Stratfor — Geopolitical Risk

Stratfor is a geopolitical risk company aimed at globally engaged individuals and enterprises. It enables better decision making and risk mitigation.

The final designs

My Role

This project to redesign Stratfor's navigation and articles pages was a mini sprint collaboration between myself and our Project Manager over three days, I was responsible for the UX design and information architecture.

The Problem

Usability testing conducted through clearly demonstrated users' difficulty in navigating the site, and from questionnaires and phone calls with customers it was clear that users thought of their interests in terms of region or broad topic, rather than custom, specific themes.

We concluded that part of the difficultly in navigating was due to basic readability, but primarily it was due to the information architecture — users could not find content because they did not understand how the website was organized.

The Solution: Information Architecture

We reorganized the information architecture and refreshed the navigation by prioritizing regions and broader topics, reducing the detailed topics to an internal taxonomy instead of an external method of navigation. From user testing it was clear that these two paths (regions/broad topics) were how out users categorized their interests and therefore wanted to navigate by.

Desktop navigation
Mobile navigation

The Solution: Letting the Content Shine

One of our issues was the lack of readability on mobile and how far users had to scroll to get to the content. The new design allows both the title and image to shine, instead of forcing them to compete with each other. We also decided to utilize more a conventional vernacular for tags and moved "Connections" (tags) to the bottom of the article, allowing the start of the article to be in view when the page loads.

We also made slight but important tweaks to the typography:
• We upped the contrast by very slightly lightening the background grey, and darkening the text

• Adjusted the bullet style and added a big cap to negate the need for boxes to separate content

• Adjusted the header styles to be more elegantly bold