Controller
Hardware / App Integration
Client:
N/A (name and branding are removed for NDA purposes)
Role:
UX / UI Designer
Project Description:
Design the software and interface to support the updated controller's embedded android touch screen device.
Project Goals
- Convert the existing scroll wheel and button LCD interface for an embedded android touch screen experience.
- Identify opportunities in the information architecture and update the interface to meet expectations of legacy users and smartphone capabilities.
Discovery
Learning by Observing ...and Some Doing
The project started with learning the basics and observing how users setup and fly their aircraft. The team did field observations and went through a crash course on aircraft setup which walked us through the what would eventually be our MVP feature set. Because of our limited experience and the cost of these aircrafts, we logged hours in a flight simulator to get a better understanding of the process. I studied the existing instruction manual to learn about the features and the current system architecture in order to iterate on updated information architecture designs that would not alienate legacy users.
Early Insights + Opportunities
The updated controller featured a lower quality embedded screen that provided some visibility issues in bright sunlight. We took several color iterations outdoors to test visibility and contrast levels early on, making sure we were designing content that could be seen and read.
Examining comfortable reach / touch zones for users gave us insight into the appropriate location and size needed for the tappable content. This was a crucial step in reducing friction and successfully replacing the older physical button work flows.
Legacy users have expectations for how to access screens through the existing menu structure and shortcuts. We wanted to smoothly transition users to the new version by blending a familiar architecture with the functionality of modern touch devices.
Exploring Opportunities in Navigation & Information Architecture
Design
Exploring Home / Dashboard
The home screen (or dashboard) is really a dynamic set of screens accessed by swiping left and right. sandwiched between a information bar at the top and main menu buttons along the bottom. The info bar remains at the top of the screen, allowing users to always see high level information (currently connected model, model timer, connection type & signal strength, device battery life). Swiping through your dashboard series will show items like throttle timer, servo monitor, and telemetry data. The bottom menu buttons house the remaining items that are not accessed often during flight.
It was so important to observe users in their environment flying the aircraft. Of the many insights that came from observation, one of the so stupidly obvious things I could have missed if I wasn't out there: During 99% of flight time, the user's eyes are focused on the aircraft in sky, not looking down at the controller. So when they do glance down, they better be able to read the text.
Prototyping
Design System
I created a design system in order to keep pace with development in tackling the volume of screens. We worked together to identify screens existing screens that the dev team could recreate using the design system for the first pass. The design system kept the development team busy while I could focus my efforts on the screens that required a redesign.