City of Rochester Website Redesign
This is the redesign project for the city of Rochester's website. My main focus is on the Usability Testing and User Testing process.
01
Usability Testing
I first conducted a heuristic evaluation using Jakob Nielsen’s 10 Usability Heuristics.
Issues with current design
1. When compare the header section of the City of Rochester website with other websites, the header section of the City of Rochester website is very small;
2. The “Search” section is too big and take up a lot of space;
3. The image is very big and not necessary;
4. There are so many sections on the home page and placed in a very random, not well organized way, also many repetitive information.
5.There are 100+ clickable links on the homepage which makes hard for users to find the information they want.
1. Lack of visual hierarchy;
2. The layout of information pages being too crowded.
1. Lack of visual hierarchy;
2. Unrelated images take up a lot of space.
02
User Testing
I recruited 5 participants to do user testing on this website. All participants are people who live in the Rochester area but never used the website before. I recruited people in the area but never used the websites because I want participants to have certain knowledge about Rochester so they wouldn’t be confused when navigating through the website. But I always made sure they never used this website to avoid bias.
Things I learned from the user testing:
03
04
Personas
This design is more focused on the city residents and nearby cities’ residents.
05
Redesign Goals
1. simplify the homepage;
2. Build a better visual;
3. Rebuild visual hierarchy;
4. Put related ifomation together;
5. make important information more visible;
6. Get rid of repetitive information.
06
Home Page
What did I Change?
1. Bigger navigation bar, clear visual;
2. Made each section smaller, each section got their own information page for user to explore;
3. Events separated from the information section.
07
Pets & Animal Services Page
The old “Pets & Animal Services” section had so many clickable links, many pages such as “Adopt A Dog” and “Adopt a Cat” had many same content on detailed info page. To save user sometimes, I combined these pages together. Users can read the information first then decide to go to the detailed information page that dedicated to their needs.
08
Senior Management Team
The old “Senior Management Team” page each government official’s section takes up a lot of space, I added a clickable section to hold information, users can close it when they don’t want to see everything.
08
Senior Management Team Info Page
The old page was too crowded with too many irrelevant information on the widgets, which stop users from reading the actual infomation they were looking for. I took out the widgets and devided the page into 3 sections to help users to read.
