Framer recently released its newest version, Framer X which supports React. I designed for an online course called Framer X + React (https://learnreact.design/framerx-react). Learners will learn to create an app by Framer X and React after taking this course.

Storyboards of the opening animation
I created a story that runs through the course: Mr. Skinny, an overweight bird dreams of losing weight and becoming a skinny bird, while our learners try their best to help him by making a Fly Keeper app. Because there is a story throughout, the learning process becomes one of story exploring, which stays learners motivated when learning online.

Final character - Overweight Bird

Final character - Skinny Bird

Character Sketches

Animated logo for ProductHunt

Poster for ProductHunt

Awarding Stage Design