An emergent AR design framework

Nick Ritchie and Rob Scott from the New Experiences team explain an emergent design framework for creating mobile augmented reality experiences.

Contributors

  • Nick Ritchie
  • Rob Scott
3 layers of the mobile AR framework: Physical Space, Activity and Content. Content shows educational food chain experience.

An emergent AR design framework

In a previous post we talked about how we were looking into spatial and immersive experiences and what the public service benefits might be. Since then Rob and Chris shared some great insight into researching for headset AR. Today we’d like to share some more of our work.

Early on in our exploration of immersive technology, we identified that children may have a richer learning experience through educational spatial applications. We began looking into whether augmented reality (AR) on mobile phones could help people learn in their homes. According to academic research on AR and learning, AR has been proven beneficial in several contexts. Two notable examples are:

1. Situated learning

The theory that learning a task is more effective when the setting in which learning takes place is similar to the real-world context in which this learning would be applied.

2. Constructionist learning

The theory that developing knowledge occurs best through building artefacts that can be experienced and shared.

Some of our own early research suggests that AR provides the opportunity to learn in a way that is more visually and physically engaging. This can prove empowering, particularly for those who find some aspects of learning difficult. AR has the potential to:

  • Aid understanding of abstract concepts by making them more tangible and placing them in the spaces around us
  • Engage curiosity about a range of subjects, some of which may have not seemed interesting before
  • Build resilience, by encouraging users to persevere when tackling ‘harder’ subjects

Scalability

We are currently running a more detailed follow up study. As part of our research we have designed and built a number of prototypes. Through this process, we’ve identified and developed a number of patterns to make sense of what we’re making. We want to share some of our thinking in the hope that it’ll help others new to spatial and immersive design.

When we approach a design challenge in BBC UX&D, we generally try not to make decisions that only benefit the current problem. Instead we try to develop reusable systems, patterns and components that can scale and be used across many different applications, now and in the future. You can see some examples of these from our own design system GEL. Our colleague Ryan recently wrote about the scalability of patterns designed for educational content in BBC Bitesize.

So as we design the prototypes for use in our research we are also working to develop a system for the development of educational AR experiences. Our hope would be that this “framework” could also prove useful for AR beyond education.

The Framework

Let’s imagine we want to create an experience that allows someone to learn about food chains in AR like this challenge on Bitesize. In AR the producers and consumers like plants and lions can be brought into your living room.

Image shows an educational food chain example mobile AR experience.

A Bitesize food chain game reimagined for mobile AR

Essentially we would think of an experience like this in 3 layers: Physical space, Activity type and Content.

Image shows how the 3 layers of the mobile AR framework stack up: First Physical Space then Activity type and finally Content

3 layers that make up the framework

1. Physical space

As a designer, it’s critical to consider the physical spaces that your audience will be in. They are the canvas that AR experiences play out in. This is also a technical consideration — your device needs to understand the part(s) of the real, physical world in order to integrate virtual elements into it. This could be a simple table top, an entire room, a person’s face (think face filters in Snapchat and Instagram) — or all three. So the first thing you need to think about is how you want your user to interact with the physical world, and how virtual elements will intersect it.

Image shows how the physical space can take a number of forms, like a table, a room or a face

The physical space layer can take a number of forms

2. Activity type

Having established the physical space that will act as a canvas for the experience, you can then choose from a set of common activity types. We have identified some common types of AR experience that many experiences boil down to. We believe these could be the beginning of a set of repeatable templates for AR. Our research will help us explore this hypothesis.

Examples of the AR activity types. ‘Hunt’, ‘Inspect’ and ‘Immerse’ (the user is surrounded by elements).

Some examples of the activity types layer

3. Content

Having figured out the space you have to play with and selected an appropriate activity type, you then need to decide how to ‘dress’ your activity. This is where branding and visual aesthetic are brought in as you create bespoke content for your user to interact with and experience. The idea is that you can realise lots of different experiences on top of just one activity type. For example, if you were to use the “Hunt” activity type, your user could be searching for different animals (biology), prime numbers (maths), or letters of a word (english).

Image shows how one activity type can be used to enable many different experiences - food chain, maths, english quiz

One activity type (e.g. ‘Hunt’) can be used to create many different experiences

Once those layers are established they all combine to create your unique AR experience.

Image shows an educational food chain example mobile AR experience.

The 3 layers combine to create an AR experience

That’s it in a nutshell. This is early work and we will evolve it as we learn more. Particular areas we would like to learn more about are:

For our audience:

  • What the benefits of each of these activity types might be, in an educational context and beyond.

  • What other activity types might there be, and which ones might become useful as technology develops.

  • How we enable mixing and matching of templates to create new things.

For production:

  • How well these templates scale, enabling the efficient production of AR.

  • What tools our editorial colleagues will need to produce new content as independently as possible.

  • If this framework can aid in the understanding of how we might approach the design of AR experiences across our team.

We aim to answer some of these questions in our next phase of work, drawing insights from the research in education. We will continue to share our thinking as we progress.


The following models by ‘Poly from Google’ were used as part of some images in this article; ‘Lion’, ‘Hyena’, ‘Capuchin’, ‘Tuft of grass’. All licensed under CC-BY 3.0.

Where next?

Games framework

Ashleigh Middleton

Ashleigh Middleton

Senior UX Designer

  1. Guidelines: Design Patterns

Iconography

Simon Rooney

Simon Rooney

Creative Director, AVKX and BBC Three, UX&D

  1. Guidelines: Foundations