Project Details

Design Goals

Reduce Page Density

The existing design (right) used a lot of links on the page which made it difficult to find information. We looked to put the links in the nav elements so the number of visible links was reduced.

Create a Task-Based Link Structure

Because of the diverse audience base, users came to the site for a vareity of reasons based om their persona type. We wanted users to have a quick way to locate important tasks. A link farm below the hero provided a good way to showcase this info.

Design Challenges

Information Difficult to Find

The current IA had too many categories and elements on the page. Additionally, some common elements were located on the right side of the page and in the footer. User stats showed that this was a popular destination. Additionally, some elements were repeated, made users wonder what was the difference for each element. This caused users to take more time to perform the task.

CMS Integration

To manage content, a Sharepoint CMS was rolled out. To ensure the design utilized these CMS features such as webparts, the team needed to be mindful of it's capabilities. To help me better understand these features, I dive into Sharepoint training from Microsoft on my own time and bought several technical books. This helped me better understand these features.

Lots of Content

The organization did a great job of encouraging staff to add content to the existing web site. However, as more content was added, the IA made it difficult to find information. Also, some content was duplicated. To locate the content that would be added to the new site, an inventory was conducted. Part of this exercise also included identifying new content that didn't exist. Talking to users and SMEs helped the team come up with a list of potential new content that could b added.


Project Overview

person

My Role

Senior Information Architect and Content Strategist

person

Project Team

Group Director of UX, UX Design Manager, Information Architect, Senior Designer, Senior Developer

Project type

Project Type

Waterfall, with the development team offshore

Gears

My Toolbox

Visio, Photoshop, Excel, Sharepoint


Accomplishments


Design Tools

Design does not live by wireframes alone. Below is a representative sample of various supplemental tools that were used to help shape the design.

A Detailed Content Matrix.

An exhaustively-documented 187-page content matrix was created in Excel - all within 3 months. Each content element was documented to include content type, puprose, page location. Each of the elements was traced back to the wireframe with a unique ID to aid developers. Although I generated and updated the document, I received input from both development and SMEs. I also identified content origin - whether the element was from existing content, or needed to be created.

content matrix

User testing with paper prototypes.

A user test plan was put in place to test 20 users who previosuly used the web site. We were careful to make sure we got a well-balanced mix of users with varied experiences, background levels, age and computer usage. The tests included a paper prototype of the home page which featured the proposed new design. Users were also asked their opinions of the current system. We were particularly interested in whether users could perform key tasks. Users were also asked to review the link far list. We iterated on the design after a session was completed. The sessions were recorded, which allowed us to document the feedback afterwards. This also helped us shape a set of user personas that were used to help identify user tasks and goals.

user test

Determine main tasks

A critical navigation element on the home page featured a task-based link farm that listed common tasks based on various needs. Our team first mapped out on a whiteboard adjacent to our workspace to list the main task categories. After performing a task analysis, and then validating the structure in user testing, we settled on: "I want to...", "Tell me about.." and "Share my thoughts..." We wanted to keep the number of links to a minimum while ensuring that the most important tasks would be visible. To help generate the list, we sketched out the items on a whiteboard. The example on the left is intended to show how a simple design approach such as sketching can yield big dividends. The board was visible throughout the entire project, and became a reminder of the user's main goals. At the same time the list allowed team members to add to the list, or provide comments and questions.

sketch

About · Contact

© 2016 Speedy UX. All rights reserved.