Thinkific Animations

I'm responsible for all product design animations for Thinkific's mobile app and corresponding Branded apps.
Tool: After Effects

Find your school screen

This is the first screen the user sees after they download and open the Thinkific mobile app. I wanted to go for a "wow" moment when the user first downloads and opens the Thinkific app.

I also wanted it to be clear that Thinkific was a platform for multiple businesses. Because I had such small phone screen space, I decided that showing this concept with animation was really critical to get the point across.

Celebrating Course Chapter completion

When a user completes a chapter (which is a series of small lessons), we show them a celebratory animation.
The challenge here was trying to find one animation that was generic for thousands of businesses/brands. Ideally, I would have liked a library of animations for our customers to choose from; however, since we wanted to simplify our customer set up process, we opted for a generic animation which automatically changed according to the businesses' brand color. The final "Firework" animation's design is derived from Thinkific's logo, which a simple line and dot.

Branded stars

Rainbow stars

Final: Fireworks

100% Course completion

Adhering to the same design language pattern of the fireworks in the chapter completion, when a student finishes a full course, I added a more dramatic celebration animation, because it only happens once. I also included student personalization and a social sharing button for this big moment.