Last project:
Gifts of Art
Next project:
Sap EWM Return Clerk

Usability Test on City of Detroit Website

CUTGroup Pilot Study with Data Driven Detroit
Alternative Spring Break
City of Detroit Public Work
Usability Test
Contextual Inquiry
Card Sorting
Hyorim Kim
Mengzhu Ouyang
This is a week-long alternative spring break project. We worked with Data Driven Detroit, conducted usability research on City of Detroit’s Public Service Map tool, as a pilot study for CUTGroup in Detroit. We defined our project scope to give the most pertinent recommendations in the week, and provided re-design solutions.
At the first glance of the website, we think the website can be improved in a lot of places. In the given time, we want to focus on the most important tasks. We started from making an interaction map on the main functions, and did heuristic evaluation based on Nielsen’s rules.
[Heuristic evaluation document]
The webpage is for the department Public Work. The landing page is the tool used to inform Detroit residents garbage picking schedule. It also shows other information and functions provided by the department in the side bar. Then, we identified our research questions:
While checking garbage schedule, user is involved in a series of interaction with the tool, including selecting address, garbage type, and subscribe with phone number. In order to understand the obstacles in the process, we decided to conduct usability test on the tasks related to scheduling check.
After pilot tests with our colleagues, we found people interpreted the titles in the side bar very differently, having difficulties in information seeking. We chose to use card sorting, later reorganized the side bar in a more intuitive way for Detroit resident users.

Usability Test

User Interactions

We designed three information-seeking tasks that are commonly used by Detroit residents, from easy to hard.
Task 1: Subscribe recycle pick up time for your address.
Task 2: Find out street swapping schedule for a friend’s temporary address.
Task 3: Find out bulk garbage pick-up time for your address.
Based on the result of usability test with three Detroit resident on the website, we gave following web re-design recommendations:
Recommendation 1: Re-design the schedule information based on user flow

Recommendation 2: Use accessible color palette on map for colorblindness
Recommendation 3: Adapt schedule-checking to mobile user habit
During our test, we asked one of the participants to conduct the tasks on her mobile device. The test revealed a bunch of serious usability issues on mobile. When the user first open the page, a map is occupying the whole screen. When the user tried to move the map with touch screen, an accident click navigate the page to the schedule popover. Unlike on desktop where user could see it is over the map, mobile only show the schedule and nowhere to change the address. The participant was stuck here for minutes.
🚫The landing page only shows the map without interactive signs
🚫No way to change address on the schedule page unless go back
We recommend to remove the map if users open the site via mobile, as the map on mobile is too small to provide convenience in locating. By only showing the schedule page in Recommendation 1, users could have a quick and clear check through the input.

Card Sorting

Information Architecture

We initially found the side bar is hard to use majorly for two reasons:
1. The titles are ambiguous. Users get confused with what information each title would lead to.
2. The side bar is grouped into categories that are hardly make sense to resident users.
In order to find the best way to organize information for the resident’s use, we include “title iterating” process into our card sorting. We invited seven participants to do card sorting, with all the titles written on card.
We ask each participant to group cards that seem related to each other, and give a name to each group.
The participant is encouraged to leave the cards that they don’t understand.
We ask the participant to describe his/her understanding of the card, then we tell the participant the actual page it will lead to, and ask the participant to give it a new name.
Each time we iterated the process, we will get some card renewed. We can clearly see the trend that the number of ungrouped confusing cards is decreasing along the iteration. In the end, we replaced five titles, and synthesized card sorting results, came up with a set of new groups.



Thanks for the great team and project host I had! In the one-week practical work, I learnt many things to apply school knowledges into company projects with real users and partners.
First of all, we didn’t expect that during the week we had no support from the development team, to ask about the goals of the testing. We later realized to start sectionalizing the website, and focus on several individual tasks that look obvious to the user. If users succeed in those major tasks, we can go into details. However, even the user task showing on landing page has a number of usability issues.
Secondly, we were glad that we were about to make decision on our user research approaches. In the beginning, we wanted to do usability tests for all. Along with hearing from users and asking feedback from colleagues, we think the the usability issue of sidebar is mostly about the grouping. So we changed to do Card Sorting. And when observing the users sort cards, we found the naming is also an issue hinders grouping. Therefore, we combined card sorting and card renaming, which ended up with a good result.