Fitch: Building a New Digital Face for a Growing Media Company

In 2014, Fitch’s digital presence wasn’t doing enough to engage an ever more globally-aware and digitally-savvy audience. Stewart has led a transformation that includes a new website, email campaigns, and social media strategy that make use of media including images, video, audio, and data visualizations to better package, present, and promote Fitch’s insight. He instituted agile development practices to move from occasional, large website releases to a rolling, four-week development, testing, and release cycle; and replaced several outdated and expensive content-management systems with a single, open-source platform and modular design architecture based on reusable components that can be assembled and published in real-time.

Stewart built the company’s first-ever global digital media team, with technical, design, and editorial staff in Chicago, New York, London, and Hong Kong; established Fitch’s social media presence as a strategic audience development and lead-generation source, improved email marketing by redesigning campaigns for better engagement on mobile devices, and integrated the campaign platforms with the website content management system and CRM to automate delivery and measurement. He developed a blog strategy to build an audience for Fitch’s thought leadership on Medium, and guide people to related content and products on fitchratings.com.

Visualizing air travel trends: We built a tool to compare airports in Canada & US by size, credit ratings, and carrier hub activity https://www.fitchratings.com/infrastructure/airportdatamap

Posted by Stewart Mader on Wednesday, February 22, 2017

 

Architecture & Foundation

A complete website overhaul is much like a major construction project to build a skyscraper. Once the project plan is set, the construction fence (or shed, as we call it in New York) surrounds the site, and much of the initial activity takes place out of sight. The foundation is dug, footings are poured, and below grade infrastructure is built to support the structure that will rise above ground. Once the structure starts rising, progress becomes more steadily visible.

For the new FitchRatings.com, we used this ‘foundation’ phase to put in place a completely new underlying system on which the presentation layer – what you see and interact with in your browser or on your mobile device – is built. These new underpinnings include a new database, new APIs, new content management system, new page architecture and and reusable components that gracefully rearrange in response to various screen sizes.

A fun look at how we’re redesigning and reengineering the fitchratings.com web presence. Details: fitchratings.com/releasenotes

Posted by Stewart Mader on Monday, April 6, 2015

 

On top of this foundation, we’ve built a new page architecture. Let’s take a look.

front page

The new header emphasizes search, the most widely used function of the site, and a new menu that provides an A-Z listing of the market sectors and topics covered by Fitch, which reflect the way business and market topics are organized elsewhere on the web. The menu is represented by an ☰ icon known as the ‘hamburger’ in the digital media world. Although it first appeared in the Xerox Star, the computer that famously introduced the graphical user interface in 1981, it is regaining prominence on websites like Discovery, Mic, Politico, and Reinsurance Magazine because it functions as a standard, recognizable icon for menus, and works well on screens of all sizes.

On the homepage, a selection of Featured Stories highlights the most important, globally-relevant research, commentary, and ratings. On the right, the Headlines stream displays a constantly updated list of research, commentary, and Fitch Wire headlines, while a Ratings stream displays the most recent rating actions, with a link to all ratings. Throughout the site, essential information is presented in a format that’s generously spaced, gracefully responsive to varying screen sizes, and especially easy to use on mobile devices.

Redesigning the Presentation of Articles

Fitch publishes dozens–sometimes hundreds–of news items every day. They contain everything from announcements of ratings to research summaries and commentary on important developments in the financial markets. They are among the most heavily used items on the website, and until now, they’ve been presented in a way that isn’t optimal, especially on mobile screens. In this website release, they have been redesigned to improve readability on a variety of screen sizes with a responsive layout, improved spacing, and font sizing optimized for screen reading. We’ve also added tools for sharing via email and social media, and streams that display related content, so that these  function as a stronger gateway to research, commentary, and ratings.

FitchRatings.com Rating Article

Here’s what a story looked like before the redesign:

Old FitchRatings.com Article Presentation

New Search Experience

Instead of putting all results on a single, overwhelmingly-cluttered page, as was the case in the old search experience, we built a new search experience that segments Research, Entities, Issues, Surveillance, and Analysts so you see one set of results at a time. Research appears first, and other result types are easily accessible from a bar at the top of the page. During user research, we heard from people that it appeared Fitch didn’t have research or commentary on topics of interest, because the research was displayed near the bottom of a busy page, and people were, understandably, missing it. This new approach gives each type of content a clearly-labeled, highly-visible, and easily-accessible place. A red diamond next to individual items indicates premium research.

FitchRatings.com Search

Filters were another source of complexity and visual overload in old search, so we made them smarter by showing only the top five in each category by number of results. A person can still access the entire list of filters in a given category, but they choose to do that, rather than having the information presented whether or not they need it. We also moved the filters to the right side to make the results page consistent with our main + sidebar layout used throughout the new website.

Websites for Fitch’s Worldwide Businesses

Stewart designed a flexible web architecture that can be used for Fitch’s business units and subsidiaries around the world in addition to the company’s core website. So far, new sites have been built with support for content in multiple languages, and released for Fitch businesses in Canada, China, France, Germany, Japan, Poland, Spain, Taiwan, and Turkey.

FitchRatings.com Japan

Play-in-Place Media

The cards used throughout the new website support embedded video and audio playback, so that videos, teleconference replays and other media hosted on YouTube or SoundCloud can be played without leaving FitchRatings.com.

FitchRatings.com Audio & Video

A Visual Refresh for @FitchRatings on Twitter

We’ve given @FitchRatings a crisp, visually compelling refresh with a header that features our London office in Canary Wharf, and a new profile picture that reduces well when it appears alongside tweets in your timeline:

new @FitchRatings profile

Here’s what it looked like before the change:

old @FitchRatings profile

Here’s how it looks now on mobile devices:

@FitchRatings promoted account