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
When a film production company asks for a website without using photography, you're forced to tell the story in a completely different way. That's exactly what made designing for Mindsoup such an exciting challenge.
Mindsoup is a film production company that partners with bold artists to develop and finance films that challenge the way audiences see the world. Their productions have earned more than 80 international awards, including two Academy Award nominations.
The goal was to transform an analogue creative direction into an interactive digital experience. Instead of relying on film stills or photography, the website needed to communicate Mindsoup's identity through illustration, typography and motion while remaining clean, minimal and highly professional.
The visual language is built around a cinema auditorium, where every occupied seat represents a different story waiting to be told.
I illustrated the chairs by hand using markers and paint on acetate sheets, then recreated those overlapping layers digitally in Squarespace. As visitors scroll, the illustrations gradually unfold, creating a subtle narrative journey.
Finish Layer and other tools I used:
Layers — Recreated the physical acetate overlays digitally and became the foundation of the scrolling experience.
Block Transforms — Added subtle hover interactions to section titles.
Custom Font Uploads — Preserved the project's typographic identity.
Pin Block — Kept the central illustration anchored while the story unfolds around it.
Preview: https://pike-orca-875m.squarespace.com/
Password: mindsoup
Once live, it will be available at mindsoupfilms.com.
Thanks to the Mindsoup team for trusting me with their new digital identity—and thanks to Squarespace Circle for leading me to this challenge.
wow i love this
So nice !
Love it .!
super creative! I love it!
Simple but really creative and I mean IT 😭
That's so creative.
Wow! What an awesome work! 🔥
WOW!! love love love it!!
Anchoring the whole story on occupied auditorium seats is a clever constraint, and hand-illustrating the chairs on acetate before rebuilding them in layers is exactly why the scroll unfold feels earned rather than templated.
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
The Future in Black was built for Joy Fennell to hold a story that needed more than a standard portfolio site. Our goal from the start was to make the site feel archival and alive at once, part digital exhibit, part living brand presence, so every design decision was made to support that feeling rather than just present information.
We started with structure: how should a visitor move through this content, and what pace should that movement have? That question shaped our use of Finish Layer's block animations. Text reveals on scroll, so the story unfolds in beats instead of arriving all at once, closer to reading a book than scrolling a website. Images use hover interactions to invite a second look without pulling focus from the words around them.
From there we layered in movement. Shapes transform and shift position as the visitor scrolls, adding depth and a sense of motion that a static layout couldn't carry. This was the piece that took the most iteration, getting the timing and scale of these transforms to feel intentional rather than gimmicky meant testing several versions before landing on the current pacing.
Typography carried a lot of the brand's identity, so we uploaded Million and Inter Tight rather than relying on Squarespace's native font library. Million gives the site its editorial voice in headlines, and Inter Tight keeps body copy clean and legible against it.
The result is a site built on Squarespace's foundation, using Finish Layer's native tools alongside custom CSS and JS, pushed toward something that reads as custom, editorial, and specific to one person's story rather than a repeatable formula.
FigmasquarespacedesignsquarespacewebsitesSquarespace Website DesignWebsite CSSSquarespacesquarespacechallenge
Hey @Golden Launch this is awesome but it looks like the link you included in the comments isn't working. make sure the link is active in order for your submission to be judged 😃
MINITEL DU SUD — La légende se reconnecte 🖥️📞
The idea: what if France's heritage sportswear house revived the Minitel — the terminal that connected millions of French homes from 1982 to 2012 — the way a maison reissues an archive icon?
Making it real: a numbered edition of 50, hand-restored in Marseille, with a full campaign world, a working storefront, and a soundtrack — built end-to-end on Squarespace 7.1 / Fluid Engine.
How Finish Layer made it real:
Font Uploads — a custom pixel typeface as the "machine voice": title, ticker, teletext annotations. No code injection.
Block layering — the serif headline interrupted by the machine; the campaign broadcasting inside the terminal's screen, video layered under the frame.
Pinned hero text — the composition holds through the scroll.
Block Animations — hover reveals hide edition serials behind the campaign cards (N° 07/50 — RÉSERVÉ).
Block Hiding (Mobile) — desktop gets the theater; mobile gets a streamlined vertical flow.
Beyond the layout: a fully functional storefront built with real commerce settings — 50 units in inventory, limit 1 per order, so the scarcity story is enforced by the system, not just the copy. (Concept project: nothing ships, no payments are processed — the store demonstrates the commerce build.) Plus an original French-electronic track — the hold music of 1990, composed for the terminals — closing with a scroll-scaled banner: « MONTE LE SON. »
Toolkit: Midjourney (campaign imagery, locked style refs) · Departure Mono by Helena Zhang (SIL OFL) · Suno (soundtrack) · SquareKicker (window reveal, horizontal scroll, scroll-scale banner)
🔗 minitel-contra.squarespace.com — password: 3615 (the dial code, of course)
Projet conceptuel — not affiliated with Orange S.A. Minitel is a trademark of its respective owner.
#squarespacechallenge
This deserves more than just liking, this deserves to be featured! 🏆 Mixing heritage with modern asset storytelling is a killer concept for a custom web presence.
What if the Krusty Krab hit the road? 🍔🛻
I reimagined the iconic Krusty Krab as a real-world food truck and brought the idea to life with Squarespace. From playful visuals and custom illustrations to an immersive scrolling experience, every section was designed to capture the charm and nostalgia of Bikini Bottom. I also used Finish Layer to add animations, hover interactions, layered visuals, and smooth transitions that make the experience feel more dynamic and engaging.
🔗 Website: https://cardioid-helicon-94jp.squarespace.com
🔒 Password: square
squarespacedesignwebsitedesignUI DesignUX DesignSquarespaceSquarespace Website Designsquarespacechallenge
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?