MY ROLE
UI & UX Designer

BACKGROUND
SAOTA is a firm of architectural designers and technologists including in-house CGI and marketing teams. Their virtual reality app allows users to walk through and look around buildings and homes. However, the previous app was difficult for people to use.

THE CHALLENGE
Develop an app that clearly identifies its features while not distracting the user from the augmented reality presented by the app.

THE SOLUTION
Use large images and small buttons to keep the user’s attention on the architecture. Ensure that there is always enough contrast behind the buttons so the user is always able to navigate within the app, regardless of whether they are looking at a dark or light part of the building.

THE PROCESS
I tested the current app on a group of people and noted what parts they found confusing, difficult to use, and non-intuitive. Based on the notes from that research, I found ways to improve the app and features to implement to aid understanding.

BUTTONS
Some of the buttons in the previous app were hidden and relied on the user knowing to scroll or swipe in certain areas to find them. Many of the users I interviewed never found these buttons, so I moved their location to make them visible and clear to the user. I added a menu to group some less-clicked-on tabs, such as About and Contact. This way, the links were still part of the app, but they would not be distracting to the user.

COLORS
The previous app only used black, white, and gray. The reasoning behind that was to allow the user to focus on the beautiful images. However, that made the call to action buttons difficult to find, and links were not clearly distinguished. Thus, I added orange as an accent color. The orange complemented the warm tones found in most of the images, and I used it sparingly. This kept the focus on the architectural renderings while still helping guide the user through the app.

VIRTUAL REALITY INTERFACE
When using the virtual reality (VR) portion of the app, there are several buttons that need to be visible to the user are all times: back, help, and the toggle to switch VR on and off. These buttons need to be clearly visible, but at the same time, they cannot distract from the experience of augmented reality. They also need to be visible on all background colors- whether the user is looking at a dark corner of a house or up at the bright sun in the sky. I decided to make the buttons white outlines to keep them subtle and non-distracting. To ensure that they were always visible, I added a slight dark gradient behind them that was nonintrusive to the rest of the screen.

THE RESULTS
The new app was much more intuitive, clean, and easy to use. There were no more hidden features, and all the app’s capabilities were clear to the user. The new app allows users to easily and seamlessly navigate to the virtual reality aspect, which is the main focus of the app. Users can now focus on enjoying walking through luxury mansions and skyscrapers without getting frustrated by confusing navigation or hidden buttons.

saota02

saota01

saota03

saota04