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
Learning OGL by rebuilding my portfolio's floating nav, inspired by Dynamic Island.
It stays compact while you scroll, then expands on hover, with the email button splitting off in a gooey morph. The shape is a signed distance field in a fragment shader, with GSAP handling the spring motion.
#webdevelopment #creativecoding #webgl #ogl #gsap
The gooey morph where the email button splits off is really satisfying, Oska. Using a signed distance field in a fragment shader for the nav shape is a great way to learn OGL.
Thanks! That split was my favorite part to tune. It's two pills blended with a smooth minimum, and the blend shrinks as the email button pulls away, so the bridge thins and snaps. SDFs turned out to be a great way to get into OGL.
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
Video-led hero for me. The big script Presence over the field sells a feeling in one glance, which is what wellness needs. The expanding gallery would work well as the second section.
Spline 3D plus GSAP inside Webflow without the site feeling heavy is no small thing. The product interactions in this reel are really clean, Toqir.
Designed an AI agents dashboard where you approve work, track running tasks, and see your whole team of agents in one place.
Same screen, two shots. Which one would stop your scroll? 👀
1 voted
50%
1 voted
50%
2 votes
Closed
nice one dude