Relaunching the SundayWorld.com

The Sunday World was founded in 1973. It’s a successful print product; with a circulation of 526,100 every week — that’s 63% more readers than the nearest popular Sunday competitor. But it lacked a digital presence.

That has changed with the launch of Sundayworld.com and the iOS and Android apps. Like the paper, the site and app will focus on crime reporting, entertainment, lifestyle and sports — but on a daily basis. An eight-month design and development process with a cross-functional team defined the online iteration of the brand. It needed to:

  • Define a product that offers compelling stories to engage users and a layout that satisfies business needs.

Research

At the start of the project we undertook detailed competitor research, defined the user touchpoints: Making a responsive site, developing an AMP site for mobile, creating an iOS and Android app and standalone app for the digital edition. This helped us understand what was important to reflect as a brand and how to connect the dots between the product and the brand.

Competitor research for Sunday World

Shared Publishing Platform

The Sunday World website is built on a common codebase, shared with INM’s sister titles, Independent.ie and BelfastTelegraph.co.uk. Some elements such as break-points and image ratios stayed the same, while other elements were restyled using CSS.

Sunday World responsive design

Typography

Bold fonts are vital for a tabloid brand. So deciding on font- families was one of the first steps in creating the design system. We have serif headlines and sans font for body content. Then a type scale was set up, so we can have responsive text and decide what size unit at which breakpoint. Finally, a base value was defined for the spacing, we used this value to generate multiples of the baseline and obtain a consistent spacing between elements and components.

Tempo, Merriweather and Helvetica font families

Headline prefix

We created a new headline prefix. This was the only break from the common design system used on all of INM’s digital titles. We felt it was vital to give teasers and articles on all platforms the additional oomph that the Sunday World brings to the news agenda

Colour

We use the brand colours as primary colours, those colour are the most prevalent in the UI. We introduced a new primary colour to balance some designs and to be applied for the main CTA’s. There are also secondary colours, that are applied to all different text or elements in the UI.

While selecting the colour and its applications, we used a colour contrast checker to ensure accessibility standards were met.

Colour palette designed for Sunday World

Iconography

Icons are a very important part of the visual language, they help users to identify a type of story, for example, a video, op-ed or a gallery.

We opted to use the material design icons and we decided which icons should be part of the Sunday World inventory.

Quote, video gallery and more icons used in the interface

Cards

Components are reusable part of the interface and these components are modular to support a variety of applications.

Clusters

A cluster is a group made of different components that most of the time, have a relation in common. We use clusters to group stories from the same section, related content or news topics that users care about.

Teaser card structure consists of labels, headline prefix, icon, headline and image.

iOS and Android Apps

The Sunday World iOS and Android apps, like the site, share a common codebase with INM’s news apps. The same branding and web styling were applied to the front end of the news apps.

The apps have some unique features to make the experience feel more intuitive and interactive for example:

  • Onboarding experience
Sunday World App design

ePaper App

The Sunday World ePaper is an interactive digital replica of the newspaper and supplements for mobile, tablet and desktop. As a part of this project, the epaper app required a facelift from INM’s other ePaper apps, where multiple titles are bundled together.

The digital edition product allows users to print, share and save for later to read offline, search for the latest editions, watch videos and bookmark content. Users can also revisit the past through the archive editions by using the date filter.

Sunday World ePaper App design

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Mediahuis Ireland Product Team

We are Independent News & Media design and technology team writing about how we design, build and optimise our digital products.