A new layout, branding and code base for a rapidly growing mobile audience.
Animoto is a video startup in New York. Through applications on the web, iOS and Android, users upload photos, add a custom soundtrack and theme, and produce a high quality video to share. Soon after I joined in 2012 as a senior front end engineer, the company saw significant increases to their external facing corporate website from mobile browsers. Yet the existing fixed design was optimized for desktop and in need of a refresh.
We had a strong in-house design team, but they were few in numbers and stretched thin among the needs of our engineering staff. Because of my experience and interest in responsive web design, the design team mostly focused on the aesthetics, branding, and initial concept for our rebranding. I was tasked with wireframing, research and development.
Core development
Oversaw and managed site wide CSS and HTML5 on animoto.com.
Collaborated with junior developers for a consistent web experience across multiple devices and platforms, including mobile.
Lead developer on site wide redesign and rebranding project, instigating a module based (SMACSS) CSS reorganization and a responsive web design framework.
Wireframing, research
Created wireframes in Sketch for resigned RWD-friendly pages at different viewports
Brainstormed, sketched and designed wireframes for various marketing initiatives
Ran user research interviews with founders, designers, other longtime staff at Animoto
Formulated A/B tests to test with live users based on various design direction hypothesizes
Slide from a presentation to the Animoto web development team on SMACSS, a framework for CSS reorganization.
CSS coding guidelines for fellow web developers.
Slide from a presentation on responsive web design changes given team-wide.
Sketch wireframes for features page.
The final features page on a desktop browser (see top banner for mobile perspective.)
Sketch wireframes for pricing page.
Final pricing page on various devices.