Removing the friction with webAR
Augmented Reality is an amazing way to engage people and bring your creative ideas to life. But the hurdle of having to find, download and install an AR App, or the limitation of requiring dedicated hardware can scare away the majority of the people you worked so hard to attract.
In fact, for a lot of Augmented Reality experiences more people see the YouTube video than ever actually use it.
However with webAR you can create a seamless experience that removes the friction created by Augmented Reality apps…
- you open a web link in your browser
- you point your camera at the real world
- and BAM — magic happens!
webAR can be the closest thing to a #ZeroFriction Augmented Reality experience that’s possible. But even with webAR there are a few things you need to know in order to ensure people really use what you create.
How do you access webAR?
In the simplest scenario people just open a web browser and type in a short or memorable web link e.g. rocket.awe.io
Of course if you’re creating a custom branded experience then you’ll probably want to create your own custom domain. Our AWE platform makes it easy for you to setup your experience using any custom domain you like, and this includes the SSL certificate that’s required for all modern webAR experiences.
However, getting people to use your creation is not always as easy as just pointing people at your web link.
People may see your web link printed on a product, poster, brochure, business card, magazine, outdoor ad or even in a TV ad. And along side your web link they may even see an optional QR code.
They may receive your link in an email or text message, so they can just tap on it.
They may see your link shared via social media which can be within a browser on their mobile or PC, or could be within their Social Media app.
Or they may see a short promotional video or image with a call to action shared via Social Media.
They may even be told about it while face-to-face with another person and want to quickly and easily try it for themselves.
It’s so much simpler to share webAR than it is to drive users to download and install a native AR app experience. But what started out as “a simple web link” can quickly expand into a wide range of different scenarios.
Thinking through and planning for all these scenarios is your key to ensuring your users get the best experience possible.
How do QR codes work with webAR?
Some designers are not fond of QR codes as they are not the most beautiful graphic elements. However, there are 2 big benefits that QR codes deliver:
First, almost everyone that sees a QR code knows what it does. Just by placing a QR code somewhere you are explicitly providing a call to action to “scan this code”.
Second, scanning a QR code on your mobile device today is seamless. It no longer requires a specific QR scanning app. On both iOS and Android QR code recognition is built into the default camera app.
From a phone with it’s screen turned off you can turn on the device, launch the camera app, scan the QR code and then be taken directly to a webAR experience with only one swipe and a tap. All of this can be completed within a few seconds.
This is the most seamless way to access Augmented Reality available today.
However, people don’t always have the QR code with them and may be unlikely to share the QR code too. So even if you want to include this as part of your interaction design, you can’t rely on this being how all people get to your creation.
What do people see when they get there?
Even the most efficient web experience needs to load a number of resources, and webAR also requires setting up access to sensors, plus software libraries for computer vision and 3D graphics. The key to making this a smooth experience is to balance useful and interesting loading experience with the need to keep your graphics and content as lightweight as possible.
Loading your webAR
First you should present your users with a visually interesting “loading experience” that helps them understand that your webAR content is loading and will be ready to use soon. For example our AWE platform makes it easy to create a fully custom branded loading experience that fills the entire browser window or screen.
Loading computer vision
Now that the page has loaded you will want to let your users know that the computer vision and other related libraries are being setup so we can present them with a rich webAR experience.
Communicating these different steps helps the overall loading process seem shorter than if you had one long animation. It’s also a chance to start communicating with the user about what they will soon be experiencing. With AWE based webAR experiences you have a rich events based model that gives you complete control over how this loading phase works.
Helping the user get started
Once everything you need to start the webAR experience is loaded you have 2 key design choices.
- You can automatically transition into the full experience, or
- You can present the user with a clear call to action for them to start the experience.
Your choice depends on the design goals you have and the overall user experience you want to create.
We have often found that you create a stronger sense of control if you use the second approach and give the user a clear call to action (e.g. “Tap anywhere to start”).
You may also combine this with a graphic presentation of what they will need to do once they start (e.g. “Point your camera at this image” or “Point the camera at your face”, etc.). This single step can be the difference between creating a highly engaged audience and leaving people feeling lost.
What about webAR inside Social Media?
When people share links to your webAR experience through Social Media, the end users may access this in a range of different ways.
They may be receive an email summary of Social Media highlights and click/tap on a link to launch their full web browser.
They may receive a notification and click/tap on a link.
Or they may tap on a link within a Social Media app like Facebook, Instagram or Twitter, etc.
In the cases where they open the link from a Social Media app they will usually open your experience within a cut down version of a web browser that is embedded within that app.
In these cases you will find that these cut down browsers don’t provide all of the access and capabilities required to run a full webAR experience. Here you will need to make it easy for users to quickly get from within the embedded browser, out to a fully functioning browser.
There’s a few different strategies here. Some people try to provide contextual hints to the user based on the different type of app they have opened this within. If you and your dev team choose this approach, you will find that it is very difficult to reliably detect which app they are using and that this detection method can break and needs to be changed at any time. You may also find that the contextual graphical hint you provide can change at any time too, as these different apps update their user experience.
With the AWE platform we have developed a simple and effective strategy for dealing with this challenge that provides a consistent user experience across all these different contexts. This also gives you the ability to easily customize and brand this experience to match your needs.
What about webAR inside other apps?
The same challenge exists when you try to embed webAR inside any native app. The embedded web browsers imposed by the operating systems like iOS and Android have their own limitations. In some cases you may find that access works as desired, but this is far from consistent and needs continual review as new versions of these operating systems are released. And often these reviews and updates will require a new submission of your native app for review and publishing approval.
With the AWE platform the same consistent user experience that is delivered within Social Media apps works for any other type of native app too.
How do you measure success?
It’s important to measure each of these steps. You can measure how long they take and how many people then proceed to the next step. The AWE platform provides detailed analytics that lets you see who has interacted with which content — grouped by type of browser, device, operating system and more. It also lets you easily add your own custom analytics using platforms like Google Analytics so you can track any individual aspect of this you want.
You should set goals for this data when you first plan your interaction design. Then measure the actual performance against this on a regular basis to see how your design is performing. Learning from this process is one of the key steps to finding out what really works when you’re creating webAR.
This is all part of creating a great “First Use” experience. This has a big impact upon how people will feel about your brand after using your webAR. We’ll cover more about customizing webAR to match your brand in detail in our upcoming posts.
This should give you a good introduction to the new User Experience issues you need to consider with webAR and how this is much more than just the Augmented Reality content itself. This includes a whole new way of planning and designing content. New media formats and workflows. Plus a range of different webAR modes & technologies including Image tracking, Face tracking, Geolocation, World tracking, 360°/VR experiences and much more.
The key message we hope you take away from this is that webAR is here right now and it provides an amazing opportunity for creative people like you to weave new and exciting immersive experiences.
Please share this post and come back again when we continue exploring how you create webAR. You may also like to checkout our first post in this series.
Looking for help getting started with webAR?
Here’s a guide to setting up your free trial and getting started creating webAR. And here’s a guide to creating your first Image based webAR experience.
If you have any questions or need any help please contact support [at] awe.media — we love to help!
