360proto

360proto

360proto

Making Interactive Virtual Reality &
Augmented Reality Prototypes from Paper

Professor Michael Nebeling & Katy Lewis

This research explored prototyping for virtual and augmented reality applications using paper. The work shown here are my drawings and prototypes used in the research to create study requirements and test initial concepts.

This work was accepted to CHI 2019. Watch our talk here & read our paper here.

Initial Concepts & Drawings

360 Mountains

360 Degree Layered Mountain Drawing

This drawing was sketched in the perspective of an equirectangular grid with three distinct layers; a foreground, mid-ground, and background. When wrapped onto a 3D sphere, it acts as a 360 degree drawing of an environment. Using the 360 proto tool, we developed an XR environment and placed 3 progressively larger spheres enveloping the user; one for each layer of this drawing. This technique illustrated how a quick paper prototype can be used to test out a concept for a complex XR scene.

Github
Live Demo

360 filming

An Initial Concept for Diorama Filming

During the discovery work for this project, we explored ways to quickly test XR concepts using a diorama. This image shows an initial concept for using a 360 degree live stream camera, clay figures, drawings, and a box to act out VR scenes for a user wearing a VR headset.

Video


Prototypes

camera orientation filter

VR Tennis Game

Throughout the research process for 360proto, I created several demo experiences using web-based VR platforms that were then used as comparison applications for the 360proto tool. In this prototype, a user plays tennis with themselves in a small room (yes, this game is probably more like solo racquetball).

Github

arjs soccer

ARJS Soccer Stadium

To compare AR streaming capabilities with the 360proto tool and existing AR marker-based platforms, I developed a web-based AR soccer game using an ARJS marker system and inspiration from the 2019 world cup.

Github
Live Demo (you will need to print some markers here)

arjs soccer

AR News App Concept

Utilizing the equirectangular grid and Sketch, I created several quick low to mid-fidelity assets for AR experiences to test with our research group. This example shows an AR News application using a 360 degree photo grid as an artboard. We then took this asset off of the equirectangular grid (IE: with a transparent background), and placed it in web-AR capable 3D scene.

Github
Live Demo

daydream

Paper Daydream App Recreation

The 360proto tool allows for live streaming paper content and ‘wizard of oz’-ing other physical prototyping elements. In order to test these capabilities with our tool, I created this paper prototype of the Google Daydream tutorial scene, which includes several animals in the woods that the user illuminates with their flashlight. Moving these animals along the equirectangular grid while the user is experiencing a live stream of the scene, simulates an interactive VR experience.

Video