Project Description

Release date: 2017
Role: UX Designer 

The Virtual 4D Menu was a software feature developed for BragiOS 3.0 and The Dash Pro True Wireless Earphones. 

The feature uses Kinetic UI, meaning users can control it using their head movement rather than interacting with the earphones using their hands. 

The Challenge 

The Virtual 4D Menu was the first project I worked on at Bragi. The concept for the feature was to develop a new way in which users would be able to interact with the earphones hands-free. From the previous software releases, the earphones could register head nods and shakes as means of accepting or rejecting phone calls, so it was decided to build on top of this already existing framework.

Information Gathering

While relaying on lessons learned from the previous feature to reject/accept calls, the 4D Menu presented a new set of issues with known standards for hand-free interactions. Nothing on the market has previously done what the 4D Menu set out to do at the time. Some of the issues that needed solving were:

1. How to design a gesture that the user could use to enter the menu? 
2. How does the user navigate the menu itself?
3. How does the user select a category?
4. How does the user exit the menu without having selected a category?
5. Which features are appropriate for usage in the menu?
6. How does the menu act when connected to the phone? 
7. Customization and more?

Design Approach

To answer those questions mentioned above, we needed to create a set of technical and user-related requirements to have a foundation that we could test internally and externally. 

A workshop together with various stakeholders was held to better hone in on those requirements to make the product viable. From the design aspect, we worked on and created user stories that we could then derive some technical requirements from so that we had a solid foundation as a starting point. 

Enter The Menu

The first problem was finding a method to enter the menu using a robust and stable gesture. It was not activated by accident when people were out walking or doing exercise while using the earphones.

Several sparring sessions with design colleagues were conducted to try and map out proposals that we could then prototype later on. Together with the engineers, we created various prototypes that were tested internally with a small group first that would be able to sort out the significant problems and errors first before exposing a larger group.

These smaller prototypes were tested over 1-3 days, depending on various issues. We quickly found out that certain entry gestures worked better than others regarding stability and ease of use. 

Navigation

After having entered the menu, the users needed a way in which they would be able to navigate the menu structure.

Horizontal and vertical menu structures were discussed and prototyped with a short test cycle for each of the suggestions and tweaks and taken out into the real world by the developing and design team.

An interesting issue with the navigation was the problem of the menu drifting during usage, e.g., if you were traveling by car or train and the vehicle turned, the menu would, in some cases, move as well. 

The menu would not be handy if you couldn't select any functionalities. We experimented with various menu entries ranging between three and six and how the users would know which function was currently selected. 

The premise of the vectors was that they were static when entering the menu. To mark the jump from one vector to another, we initially used voice prompts and subtle noise cues to mark the transition between functions, but we quickly found out that the angle in each vector was minimal and didn't require much head movement to select it. Which resulted in very rapid jumps between functions and an overload of audio and voice prompts which also clogged up the processing power of the earphones. 

It was clear that a new structure was needed to accommodate these issues. Rather than having them static, a suggestion was made that the vectors could be dynamic in their behavior so that when the user would transit from one vector to another, an overlapping buffer would be in place to give the user more control when switching between functions. 

This buffer space also ensured that the earphones' processors would not be overloaded during use. 

Selecting and Exiting

We already had a head gesture in our Kinetic UI to accept calls. We chose to use a slightly modified version to select the function. However, a question arose when we realized that we had forgone a way to exit the menu other than having to choose an item. This led to frustrations among our testers and the development team, and we quickly looked at our existing library of head gestures in which we chose to use the already existing head shake was decided. The user would know this gesture from other parts of the system, so there was no learning curve. 

Features and functions

With the menu structure and gestures in place, it was time to organize the menu itself. We had two requirements for the menu, and that was that it should work around two primary user contexts. 

1. Connected to the phone
2. Not connected to the phone

While connected to the phone, we wanted the user to take advantage of their voice assistant of choice. This meant that one of the menu items would be replaced with the voice assistant. Similarly, this also means that when the user hasn't connected to their phone, the menu item of their voice assistant would be replaced with another offline function. 

The features we ended with selecting were:

• Skip to the next song
• Play/Pause
  

• Activities report
• Voice assistant(Online)/Activities

Customization and more

Originally planned as an addition to be pushed out, later on, was the idea of being able to customize the 4D menu so the users would be able to organize, rearrange and switch the layout to their wishes. However, before I left the company, this was not done. 

Another learning we did after releasing the software was that people felt uncomfortable with using the menu during use outside 'in the real world' people felt uncomfortable with using the menu. One situation came from one of our testers, who said that people were looking at him strangely when he moved his head around navigating the menu on a train ride. Another story was that people were confronted by others when it looked like they were staring at them while using the menu.

We also realized that we needed a warning into the app that people were saying that the menu was ideal when they were driving with their car. This was a dangerous situation where we had to tell people not to use the feature in those situations. 

All Images and Videos are subject to © Copyright 2019 Bragi GmbH.