Here at Vizor we’ve just released a new WebVR app, Vizor 360, specifically for working with 360 based media. We’ve built it on React VR, which will give us the ability to publish to Facebook and opens up a whole new audience to immersive web experiences.
But our usual tools (Sketch, Atomic.io, Framer and our own visual programming tool Patches) didn’t quite give us all we needed to prototype features for the app, so in collaboration with Jouko from the dev team, we decided to design and build a series of prototypes directly in React VR. We wanted to discover how the various elements from a typical 360 project—text, 3d objects, animation and interaction—would work across a range of viewports and devices, from 2D desktop web to Facebook Newsfeed, mobile Newsfeed, and WebVR devices like Google’s Daydream.
One of the issues of concern was the ability of React VR to deliver good typography on desktop and 2D mobile views, as it was going be using SDF text for its VR and desktop views. If you’re not familiar with SDF text, it is a way of keeping type sharp when it is drawn in 3D spaces, devised by Valve in 2007 for use in games. It is a better way of handling type in 3D space than simply rendering it to pixels on a plane.