CanWe
Research-backed dating app that aims to foster intentional dating. My work included 3 animations used in the app's onboarding, and a loading screen.
​
Made with After Effects
Handed off as Lottie Files (.json)
Team: Yan Grinshtein (head of design), Wight Goforth (visual design)
Role
Contract Motion Designer
Timeline
May — Jul. 2021
01 Final Iterations
1/3
Creating Account
Showing the user how to complete registration and subscribe to CanWe's newsletter
2/3
Share Dating
Intentions
Quick overview of how a user can set their intentions and be specific about their ideal relationship
3/3
Connecting with
a partner
Finally, users can gauge how compatible they are with someone based on how well their needs align
02 Planning
Our goal was to give an overview of the app with 3 main screens using the top 70% of the frame's space. There were three main parts to the planning phase:
1
Visual Design
We wanted to be less abstract and use a simple version of the app's interface.
2
Animations
Using our storyboard, Yan and I hopped on a Zoom call to discuss how the screens would progress.
To export the animations in the end as a LottieFiles (allowing direct implementation for developers), I had to keep in mind a set of constraints
First Iterations
03 Revision and Handoff
After the first iteration, I recreated the animations with a new visual design (which you see in the final iteration), which included a different screen for step 3 to connect with a partner.
LottieFiles Handoff
I exported the animations to LottieFiles, where the team's developers could access a .json file of the animations for implementation. Though there were some bugs and export errors, I made multiple small adjustments based on Yan and the team's feedback.
Final Thoughts
I enjoyed this project since I also got to work with a visual designer and some developers. I received feedback on improving the animations from the developers, and greater insight into hand-off of animations through LottieFiles, a tool I will be using a lot more often now. The visual design was used to put together a storyboard, which I translated into the
1
3
2
3 (revised)
Other Work
