Overview
Overview
Joined SPIN’s design team as a Staff Motion Designer to bridge product and marketing through motion. Imported Figma assets into After Effects to create Lottie animations for in-app UI.Animated social content and email campaigns, banners, and presentations.
Joined SPIN’s design team as a Staff Motion Designer to bridge product and marketing through motion. Imported Figma assets into After Effects to create Lottie animations for in-app UI. Animated social content and email campaigns, banners, and presentations.
Joined SPIN’s design team as a Staff Motion Designer to bridge product and marketing through motion.
Imported Figma assets into After Effects to create Lottie animations for in-app UI.
Animated social content and email campaigns, banners, and presentations.
Roles
Roles
Motion Design | UX Motion | UI Animation | Lottie/JSON Animations
Motion Design | UX Motion | UI Animation | Lottie/JSON Animations
Tools
Tools
Spin's foundational values are central to its identity. These animations were created to visually represent those values across presentations and online platforms.
Spin's foundational values are central to its identity. These animations were created to visually represent those values across presentations and online platforms.
DO WHAT IS RIGHT
DO WHAT IS RIGHT
ACT LIKE OWNERS
ACT LIKE OWNERS
DEFAULT TO TRUST
DEFAULT TO TRUST
EMBRACE DIVERSITY
EMBRACE DIVERSITY
WORK AHEAD
WORK AHEAD
In honor of Disability Awareness Month, SPIN released an animated banner highlighting people who use wheelchairs. See the banner below
In honor of Disability Awareness Month, SPIN released an animated banner highlighting people who use wheelchairs. See the banner below
This set includes a walkthrough of Spin’s sign-in flow with a focus on the pedestrian warning sign card, along with an animated breakdown of the Group Ride feature.
This set includes a walkthrough of Spin’s sign-in flow with a focus on the pedestrian warning sign card, along with an animated breakdown of the Group Ride feature.
SIGN IN FLOW
SIGN IN FLOW
GROUP RIDE
GROUP RIDE
When users reach extra mileage milestones, Spin’s Riders app rewards them. This banner animation celebrates earning a free one-hour ride.
When users reach extra mileage milestones, Spin’s Riders app rewards them. This banner animation celebrates earning a free one-hour ride.
Spin’s rider app displays badges on user profiles based on mileage achievements, ranging from Bronze (lowest) to Platinum (highest). Below are the Lottie animations representing each reward level
Spin’s rider app displays badges on user profiles based on mileage achievements, ranging from Bronze (lowest) to Platinum (highest). Below are the Lottie animations representing each reward level
PLATINUM
PLATINUM
GOLD
GOLD
SILVER
SILVER
BRONZE
BRONZE
Here are some quick-loading animations used to make page transitions feel seamless
Here are some quick-loading animations used to make page transitions feel seamless
Static email banners often go unnoticed. The goal here is to introduce minimal interaction just enough to catch the user's eye without distracting from the content. Below is a sample email animation
Static email banners often go unnoticed. The goal here is to introduce minimal interaction just enough to catch the user's eye without distracting from the content. Below is a sample email animation
Hope you enjoyed it—thanks for viewing!
Hope you enjoyed it—thanks for viewing!
