The challenge
To work with a team of UI and UX designers to deliver the visuals for Voo’s new digital TV player, focussing on the web platform whilst maintaining continuity between the TV and native app designs.
Mockups
Program Info
It was important to make the art work impactful whilst allowing the description and meta data to be clear and legible. This required clearly defined rules around the treatment of the image to making sure the gradient over top would protect the text when used with very light and dark art work.
Playback
The playback controls were designed to be compact. This meant placing the casting icons on the same row as the playback controls. A lot of attention was given to the size of the icons making sure everything felt balanced and considered.
Settings
As the settings screens needed to accommodate a lot of different information including profile settings, language and subtitle settings, parental controls and recording options it was essential to create a neatly structured and flexible layout. We opted for a secondary side navigation and content rows housed in panels. Consideration was given to padding and spacing and how screens transitioned from one to another.
Recordings
Simplicity was the key factor when designing the recordings pages. It can often be tempting to over design such pages wanting to create something impactful but from experience have found that cluttered designs only make the users job harder. Clear type hierarchy and interaction states were essential for creating meaning and guiding the user.
First Time Use
Although the on boarding designs were used to help users understand the product they were also a chance to show off the UI and entice people to sign up.
Purchase flows
A big part of the work was designing the purchase flows and having to consider the different scenarios involving sales, promotions, movie bundles and series passes. Attention to detail was key to ensuring a consistent experience for the user.
Pattern Libraries
Part of my role during this project was to help organise and maintain the pattern library, adding and updating UI elements and components as we went along and defining interaction states and behaviours.
Get in Contact
Let's work together
If you like what I do and think I could be a good fit for a project or simply want to get in touch please drop me a line here.
Say hello