Episode 18 – Virtual Reality & Front End



September 25, 2016

Hello, and welcome back once again to Front End Center!

The intersection of creativity and technology is always an exciting and ever changing focal point. There’s an infinite shade of spectrum to choose what flavors of technical and creative you engage in, and there’s always another platform to learn on.

This week’s episode will be the first of an eventual many that focus on my growing interest in the space of virtual reality user interfaces. As always, let’s start off with a little bit of an explanation.

In the last few years, virtual reality has taken leaps and strides forward. What was once a gimmicky arcade game on demo at the mall… is now a largely gimmicky gaming peripheral for people with too much money and time. But! The same could be said of many technological instruments we consider indispensable today. Those with excess time or money tend can devote themselves to something until it becomes ubiquitous for everyone else.

In this case, gaming is a prime arena for the current state of virtual reality. What truly impresses is how large and complex VR rigs have become compact and effective, if not at least marginally more comfortable. There are a few competitors in the gaming VR space, primarily the HTC Vive and the Oculus Rift. Each has their strengths, and will greatly improve each other through competition going forward.

Beyond gaming though, there are unimaginably huge applications for the technology being shaped now. The cousin of virtual reality, augmented reality, has been driving sci-fi and real world planning projects for ages. Rather than having a single screen stuck in front of your face, augmented reality overlays images onto your view of the actual, physical world.

Imagine being able to have Google overlay directions on the world as you navigate to a new location. Or attending a busy conference, and having the ability to add long and custom details to the “Hello” nametag on your chest.

Augmenting reality through digital interfaces adds the ability to greatly expand convenient access to information. Taking the time to pull out your phone and unlock the screen will seem archaic and backwards.

How do virtual and augmented reality pertain to Front End Center?

While the technical software and hardware of VR have been steadily improving, they are now being balanced with consideration for how humans are expected to USE this new technology.

Hobbyists will gladly shake off rough edges or unintuitive processes to get to what they want. When Microsoft considers putting its augmented reality product in the hands of global consumers though, that’s not a benefit they can expect. Large and small, corporation and individual, there is a demand to understand and create usable interfaces and interaction methods in this new, three dimensional space.

Front end design and development for the web has focused on combining real-world relatable experiences with the naturally unnatural interface that is the internet. We structure content on pages that can be ‘scrolled’ down. It might be literally archaic, but it’s a mechanic we’ve had around for centuries. Those pages can be linked, and then you can turn ‘back’ a page, like flipping through a book.

We take a lot of this familiarity for granted.

There will probably be a lot of sharing between two dimensional and three dimensional user interfaces. They will inform each other on universal constants that we might not have seen working with one or the other in isolation. Each will have their own unique challenges though. Some of the bigger ones are already apparent for 3D interfaces, and we’ve barely scratched the surface.

One of the big issues is field of vision, and how we represent content and screens. When you’re looking at a TV, there’s a set size, resolution, and distance you can generally expect. When you’re floating a virtual menu in the middle of the air and filling it with multiple types of content… flat, 2D rectangles don’t work so well!

Depending on the perceived distance from the user, the rectangle either has to be fairly small, or risk the content appearing faded or blurry at the edges. Imagine trying to work with your computer if the only screen you had available to you was a billboard across the street. The screen real-estate is to drool for, but the experience is probably rather lacking in reality.

The generally used solution for this issue is the physical curvature of interfaces! If the edges and corners wrap around and towards the user’s point of view, it creates a much more usable perspective.

Another issue is how to direct a user’s attention. The web makes it easy. Scroll, move, animate. While excessive or pointless movement is not popular, users are usually happy to cede control when it helps them achieve their goal.

Try doing that with a VR headset, and you’ll need a bucket and mop before long. This is particularly an issue in fully immersed VR environments, but would be problematic in augmented reality as well. Unless our bodies are voluntarily moving and giving us the corresponding feedback, we don’t deal well with motion. Car sickness while reading is a great example.

Even if your user REALLY wants to see the details on that link they just clicked, if you spin their world around to put the new content into view, they will be incredibly disoriented in the best case scenario. So what ideas and techniques have popped up for this problem?

The power of gentle persuasion is the order of the day. Animating elements like buttons or icons, to move slowly from the initial view of the user towards where we want to direct their attention. Highlight their destination, or outline it. Give it something to set it apart so they know where to look. Assuming you have access to audio, play a chime or music that grows relative to their viewing proximity.

In the realm of three dimensions, we have to give up a lot of command and be comfortable with suggesting. Perhaps at some point, we’ll find a middle ground or usability technique that changes that rule. In the meantime, we’re using what we know of old interfaces to inform the new.

Like the early days of web design and development, the rules are still being made and best practices formed. Unless you’re on an existing team with a lot of resources, many of the pioneers have to have some amount of skill in both technical and creative pursuits.

Having an opportunity to take part in the development of such a monumental tool is a major opportunity. Front End work isn’t limited to just the web and internet browsers. Here’s the what the future holds across a countless number of platforms and experiences.

Until next week, thanks for listening. This has been Chris Landtiser and Front End Center.

Leave a Reply

Your email address will not be published. Required fields are marked *