UX Audit with Heuristic Evaluation Method

Iqbal Nurrofiq

UX Researcher
UX Designer
UI Designer
Figma

Overview

For this case study, I used the RS BP Batam website, a pioneer in healthcare services in Batam. After considering the time and resources, I decided to scope this UX Audit to just the homepage, aiming to evaluate its design using the Heuristic Evaluation method

Audit Findings

1. Visibility of System Status The appearance of design elements such as typography,color,and layou
The search bar in the navbar lacks a placeholder to visually indicate that users are performing a search.
There’s no hover effect on the “Jadwal Dokter” button, which seems important since its color stands out more than other buttons.
There’s no hover effect on the “Dokter Spesialis” and “Layanan Unggulan” cards.
2. Aesthetic & Accessible Design The appearance of design elements such as typography,color,and layout
The CTA button colors are too contrasting,failing the overall contrast check using the Contrast Plugin in Figma.
The color and font type of the headlines need improvement, as the current color contrast of the headings does not meet the standard.
The layout of the 3-point benefit section can be improved further.
The font weight and size need enhancement to improve accessibility for users.
3. Flexibility and Efficiency of Use Ensuring flexibility and efficiency for users in utilizing the product.
There is no “Back to Top” button to quickly help users return to the top of the page.
4. Help and Documentation Providing additional documentation to assist users in obtaining information about the product.
There is no FAQ section to help users find additional information about RS BP Batam.

Solution

1. Visibility of System Status
Redesign the placeholder in the search bar to clearly indicate its functionality.
Add hover states to the “Jadwal Dokter” button and other important elements for better visual feedback.
2. Aesthetic & Accessible Design
Redesign the homepage layout, typography, and color scheme to enhance visual appeal and accessibility.
3. Flexibility and Efficiency of Use
Add a “Back to Top” sticky button to help users navigate quickly to the top of the page.
4. Flexibility and Efficiency of Use
Create an FAQ section to help users find additional information about RS BP Batam.

Output

Before Redesign
Before
Before
After Redesign
After
After
Due to time and energy constraints, I only completed the redesign process in my case study. I haven’t moved on to the testing phase with real users to gather additional metrics beyond what I mentioned above.
Partner With Iqbal
View Services

More Projects by Iqbal