Day 2 of 30 in my Webflow challenge

Creative

I built this hero section with a 3D curve perspective, auto-scrolling cards with a flip-on-hover effect, and a simple, efficient layout. The focus was on the card ticker auto-scroll below, allowing it to be moved easily at any point within the section and paused on hover; also, hovering over the cards flipped the card 180 degrees on the X-axis to the back.

Here is what went into it:

Created a Card Component system

Created an auto-ticker system

Hover animations on the card stop the scroll

Hover animation flips card horizontally to show what's behind

Responsive build across all devices

Mobile animations work with tap gesture

Link here: challenges-30.webflow.io/creative

If you're a business owner, startup founder, or innovator, and you need someone who treats your website projects as if their own business were on the line and delivers on business goals.

Let's talk on a call here: https://cal.com/onyebuchi-omoigberale/30min

DM me or drop a comment. I respond to everyone.

#Webflow #UIDesign #FrontendDevelopment #WebDesign #30DayChallenge #OpenToWork #ConversionOptimisation #Figma #GSAP #JavaScript