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 created Purrberry 🍓🐾 for the Contra × Squarespace website design challenge.
A playful e-commerce concept for hand-knitted cat hats, built around the idea that every cat has a unique personality and every hat has a vibe to match.
For this project, I used Squarespace’s new Finish Layer, mainly exploring hover animations. I chose this approach because subtle, playful interactions felt like the best fit for Purrberry’s colorful, lighthearted atmosphere.
Explore the website: https://vibraphone-finch-wy57.squarespace.com/ (It may be a little slow in the products section)
Password: 1234
X post: https://x.com/muqaroow/status/2080291386885345283?s=20
The short walkthrough video is in the comments↓
A liitle sneak-peek from the process:
this is too cute
This is ADORABLE!!
So good! I am allergic to the cats but this is a good way for me to se these cutie patooties! Good work!
Thank you Abdullah!
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
Hey Contra Community! 👋
Excited to share my latest Squarespace project, Vera Collective, a unique online space dedicated to fostering meaningful live conversations and genuine human connection. This project was a fantastic opportunity to push the boundaries of Squarespace's design capabilities, especially with the new Finish Layer tools.
The Vision Behind Vera Collective
Vera Collective was born from a desire to create a serene, inviting digital sanctuary where individuals can engage in authentic dialogue and shared understanding. The design needed to reflect this ethos: sophisticated, minimalist, and deeply engaging.
Design Highlights & Finish Layer in Action:
1. Bold, Immersive Aesthetic:
I opted for a striking dark theme with elegant typography to create an immediate sense of depth and focus. This bold choice helps to draw users into the content, emphasizing the intimacy of live conversations.
2. Strategic Use of Block Transforms:
To achieve a dynamic yet refined layout, I extensively utilized Block Transforms. Notice how certain sections, like the prominent "Who This Space Is Not For" area, use subtle transformations to break the grid and add visual interest without compromising readability. This allowed for a more artistic and less conventional presentation of important information.
3. Responsive Stacks for Seamless Experience:
Ensuring a flawless experience across all devices was paramount. I leveraged Stacks to meticulously arrange content blocks, guaranteeing that the site's unique visual hierarchy and interactive elements remain perfectly aligned and accessible, whether viewed on a desktop or a mobile device.
4. Subtle Block Animations for Engagement:
To enhance user engagement and guide their journey through the site, I incorporated Block Animations. These subtle, scroll-triggered effects introduce content gracefully, adding a layer of sophistication and interactivity that keeps the user immersed without being distracting.
5. Custom Typography with Font Uploads:
The brand identity of Vera Collective demanded a distinctive typographic voice. Through Font Uploads, I integrated custom fonts that perfectly complement the site's elegant and thoughtful aesthetic, reinforcing its unique brand personality.
Why Vera Collective Stands Out:
Vera Collective isn't just a website; it's an experience. By combining a bold design vision with the powerful new Finish Layer tools in Squarespace, I was able to craft a platform that is both visually stunning and highly functional, truly embodying its mission of connection and understanding.
I'd love for you to explore Vera Collective yourself and let me know what you think! Your feedback is invaluable.
#squarespacechallenge #webdesign #community #veracollective
Love this!
Cardinal Soccer Camps
Cardinal Soccer Camps began with a simple idea: create a professional, welcoming, and engaging online home for a soccer camp dedicated to helping players grow both on and off the field. I brought that idea to life with Squarespace by building a website that captures the energy of the game while making it easy for families and players to discover the camp, understand what it offers, and take the next step toward getting involved.
The goal was to create more than just an informational website. Cardinal Soccer Camps needed a strong digital presence that felt modern, trustworthy, and energetic—reflecting the experience players can expect when they attend camp. I used Squarespace’s built-in design tools to create a clear visual identity, organize the site around the user journey, and make important information easy to find across devices.
Using Squarespace’s design capabilities, including the advanced control offered through Finish Layer tools, I was able to refine the website’s visual details and create a more intentional, polished experience. These tools helped me bring greater control and customization to the design, allowing the final site to feel unique to Cardinal Soccer Camps rather than relying on a generic template.
Squarespace made it possible to take an idea from concept to a fully realized website through a combination of strong foundational design tools and advanced creative control. Cardinal Soccer Camps is an example of how a clear vision, thoughtful design, and the right platform can transform an idea into something real.🙌🏽🎉
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?