This project focused on designing both the in-app experience and the physical interactions for the second-generation Yale Keypad, an accessory to Yale and August smart locks. It required balancing usability with firmware limitations, all while serving as one of the first major launches to implement our new design system.
From LED indicator behavior to “One Touch Lock” and fingerprint flows, every detail was carefully considered to create a smooth and intuitive experience.
Year
2024
Team
Product design (me), software & hardware product managers, iOS and Android mobile developers, backend developer, firmware engineer, QA lead
Going beyond the app
Installation - To ensure smooth setup, I took ownership of the installation instructions—writing and refining them through hands-on testing and physically installing the keypad multiple times.
User testing - We also ran in-person, moderated usability tests where participants followed a Figma prototype of the in-app instructions while installing the device. The feedback we gathered revealed key pain points and directly informed updates to content, layout, and interaction that made setup more intuitive and less error-prone.
Implementing a new design system
New framework - Because we were completely redesigning the entire keypad, the design, product, and engineering teams chose this project to pilot new design components and UI built with SwiftUI and Jetpack Compose, frameworks which were different from the rest of Yale Home apps.
Redesign validation - Many of the existing smart lock flows were tightly interconnected, so rolling out the new design system across core lock setup and settings was a tall order. Instead, since it was relatively independent compared to other products, we used the keypad to introduce the new system and validate it in a real-world context.
Ensuring quality through design-engineering partnership
Bug squashing - When I joined, the design system was mostly built in Figma and partially implemented by developers. Using the components in real screens for the first time required careful review to ensure adherence to the specs.
To catch issues early, I was added to pull request reviews, which allowed me to identify UI inconsistencies before a code merge and reduce further bug tickets.
Collaboration - Throughout the project, I maintained a collaborative and respectful approach with engineers, pushing for the best results while navigating challenges, especially where new UI had to integrate new code with legacy code.
By incorporating developer feedback and iterating together, we consistently delivered polished UI that satisfied both design and engineering.
Cross-functional complexity
Holistics - Despite seeming like a simple project, designing new features for this keypad involved a lot of moving parts. Especially for the over-the-air (OTA) updates, we needed to align firmware behavior, backend server processes, UI flows, and keypad LED signals to ensure a cohesive experience.
Aligning all functions - To support future troubleshooting by customer service, I designed distinct animations for each update stage. To ensure all would work as expected, I brought together mobile, server, and firmware to create a detailed chart that clearly mapped what needed to happen and when, improving clarity and alignment across teams.
Plot twist
Last minute change of plans - We initially designed the keypad assuming it would have a motion sensor to wake the display, enabling features like a doorbell button. However, near launch, the hardware and firmware teams confirmed the sensor wouldn’t work due to battery drain issues beyond our control and would need to be permanently turned off.
This change meant the “One Touch Lock” button had to double as the wake-up trigger. Since waking the keypad always sent a lock command and required a 5-6 second cooldown, quickly entered codes were rejected. After some thought, I landed on the best possible solution—a “short press” to wake without locking, and a “long press” to lock (plus a backup “short press” while awake to lock).
Because many functions required the keypad to be awake, we updated error messages and prompts to remind users to wake it first. We also removed the doorbell feature, which relied on the sensor and would have been confusing to guests without the keypad being able to wake on approach.
This last-minute change pushed us to rethink interactions so that we could craft a seamless keypad experience despite unexpected hardware constraints.
Final Thoughts
The importance of adaptability and collaboration.
Launching our new design system was a significant milestone greatly enhanced design consistency across the platform. Even faced with unexpected hardware constraints, our team’s creative problem-solving and open communication ensured we delivered a thoughtful user experience.
Not every solution was perfect, but navigating real-world limitations is core to impactful design. I’m proud of how we balanced ambition with pragmatism, ultimately advancing both the product and our design practice.
Outcomes
Newly implemented design system
Thoughtful hardware interactions providing a holistic physical/digital experience
Well tested out of box experience and installation guide