Noak
Streamlining clinic staff workflows through a centralised home interface
Streamlining clinic staff workflows through a centralised home interface
This case study was provided by a Singaporean digital healthcare company as part of their recruitment process. The task was to create the home user interface for the tablet application used by clinic staff in General Practitioner clinics to manage all their workflows.
Disclaimer: all information in this case study are my own and do not necessarily reflect the views of the company. Names and identification numbers used in this case study are purely fictitious.
This case study was provided by a Singaporean digital healthcare company as part of their recruitment process. The task was to create the home user interface for the tablet application used by clinic staff in General Practitioner clinics to manage all their workflows.
Disclaimer: all information in this case study are my own and do not necessarily reflect the views of the company. Names and identification numbers used in this case study are purely fictitious.
My Contributions
My Contributions
UIUX Design, Prototyping
UIUX Design, Prototyping
Team
Team
Solo project
Solo project
Timeline
Timeline
5 days
5 days

Background
Background
Designing a user interface for busy clinic staff
Designing a user interface for busy clinic staff
Having worked in healthcare myself, I am familiar with the hectic environment front-liners are in when managing a never-ending stream of patients. A well-designed user interface can be a game-changer, helping them juggle multiple tasks efficiently while prioritizing patient safety. After all, even a minor mistake can have serious consequences. This application aims to address these challenges by providing a centralized hub for managing patient flow, consultations, and administrative duties.
Having worked in healthcare myself, I am familiar with the hectic environment front-liners are in when managing a never-ending stream of patients. A well-designed user interface can be a game-changer, helping them juggle multiple tasks efficiently while prioritizing patient safety. After all, even a minor mistake can have serious consequences. This application aims to address these challenges by providing a centralized hub for managing patient flow, consultations, and administrative duties.
Challenge
Challenge
How might we create a centralized place for clinic staffs to manage and view frequently-encountered workflows on a single screen?
How might we create a centralized place for clinic staffs to manage and view frequently-encountered workflows on a single screen?
User goals
User goals
Identifying core tasks for a streamlined interface
Identifying core tasks for a streamlined interface
To create a user flow that optimizes efficiency for clinic staff, I began by identifying all the tasks they typically perform throughout the workday. These were broadly categorised into 4 task types
To create a user flow that optimizes efficiency for clinic staff, I began by identifying all the tasks they typically perform throughout the workday. These were broadly categorised into 4 task types
Doctors
Doctors
Shows doctors that are on duty and their current availability
Shows doctors that are on duty and their current availability
Mark patient as absent
Mark patient as absent
Update consultation as completed
Update consultation as completed
Cancel consultation for emergencies
Cancel consultation for emergencies
Start next consultation if doctor is available
Start next consultation if doctor is available
Upcoming Queues
Upcoming Queues
Shows next 5 patients in line to see doctor
Shows next 5 patients in line to see doctor
Identify patient records to prepare and call for upcoming consultatons
Identify patient records to prepare and call for upcoming consultatons
Tag online-queue patients as ‘Confirmed’ when they arrive in clinic
Tag online-queue patients as ‘Confirmed’ when they arrive in clinic
Cancel and remove patients from queue
Cancel and remove patients from queue
Missed Queues
Missed Queues
Shows patients who were absent when called
Shows patients who were absent when called
Help patients rejoin queue
Help patients rejoin queue
Checkout
Checkout
Shows patient who have completed their consultations
Shows patient who have completed their consultations
Check patient’s payment status
Check patient’s payment status
Edit quantity and price of medications and bills
Edit quantity and price of medications and bills
Print bills and medical certificate
Print bills and medical certificate
Doctors
Doctors
Shows doctors that are on duty and their current availability



Upcoming Queues
Upcoming Queues
Shows next 5 patients in line to see doctor



Missed Queues
Missed Queues
Shows patients who were absent when called



Checkout
Checkout
Shows patient who have completed their consultations



User flow
User flow
Connecting everything together
Connecting everything together
With a clear understanding of staff tasks, I created a user flow diagram. This visual representation maps out the sequence of steps clinic staff will take while using the interface to complete their various tasks.
With a clear understanding of staff tasks, I created a user flow diagram. This visual representation maps out the sequence of steps clinic staff will take while using the interface to complete their various tasks.



Design
Design
Wireframes
Wireframes



Style guide
Style guide
Given the fast-paced environment clinic staff operate in, clear and easily readable text is important. I chose these fonts as they are tabular typefaces which have an even amount of spacing between the characters. In addition, they are also sans-serif fonts which makes for clean and highly readable text. I have also defined a clear colour palette for clear status indicators. For example, red is reserved for destructive actions to serve as a warning to staff, reducing accidental mistakes due to “notification blindness”. These visual cues help staff quickly understand patient information and manage workflows efficiently.
Given the fast-paced environment clinic staff operate in, clear and easily readable text is important. I chose these fonts as they are tabular typefaces which have an even amount of spacing between the characters. In addition, they are also sans-serif fonts which makes for clean and highly readable text. I have also defined a clear colour palette for clear status indicators. For example, red is reserved for destructive actions to serve as a warning to staff, reducing accidental mistakes due to “notification blindness”. These visual cues help staff quickly understand patient information and manage workflows efficiently.






Takeaways
Takeaways
Importance of user research
Importance of user research
While this case study design relied solely on the provided brief, incorporating user research with clinic staff would have further enriched the process. My background in healthcare offered a strong foundation for understanding their workflows, but real-world observations and feedback would have yielded invaluable insights into their specific pain points.
While this case study design relied solely on the provided brief, incorporating user research with clinic staff would have further enriched the process. My background in healthcare offered a strong foundation for understanding their workflows, but real-world observations and feedback would have yielded invaluable insights into their specific pain points.
See more of my work:

Connecting passionate volunteers with Singapore's tech-for-good initiatives through a redesigned Better.sg website
Better.sg

EBI
Empowering therapy seekers to better explore and express their thoughts through guided and interactive journaling

Great Eastern
Digitalising hospitalisation claims to help customers submit, manage and track their claims easily on a single platform
Let’s connect!
Feel free to reach out for collaborations or just a friendly hello. 😀