IAG Newsroom redesign

Enhancing IAG’s communication effectiveness

IAG is the largest general insurance company in Australia and New Zealand, selling insurance under many leading brands.

Challenge

Enhance IAG’s communication effectiveness through the Newsroom to make it easier for media and stakeholders to engage with the strategy and work.

Objectives

  • Redesign the Newsroom to make it more usable and engaging.

  • Create more flexible templates and options for publishing stories via the CMS.

  • Make it easier for stakeholders to share stories with their networks.

  • Improve options for media to engage with IAG and find the information they need on breaking news.

My role

Lead UX/UI

Duration

3 months (2020)

Team

I worked with a PO, developers and business analysts.

This was my first project at IAG leading UX (as well as UI, but I had done that before). I paid attention to following UX steps and methodology.

UX/UI process

Research

Site analytics

Site audit

Customer interviews

Competitor analysis

Prototype and test

User goals

Hypotheses

Prototype

Usability testing

Design and deliver

UI style guide

UI shared components

UI page templates

Developer handover and design QA

Research

Analytics

Reviewing the current site analytics showed very few people visit the News & Events page, and most visitors journeys are direct to one story and then off the site.

Key findings:

  • Most newsroom traffic lands directly on a news story from a LinkedIn share

  • Most visitors view one page only (story page) then leave the site


Site audit

Collating all current pages and their purpose to understand the current IA and structure.

Key findings:

  • The News & Events pages are mostly dead-ends with difficult multi-step flows to find more content.

  • There are many double-ups in the navigation, e.g. ‘Announcements’ is another page template showing the same latest news stories in a different layout.

Image: site map mockup from the audit showing the before state

Customer interviews

6 IAG stakeholders and 4 journalists

  • How they currently engage with IAG’s content

  • What are their expectations of a news page

  • Their impressions of the current newsroom

  • How they engage with news sites more generally

Image: screenshot of raw interview synthesis

Key themes:

Themes 1.png

Competitor analysis

We reviewed competitor and adjacent news sites. 

Image: Competitor analysis stakeholder presentation slides
Image: screenshot of synthesised themes

Prototype and test

User goals

We created proto-personas to communicate key goals and pain points.

Key hypotheses

  1. Improving searchability and tagging will encourage more people to view articles on IAG’s website instead of general news sites.

  2. Creating more paths between related content, such as suggested articles and category tags, will increase the number of articles people read in one session.

  3. Improving story topic clarity on article lists will increase click-through rates to article pages.

  4. Visual and content type tweaks to article pages to make them more scannable will improve audience engagement and satisfaction with our content.

  5. Embodying IAG’s purpose on the news page will reinforce audience positive belief in IAG.

  6. Making it easy to share articles to social media, especially LinkedIn, from the article pages will prompt people to share and increase viewership.

  7. Making it easier to explore and find content with clear categories, navigation and hierarchy, will increase the average time a person spends on the IAG news site.

  8. Modernising the interaction design will help people interact with the News Site more confidently.

  9. Including tools for journalists, such as media contact links and downloads, will increase journalistic engagement with IAG content.

Mid-fidelity prototype

Testing our concepts with journalists and highly engaged stakeholders for clarity, usefulness and usability.

Image: medium-fidelity prototype for usability testing

User testing synthesis

Examples of actionable feedback included confusion around our category labelling, usability enhancements with our search feature, and clarity on which features to prioritise for journalists.

Image: Usability test report
Image: Proto-personas from a stakeholder presentation

Design and deliver

Creating a UI style guide for the IAG brand

The existing IAG website template was inconsistent and put together by different teams without design input. It wasn’t aligned with the brand style guide, and was not AA accessible. I defined the UI styles to put into our global design system for the IAG brand.

style guide.png

CMS components created for news story publishing

We defined a variety of styles and components for the story template to add flexibility to the layouts used to publish stories.

Story text style options:

story-text.png

Story image style options:

CMS components created for Corporate Affairs

We defined a variety of styles and components for the story template to add flexibility to the layouts used to publish stories. 

Image: Base component styles I created designed for the IAG design system

Final thoughts

A chance to define style
Because IAG is not a consumer facing brand the website is a little neglected style-wise and not in-line with their current brand guidelines. This allowed a lot of flexibility to advise and define the visual style based off the IAG brand guidelines which will now influence site-wide iterations.

No budget means using networks
There was no allocated spend budget for testing this work as the stakeholders believed if the site was just made to look nicer then they would lift engagement. This meant being a little creative with finding test participants and hosting regular stakeholder showcases to show the value in the UX research and testing process.

No budget also means tight prioritisation
We had a lot of great ideas for the re-design features, but had to be very clear on prioritisation to deliver MVP and define future features for enhancements.