The New Humanitarian

The New Humanitarian provide quality, independent journalism that reports on the stories of the millions of people affected by humanitarian crises around the world. As creative director at Bliss, I led the redesign of their multilingual news platform, including the restructuring of over 80,000 reports.

Report viewed on an iPad

The weight of words

In 2015 IRIN News (now The New Humanitarian) approached Bliss to build their new content delivery platform. I led the end-to-end design effort that spanned over 4 months on a budget that demanded strict adherence to scope.

Before any visual design could commence, an IA (Information Architecture) overhaul of over 80,000 pre-existing reports spanning more than 40 categories was urgently needed.

By analysing usage data, the distribution of articles across categories, mapping taxonomic relationships and thematic similarities, and running card sorting exercises with internal IRIN stakeholders, we succeeded in re-grouping articles into 13 categories that fell broadly under the themes of Aid and Policy, Conflict, Environment and Disasters, and Migration.

Example of report layout wireframes — Early wireframes exploring report layouts reflecting different metadata.

Besides thematic groupings, we also faced the difficulty of establishing clear geographic regions that corresponded with the mental models of a wide variety of users. For example—to find stories from Egypt, would you look under the Middle East or Africa?

Considering context

The challenges associated with the propagation of long-form journalism that deals with serious subject matter were clear from the start, but unforeseen technical hurdles also impacted the design process.

Array of mobile designs

The existing IRIN website was slow, difficult to manage, and poorly optimised for smaller screens. In 2015, 35% of their readership visited on mobile devices. By 2020 that percentage had nearly doubled. Coupled with the knowledge that many visitors were in areas of poor connectivity (eg. rural Africa), performance and readability were top criteria to be considered when exploring design options.

IRIN’s library of nearly 40,000 photos would be readily wielded in support of their reporting, in a way that was scalable and fully responsive. We established a benchmark that no page on the site should take longer than 1 second to load on a standard 4G connection.

A tale of two users

Shifting focus from the readers of reports to their authors, content administration was also a huge consideration. How do you design a dynamic system that allows for creative control, whilst maintaining usability and consistency across thousands of articles? We built an editorial approval workflow and designed rendering rules for all manner of media, including galleries, videos, and interactive infographics.

Screenshots of homepage designs — It was necessary to consider how report teasers rendered based on their content, recency, topic, and importance.

The platform was built on Drupal, but we went to lengths to configure the available WYSIWYG features and permissions based on user role. I worked closely with our engineering team to outline the system architecture for every single content type, entity relationship, and form field configuration and limit.

Rigorous testing ensued to ensure that even the least tech-savvy of content contributors would be able to publish without fear of breaking the website's UX.

In news, content is king

Our design ethos was guided by the belief that everything was in service to the findability and readability of The New Humanitarian’s journalist output.

The bulk of the UX design process occurred in the world of wireframes, and at all points encompassed fully responsive layouts. I focused on establishing a clear information hierarchy, taking cues from print journalism, eye tracking and heat mapping studies, and following established usability heuristics.

Design explorations of advanced report mastheads — Besides standard reporting, in-depth features warranted more captivating designs—as seen in some of these masthead explorations.

While I strove to design engaging presentation formats, creating fallbacks for any eventuality was important. Some reports could run to thousands of words with lots of imagery, whilst others may be only a few lines with no supporting visuals. I also had to consider multiple languages. For example, how would blockquotes render when localised into an RTL (right-to-left) language like Arabic?

“The website … is faster, simpler, easier to search, and looks great on mobiles and tablets. It allows us to deliver more dynamic and visual content, on a range of platforms, as we continue to develop our storytelling.”

— Ben Parker, Editor-in-Chief, The New Humanitarian, 2016

In 2019, IRIN became The New Humanitarian. With a brand overhaul came a rapid website redesign project. Following the launch, I oversaw a UX audit and programme of sweeping UX improvements.

Reflection

Working with The New Humanitarian was challenging but extremely rewarding. Strict budgets imposed the necessity of focusing on low-cost, high-gain improvements, and the stakes could be high.

Report viewed on an iPad

Unlike much of my other commercial experience, our goal was not to drive conversions and increase revenue—The New Humanitarian’s reporting from conflict and disaster zones informs prevention and response. It saves lives. Less than a month following the launch, page views were up 50% and visitor times on the site were up 25%.

Although I left Bliss in 2020, they continue to work with The New Humanitarian several years later. A working partnership that spans almost a decade is a testament to the enthusiasm, vision, and hard work of everyone involved.