Over a four-month period, implement a user experience design process to thoroughly evaluate the usability problems on the site and make design suggestions based on our findings.
After talking to our client, several usability problems were brought to light. The guide had not been tested since its inception and pages had been pushed into basic categories (“Browse Data Types” and “Browse IT Tools & Services”). If the guide continued to expand in this haphazard way it would become unusable, too bulky and difficult for users to navigate.
Since we were unfamiliar with the guide, we partnered with our client to obtain general information.
One of our clients provided us with examples of other campus data guides. We also expanded our competitive analysis beyond universitiesto Expedia.comWikipedia,comerica.com and wyo.gov. These websites were chosen because they all contain a large amount of information and we wanted to explore how they categorize and organize information.
After conducting initial research about the guide, we were ready to learn about our users. The objective was to gather data related to the goals and frustrations of our users
Given that almost all our users are local, we conducted interviews in person. Users noted where they were confused with the tool and provided us with insights on how to improve it.
Our questions were designed in a way so users could openly talk about their experiences while noting issues they had. We wanted our users to explain how they use the data guide, telling us the pain points along the way.
"...when you go to the sensitive data guide, what are you looking for? How do you use the sensitive data guide?"
Personas & Scenarios
After conducting user interviews, we took the data we gathered and put it into context. Prior to the design phase, we created personas to answer the question, “Who are we designing for?” . This helped us align strategy and goals to specific user groups.
We used various scenarios to explore the set of tasks and interactions required for the design of the guide. After our user interviews, we had more insight on user scenarios and could describe users' goals and motivations as well as specific tasks that needed to be accomplished.
Creating personas and scenarios was a critical step in our process because the data guide has a specific set of users. Users include new researchers and those that have worked at UM for several years.
Through sketching, my team and I generated stacks of ideas about the arrangement of UI and information hierarchy. Starting broadly, our vision began evolving into something tangible.
Wireframes and Prototypes
We focused on three different pages that we believed, based on our research, would improve the site's usability. Our wireframes were created using the Figma application, which proved to be a fast and easy way for our team to collaborate on the designs. We then created our digital prototypes using InVision. With InVision, we could easily share our digital prototype with our client. InVision proved to be the best tool for testing our prototype with users.
Analysis and Recommendations
Lo-fi prototypes were created to analyze and suggest designs based on our user testing.
We found that most users go to the search before anything else on the page. Therefore, we decided to put the search function on the top of the page so it's immediately salient to users.
To make the search more user friendly, we gave users the option of typing in a specific data type or service or clicking on the dropdown to search for it.
Lastly, users mentioned that numbering the steps in the search made them think they had to follow a specific order by first selecting a data type and then a service. The functionality of the search does not require users to select a type and a service, so we removed the numbering to reduce confusion.
"Links" and "About Sensitive Data Guide"
Users mentioned that they cannot find the “recent updates” link hiding in the blurb at the top of the page. We decided that highlighting helpful links to the right of the search will put links like “recent updates” in the users’ view. Additionally, putting a small blurb about the sensitive data guide is important to new users so we put that blurb to the left of the search.
We also experimented with putting the helpful links and “about sensitive data guide” blurb in a gray box alongside the listing of data types and services. This provides balance to the page and users can see this gray box when they browse through the listing.
Data Type Page
All users we interviewed indicated that the permitted/not permitted box was the primary component they looked for when visiting the page. They also indicated they rarely look at the description of the data type because most users are very familiar with data types. For this reason, we decided to raise the permitted/not permitted box to the top of the page and align the information, examples and data classification level to the left as secondary information available to new users. The data classification risk level will be salient on the page it is important for users to know what level of risk is associated with their data type.
The comparison page was an idea that one of the researchers we talked to came up with and the designs have evolved since. The search function and data service portions of the pages allows users to check off any of the services that the user is thinking about using and compare all the data types permitted to store in that service. Users can compare as many services they want while looking at only a few data types, or to visualize all the services and data types at once, or any other variant of the chart. This feature eliminates the time spent by the user going back on forth between pages trying to figure out which service to use.
My team and I documented our user testing process including the study design, who we selected to user test and why, our limitations and results.
Click here to download the full report.
Two months after graduation, we received an email from our client saying that our design recommendations for new layouts for pages in the Sensitive Data Guide went live. You can view the site here.
My group was runner-up for “Best Project Award.”
We received positive feedback from our classmates and professors on how we approached the process toward suggesting new designs.