In late March, 2014, ClassDojo launched ClassDojo Messaging — a new feature built into the existing teacher web, iOS, and Android experiences.
Working alongside the mobile team, I designed and built (read: HTML, CSS) the web interface for the new messaging interface, as presented to both parents and teachers, to look seamless across devices.
Before we could release the messaging feature to our teacher and parent users, we had to let them know what was new! The task then fell to me to create a marketing page touting the new communication tools in an interesting and interactive manner.
We originally planned to film a 'floating hand' using the updated app in a real school classroom. After several iterations of concept, we opted to keep the phone static, but animate the actions a user would take within the actual app.
To achieve the 'screencasted' video of the iPhone, I ran the app locally in Xcode and and captured the movement a finger would take. For brevity sake, I used FCP X to edit down some segments and re-created natural app animations to cover the gaps caused by editing.
Watch the final animation