As a project at BrainStation, I conducted a heuristic evaluation and created improved designs of the Save My Spot! mobile app (iOS version 2.3.5) by LifeLabs to improve the usability for British Columbians within existing design constraints.
Role
UX/UI Designer
Duration
10 Days
Tools
Figma
Collaboration Tools (Slack, Google Docs, FigJam)
Problem Space
LifeLabs is a Canadian-owned company that has been providing laboratory tests to over a million Canadians every year for more than 50 years. Save My Spot! is an app by LifeLabs created to reduce wait times for customers without an appointment. However, usability issues within the app add difficulty for users in the booking process.
Significance
Studies have shown that it takes less than a few seconds for visitors to form an important first impression of an app. One study found that 94% of visitors would reject a website or app, or even mistrust a company based on its design-related aspects like clutter, poor error prevention, and inconsistency, which affect user engagement long-term. Source
Methodology
I used Jakob Nielsen's 10 Usability Heuristics to examine the interface and judge the app's compliance with the recognized usability principles. Then, we rated each defiance on a scale from 0 (no usability problem) to 4 (usability catastrophe). We used the design prioritization matrix to identify which issues should be redesigned first.
Task Selection
The main and only task flow of this app is checking-in to a LifeLabs. This main task consists of subtasks including:
Heuristic Evaluation
Here are 4 examples of the Heuristic Evaluation:
The app allows users to make false or unwanted decisions. Without proofreading, users can check-in with the wrong information with no warnings.
To add an error message when users enter an invalid phone number and to grey out the ‘Check In’ button when invalid entries exist.
There are no "emergency exits" to leave the unwanted state. This may result to users pulling a "no-show" and affecting wait time accuracy.
Add a secondary button that allows users to cancel their booking.
For small screens, the primary button is usually located on the right side while the secondary is on the left. Users may accidentally cancel their check-in as their thumbs naturally tap the right.
Place the secondary button, 'Cancel', on the left and 'Done' on the right.
There is no address in the pin after the confirmation. Therefore, users must rely on recall when they see the map to see the address of their check-in location.
Maintain the LifeLabs lab location name on the pin and make the check-in location visually significant.
Design Prioritization Matrix
Design Constraints
Since I did not have access to LifeLab's official UI library, I built my own with existing elements, components, and branding within the app. I used screenshots of the app and Figma to trace UI components and used various plugins, such as Redlines, to build a functional UI library.
UI Inspiration
For elements and components that LifeLabs did not already have, I took inspiration from the the LifeLabs website and everyday apps such as Google Maps. This allowed me to work off of existing mental models to make the features understandable.
Redesign
Key Learnings
It was important to refer back to the existing UI library when building new screens to create consistency within the app. I often had to remind myself that this exercise is about usability and not branding so all efforts should go towards improving the usability of the app.
Working in a partnership required constant communication and organization. Before starting the project, it was helpful to outline expectations and standards (such as naming systems) to set us off on the right foot.
Next Steps
I would like to conduct usability test with LifeLabs patients to ensure that the new UI changes did not negatively affect usability or raise new concerns.
Since the Save My Spot! app has a wide range of users and level of technology fluency, I would like to create a 'What's New' modal or onboarding tutorial for new and returning users. This way, the new features can be smoothly be adopted by LifeLabs patients.