Curated archive of 30 design references, UI interactions, and animations published by Eduard Bodak on X.
Smooth sticky element. What I don’t like about sticky elements is t... - Eduard Bodak
Smooth sticky element. What I don’t like about sticky elements is that when you scroll, they pin instantly and scroll with you until they instantly unpin again. It doesn’t feel sm...
@eduardbodak010/100 Buttons. I’ve used this button style on my own portfolio On... - Eduard Bodak
010/100 Buttons. I’ve used this button style on my own portfolio On my portfolio I originally used CSS keyframe animations on that button and added an event listener with JavaScri...
@eduardbodak009/100 Buttons. A button animation I see quite often on websites,... - Eduard Bodak
009/100 Buttons. A button animation I see quite often on websites, I just crafted it in my style. We have two icons: the one on the right moves to the right and fades out on hover...
@eduardbodak2025 Recap. Or mostly September until now as I started there my ful... - Eduard Bodak
2025 Recap. Or mostly September until now as I started there my full time freelancer journey. Happened quite a lot, way more than I first thought. Can’t share everything but more...
@eduardbodakPage Transition on the FUTURE THREE® studio site. As always the Pag... - Eduard Bodak
Page Transition on the FUTURE THREE® studio site. As always the Page Transition is the most difficult part on the page. At least for me. I’m using here Swup JS as it works nicely...
@eduardbodakBuilding a VanMoof Lookbook page as a concept project. Start to dev... - Eduard Bodak
Building a VanMoof Lookbook page as a concept project. Start to develop this thing in Webflow with GSAP. Why Webflow when you use so much custom code? That’s one of the most asked...
@eduardbodakThe Intro Animation on the Future Three studio site. It’s basically... - Eduard Bodak
The Intro Animation on the Future Three studio site. It’s basically a mix between @greensock & CSS. I’m using here GSAP to animate the loader to autoAlpha: 0 after the Lottie Anim...
@eduardbodakBuilding a VanMoof Lookbook page as a concept project. VanMoof woul... - Eduard Bodak
Building a VanMoof Lookbook page as a concept project. VanMoof would be one of my dream clients, so it should hopefully attract clients in that direction. Starting this project by...
@eduardbodakThe states of a button. Building the base of a mighty button. I got... - Eduard Bodak
The states of a button. Building the base of a mighty button. I got here the typical default, hover, active & focus. Hover, active & focus should also respect reduced motion when...
@eduardbodakA button from my tiny library. Made in @webflow with custom CSS. I'... - Eduard Bodak
A button from my tiny library. Made in @webflow with custom CSS. I'm using here no position absolute. You can see on hover that two backgrounds moving in and fill the button. Thos...
@eduardbodakMake the Button Feel Right I'm building currently a UI library call... - Eduard Bodak
Make the Button Feel Right I'm building currently a UI library called Tiny Mighty Pieces. And I want to go through every basic element. So I'm breaking it down. State by state. Ho...
@eduardbodakMy Portfolio is live! At least the first Version. For now only in G... - Eduard Bodak
My Portfolio is live! At least the first Version. For now only in German. English will be added later. Didn't finished everything I wanted, but this will be a work in progress. No...
@eduardbodakFilled the placeholder section on the service page. Made in Webflow... - Eduard Bodak
Filled the placeholder section on the service page. Made in Webflow with custom CSS & JS. I want to show here that good animations can bring a good feeling to the user. Therefore...
@eduardbodakFinished the price page so far! Made in Webflow with custom CSS, JS... - Eduard Bodak
Finished the price page so far! Made in Webflow with custom CSS, JS & GSAP. Got a sleek price card which rotates on mouse movement. Circular cards which rotates a bit on scroll. H...
@eduardbodakAdded another three new buttons to my tiny library among 37 other u... - Eduard Bodak
Added another three new buttons to my tiny library among 37 other unique buttons. Made in @webflow with custom CSS. It's a free cloneable. Check it out live! Link is in the commen...
@eduardbodakThe waitlist sign up on mobile. Made in Webflow with custom CSS & J... - Eduard Bodak
The waitlist sign up on mobile. Made in Webflow with custom CSS & JS. I recorded this on my iPhone in Safari. When you look closely, there is no zoom when tipping in the input. An...
@eduardbodakAdded the first step of the waitlist form to the price page. Made i... - Eduard Bodak
Added the first step of the waitlist form to the price page. Made in Webflow with custom CSS. There is this typical autofill from Chromium based Browsers. And normally when using...
@eduardbodakAdded the feedback of the waitlist form. Made in Webflow with custo... - Eduard Bodak
Added the feedback of the waitlist form. Made in Webflow with custom CSS & JS. I'm using here fetch to handle the request. When the response is handling the send the class "is-loa...
@eduardbodakThe wheel section on the price page on mobile. Made in Webflow with... - Eduard Bodak
The wheel section on the price page on mobile. Made in Webflow with CSS & Locomotive Scroll v5. Fun fact. Nothing in this section is using position absolute. Everything is build w...
@eduardbodakBack to the wheel section on the price page. Made in Webflow with C... - Eduard Bodak
Back to the wheel section on the price page. Made in Webflow with CSS & Locomotive Scroll v5. Added the rest of the content in this section, expect the waitlist form. Also filled...
@eduardbodakAdded in the meantime the legal pages. They deserve also some love... - Eduard Bodak
Added in the meantime the legal pages. They deserve also some love Made in Webflow. One thing I got always on privacy pages is that you can scroll horizontal on mobile because the...
@eduardbodakAdded another three new buttons to my tiny library among 34 other u... - Eduard Bodak
Added another three new buttons to my tiny library among 34 other unique buttons. Made in @webflow with custom CSS. It's a free cloneable. Check it out live! Link is in the commen...
@eduardbodakNext section on the price page. The cards in a circular order and i... - Eduard Bodak
Next section on the price page. The cards in a circular order and it's rotating a bit on scroll. Made in Webflow with CSS & Locomotive Scroll v5. I call it wheel for now. This is...
@eduardbodakAdjusted the info modal on mobile. Also changed the animation a bit... - Eduard Bodak
Adjusted the info modal on mobile. Also changed the animation a bit, thanks for the feedback @prizigner Made in Webflow with custom CSS & JS. I'm using here the dialog element. It...
@eduardbodakRecap of building the stage of the price page in Webflow with CSS &... - Eduard Bodak
Recap of building the stage of the price page in Webflow with CSS & GSAP
@eduardbodakAdded the page transition on the price page. Made in Webflow with c... - Eduard Bodak
Added the page transition on the price page. Made in Webflow with custom CSS, GSAP & Swup JS. Those page transition are always the tricky part for me. Made the appear Animation on...
@eduardbodakFree Button Friday. Added another three new buttons to my library a... - Eduard Bodak
Free Button Friday. Added another three new buttons to my library among 31 other unique buttons. Made in @webflow with custom CSS. This time I played around with clip-path and tri...
@eduardbodakAdded the rest of the benefit section on the price page from my por... - Eduard Bodak
Added the rest of the benefit section on the price page from my portfolio made in Webflow with custom Code. Every item gets highlighted on scroll. This makes it easier for the use...
@eduardbodakAdded the adjustment of the tooltip hover from the footer in dark m... - Eduard Bodak
Added the adjustment of the tooltip hover from the footer in dark mode. I'm always trying to use not too many different colors. I see pretty often design systems or styleguide whi...
@eduardbodakOn the page transition to the price page which is in dark mode the... - Eduard Bodak
On the page transition to the price page which is in dark mode the navigation should also change smoothly to it. Tried a bit of different animations here. One was that the navigat...
@eduardbodak