About: ICI Tou.tv is a French Canadian video-on-demand website launched on 2010 by Radio Canada, it offers mostly content in French, provided by several TV channels, such as ICI Radio-Canada Télé, RDI, ARTV and others.
Challenge: To create an app for TV Mediaroom environment, following the current design and branding for the website and mobile application https://ici.tou.tv/
Team: LVL’s Design & Development team
My Role: I led the user experience of this project, supported by my UX lead, followed by my fellow UI designer and the development team. Likewise, I did some internal tests to check proper UX-UI implementation.
Software: Adobe XD, Confluence and Photoshop
Design Process: Given the nature of the project some of the steps in the design process were already provided by the client such as the information architecture, user stories, personas and the basic look & feel of the app. The real challenge started when trying to design a similar experience to the mobile and website apps but for TV with the limitations that Mediaroom have.
Firstly, a vertical navigation was proposed to limit the number of elements on screen and therefore improve performance and smoothness on the overall experience. So, the app was structured with a main menu at the top that displayed all the sections available followed by swim-lanes with different categories.
Some sections had submenus on its own that navigate to a list of assets related to that subcategory. Certain subcategories had its own branding, hence they had to be given a different graphic treatment to follow the product’s branding guides.
Additionally, for the product page (series and movies) the main menu had to be collapsed in order to see more elements on screen like metadata, the show’s image, trailers and the list of episodes and seasons for series.
Finally, Proper font and icon sizes were tested to be easily read and recognised from a 10ft distance, wireframes were elaborated and pass-on to the UI team, the use of black UI was suggested. Technical documentation was prepared to be handed out to the development team. Final reviews of the implementations were done to check proper UX-UI implementation and test performance and smoothness of the experience. This TV app can be found in some of the Telus products and TV plans.