Process: From Pixel Based Design to User-Centric Experiences

Gannett’s large team of UX practitioners needed a process that encouraged creativity and deliverability, one that could move the team from moving from designing pages to designing experiences.

1- Understanding Our Users and Meeting Their Needs

Understanding a user is more than demographics - it’s a wholistic view of their needs, technical environment and engagement triggers, and designing an experience that takes these factors into account. Intentional Design

highlighted below not only responds to a user's device, but their segment, previous behaviour and origin as well.

2- Understanding the Landscape
Researching Where We Are

Module, Template and Content Inventories helped the team understand what we have and what was in demand by editors and users

Investigating News Design

To build an understanding of how a site’s structure, contents and design affect how it’s presented, each member of the team took an in-depth look at a competitor or industry leader to better understand news design now.

Competitive Content Massing

Evaluating the content competitors placed on their home pages, combined with competitive research, gave concrete examples of how a site is designed to match a brand and mission.

Adopt-A-Site

In this Adopt-A-Site exercise, each team member used a competitor or industry leader as their primary news source for a week, evaluating their navigation, advertising, article, media and social treatments, as well as looking at their responsive design solutions.

Living with site for the week allowed the team to evaluate the impact these decisions made to the overall experience.

3- Process and Design System

A modern design process needs to take into account the importance of the user experience as part of the product. Understanding and incorporating proven approaches like Design Thinking is crucial. Though these may need to be tweaked slightly to work in a specific environment, the core questions remain the same. Working from these core questions creates a flexible methodology that can be used in both intense brainstorming and long-term development.

The design system also needs to be a “living” system - one that’s is crafted together with development, updated organically and part of the design and development workflow.

Design Thinking in Action

Working from a methodology such as Design Thinking allows everyone, not just UX, to focus on core questions, users’ needs and business goals. Defining the problem before the solution encourages new and iterative ideas.

Module and Template Library

A module and template library outlines the key elements in a site and with accompanying functional specs describes how those elements work, providing an invaluable resource for Development and QA. It helps guide thinking to improvement and iteration, rather than duplicating existing functionality, ensuring consistency and ease of maintenance throughout the site.

Focusing on key functionality and defining how these modules or templates change depending on context encourages thinking about the experience as a user moves through the site (rather than just what one page looks like) and the development of a site that is easily adapted using CSS and responsive design.

Living Style Guide

An online style guide and the crucial step of embedding these rules in commonly used tools provides a resource that immediate updates as changes are made, ensuring the rules that define the look and feel of the product are immediately accessible and reflect the current state of design.