Department of the Interior

During the bootcamp course, I was tasked with the redesign of a US government department website. I chose the department of the interior (DoI) as while it was already in a decent place, there were some aspects which strongly needed reworking.


Over the course of 3 weeks, I redesigned the main page and a few other parts of the site to make it more intuitive and user friendly as well as visually appealing,

Research

Competitor Analysis
User Interviews

User interviews were conducted to gather information on pain points and initial issues with the site and also allow me to generate a user persona.

Card image cap
User Persona

From the information gathered during the user interviews, I generated a User Persona to use going forward in the project and to condier when making design decisions.

Card image cap
Guerrilla User Testing

Guerrila user testing was carried out to help further pinpoint problems with naviagtion and site layout that needed to be addressed during the redesign.

Card image cap
Heuristic Evaluation

A heuristic evaluation was conducted on the site and search results page to see how intuitive the current site is. Overall it did well however there were some weak points that needed improving.

Card image cap
Colour & Accessability Testing

I analysed the current colours and fonts used on the site with webaim.org to see how they were in terms of accaessability and readability and used this to modify them.

Card image cap
Site Evaluation

The entire site as a whole was broken down into its individual parts to look at closely to identify strengths and weaknesses.

The Problem

During our interviews, we discovered that finding parts of the site through the navigation bar is complicated and the search page can be difficult as the results displayed are poorly displayed, making it a chore to read them.

I believed that redesigning the site could create a more positive and user-friendly experience.

This could include colour scheme, site layout, navigation method, content structure and more.


Iteration

Card image cap
Moodboard

I created a moodbaord of similar sites to inspire my design ideas and create something both usable and aesthetically appealing to the end user.

Card image cap
Card Sorting & Site Map

One of the issues that had been raised during the initial testing was that some pages were hard to find so a card sorting exercise was completed and the results used to make a new site map.

Card image cap
Wireframing

I began wireframing the basic structure for the homepage design using Figma before going on to create a low-fidelity clickable prototype that could be used for testing.

Card image cap
5 Second Testing

I conducted a round of "5 second testing" with the prototype where subjects were allowed to view the page for 5 seconds before being asked a few basic questions about it.

Card image cap
UI Style Guide

A UI style guide was created to ensure cohesion and continuity between pages of the site which was something it previously lacked according to the testing I conducted.

Card image cap
User Testing & Iterate

I iterated based on the feedback from the 5 second testing before conducting a round of navigation testing with Maze. I used the results from this for a further round of iterations.

Final Prototype

Below you can view the final clickable prototype along with the Figma files and a full version of the case study that goes into much more detail and containes links to testing results.


Prototype images