this framer tutorial should've been a paid course...
NEW FRAMER COURSE: 0 TO $11.5K WITH FRAMER (ENROLLMENT CLOSES APR 7TH):https://go.frameruniversity.com/ ____________________________________________________ ✔︎ Framer University: https://frameruni.link/yt ✔︎ Create a free Framer account: https://framer.university/free-account This Framer tutorial honestly should’ve been a paid course. Why? Well, I walk you through the entire micro-interaction building process in Framer. After watching this video, you’ll have a solid understanding of how these interactions and animations are structured and built, no coding required. → Remix the tutorial project: https://framer.university/resources/set-status-micro-interaction-in-framer 00:00 - Introduction & Overview of the Microinteraction 01:02 - Breaking Down the Animation Behavior 02:49 - Designing the Base “Set Status” Button 06:42 - Creating the Icon & Wrapping in Frames 11:54 - Adding the Click Bounce Effect with Scale 16:09 - Building the Popover Container 20:35 - Designing the Individual Status Elements 27:21 - Making Components Reusable with Variables 31:10 - Adding Hover Animation to Status Elements 37:41 - Connecting Hover Interactions 41:30 - Turning Popover into Component & Adding Animation 47:11 - Fixing Interaction Conflicts & Improving Logic 50:00 - Creating “Set Status” Button Variants 57:17 - Animating Text & Emoji Transitions 01:02:15 - Building Close Button & Hover Effects 01:07:03 - Adding Click Events & Connecting Variants 01:13:12 - Final Preview, Testing & Wrap-Up Follow me on: X: https://twitter.com/learnframer Instagram: https://instagram.com/framer.university
Download
0 formatsNo download links available.