Botanical Scroll Animated Website

Botanical Scroll Animated WebsiteBotanical Scroll Animated Website

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

Chidi Chukwu

• Aug 30

Botanical Scroll Animated Website

HTML5 three.js GSAP Graphic Design Web Design Website CSS

Damilola Adelaja

pro

• Aug 30

Such a great work, Chidi

Chidi Chukwu

• Aug 30

Thanks Damilola

Diego Sánchez

• Aug 30

Three.js and GSAP for a botanical scroll site sounds heavy, but the 'Return to Your Nature' framing suggests it stays gentle rather than flashy. How do you keep scroll-triggered 3D from feeling gimmicky on a skincare brand like this?

Chidi Chukwu

• Aug 31

Exactly, the goal is atmosphere, not spectacle. I keep the movement slow, tied to the natural rhythm of scrolling, and focused on depth, water, light, and the product itself. No constant spinning or dramatic camera moves. The skincare experience should still feel effortless.

Nirali Padariya

• Aug 31

Nice work

Bella Brillantes

pro

• Aug 31

Great work!

Benjamin C

max

• Aug 31

the waterfall behind the bottle is so pretty chidi. is the scroll smooth on phone?

Nesar Ahmad Nori

• Aug 31

cool

Nazar Koliano

pro

• Aug 31

the scroll on this is smooth

Maty Sandoval

max

• Aug 31

That waterfall-to-bottle transition is genuinely satisfying to watch. With three.js and GSAP both loaded, how'd you keep load times sane for a skincare audience that's probably browsing on mobile more than desktop?

Taimur Iqbal

• Sep 1

Attractive work👍

Jitinder Parihar

• Sep 1

Clean

Agadon Creative

pro

• Sep 1

This looks really nice. I love the concept with the glassmorphism and the waterfall in the background. Great work!

Blessing Akpoghelie

• Sep 1

You did good

Mark Barliet

pro

• Sep 2

Keeping the bottle static in frame while the waterfall and mist move behind it is the right call — a lot of scroll sites move the product too and it ends up fighting the eye for a fixed point. This one gives you one anchor and lets everything else do the motion work.

Kris Anfalova

pro

• Sep 13

Ledger — AI CFO Platform Ledger is an AI platform that acts as an always-on Chief Financial Officer for founders — connecting to accounts, learning cash rhythm, and surfacing risks before they become real problems. I designed the full landing page. My role: UI/UX Design Scope: Landing page Financial tools for founders usually feel either cold (dashboards) or intimidating (accounting software).

For Ledger, we borrowed from old-world institutional finance instead — serif type, oil-painting textures, classical architecture — so an AI CFO feels like real authority, not another app.