Web-VR for design prototyping

Yesterday I was told I had to design a roll-up poster for advertising a VR demo we’re running. We basically stand around with 3 Gear VRs and let the public try 360 videos with 3rd order Ambisonics of operas, in the foyer of the Teatro Regio opera house in Parma, in the intervals of opera performances. This is a bit too meta for my tastes, but people seem to like it.

Most roll-up posters that I saw for sale online are 1950x850mm, which is both very tall and in an uncomfortable aspect ratio. I’ve done plenty of typesetting, but never at this scale, I mostly do papers and long documents.

I needed a way to visualize the size and evaluate the legibility. What allows for the best sense of scale? VR, of course.

So I remixed the default A-Frame project on glitch.com, uploaded an equirectangular picture of the Teatro Regio foyer, set it as the sky box, I uploaded a jpeg of my poster draft, set the width and height to match the real-world dimensions, and fiddled with the distance for 5 minutes. The wonderful thing is that 1 A-Frame unit is one meter. This is the result, which works pretty much anywhere.

It also kinda works in room-scale with the Vive, but the skybox is pretty much at infinite distance. It would work much better with an actual environment, but it would probably be overkill for something like this, and the screen-door effect is a worse problem anyway.

The non-VR view

Of course, the really interesting bit is that you can easily do the same for any graphical project you’re working on, it’s quite literally two lines of code.

I might write a simple app that takes in a PDF and automatically generates a VR mock-up if there is any interest..

Lazy biker and videographer. Very occasional scuba diver. Tends to bake when procrastinating. Did Classics in High School, EE + media in Uni.