FreshBooks Blog

Improving discoverability.

UI
VISUAL DESIGN
Information Architecture

Background

The FreshBooks Blog is a resource for all things small business, from tips to getting started to running a healthy business.  In 2017, the blog needed a full overhaul to keep up with the needs of the readership following the new platform launch. The single-column paginated page layout that existed was clunky to navigate.

For this project, I was a Visual Designer working alongside the content team of editors, writers and an illustrator. I was responsible for a site map, wireframes, site IA and the final visual design.

The Problem

The team started with identifying some of the problems/opportunities.

  • Some of the readership was coming from external social channels - how would we balance providing useful content with brand recognition?
  • We had popular evergreen articles/topics, such as taxes - how would we help readers find the articles they sought?
  • Readers come from varying industries or business stage, how would we help them find the right information?
The structure of the new blog arranged articles by industry, small business resources and company news.

Wireframes

We hypothesized improving the front page of the blog to include section jumping off points would help readers see more topics at once, and allow them to jump into sections or stories. Some quick wireframes were assembled exploring the hierarchy of story cards and dedicated sections for industries.

Wireframes for the desktop and mobile view demonstrating how feature article tiles and smaller article tiles would be structured and scale down on smaller screens.

UI and Visual Design

As we were looking to improve discoverability, we did some research on the psychology of search. We hypothesized that providing a site navigation with article previews would give a better view of what falls inside a category, allowing readers a “window” into what was inside.

Final design of the page. The navigation features the four newest articles.

Finally, we gave a polish to the visual design with a colour-coded system for topics, and created some fun FreshBooks ads that could be interspersed inside articles or alongside story tiles.

Outcomes

We found the Blog was a contributing factor for new signups. The team continued to iterate and test on the front page sections and content types.