The Wrist Display
Like the rest of Jack’s integrated systems in Lone Echo, the objective system’s wrist display offers fully ambidextrous support by simply appearing on both wrists[5]. Visually, it consists of only an unlock slider and new objective indicator, but it has a few more nuanced features as well. Let’s break them all down:
Context Fading: Like UI in many games, the wrist display fades in or out under certain conditions. Obviously, when new information is added to it, it appears, but the other more peculiar condition is its position relative to the player’s view. Specifically, the closer it is to a specially tuned ‘sweet spot’ region of the player’s view (imagine a spot about 1.5 feet in front of the player’s face), the more opaque it appears. This allows the display to stay hidden during normal interaction (e.g. climbing around), but makes it very easy to see when intended.
New Objective Indication: When a new objective is added an audio cue, unique rumble tone, and colorful moving icon are all used to get the player’s attention. Particularly, the icon ‘jumps’ off the arm to increase the likelihood that it’s spotted by the player even when out of their view, thereby encouraging them to see the text readout.
Unlock Slider: Built around the assumption that most players would be familiar with this interface from using mobile device touchscreens, this method for opting-in to more objective info was chosen for two key benefits: it’s easy to do intentionally (but difficult to do accidentally), and it encourages players to start using their index finger (which they’ll need for all future interactions with the objective system). That said, to achieve this ease of use, a lot of time was spent iterating on the precise position and sizing of both the slider’s arrow ‘button’ and the overall travel distance. Furthermore, to avoid proprioception disconnects[6], the slider had to be placed pretty far ‘up’ off the arm. Additionally, we had to discover the right balance of using the sensor-tracked wrist orientation and the IK arm orientation to position the slider; discounting the wrist results in a bizarre lack of player input over the system, but using the wrist exclusively results in the slider frequently becoming uncomfortably misaligned from the IK arm.
Additional Usability Features: Here’s a quick rundown of a few additional VR-centric features that improve the usability of the wrist display:
Over-press Distance: Allowing players to push a little bit past the depth of the slider (and hover a little above it) helps make up for the lack of tactile feedback that your finger would normally experience pressing something.
‘Jump’ on Poke: When the player pokes the arrow button (instead of sliding it), it jumps in the unlock direction to imply the intended interaction.
Simplified Physics Sim: The arrow button also runs a simplified physics simulation. Specifically, it retains velocity from being swiped, uses ‘gravity’ to fall back to its origin position, and even bounces a little on landing. Together, these features are important for making the slider easy for our brain to process; as adult humans we already understand the basic results of physics, so instead of having to learn arbitrary rules about how the slider moves, we simply realize that it’s a physical object ‘falling’ in a certain direction and then understand how it works intuitively.
Swipe ‘Becomes’ Tablet: When the swiping gesture of the unlock slider is completed, it results in the tablet appearing. More specifically though, the tablet appears roughly along the same 3D-vector as the swipe, offering two key benefits: it helps first-time users notice the tablet appearing, and (in conjunction with the slider disappearing upon unlock) helps imply that the information/use of the slider has been transferred to the newly appearing tablet.
That wraps up the slider and leads neatly into the other major component of the objective system, the tablet.
The Tablet
Just as the wrist display has some hidden nuances, so does the tablet. Let’s go over its relevant features:
Physicality: Making the tablet a physics object that the player can grab was done to solve our biggest problem: where can we comfortably place text for players to read? What we found through testing is that—just like in real life—players had different distances that were comfortable for them to read at while in VR. Thus, while the tablet appears at a ‘best guess’ location[7], it being physical allows players to very naturally adjust its placement to match their own personal comfort. However, in order to leverage this advantage, it is also important that players easily understand that the tablet is physical: by adding a layered frame to create a sense of mass and rounding the corners to make its form more inviting to the hand, we found that players quickly picked up on the feature. This physicality offers a few additional benefits as well:
- Encourages the idea that the player’s fingers will work for the touchscreen features of the tablet.
- Affords a fun new way to close the tablet: throwing it away!
- Makes it easy for players to address text clipping[8] issues by simply pulling the tablet out of intervening geometry.
Scrolling List: Inspired by email applications, this list offers players a place to easily see what their current objectives are without diving into too much detail. Its swipe-based scrolling functionality was chosen for its ubiquity in real-life tablets and to maintain the finger-based interaction paradigm established by the unlock slider. As such, like the unlock slider, it also leverages a simplified physics simulation, though instead of gravity it uses friction and dampening springs at its extents to limit over-scrolling. Two additional elements of this scrolling that were designed to help players easily discover it are that the scrolling always works (even if it’s not needed), and that the list can only show three-and-a-half items (so that when four or more items are on the list, the fourth item will be partially cropped, thus implying that scrolling can be used to fully reveal it).
Details View: If the player taps on a specific objective in the list, they’re shown a more detailed view of that objective. To help players understand this relationship, the detail view slides into place, creating a brief moment of connection between the two views while contextualizing the nature of the newly-revealed back arrow button. We found that clarifying this relationship is very important as a fair number of players accidentally access this feature on their first attempt at using the system.
Additional Usability Features: Here’s a quick rundown of a few additional VR-centric features that improve usability of the tablet:
Smoothed and Reversible Interactions: The majority of the interactions that can be performed by the tablet (moving it, scrolling the list, switching to the detailed view, etc.) are immediately reversible and follow some sort of smoothing curve. The reversibility is key for allowing the UI to remain responsive, while the smoothing curves help proximate the acceleration/deceleration that objects experience in real-life[9]. To achieve this, these dynamic elements (including transition animations like the entrance of the details view) are programmatically driven and often tied directly to player motion-control input.
Throw-Away Distance: The distance at which the tablet disappears after being thrown away is carefully tuned based on real-life arm lengths (of both very short and very tall people) to help avoid both accidental throw-aways and to prevent the tablet from getting stuck outside of someone’s reach without it disappearing. We found that between our tallest person (over 6 feet tall) and our shortest person (slightly under 5 feet tall), there was a 6-inch difference in arm reach! That might seem trivial, but it made a surprising difference in how often accidents occurred. However, given the possibility of children playing the game, we biased toward shorter arms while still trying to keep things comfortable for our taller players.
Text Size, Weight, and Contrast: In order to make text as readable as possible, we spent a lot of time iterating on text size, font weight (how bold it is), and the level of brightness/contrast between text and its background. What we found is that text needs to be bigger than typical print-sizes (roughly 1.75x), even normal text is better off being what would typically be considered bold (which led us to develop an ‘extra bold’ font for cases where we needed that emphasis), and light text on a medium-dark background results in the best readability with minimal eye-strain[10].
That covers the tablet and thus the remainder of the objective system. Hopefully this detailed examination has provided a useful and interesting look into how even seemingly minute choices can make a difference, especially when those choices are directed by thoughtful goals to create a cohesive whole. Next, we’ll move on to Echo Arena’s lobby screens, including some of the more unique problems their development faced by being presented in a multiplayer environment.
Continued on Page 3: Echo Arena Lobby Touchscreens »
— Footnotes —
[5] Given the physical nature of motion controls, supporting handedness is a must (though, as a lefty, I might be a bit biased there). However, we wanted to avoid players having to specify their handedness, especially given the tacticle nature of Lone Echo’s movement model: sometimes a righty will decide to briefly become a lefty if their right hand is busy with something else. Thus, most systems are simply mirrored across both hands.
[6] Specifically, we found that having the slider near the arm resulted in increased awareness of that arm’s position (especially if players end up actually poking their own arms), which in turn makes players much more sensitive to the potential inaccuracy of the IK-inferred arm position, resulting in an immersion break.
[7] Specifically, it appears a little past their hand: we found that most players comfortably read within arm’s reach. Additionally, this places the tablet in a prime position for further interaction with either hand.
[8] We found that allowing text to render through geometry (as many traditional games do) was a quick way to create eye-strain: trying to sort out the different depths in VR is quite unpleasant for most players. A workaround we leverage (when we have to) is rendering the text as semi-transparent, thereby allowing the brain to evaluate the image as if the intervening geometry is transparent instead, in turn making it feel more like one is simply reading text through tinted glass.
[9] Almost nothing in the physical world reaches its top-speed instantly; though subtle, the absence of that brief period of acceleration or deceleration is easily noticed (especially in VR) and can add an uncanny feeling to movement, which in turn can be distracting or even immersion-breaking.
[10] Light coloration is particularly important for smaller/thinner-weight text, as the ‘bleed’ effect of the headset lenses (where light images bleed into dark images) will work in favor of the text. The inverse (dark text on a light background) tends to result in the text appearing thinner in the headset, and thus dark text needs to have its font weight adjusted accordingly. Fortunately, reducing the contrast between the text and its background reduces the bleed effect, but going too far can result in eye-strain as the brain struggles to separate the text from the background.
