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
Liquid bubble simulation for a hydration cosmetic.
Enjoyed working on it. I'm going to explore more and experiment
If you guys want to see more of this, please do follow
anyone needs this Project file, feel free dm me or comment below.
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
VELOCITY turns a single drop of water into a hero launch for audio products. Built using the SVGator MCP and designing the products manually with Blender, the template pours water onto any headphone image and floods it into shape, because water takes the form of whatever it fills. That fluidity is the point: creators can swap the product render, brand colours and copy while the animation stays the same, making it ideal for product drops, colourway launches and pre-order campaigns.
Water taking the form of whatever it fills is a gorgeous concept for a launch template, Prajin. Pouring water over a headphone image and flooding it into shape is the kind of fluid drama that stops the scroll. Swapping renders while the animation stays the same is clever engineering too.
Sunny Rock — Cinematic Paris Travel Website | Creative Web Development
Experience Paris through Sunny Rock, a cinematic travel website concept designed to combine immersive visuals, elegant UI/UX, and interactive scrolling into a premium digital experience.
This self-directed project explores modern web design through cinematic imagery, scroll-driven animations, glassmorphism, smooth transitions, and responsive layouts.
🛠️ Technologies & Skills
HTML5 & CSS3 — Semantic structure, modern styling, and responsive layouts
JavaScript (ES6+) / TypeScript — Interactive behavior and animation logic
React.js — Reusable components, hooks, and state management
Tailwind CSS — Utility-first styling and responsive design
HTML5 Canvas API — 2D rendering for visual effects and image sequences
Scroll-Driven Animation — Frame-by-frame image sequences synchronized with scrolling
requestAnimationFrame & Linear Interpolation (Lerp) — Smooth animation updates
Lenis Smooth Scrolling — Fluid scrolling experiences
Intersection Observer API — Scroll-triggered reveals and entrance animations
UI/UX & Visual Design — Visual hierarchy, typography, glassmorphism, and interaction design
SVG Graphics — Scalable icons and vector elements
AI Visual Generation & Prompt Engineering — Cinematic visual assets
Cloudinary — Media hosting and image optimization
Performance Optimization — Efficient asset loading and animation rendering
Python & Browser Automation — Development utilities, asset processing, and testing
✨ Design Highlights
Cinematic, immersive visual storytelling
Premium travel-inspired aesthetic
Smooth, scroll-based animation sequences
Modern glassmorphism interface
Responsive layouts for different screen sizes
Interactive elements and refined micro-interactions
Project Type: Self-Directed Portfolio Project
Focus Areas: Creative Front-End Development · Web Design · UI/UX Design · Interactive Experiences · Animation
Designed and developed by Ubaid | Ubaid Web Studio.🔥
Turns out the future does have flying cars.
Last week a Roadster flipped upside down over five parked Teslas, and the clip passed 26M views in a day. I turned that moment into a scroll-driven 3D piece: scroll to fly the car, hold to boost, with the facts one tap away.
Independent concept — real demo, brief airborne maneuvers, nobody inside. The rest is imagination.
Built with Three.js: custom thruster FX, depth-of-field, scroll-linked camera, one-tap 9:16 clip export.
Available for interactive and 3D web work. DM me. 🛠️
Great work! Very good animation and smooth experince.