The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Back to feedPost
I'm a newbie with Squarespce. but i try to built this project entirely in Squarespace with the goal of creating a wellness premium website that feels clean, immersive, and memorable from the very first scroll.
I focused on strong typography with high contrast, carefully curated imagery, thoughtful spacing, and subtle interactions to create an experience that feels polished while remaining intuitive to navigate.
Finish Layer helped bring the design to life through Block Animations for smooth reveals, Block Transforms to add depth and balance to the layouts,
Every design choice was made to enhance the experience rather than distract from it.
I've included screenshots of the homepage and record screen video with some action in Finish Layer tool
Pass: Contra123
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Related posts
Boxify Web Designs
Password: 228877
VK Construction is a modern website concept created for a Los Angeles general contractor specializing in custom homes, renovations, additions, and new construction. Our goal was to elevate the perception of construction websites by combining premium branding, smooth motion, and a user experience that builds trust from the very first interaction.
Instead of relying on traditional contractor layouts, we designed an immersive digital experience that showcases craftsmanship through clean typography, high-quality imagery, subtle animations, and intuitive navigation. Every section was intentionally designed to guide visitors toward requesting a consultation while reinforcing VK Construction's reputation for quality, transparency, and attention to detail.
This project was built using Squarespace with Finish Layer enhancements to create a modern, engaging experience.
* Single page custom built linked website
* Logo Design
* Custom Icons
Key features include:
• Stacks to create layered visual compositions that add depth and hierarchy throughout the website.
• Animations to introduce content with smooth motion, making each section feel interactive without distracting from the messaging.
• Carefully timed transitions that guide visitors through the page and create a premium browsing experience.
• Responsive layouts that maintain the same polished experience across desktop, tablet, and mobile devices.
The combination of Stacks and motion transforms a standard contractor website into an experience that feels contemporary, trustworthy, and memorable while remaining fast and easy to navigate.
The goal for the Caresco NW website was to create a refined digital home for a Bend-based real estate development firm that champions timeless design and thoughtful density. The core idea was to translate their physical brand ethos craftsmanship, precision, and a deep respect for place into a polished, high-end digital experience. Using Squarespace 7.1 and the new Finish Layer tools, I built a site that is both visually stunning and functionally straightforward, showcasing their projects with a minimalist editorial feel that builds trust and elevates their local reputation .
Website Link
URL: https://caresco.com/ (No password required)
Social Media Post link: https://www.linkedin.com/posts/fazail-zubair_squarespace-makeitrealchallenge-finishlayer-ugcPost-7484998584229212160-XJ38/?utm_source=share&utm_medium=member_desktop&rcm=ACoAADndKlkBRUsO7C19NUd0VXA9M6YNqpPVIOA
How Finish Layer Tools Were Used
Finish Layer was instrumental in adding a "professional-grade" polish and unique character to the site, moving it beyond a standard template. Here is how specific tools were applied to bring the idea to life :
Block Transforms: To break away from a rigid, boxy layout and create an asymmetrical, editorial feel, the Block Transforms tool was used to subtly rotate and skew decorative shape blocks and images in the background. For example, a feature image on the "Who We Are" section was skewed to create dynamic visual interest and guide the eye, reflecting the unique character of their developments .
Block Animations: To add a layer of sophistication and guide user focus, Block Animations were applied to key elements. The hero section features a subtle fade-in animation for the headline and the "STAY IN TOUCH" call-to-action button to create a compelling first impression. Further down, key content blocks animate on scroll with a gentle fade and lift, adding a sense of rhythm and progression as the user explores the brand's story .
Mobile Overrides: Ensuring a flawless mobile experience was critical. Squarespace's mobile-first approach was enhanced using Mobile Overrides. The desktop layout's asymmetrical transforms were carefully adjusted for mobile view to ensure text remains perfectly legible and the visual hierarchy is clear on smaller screens. This prevents the design from feeling cluttered or broken, which is essential for on-the-go users .
Custom Font Uploads: Maintaining brand consistency was key. The Font Upload tool was used to import and apply custom font files that match Caresco's brand personality, ensuring their specific typeface was perfectly rendered across the site without needing any code in
Hello there. I'm the founder of Studio 113 and a Squarespace Circle Partner. Excited to share this project below with you all!
Project: CultureCon Collective, cultureconcollective.com, featuring the CultureCon 2026 Festival page
Link: https://cultureconcollective.com/culturecon-2026-festival
Social Links: https://www.linkedin.com/posts/brittanimillington_squarespacechallenge-squarespace-squarespacedesigner-ugcPost-7485407738118938624-jq5q/?utm_source=share&utm_medium=member_desktop&rcm=ACoAABXRiXcBdsT6CWGlhhHGqypNSby3I9OQZ2M
https://www.instagram.com/reel/DbEPT1Gh1qT/?utm_source=ig_web_copy_link&igsh=MzRlODBiNWFlZA==
Backend walkthrough video: https://www.loom.com/share/72739542eb2849cd97d33c49daab6cbe
Featured Project Description:
CultureCon is a two-day festival bringing thousands of creative entrepreneurs, creators, and cultural leaders to Brooklyn each October. The 2026 festival page is built around "Museum of Us": the idea that the community's stories deserve to be framed like art in a gallery.
Design direction came from CultureCon's creative team with Exhibit B Agency. Studio 113 served as Squarespace design consultant and built the experience native-first in Squarespace using this year's Finish Layer tools. Every gallery interaction on this page, the layering, the animations, the hover moments, is a native Squarespace feature. Work that once demanded plugins and custom CSS is now one panel away, which made this the fastest build of this scale the my studio has delivered, and kept custom code reserved for what it should be: client-specific integrations, not design.
How Finish Layer was used:
Layers: A museum needs depth, and the Layers panel is what made depth possible without code. A star loops in a slow rotation above text, background imagery rotates behind the ticket tiers, and curated animations to give delight, each element placed exactly above or behind its neighbors through layer ordering. Layers also power the responsive build: desktop and mobile intentionally show different images and hide or reveal different elements, so the composition is art-directed at every breakpoint instead of just shrinking down.
Block Animations + Transforms: The "What to Expect" cards tilt into a skewed angle on hover, giving the grid dimension and inviting touch. Buttons use the growth effect, with the scale amount tuned per element so the primary "Buy Tickets" action gets the biggest moment. Getting that tuning right took real iteration: each hover had to say "click here" without shouting, so scale values were tested and adjusted element by element until the page felt attention-grabbing but never overdone. Ambient loops (the rotating star, the drifting "there's a place for you" element) keep sections alive without stealing attention.
Font Uploads: A bold condensed custom display face carries headlines, navigation, and buttons, so the page speaks in CultureCon's voice rather than a platform default.
Stacks: "OUR 2026 THEME: MUSEUM OF US" section built as Stacks for desktop, holding alignment and styling as a unit across various screen size.
User experience & functionality:
The page gives visitors more than one door in: buy a ticket, apply to participate, join the Collective, book the hotel block, or simply explore. Every interactive moment reinforces the museum concept, so hovering, scrolling, and discovering feels like walking a gallery. You don't just read about the culture, you move through it. Layer-based mobile art direction keep the experience intact on phones, where most of this audience lives.
Process:
The CultureCon site was rebuilt natively in Squarespace this spring, after the sitewide refresh wrapped, the festival page was designed and refined in July with Finish Layer's newest tools, launching July 8 ahead of the ticket push. Design direction arrived as organized Figma files from CultureCon's creative team and Exhibit B Agency; Studio 113 translated the vision into native Squarespace sections and worked a section-by-section punch list with the client team. A backend walkthrough video accompanies this entry.
The result is a site built on Squarespace's foundation, with Finish Layer's native tools carrying the entire design experience: the layering, the motion, the hover moments, the museum. Light custom code and SquareKicker tools helped execute client-specific touches and I handled other client-side needs like ticketing, Mailchimp, and Zapier integrations. The page is live today, actively selling tickets for the October festival, and every visitor who hovers, scrolls, and wanders through it is walking a gallery built with the platform's own tools.
Trending
Claude
Claude has entered the design space. How are you using Claude Design?
Contra University
Learn from expert creatives how to earn more using next-gen AI tools.
creativeaiflow
Creative AI workflows are evolving. What tools do you use, and what are their strengths and weaknesses?
freelancerlife
Freelancer life is wins, pivots, and everything in between. What’s yours right now?