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
🚴 What if a bike workshop website felt more like an interactive experience?
I've been exploring how scroll-driven animations, SVG illustrations, and small interactions can make an ordinary business website more engaging.
For this concept, I experimented with:
A bicycle that comes to life as you scroll
Interactive workshop service sections
A simple way for visitors to explore what their bike needs
Built with HTML, CSS, and JavaScript.
Still exploring how to balance creative interactions with usability and performance.
Curious what you think! Does this kind of storytelling add value to a business website, or would you keep things simpler? 👀
AI DevelopmentMotion DesignWeb DevelopmentChatGPTClaudeHTML5creativedevelopmentwebdesigninteractivelandingpage
scroll driven bike build is a fun idea. did you draw the svgs yourself or start from a kit?
Thanks! 😄 They're custom SVGs created for this concept, not from a pre-made kit.
I used AI tools to help generate and refine the SVG markup, then worked on the animations and scroll interactions using CSS & JS.
It was fun experimenting with how the bike could come together as you scroll! 🚀
For a local workshop I'd keep the scroll bike for the hero and make the service sections quick to scan. The "what does my bike need" flow is the part that could actually bring bookings.
• 1d
i check your product i higly love it but it is missing some features
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
What if one of the most meaningful messages you ever receive… is written by a version of you that no longer exists?
That question became Dear Future my submission for the #Base44Challenge.
We save photos.
We save messages.
We save memories.
But we rarely preserve who we were in that exact moment what we were thinking, hoping for, afraid of, or becoming.
So I designed a digital time capsule where your words don’t just get stored.
They wait for you.
With Dear Future, you can:
✦ Write a letter to your future self or someone else
✦ Add memories and images
✦ Choose the exact future date it should return
✦ Personalize your capsule with colours and seals
✦ Seal it so it can’t be read or edited before its opening date
✦ Watch the countdown inside your personal archive
✦ Return later and experience the letter as something preserved not just another notification
But the biggest design challenge wasn’t creating a way to send a letter later.
It was designing the wait.
As a Senior Product & UI/UX Designer, I wanted every interaction to support that idea.
The archive.
The physical capsule metaphor.
The vintage television.
The sealing ritual.
The countdown.
The responsive mobile experience.
None of them are there just for decoration. Together, they turn anticipation into part of the product.
I designed the UX, visual system, interaction language, responsive experience, storytelling, and complete product flow then built and shipped the working experience with @Base44.
This project reminded me why I love product design:
A good interface helps someone complete a task.
A meaningful experience makes them feel something while doing it.
Dear Future Words outlive the moment.
Experience the project ↓
Dear future capsule
Would you write something for yourself five years from now?
A bento grid that explains a generative-AI product at a glance, designed for GanAI.
The motion is so cool! Great idea to reveal each line of text and transform it into an image.