Completed
51:48 Animating the Gut Punch
Class Central Classrooms beta
YouTube videos curated by Class Central.
Classroom Contents
How I Used Rive to Build a Punchy Pixel Art Character for My Website
Automatically move to the next video in the Classroom when playback concludes
- 1 00:00 Intro
- 2 00:08 Setting Up the Design in Figma
- 3 01:50 Creating Pixel Art for Interactivity
- 4 03:29 Dancing with the Devil AI
- 5 04:02 Challenges with AI Tools for Pixel Art
- 6 06:00 Hacking the AI
- 7 11:00 File Size Considerations
- 8 13:29 Importing and Optimizing Assets in Rive
- 9 15:56 Creating an Idle Animation
- 10 23:38 One head down, eight to go
- 11 25:55 Draw Order to the Rescue
- 12 29:27 Mouse Tracking 101
- 13 30:58 Setting Up the Hit Box
- 14 31:42 Mouse Tracking with Rive
- 15 33:48 Creating a Joystick Control
- 16 36:51 Nested Solos FTW
- 17 39:04 How Joysticks Work
- 18 46:02 Time to Punch Out
- 19 47:14 Animating the Face Punch
- 20 50:22 Adding Sound Effects
- 21 51:48 Animating the Gut Punch
- 22 47:14 Animating the Face Punch
- 23 50:22 Adding Sound Effects
- 24 51:48 Animating the Gut Punch
- 25 53:23 Creating Hit Boxes for Click Events
- 26 00:55:06 Configuring State Machines for Click Events
- 27 00:58:17 Troubleshooting Visibility Settings
- 28 00:58:44 Optimizing Animation Timelines
- 29 00:59:58 Creating and Configuring Gut Punch
- 30 01:01:41 Integrating Animations into Design
- 31 01:04:50 Advanced Mouse Tracking Behavior
- 32 01:15:09 Adding Interactive App Icons
- 33 01:19:08 Final Touches and Troubleshooting
- 34 01:25:00 Wrap Up
