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
Built a scroll-driven features section for Solene. One sticky loop, five steps: voice check-in, trend detection, care team relay, manual entry, weekly summary. Each tile takes focus as you scroll, and you can click any row to jump to it.
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
retrofuturism
Share your favorite designs from the past exploring the distant future. Or your own take on the aesthetic 🚀
halftone
Dots. Texture. Grain. Let's see your designs using the halftone technique.
Midjourney
Creatives are showing off what they're making with Midjourney.
colorgrade
Video editors sound off: How do you enhance the mood of your video in color grading?
Related posts
Ondrel: Enterprise AI Site Rebuild (Motion & Interaction Study)
A hand-coded rebuild of a Framer-grade enterprise AI website. Scroll choreography, pinned storytelling and micro-interactions, reproduced in vanilla JS with no page builder, no WebGL and no stock footage.
What's inside:
- Hero video card that expands to full bleed on scroll while the headline splits apart, then settles back
- Scroll-linked headlines that fill in character by character
- Two pinned sequences: a 5-sector carousel and a 4-case showcase, with wipe transitions, live progress pills and a rotating backdrop
- An interactive dot sphere — 200+ particles morphing through four states in sync with the copy
- Capability wheel, vertical journal carousel and infinite logo marquees
- Menu overlay with staggered reveals, hide-on-scroll nav and an announcement banner
- Every video slot is a real-time procedural scene drawn in code (engine test fire, wind turbines, highway aerials, glass towers), so it loads fast and runs even without WebGL
- Fully responsive with a dedicated mobile layout for every section, plus reduced-motion support
Tech HTML · CSS · Vanilla JS · Canvas 2D · Lenis smooth scroll · Vercel
Got a Framer or Webflow site you've outgrown, or a motion-heavy landing page you want in real code? I build these end to end — message me.
This is a great example of motion carrying the narrative rather than just decorating it—the pinned sequences and scroll-linked type sound especially intentional. The vanilla JS constraint makes the interaction study even more compelling.
It's the little things...love how the slider has the friction and bounce for the new iPhone Duo features section. Delicious details 😋
One of those small things that makes designing feel so much better. 😅
I was working on a responsive screen and decided to mirror the mobile view while designing.
Seeing the design change in real time between desktop and mobile makes spotting little issues so much easier.
Spacing.
Typography.
Button sizes.
What feels right on desktop but suddenly feels too crowded on mobile.
It’s a small part of my process, but it has been helping me design with responsiveness in mind instead of treating it as something to fix at the end.
Still learning. Still refining. Still shipping.
How do you check your responsive designs while working?
