Nov 16, 2020
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.
- Create a distinctive visual identity that captures the Sunday World personality.
- Ensure the visual look and feel for the Sunday World can be implemented on a shared CMS and common design system across INM’s digital publishing properties.
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.
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.
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.
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.
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.
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.
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
- Push notifications
- Bookmarking and sharing functionality
- Add favourite sections to the main navigation bar
- Full view of video and picture galleries.
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.
