AR and VR have become more than just nice to have. For industries like retail and entertainment, they have become a staple in their marketing. The success of these experiences depends on factors such as ease of use, how it fulfils a need and how the user can navigate the experience. These are factors that are designed, created and implemented by UX and UI designers.

What is UI/ UX?

The purpose of UI and UX design is to simplify complex tasks, improve the usability of a product and make user experiences delightful.

UX at its core, is approaching product design from a human-centric perspective - it is the method that enables users to get the optimum benefit from a product by making their experience intuitive and ultimately rewarding. At the core of UX is ensuring that users find value in what you are providing to them.

UI, in simplest terms, can be thought of as the group of buttons and prompts that the user interacts with in an experience. It is the bridge that connects the user with the experience itself and how the user learns how to interact with an experience and therefore incorporates the graphic design of interactive features such as buttons or gesture/movement and sound prompts.

---

 

There are a few elements important for users when creating AR experiences when it comes to UX. Users want the experience to be -

• Useful - Content should be original and fulfil a need
• Desirable - Experiences should evoke emotion and appreciation
• Credible - Users must trust and believe what you tell them
• Usable - Experiences should be easy to use and understand

 

It is important to consider the aesthetics as part of the UI process. Aesthetics include factors such as balance, colour, movement, pattern, scale, shape and visual weight. These elements complement their designs when it comes to usability and functionality. Take these into consideration when launching your AR experience.

Then in terms of the UI these elements need to be considered -

• Findable - Experiences need to be signposted and navigable
• Accessible - Experiences need to consider those with disabilities

 

---

 

How can we apply UI/UX to AR experiences?

In most design processes you will start off with a problem, something that you want to solve for yourself or your user. In this example, the solution will include an AR experience.

The problem may be looking to solve something along the lines of -

With online sales increasing by 12.7% between 2019 and 2021 and consumers wanting a more memorable experience when they shop online, how can we as a retailer stand out?

Creating personas

Start off with creating personas, this will help you to identify and understand who you want to make use of the experience and what they will get from it. A persona is a fictional person who reflects a user group for whom you are designing. Your personas should reflect patterns that you have identified in your users or prospective users. Create these personas with user research, conducting interviews, surveys and user testing. Check out the guides from Buffer and Career Foundry here to get started with creating personas. 

Wireframing

To start planning your experience, you can create a series of wireframes. A wireframe is a rough guide for the layout of whatever is being designed, including AR experiences. You can use tools like Sketch, Figma and Invision to create wireframes for your AR experiences. They are made up of static images and outline what the flow of the experience or website will be. This is an important early step in creating user-centred experiences.

Once the wireframes have been completed, you can start to create and identify scenarios or create storyboards to continue planning your experience.

Storyboarding and scenario planning

Scenarios are narratives to describe how your experience may fit into their lives. The focus is on regular usage. This can help identify what problem you are solving or what solution you are providing.

A storyboard is a visual sequence of events which will capture users' interactions or the movement between scenes.

This is are from a series of storyboards created by the Zappar team for Happy Egg, a free range egg company in the US. They show the introduction to the AR experience and also explain how the user interacts with the experience. 

Scenarios and storyboards help you to develop a user journey in the most efficient way possible. They also help you to think about the AR experience from your user's perspective, maintaining the user-centric mentality. You can focus on how they think and feel as they interact with the experience, what grabs them and also possibly what doesn’t. Creating a user journey helps to identify blind stops, which helps you create the best possible AR experience for your users.

This is the user journey from the Kelloggs Frosties experience. It shows how a user moves through, outlining the different outcomes and scenes within the experience.

When you have completed the wireframes and the storyboard and you are happy with the flow of the experience you can start creating! Try using Zapworks Designer to create your scenes.

User testing & QA

When you have created your experience, try it out with people around you. Run user testing with people who match your personas and track what they think about the experience. Closely test them on how usable, accessible and findable your experience is

Designing for UI and UX may sound complicated, but it doesn’t need to be. The main focus of UI & UX designers is to simplify complex tasks, improve the usability of a product and make user experiences delightful. Keep the users front of mind as you create wireframes and storyboards.

 

---

 

With the tools and key design principles outlined above, you have all you need to get started with designing an AR experience with UX and UI in mind. Jump into Zapworks Designer to get started on your AR experience.

Also any AR creator, beginners and experts welcome, why not visit our friendly group of passionate AR enthusiasts over on our Zapworks Forum? The ‘Show and Tell’ section is a great place to share your work in progress and get valuable feedback from people from all over the world.