UX Designer
Melbourne, Australia
ABC Website Redesign
Redesigning a government agency website
Design Brief
“Imagine you’ve just been hired by a government agency to help redesign their website to improve usability and increase user engagement.”
Individual Project
Daniel Yuong
My Role
User Research
UX/UI Design
Usability Testing
3 Weeks
Jan 2023
Current ABC Website
The layout for the current ABC website feels unintuitive, and lacks clarity in formatting and structure. The navigation is also confusing for users, with the primary navigation bar changing between webpages, and there being no clear CTA to return back ABC Home.

This made the ABC website a perfect choice to redesign, with the aim to improve the navigation and layout of the website to be more intuitive to use.
Heuristic Evaluation
Based on Nielsen’s 10 usability heuristics, I conducted a more in-depth analysis on the usability of the ABC website.

This allowed me to identify in more detail the pain points users might encounter when interacting with the website, and what I needed to focus on when it came time for the redesign.
Usability Tests
I also completed 5 usability tests, with the participants completing set tasks interacting with the ABC website.

After completing the usability tests, I organised the data using an affinity diagram to have a better idea of the painpoints users experience when interacting with the website.
Actionable Insights
Based off the usability tests and heuristic evaluation, I was able to come up with a few actionable insights to work on for my redesign.
Card Sorting
As there were some usability issues with the current website’s navigation, it was important to define the information architecture for the redesigned navigation prior to prototyping.

I completed an open card sorting to define and restructure the contents of the current ABC website navigation to something more intuitive.
Based off the card sorting session, I created a newly designed sitemap for my redesign of the ABC website.

I categorised the sitemap into primary navigation, secondary navigation, and global utilities.
After creating a new sitemap, it was time to start designing in Figma.

I started with a low fidelity wireframe, before refining it to a higher fidelity prototype.
Try Desktop Prototype Here!
Mobile Design
Part of my design process was designing for mobile devices.

Using responsive components and auto layout in Figma allowed me to efficiently translate my desktop designs across to mobile.
Try Mobile Prototype Here!
Usability Testing
Throughout the design process, I completed usability tests on both desktop and mobile prototypes to gain feedback on my designs.

The majority of the feedback was positive, with participants commenting on the clean, intuitve design and layout.
Style Guide
Lastly, I established a style guide in order to keep my design consistent across webpages and different platforms.