Lori Mae Watt – Product Designer
Sydney, NSW
Lumi Verify
Project Overview
Lumi Nano is a device used by the New Zealand Police to identify classified substances in the field. I was approached by The Institute of Environmental Science and Research (ESR) to design an app that would verify that this device is providing accurate results before it goes out into the field. From that point onwards, the user would be responsible for verifying its accuracy via the calibration process available in the Lumi Analysis app.
As a result, this app's user base was select employees based at ESR. This uniquely made the Product Manager and Senior Developer I was working with, my user, lending to rapid-fire feedback and shortened delivery time.
As a result, this app's user base was select employees based at ESR. This uniquely made the Product Manager and Senior Developer I was working with, my user, lending to rapid-fire feedback and shortened delivery time.
Responsibilities
User Research
Prototyping
User testing
High-fidelity design
Prototyping
User testing
High-fidelity design
Timeline
Dec - Jan 2023
Deliverables
1x native mobile app design
Step 1
Assessing the existing design
The stakeholders had an idea of what was and wasn't working for them in the current workflow. There were aspects of the current app that they wanted me to retain, and others they knew needed an overhaul but of what kind, they weren't completely sure. They gave me complete creative freedom on both the UX and UI fronts to work my magic – wanting to revolutionise the current (dated) UI while maintaining its sense of clarity and simplicity.
There were major opportunities to improve the UX of the app which I proposed to them through with user flow diagram.
Existing tablet app design seen to the right.
There were major opportunities to improve the UX of the app which I proposed to them through with user flow diagram.
Existing tablet app design seen to the right.
Step 2
Sketching & wireframing
Next I transformed the user flows from geometric shapes into sketches and then wireframes. These wireframes brought the new design to life and sparked discussion around the layout and requirements for each screen.
A challenge here was communicating which verification standards the device had passed and failed, as well as its overall status, without causing confusion.
A challenge here was communicating which verification standards the device had passed and failed, as well as its overall status, without causing confusion.
Step 3
Prototyping & iterating
From there I created an interactive high-fidelity prototype in Figma that let the stakeholders click through the app as if it were live.
Mapping the user's path
Again, this sparked important discussions, tweaks and additions, as well as helped us identify any missing pieces such as error states.
.png)
High-fidelity design
The final result was a complete high-fidelity design built with components sourced from a unique design system.
Mapping the user's path
A new colour palette, typography kit and general look and feel made the app feel sleek and modern.
Ease of connection
QR code scanning was presented as the primary connection method, hence it being the default screen when the app is opened.
Use of colour
New vivid colours were chosen to quickly communicate pass and fail statuses.
Clear & concise
The verification history of a device was presented with clarity on a single screen and in a way that was natural to the stakeholders.
More Projects
.png)
Lumi Analysis
A native mobile app used by the New Zealand Police to identify illegal substances in the field.
.png)
Serato
Leading the redesign of the express checkout that sees half a million visits per year & multiple other projects.
Landlord Studio
A native mobile app helping renters visualise their rent payments and manage maintenance requests.