Anchor & Alpine’s UX leader, our Captain, has the distinct accolade of having worked on multiple patents as an author, inventor, and illustrator, and has been awarded two. This is the story of our UI/UX project for a wall-mounted user interface patent.
We didn’t start with our eyes on a patent.
We just needed to do some good work. We were working with a client that brought us on to redesign and develop their WordPress website. At the time, we were just beginning to offer UI/UX as a core service, and the client asked us to check out a wall-mounted interface they had. They had acquired a company and, with it, the graphical user interface (GUI).
It was hard to use and hard on the eyes and presented some unique challenges:
- Everything we could learn about it, we had to learn by using it. There were no site maps or backend code for us to review.
- We got one shot to get it right. Once we shipped the designs to the developer, it was coded and released as installed software. The interface is used by people indoors, outdoors, and with and without an internet connection. It shipped all over the world.
- The interface was small and impact-resistant, so we had to fit the right information on a small screen where—we found out later—people were wearing work gloves to touch the screen. Fingerprints are generally about 44 pixels, but gloves? That almost doubles how big buttons need to be!
We started with an immersive experience and research
We went deep on this one, using the screen as it was, talking to users, and talking to potential users. We’d hang out where the screen would be used and strike up random conversations with people about what we were doing and what they wanted in a screen like this. We went on sales calls; we poured through industry data. We walked a mile in the customer, salespeople, and end-users’ shoes. Then we walked another mile.
It was a lot of research—and our job was to not only do that but distill it down into deliverables that everyone could understand. We created:
- Personas – cards with quotes, goals, and frustrations for each targeted user
- Persona Matrix – overview of how all of the personas worked together and where they overlapped
- Sitemaps – documenting the current GUI and the new one we were to create.
- Userflows – how the various personas interact with the screens
- Wireframes – low fidelity mockups to ensure we had all the right pieces accounted for before we started designing.
Testing—remember, we only had one shot!
Since we had to get it right in design before it went to development, we created a prototype on the iPad.
One thing we stipulated during tests—the iPad had to be mounted on the wall at the height of the controller for all tests. We wanted to see how body language changed and make sure this screen would work well with all sorts of human interactions. If you are really tall, and you stand close, and the screen is too low—can you see the top button options?
We took our iPads all over and had a lot of people test things out. We’d set up a camera, stand behind our test subjects, and ask them to complete tasks. When you do this, and your user asks for help, it’s really hard not to chime in! But we had to stay quiet and see what they did.
Since we had strong personas backed by industry research and interviews, we started with people that most closely matched the personas. And guess what? We were able to predict, based on age, how they would use the interface, and where they would get caught up.
- Millennials: The Button Mashers – this group will tap a button and then just hit some more if what they expect to happen doesn’t happen.
- GenX: The Frustrated – this group was more apt to complain that things didn’t work as expected after a single try than the other audiences.
- Boomers: The Readers – this group would read everything on the screen before hesitantly making a choice.
What does this tell us? We need to find the right amount of information to present to older audiences while clearly labeling a button and making sure it does what is “expected” (this is called affordance in UX) for younger audiences.
A note about the terms UI, UX, and GUI:
- UI means the user interface.
- UX means user experience—assuming, of course, that we want to create a good experience.
- GUI is an outdated term for a graphical user interface. We usually only use the term UI, but on this project, which was not a web or digital-based product, we often referred to it as the GUI because there were several other interfaces—like audio and technical wiring—on this project.
Surprises in Test
We had two surprises during the testing phase.
First—more screens are better than fewer clicks
We showed a screen with all setup options—the “clear winner” that people were advocating for with fewer screens and fewer taps. People were so caught up in how overwhelming the screen was (called cognitive load in UX) that they took 30% longer to complete the single screen AND reported negative feelings about the experience.
We changed to a walk-through with a single option on each screen and saved time and engendered much better feelings about the process.
Second—cowlicks and pixie cuts don’t work
The second surprise was that Amber had a short pixie cut and hated how she had to stare at the back of her own head in the user research review videos. Now she has long hair.
The project went exceptionally well from beginning to end. The client—like all clients—took a bit of convincing to go so deep on this, the outcomes were incredible. This UX project delivered lifted sales, happier customers, and several demonstrably increased metrics.
The original GUI took new users 30 to 120 seconds to complete the most basic task. Our redesign reduced that time to between 3 and 10 seconds. That’s a +90% improvement.
Yay for Patent USD886846S1
The patent was applied for in 2017 and awarded in June of 2020. A little about patents: Patents are awarded and list the author (the person who applies for the patent), the inventor (the persons who invented the idea, and the assigner (the person or entity that owns the patent). Amber is listed as the inventor on both her patents and the actual patent is the property of the client.
It’s not often that patents are awarded for UI and UX projects; we are excited to help push the art and science forward. While no one can guarantee a patent out of a project, we can ensure that our strategic exercises and expertise in UI/UX will deliver the results you need. With two patents under our belts and several more applied for, we’re well versed in the process.
As a side note — is your business inventing things? Make sure you are taking advantage of the Federal Government R&D Tax Credit. Working with our accountant and a specialized tax firm gained us thousands back in taxes because we work in the hard sciences. From our work on this graphical interface to our work in artificial intelligence and machine learning, we’re here to learn the ins and outs of your project and communicate that to your users.
Do you want to work with us on a UI/UX project? Let’s talk.