health.gov.au
December 2023
I redesigned health.gov.au like a 15 minute city; accessible to all and gets me from A to B efficiently.
My role: UX Research, Lo-Fi and Hi- Fidelity prototyping, Brainstorming + Ideation, UI Design
Project time: 4 weeks
Tools: Figma + Maze
The problem: Overwhelming amounts of information makes it difficult to navigate smoothly and seamlessly around the website.
​
The health.gov.au website suffers from poor navigation, burying valuable information and making it hard for users to find. The filters are not intuitive, posing a challenge for the national health authority.
​
Collaborators: Gia Dimitropoulos
(Front End Development Lead, UI Design)
Hayley Morgan
(User Experience Design Lead, UI Design, Illustrator)
the process
user interface
analysis
information architecture
prototype
.png)
test
Using the double diamond process and the project brief 4 key stages of the design process were identified and prioritised due to the time constraints and deliverables required
Existing health.gov.au interface
The Department of Health and Aged Care website was the focus of this redesign. It is a well respected government body and is the national authority on health information. I wanted to work on this site as there is incredibly useful information, however it is difficult to dig through and is a maze of lists and filters that are challenging to navigate. I wanted users to feel that this was the resource they could go to to get answers without the frustration of digging to find what they’re looking for.
​
The typical user would visit the website to browse a myriad of resources and research that includes:
-
evidence-based policy, well targeted programs and best practice regulation.
-
awareness and education, government initiatives.
-
academic resources and research papers
​
The website is a portal for users to locate health related resources and news provided by the Australian Government.
The solution is a re-organised website that categorises content in a way that most users can confidently understand and find. The content remains the same, but is broken up using colour, spacing, typography and imagery to assist the users to group information and digest what they are reading.
heuristic evaluation
01- Usability heuristics
5 interviewees ranging from ages 20 - 40, who currently live in homes they have needed to design themselves. The interviewees also are a mix of those living alone, or with families
I conducted a heuristics evaluation to determine the problem areas, and also recognise what the site currently succeeds at .
view full heuristic evaluation annotations
02- Colour Accesibility Test
We conducted a colour accessibility test and found that there were no issues aside from on the green background which failed the AAA normal text size contrast level.
02- Navigation Heuristic Evaluation
I conducted a heuristics evaluation to determine the problem areas of the navigation, and also recognise what the site currently does well.
I analysed using the 10 usability heuristics and assigned various navigation items with a pass or fail in these heuristics.
.png)
usability testing for navigation
06- 5 second usability testing
One key note from user interviews was that users wanted a dropdown menu, and I also realised that the word ‘topics’ was not meaningful to users. I have renamed this to ‘health information’ and have subcategorised the content into four sections to assist users in finding pages without using filters.
insights
03- User Testing insights
I interviewed 5 users and set out to observing the target audience's behaviour when interacting with the website, and to determine usability issues and confusion that I could work on.
Due to the large pool of users, I specifically focused on the middle aged to older adult user. Focusing on this age group allows us to help improve the accessibility of the product. Websites guidelines that cater to an older demographic will likely be more user friendly for all users.
04- Feature prioritization matrix
This was used to determine the crossover of what was most important to health.gov and also to the user.
​
-
Creating two portals for catered documents and resources (health professionals and general public)
-
Accessibility to all through dropdown customisation menu with features such as enlarging text, contrast etc. Help panel to guide confused users
-
Create better, intuitive categories to sort resources
view usability testing template
.png)
.png)
heuristics summary
06- Testing with maze
One key note from user interviews was that users wanted a dropdown menu, and I also realised that the word ‘topics’ was not meaningful to users. I have renamed this to ‘health information’ and have subcategorised the content into four sections to assist users in finding pages without using filters.
Ministry of Health SG case study
05- Strengths
-
Top bar menu follows as user scrolls through the website
-
Resource types are grouped by type of media and specific topics
-
All information and resources are grouped together (for professionals and the public)
-
Every image/text box is proportional to each other
-
Text heavy websites are divided to reduce user confusion and helps break up text
-
Opportunity to input identification number to create personalisations and recommendations
06- Opportunities
​
-
Creating two portals for catered documents and resources (health professionals and general public)
-
Using physical dividers to break up text heavy websites
-
All popular searches and relevant information is at the top of each screen, providing consistency for the user
-
Create better, intuitive categories to sort resources
Design System
07- Asset Management
-
Atoms are the smallest, reusable elements such as buttons, input fields, and labels.
-
Molecules are made up of atoms and are used to create more complex components.
-
Organisms are made up of molecules and are used to create complete user interfaces.
-
Every image/text box is proportional to each other
-
Text heavy websites are divided to reduce user confusion and helps break up text
-
Opportunity to input identification number to create personalisations and recommendations
07- UI Style Tile
-
Atoms are the smallest, reusable elements such as buttons, input fields, and labels.
-
Molecules are made up of atoms and are used to create more complex components.
-
Organisms are made up of molecules and are used to create complete user interfaces.
-
Every image/text box is proportional to each other
-
Text heavy websites are divided to reduce user confusion and helps break up text
-
Opportunity to input identification number to create personalisations and recommendations
Health.gov.au final Design System
user flow + prototyping
08- Mobile Prototype
One key note from user interviews was that users wanted a dropdown menu, and I also realised that the word ‘topics’ was not meaningful to users. I have renamed this to ‘health information’ and have subcategorised the content into four sections to assist users in finding pages without using filters.
09- Desktop Prototype
In the mobile menu redesign, I ensured that the audience was included at the top of the menu so that it would be available to users at any time, not merely on the home page. I also included links to key pages within the footer as in user testing it was discovered that many users didn’t scroll to the footer to find key information.
Mobile
Desktop
06- Menu Navigation
One key note from user interviews was that users wanted a dropdown menu, and I also realised that the word ‘topics’ was not meaningful to users. I have renamed this to ‘health information’ and have subcategorised the content into four sections to assist users in finding pages without using filters.
reflection & key learning
10- Next Steps
Direct iterations:
-
Changing the scroll for language translations to be larger. Implementing apple plugins such as the scroll feature to be more compatible.
-
Improving the popups to be larger for desktop
​
Additional Features:
-
Creating login portal for users to save data and previous searches/enquires
-
Improving the popups to be larger for desktop
-
Donation portal to give back to healthcare workers and
11-Takeaways
-
Redesigning a website personally, I found more difficult than starting from the design phase, this is due to limitations to design freedom and predetermined guidelines.
​
Additional Features:
-
Well designed websites can help form good impressions for prospective customers and enhance user experience overall. It also helps build and maintain a clear brand, express brand consistency and also helps allow easy navigation.
-
Improving the popups to be larger for desktop
-
Donation portal to give back to healthcare workers