The VR space is heating up real quick. Recently, I was fortunate enough to work at Walt Disney Studios as the Lead UI Designer on the Disney Movies VR product team.
It was my first-ever VR project, and I’d like to share a few grab-and-go lessons I learned that are applicable to both the mobile device VR environment as well as higher-end headsets.
1. Print design is relevant to VR design
VR is an interesting space to design for because it’s this overlap of technology, visual design, and interface design. Where it differs is the approach.
Having experience both in graphic design and UI design, I can tell you VR is a strange mix of the 2—and it’s more relevant to print design than anything else. Yes, you’re designing for a “screen,” but things designed in space are 100% relevant to your spatial relationship to it. Screens, and specifically typography, lend themselves very much to the same relationships you’d find and leverage in the real world.
“Don’t ignore print design when you’re designing for VR.”
I found myself asking questions like, “How big should this type be to be readable?” only to realize later that these precedents existed in billboards, posters, and even books. When it comes to design, you can never get away from typography. And when it comes to typography in space, virtual or real—it’s all about the readability and communication.
tl;dr—Print has solved the issue of readability for the real world. No need to reinvent the wheel for the virtual world.
2. Be strategic with your targets
The tricky thing about VR is the method of input. During my time at Disney, we optimized for gaze-based navigation, assuming that our users would have limited or no input capability at all. This means that the crosshair/reticle/cursor was also your button click if you hovered over an interactive object long enough.
The challenge this presents is making sure your users don’t fall into a black hole of button clicks as they’re browsing through your information architecture. We intentionally designed our UI to be out the cone of focus after users invoke a specific action. This encouraged even more intentional actions for invoking and accessing VR content.
tl;dr—Users might gaze naturally in the center after invoking a thumbnail. Putting your targets out of the natural gaze position will prevent accidental clicks.
Example:
We had 2 paths for invoking our VR content.
3. It’s important to create mockups in VR
Mockups and comps are great for soliciting team and stakeholder buy-in, but the only way to truly dog food what you’ve designed is to throw your design into VR space. You give yourself permission to see it in the world it’s designed to be in. Size, space, colors are suddenly being consumed spatially and really give you an opportunity to be critical with the work you’ve done.
“VR environments are distracting. The more feedback, the better.”
While stumbling through this process, I cobbled together a workflow that let me crudely view flat mocks as a spherical skin in my Google Cardboard viewer. There’s still a huge opportunity for prototyping in this space, as there currently exists a large void. At Disney, we were lucky enough have our engineering partners facilitate this by providing prototyping software for us to view our flat UI designs.
tl;dr—Design comps are great, but you really need to view them in a headset to get an idea of what you’re designing.
4. Feedback is everything
Visual, auditory, haptic—I’d argue that feedback becomes even more critical in VR because of the low barrier to distract a user. Where UI design’s limitations were previously viewport, VR opens up an entire world to interact with. Buttons and links can now look like portals, objects, and regular old desktop items.
“Give users feedback when they hover over something interactive.”
This is where I think game design becomes largely relevant. Surface feedback in some form and to do so consistently so users understand what “rules” they have for invoking objects and actions. Also important after establishing your visual language and rulebook is to remain consistent with it. No one wants to figure out why your buttons are 2 different colors.
tl;dr: Give users feedback when they hover over something interactive. The more feedback the better, because a VR environment can be pretty distracting.
Check out some unused design directions below. We opted for scale, color, and animation.
Wrapping it up
If you’re a designer in the VR space, there’s still a lot of great design thinking to be had—these are just some I stumbled upon. For the most part the principles of design still apply and are probably more relevant than ever. Have any other awesome thoughts or insights? I’d love to hear them (seriously).
This was originally published on Medium.
by James Hsu
James Hsu is a designer, art director, and friend based in Los Angeles. He spends an alarmingly large amount of time thinking about how he would survive a zombie apocalypse, design solutions, and how the two would ever overlap. Check him out at http://hellojameshsu.com and http://jameshsusucksatlettering.com
