Over the last couple of years, the Amazon Video UX team has focused on redesigning our apps on mobile, web and TV platforms. Because all platforms have different technical capabilities, and also were launched at different times, it was important to make the experience feel familiar for customers. So a couple of UX designers including myself were given a task was a first for Amazon’s design team: introduce Human Interface Guidelines (HIG) for our application.
Since this was an internal project I can not share the final output, but can talk a bit about my working process.
I was responsible for the motion section of the HIG – guidelines that could be used by design and engineering teams when adding motion to their applications.
This project was a challenge since there were not many existing references in the wild. Google have set a good precedent with Material Design, but Amazon Video had more specific requirements and needed a more cinematic feel to align with their brand.
I lead workshops to ask the team how they thought we should be thinking about motion for Amazon Video.
Researched interactions and transitions on competitors’ iOS, Android and TV apps.
Audited motion patterns throughout our existing apps.
The guidelines comprised the following:
Principles of how motion should be approached for Amazon Video
Recommendations for how we should use motion to unify our brand’s image
Animation patterns including duration, easing graph and animation types
Examples including solutions for different use cases
Human Interface Guidelines established internally that helped designers and engineering teams understand how motion should be applied.