In my last post, I walked through a bit of theory and a few concepts that help us understand how to approach augmented reality (AR) design in a responsive manner. At the end of that post, I promised a special treat, and I am a designer of my word.
Today, in Torch AR, we’ve published a new template to kickstart your journey into responsive AR. Create a new project from it, design scene content for each of the three major camera-content distances (discussed in the last post), and press the play button. When I said, “we have the technology, today,” I meant it.
Let’s check it out! If you’d like to play along, you have two options:
- Open this link on an AR Kit device to explore this shareable Play Mode app. Use Reset Anchor, under the gear icon to try all the ergonomic breakpoints.
- Customize our responsive AR template to build your own shareable app that adapts to a viewer's context. In Torch AR, select Templates from the app menu, and create a new project from the Responsive AR Content template.
Responsive design in Torch
The structure of the Responsive AR Content template is simple, consisting of an entry point and a scene for each of the distances worked out in the Foundational Ideas for Responsive Augmented Reality Content post. When your audience launches the project in Viewer Mode, and places the anchor, it navigates instantly to the best-fit scene for the camera-content range they're at.
The Entry scene is where we create the breakpoints that will transport our audience to that best-fit scene. The Far Back scene is selected when they stand with content on the ground. Middle Ground covers both standing-tabletop and sitting-ground options. Up Close accounts for when your audience sits to view your content on a tabletop.
Each breakpoint in the Entry scene takes the form of a large, transparent image rigged with a Gaze At interaction trigger. This trigger has a single response: a Scene Change to the breakpoint’s specific scene.
This trigger will fire immediately if the camera’s gaze is aimed directly through the breakpoint’s surface when the project is opened in Viewer Mode. Since each of these breakpoints occludes those below it, only the top-most breakpoint in the camera’s view will fire its trigger when the experience starts.
The far-back breakpoint sits at 110cm above the ground. From a standing position, with a ground anchor, the camera should fire this breakpoint’s Gaze At trigger, causing a Scene Change to the Far Back scene.
The next breakpoint sits at 60cm, and fires when the camera-content distance is in the middle-ground range. Remember, this works for both standing-tabletop and sitting-ground camera-content distances.
Also, recall that the placement of the far-back breakpoint should now be above the camera’s gaze, since the camera has moved closer to the content anchor. This puts the middle-ground breakpoint in direct view of the camera, causing a Scene Change to the Middle Ground scene.
If the camera is sitting at the up-close camera-content range, which we’ve identified as the sit-tabletop ergonomics-placement combination, the final breakpoint, sitting at 10cm above the anchor, will fire. This breakpoint will cause a Scene Change to the Up Close scene.
With the three breakpoint targets set up, we’re ready to start looking at content in a responsive manner. Here it is in action.
Where to from here?
To get started, open up the Torch app, select Templates from the app menu, and create a new project from the Responsive AR Content template.
From there, it’s up to you! Whether you want your content to keep a consistent scale, or present entirely different layouts based on the ergonomics and content placement, this template should get you going.
If you're looking for some starters on how you could use responsive AR for your next project, here are a few:
- Create a sculpture garden at room scale allowing your audience to walk around looking at life-size sculptures. Then, shrink it down as a diorama for tabletop viewing, with the whole arrangement viewable at once.
- Practice your spatial UI layout by adapting scale and height to keep a consistent presentation regardless of the camera-content distance.
- A choose-your-own-adventure quest that leads to different places depending on how the anchor is placed, and when.
As I said in my last post, this is just a start. We need to act as a community to push responsive AR content AR forward, so that we can build rich experiences that everyone can enjoy.
Let’s continue the conversation about responsive content in AR. Feedback, conversation, tweaks to the template, and additions to any and all are welcome, without reservation. Join me on the Torch Friends Slack to continue the conversation. You can find me under the handle @blackmaas.
