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
Carmatik is probably one of my favorite projects I've worked on, and in this post I want to show off the storefront.
A car marketplace only works if people can go from 4,000 cars to the one they want, fast.
My favorite part is the part you never see. The moment your cursor touches a car card, that page starts loading in the background. By the time you click, it's already there. No spinner, no wait.
Scroll past a card, same thing happens. So the cars you're most likely to click on are already loaded before you touch them, and nothing loads twice.
That's the whole trick. Nobody notices it. They just think the site is fast.
Filters do the rest: 14 of them, counts that stay accurate while loading, empty results that explain themselves, and everything just as easy to tap as to click.
4,000+ cars. A few taps to narrow them down. A car page that feels like it was already open.
Full case study: www.romanrobert.com/work/carmatik-storefronts
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
Trending
Claude
Claude has entered the design space. How are you using it?
Contra University
Learn from expert creatives how to earn more using next-gen AI tools.
Brand Design
The best brand designers are on Contra. Scroll to see what's trending in brand design. What are you building?
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?
Related posts
A very effective way to engage users is to give them something to play with.
A tiny interaction can turn a passive visitor into an active explorer.
That's exactly why I like mouse trails.
They don't explain your product.
They don't increase conversions overnight.
They simply make your website feel alive.
People move the cursor just to see what happens.
A few extra seconds of curiosity often become a few extra seconds of attention.
Sometimes, the smallest details leave the strongest first impression.
Here's a Framer Mouse Trail component that adds that playful touch in seconds.
See it in action here: https://rohitkumarverma.framer.ai/
💯 true. Good job
Immersive parallax landing page for a wood-fired pizzeria concept , built with React, TypeScript, and Tailwind CSS.
Two scroll-driven scenes inside a sticky viewport: a curtain-reveal intro that opens into a glowing oven portal, then transitions into an arc-shaped card slider showcasing the menu. Custom scroll-linked and mouse-driven parallax across every layer, staggered entrance animations, fully responsive across mobile/tablet/desktop, no external UI libraries.
Open to building similar interactive/parallax experiences for brands, menus, and product launches.
Cloudy Galaxy — luxury wearables landing page (Framer).
Design process — Cloudy Galaxy (Framer)
1. Brief
Luxury wearables brand. Two products: Orbit (smartwatch) and Nova (headphones). Palette locked early: gold + graphite. Goal was a product landing page that felt premium and still converted.
2. Direction
Dual-product hero (both SKUs visible up front). Standard page depth: hero → products → features → stories → CTA. Built reusable pieces first — buttons, nav/footer layout — so the page stayed consistent.
3. System
Set color tokens and type before layout. Bodoni Moda for headlines, Satoshi for UI/body. Gold for accents and CTAs, charcoal for the page, muted grey for secondary text.
4. Structure
Mapped the page as one scroll story:
Hero with both products
Collection detail cards
Three craft features
Testimonials
Final CTA + email capture
Nav links jump to each section so it feels usable, not just pretty.
5. Hero polish
First pass had black products disappearing into the dark background. Fixed that by putting products on light cream–gold stages, gold borders, and soft glow so the cards actually read on the page. Added float/tilt motion so they feel a bit more 3D without overdoing it.
6. Build in Framer
Designed and built directly in Framer: layout template for nav/footer, button components, desktop + tablet + phone breakpoints, form on the CTA. Kept client-safe editing in mind — layout locked, content editable later if needed.
7. Check
Reviewed contrast, mobile stacking, and scroll targets. Tweaked card elevation and product framing until the hero felt clear at a glance.
