MoneyNest

PROJECT OVERVIEW

THE GOAL

MoneyNest is a personal finance blog, aimed at 20-30 year olds in the UK. The blog focuses on helping people manage their money in a better way, and educating them on various financial topics. The website is owned by a family member, and I've offered to help improve their site in exchange for showing the case study as part of my portfolio.

Their main goal is to grow their newsletter subscribers, and success after the redesign of their site will be measured based on the newsletter sign up conversion rate.

THE STRATEGY

As the process for redesigning a growing blogging site doesn't have to be very extensive, my focus for this case study will be on usability tests and high level wireframes based on the findings from user research.

MY ROLE

UX Designer (individual project)

TOOLS USED

Sticky notes, Pen and Paper, Sketch

DIScovery phase

usability testing

Usability testing is a great tool to help uncover areas that are preventing conversions. In order to understand what users of MoneyNest were finding difficult and what was stopping them from signing up to the newsletter, I set up a usability test with 3 different tasks:

  1. Homepage tour: what's the first thing you notice? What can you do on this site? What products and services are offered? Who is the site intended for?
  2. Signing up to the newsletter: imagine you're interested in finances and want to be updated when a new MoneyNest article comes out. Please take a look at the website, and try to subscribe to get new articles by email.
  3. Reading the blog: imagine you want to read all the articles on MoneyNest. Please take a look at the website, and find the page which shows all the blog posts that have been written to date.

I recruited a few research participants, and used Steve Krug's Usability Test Script to run the sessions.

affinity map

After developing a deeper understanding of the users, I used an affinity map to identify the most common pain points. I wrote down the insights that I gathered from usability tests, and then grouped them based on similarity. 

 
 Affinity map showing user pain points

Affinity map showing user pain points

 
 
 Site screenshots with areas of biggest pain points

Site screenshots with areas of biggest pain points

 

As a Moneynest's goal is to increase the number of subscribers through blogging, I decided to primarily focus on the following pain points:

  1. User doesn't know how to sign up to the newsletter
  2. User can't locate the site menu
  3. User can't locate the blog page

My secondary focus will be on improving the general impressions of the website through explanations of features and updated imagery.

 

Design Phase

UI Sketches

 
 UI Sketches for MoneyNest

UI Sketches for MoneyNest

 

Prototypes

After learning the critical things throughout user research that uncovered how users use the website, the prototypes below show an updated homepage and blog page. 

The homepage includes a darker background image, a menu, and calls to action to sign up to either a newsletter or an email course.

The blog page includes a menu that stands out more than the previous one, a call to action and a simpler design.

A brighter colour has been weaved into the design to draw the users' attention to the parts important for achieving business goals. 

 
 Moneynest homepage prototype

Moneynest homepage prototype

 
 
 Moneynest blog page prototype

Moneynest blog page prototype

 

Results

Coming soon - the client is currently working on website changes.