Designing the interface for a key copying kiosk, bringing delight during the duplication journey.
Minute Key
UX/UI Design, Animation
2023
Find a kiosk: www.minutekey.com/key-services/
Unlocking seamless key kiosk design
Minute Key (a.k.a. MK) has had a long term partnership with Green Stone — working on early stage industrial design of their kiosk, web design, and the kiosk interfaces. I joined the team to help evolve and improve the digital interfaces with a new look & new endless aisle shopping experience.
Problem
A challenge arises with having thousands of key types and designs: the user journey becomes increasingly complex and burdensome on customer’s cognitive load.
Solution
Ultimately, our design solution led to a major reduction in checkout time and in areas where time couldn’t be shortened (machine cutting keys), we added in moments of joy.
Finding the key steps in our user journey
Current Experiences
Gaps and New Features
MK’s current experience is much simpler since it has less features.
To stay competitive we aim to add the following functions:
To stay competitive we aim to add the following functions:
*solved in a separate project*
Updated user journey
The final user journey shown here went through many iterations as new information was revealed during design reviews with the client. Keeping this updated was crucial to our team’s organization.
Simplifying complexity
After mapping out the user journey, and designing the pages in simple wireframes. I leveraged our existing design system and worked with a visual designer to create the iconography, card systems, and animations to create a cohesive and delightful experience.
Project Outcomes
We improved the key copying process and incorporated the endless aisle experience delivering designs, testable Figma prototype and voiceover script. since then, the prototype was taken to be user tested which showed a 25% reduction in time-to-purchase. Currently, these new journeys are being developed.
Learnings
It was enjoyable going to do in-person research by copying my own set of keys. Since this was the first time designing for a kiosk, there were additional challenges to consider compared to designing for a website or app. Specifically, the touch sensitivity of the screen and voiceover.
I closely collaborated with the senior visual designer to design the key selection page and animation interactions. We carefully considered the size of each element so that important pieces of information are visible on the limited real estate, but that selectable elements are easily clickable. Furthermore, the animations we designed needed to be simple as we noticed a bit of a delay with the kiosk’s display.
Designing intuitive and contextually relevant audio prompts was particularly difficult, but one of the most rewarding aspects of this project. Through collaborating with our copywriter, we carefully considered the right balance between providing informative guidance and avoiding information overload. After completing the final set of screens, we were able to refine the voiceover expereince to ensure it was seamelss and enhanced the journey.