Role     UX Designer

Client     UTV

Agency     Ostmodern

utv - header imageutv - header image


UTV are a key commercial TV channel in Northern Ireland and the Republic of Ireland. I was part of the design team at Ostmodern commissioned to create and build a new destination for UTV viewers to come and discover the latest news from Ireland and around the world.

My key role within the project was to create the strategy, logic and page designs for the destinations of UTV's top programmes & news. I designed the EPG from the ground up, providing clear and quick indication UTV's programming schedule.

utv - homepage final renderutv - homepage final render
utv - final renders mobileutv - final renders mobile


UTV are the top destination for the public in Ireland to get their news. It was important that a platform was designed that allowed for easy curation, showcasing breaking news and top popular stories. Once a story was no longer breaking or popular, it needed to naturally filter its way into the appropriate news category. The system will move the news article down a heirarchical list, and when no longer in the top 4 / 5 list it is assigned into the suitable category.

utv - latest new logicutv - latest new logic

// Diagram illustrating the path a piece of content takes as it moves from ‘breaking’ news into ‘latest’ news then over time being categorised into the relevant module for viewers to discover later. //

Bringing form to the logic

Detailed wireframe specifications were created to illustrate how the logic for all news would be handled on the latest news page of the UTV product.

utv - top stories wireframeutv - top stories wireframe

// Wireframe design using a modular design to build the ‘Top stories’ page. Each module has a set of rules applied to each to ensure each story is showcased in the correct way. //

Clear reading experience

News is an important part of the UTV product for its users, so the reading experience on a story was the key focus across all device types.

utv - final rendersutv - final renders

// Final designs showing pages that are implementing the modular design to provide a clear reading experience and showcase other stories that are similar. //

Follow a story

It was my task to design a tool for news articles that provided the flexibility of a news piece being a one time article, or evolving into an ongoing story. UTV readers can arrive at a news piece and quickly locate older stories within the timeline to catch up with the ongoing story.

utv - follow a story findal renderutv - follow a story findal render

// 3 categories ‘Updates’, ‘Previous stories’ and ‘Background’ break up the story to allow users at different places within the story timeline to catch up or get the latest updates. //

Programme pages that adapt with a programme

UTV airs some of Ireland's most watched TV programmes. It was important that the platform designed to showcase them provided a flexible content structure.

A selection of programmes on UTV such as 'The X Factor' have a live element. We asked ourselves how would the programme page adapt and provide supporting content as the programme aired.

We designed an underlying logic to the page, that allowed the content structure to update with real time content and conversations about the live episode.

final renderfinal render

// Module design specifying how it will handle different numbers of content when showcasing a programme as it is live. The module handles ‘breaking’ content as it arrives and leaves. //


Browsing what is on for the next 7 days was designed to be as clean as possible. Ensuring that all important information and metadata about a programme was clear and easy to read.

As the user browses through the EPG they can quickly orientate themselves with the time & data, whilst always being able to jump straight to what's on now.

utv - epg collectionutv - epg collection

// The EPG was designed to provide a clear overview of content with the ability the quickly jump to the UTV player to watch available on demand content. //

[unex_ce_button id="content_dkahk2rg8,column_content_9sfex8g5q" button_text_color="#4a4a4a" button_font="semibold" button_font_size="44px" button_width="full_width" button_alignment="center" button_text_spacing="2px" button_bg_color="#ffffff" button_padding="75px 68px 75px 68px" button_border_width="0px" button_border_color="#ffffff" button_border_radius="0px" button_text_hover_color="#ffffff" button_text_spacing_hover="2px" button_bg_hover_color="#161616" button_border_hover_color="#161616" button_link="http://matthewmcgriskin.co.uk/work/seat/" button_link_type="url" button_link_target="_self" has_container="" in_column="1"]previous[/ce_button]