Sep 30, 2020, Design

UI Design in Augmented Reality

Jacek Sęk Product Designer
image

Augmented reality becomes more and more embraced by developers and users. We already have some AR experience with hits like Pokemon GO and cute Instagram filters. As it is fun to use apps that offer it, for designers creating them can be a challenge. Let’s see why.

What is AR?

If you know these apps we mentioned in the intro, you probably know more or less what augmented reality is. But let us explain real quick. Simply put, AR integrates virtual elements with the real world. So you can see a dancing dwarf on your carpet in your living room. Or you can catch Pikachu that is hiding on your parent’s porch. Or you can put dog ears on our own head. You get the idea.

It’s worth noting that Google and Apple already introduced their AR development platforms some time ago. That’s proof that augmented reality is something to be alert about.

The difference between AR and VR

Virtual reality is often confused with augmented reality, but the difference is really simple. VR offers a fully created new world, without any elements of the physical world we are the part of – even if the experience is quite similar to it. AR connects the virtual world with our own – mixing elements together to give us some new opportunities.

Comparing them wouldn’t even make sense. They can be used for alternative purposes and each of them is one of a kind.

Here is an example from Wanna.by:

 

 
 

 

Design in AR

We’ve mentioned design trends for 2020 already on our blog. Now we want to add one more – AR in UI. It can explode more than ever, as we need to stop always thinking about UI that is fixed to a screen. 

What will be the key when designing a user interface with augmented reality in mind, is to create experiences that feel like they are a part of the real world. Blending virtual objects with reality is not easy, but learning it can be a key for all innovative projects that spawn every year.

Let’s start with the basics and then analyze the obstacles in UI design related to AR.

Types of UI design for augmented reality

There are a couple of different approaches when it comes to user interface design for augmented reality solutions. We distinguish:

Object-related design

In this case, we can have two different situations. The first one is that real-world objects have a certain interaction connected to them. The second one is showing a digital object after scanning a marker.

Real-world related design

These AR apps use the world around to display certain elements – for example, restaurant reviews.

Fixed to screen design

All the elements are locked in the screen space, so the user has to position the camera in a certain way for AR to appear.

What you should consider when designing AR?

When creating extensive reality, there’s a couple of things you need to have in mind. This way you can provide a positive experience for every user. These 3 S rules will help you to understand what matters most:

Simplicity

If there’s too much going on, you can be sure that no one will be satisfied with what they see on the screen. Be sure to give each action a clear context, don’t overwhelm the audience with too much data and explain the meaning of every element.

Check out this example from Behance:

 

 
 

 

Surroundings

Remember, that AR becomes a part of reality – so you need to design it in a way that will help it respond despite all the external conditions. That includes lighting, indoor/outdoor situations, movement and more. You can’t predict everything, but probably most of the scenarios are pretty repeatable. If you notice something is not working in certain patterns – fix them ASAP.

An example from IKEA:

 

 
 

 

Security

What’s most important, is that AR is complementing reality with digital objects which means it can be distracting for the user. Make sure using it won’t lead them to dangerous places or to make unwise decisions. Also, prevent physical injuries by not requiring weird movements.

Also, because AR often uses the camera and other hardware and operating system features – take care of data safety.

2D in AR

When we think about AR, the question arises – should the designed objects be 3D or can they also be 2D? The answer is not so obvious because it depends. Flat, 2D objects can be less distracting so they are great for notifications and controls displayed on the screen. Actually, putting too much on the screen is not recommended in almost every case. For controlling features and text it is always better to put them in someplace that doesn’t intrude on the main experience.

So what’s next?

There is no doubt that AR is a huge trend in UI design. Wearables like glasses and headsets that use augmented reality will become more popular every year. Google and Apple are already working on them – right now it seems like not a lot of people will become their users on a daily basis but that can probably change with decreasing prices and growing functionalities.

For all UI designers, it might be wise to consider learning more about augmented reality. Find out how to make it right and consider all the difficulties it might bring. New trends in the digital world are approaching fast so being updated is the best we can do for our work. Probably more and more clients will require some skills and knowledge in AR. Hopefully, thanks to this article you will know where to start.

And if you’re looking for seasoned designers with many competencies to offer – let us know what you have in mind. Let’s create something extraordinary together!

Share