ROLE: VISUAL DESIGN & USER RESEARCH
YEAR: LATE 2012
AGENCY: MADE BY MANY
Complete overhaul of broadcasters homepage, bringing the rebrand of ITV to the web.
A lot of broadcaster homepages represent land grabs from different departments within organisations that clutter the design and lose focus. Through audience research we discovered that the highest percentage of visitors to the ITV homepage went on to watch catch-up on ITV Player. The new design had to serve this need first.
Other user needs we discovered were: streaming live TV on the web, exploring more about a show they've been watching and finding out what's coming up on TV.
Using the user needs as a starting point we then held a series of sketch workshops to rapidly generate a range of approaches to solving the problem. Within hours we started translating these ideas into prototypes we could test. We use keynote as it's fast.
Some of these approaches were based around changing layouts to reflect the time or day of the week. Others were to surface what was trending on ITV and to use longer scrolling pages with dedicated areas for content. We tested these prototypes with users to understand which approach worked best.
Responsive web design
Visitors to ITV.com from mobile and tablet devices are increasing all the time. This shift in usage pattern meant a responsive design was the only approach to take. This allowed us to restyle content to better suit screen size or device, providing a more consistent user experience.
Showcase for the brand
Visually, the site needed to be a poster child for the new ITV brand. We worked closely with the design and branding teams at ITV to develop a new visual language, that echoed and built upon elements from the TV rebrand. The homepage showcases the best of ITV right now whilst simultaneously reinforcing the broadcaster's new brand position: at the heart of popular culture.
The site leads with immersive programme photography, being bold and proud to showcase this content. For the rest of the page the design is modern and light. It uses white space to define clear content areas and makes use of ITV's new web font - Reem by Fontsmith.