General VR Design & UI, UX Principles - Esin-M/FlUId-VR_UI_Guidelines GitHub Wiki
1. Oculus Rift, Leap Motion, Unity3D Manufacturers' Guidelines (Adapted from 1(#ref1))
1.1. Use depth tips like parallax effect of movement, relative scales and lighting effects to create immersive GUIs.
1.2. Position frequently viewed UI elements (e.g., menus) within a comfortable viewing distance - 0.5–1 meter from the user's view.
1.3. Integrate GUI elements into the virtual environment or character. For example, weapon selection by grabbing a virtual backpack or holster.
1.4. Avoid placing content in peripheral areas. Restrict content that requires more time to focus on the center of vision, while content that requires less attention can be arranged in the peripheral areas of vision.
1.5. Display text in UI in a size comfortable enough to be easily readable.
1.6. Use gesture-activated wearable menus instead of static ones, as they occupy less space and help achieve a stronger sense of immersion.
1.7. Place the GUI in a way that surrounds the user to help with reading
1.8. Provide visual feedback on interactive elements, like hand shadows or hover effects.
1.9. Ensure interactive elements are adequately spaced and sized to make the interaction easy and avoid accidental selections.
1.10. Prevent hand occlusion of the UI by using transparency or adjusting element size so they are easily seen around the user's hands.
1.11. Avoid pinning UIs to the user's view to prevent discomfort; if necessary, implement delayed following behavior.
| Feature | Oculus | Unity | Leap Motion |
|---|---|---|---|
| Include depth cues | x | x | |
| Comfortable viewing distance | 0.5m to 1m | ||
| Integrate interface into the user's surroundings or avatar | x | x | |
| Use clear and legible text in the UI | x | x | |
| Surround the user with the interface | x | x | |
| Provide visual feedback on interactive elements | x | ||
| Implement wearable menus | x | ||
| Maintain appropriate size and spacing for interactive elements | x | ||
| Avoid pinning the UI in front of the user | x | ||
| Keep content out of peripheral areas | x | ||
| Ensure virtual hands don't block important interface elements | x |
2. Oculus Best Practices Guide (Adapted from 2(#ref2))
| Guideline | Description |
|---|---|
| General User Experience | Enable users to determine their session length, promote taking breaks, gradually introduce intense experiences, provide intensity warnings to maintain comfort; reduce loading times and use spatialized loading screens to preserve immersion. |
| Vision | Display depth accurately to avoid disrupting the VR experience; maintain comfortable viewing distances; manage distant textures to prevent breaking immersion; design with stereoscopy in mind and integrate information into the environment instead of relying on a HUD to boost interactivity and immersion; put key elements within the user's line of sight to aid visual recognition; consider POV in relation to comfort. |
| Locomotion | Match movement intensity to user level; prevent rapid acceleration for newcomers; restrict movement direction – preferably forward; provide control over movement to avoid simulation sickness; consider the pros/ cons of different movement techniques and types. |
| User Input | Utilize the standard Oculus controllers; maintain 1:1 correspondence between physical input and virtual response; design controller-based menus for better usability; employ familiar button layouts to avoid confusion; accommodate left/right-handed users; avoid proprioceptive mismatch by using techniques for different controller types. |
| Audio | Apply spatial directional audio to enhance realism. |
| User Orientation and Positional Tracking | Avoid disabling/modifying positional tracking; let users set their origin point; accommodate for different room sizes; ensure users don't exceed their physical space limits to prevent accidents and maintain immersion; avoid poorly designed elements that break immersion; don't allow users to get close to the virtual boundaries. |
| Avatars | Design avatars with realistic proportions; ensure accurate positioning and that carried items appear correctly in the avatar without causing disorientation; predict motion and facilitate comfort by using the avatars. |
| Rendering | Apply comfortable fonts and distances for readability; avoid visual flickering; ensure content comfort without causing disorientation; use parallax mapping to support stereoscopy and enhance immersion; implement lens correction appropriate for the headset to prevent disorientation; avoid allowing users to modify lens distortion; avoid lag and maintain consistent low latency under 20ms for optimal experience. |
3. NUI Design Guidelines (Adapted from 3(#ref3))
3.1. Dialogue Principles
| Guideline | Description |
|---|---|
| Suitable for the task | A system is appropriate for a task when it helps users complete it, based on task-specific characteristics instead of the technology used. |
| Self-descriptiveness | A system is considered self-explanatory when users can always understand what is currently happening. |
| Conformity with user expectations | A system aligns with expectations if it behaves in a way that meets what users need. |
| Suitability for learning | An interface that is built in a way that supports users in learning the system. |
| Controllability | An interface that lets the user initiate, control, and time their interactions to achieve their goals effectively. |
| Error tolerance | If users make mistakes, the system should still deliver the intended outcome with minimal or no need for correction. |
| Suitability for individualization | Interfaces that allow users to tailor both interaction and information presentation to suit their needs and capabilities. |
3.2. Guidelines for Ergonomics
| Guideline | Description |
|---|---|
| Everything should be responsive | All interactive elements should react to the user's physical input, even if unintentional, to enable natural movement and interaction. |
| Dynamic feedback | When users get feedback from the system, their interaction becomes more accurate and engaging. |
| Description of the gesture | First use of the application should provide clear icons and explanations for gestures to help users understand the interaction. |
| Graphic Interface | The user interface should be simple, functional, and not distracting. |
| Work mode | The system should clearly distinguish between navigation and interaction modes. |
| The danger of intuition and affordance | "Affordance" is the ability of an object to suggest how it should be used. Applying this idea helps create interfaces that feel more natural. |
| Specific interaction leads to a more specific affordance | Clear affordances help ensure an object is used correctly, reducing the chance of error. |
| Choose the most intuitive actions | Even without prior guidance, users should be able to perform the right actions when using the application for the first time. |
3.3. Gesture Guidelines
| Guideline | Description |
|---|---|
| Avoid gestures too complex or lengthy | Complicated or unfamiliar gestures can be hard to learn and memorize. |
| Taking inspiration from the natural interactions with physical world | Gestures based on real-world actions are generally more intuitive and thus easier to learn. |
| A limited number of gestures the user must learn | Users can only learn a certain number of gestures effectively, and they should be taught in a straightforward way relevant to the usage context. The design should include a basic gesture set that can be combined to obtain new gestures. |
| Constraints of real world are not restrictions in the virtual reality | Some real-world limitations can be removed in virtual environments to simplify how users interact with the system. |
| Ergonomics | NUI design should account for user posture and comfort to minimize fatigue during interaction. |
| Disambiguate | Gestures must clearly show their start and end states through visual cues. |
4. Best Practices for UX Design (Adapted from 4(#ref4))
4.1. Design with an understanding of users' needs, preferences, and goals. Consider different user demographics, experience, and accessibility requirements.
4.2. Create fast prototypes and get frequent and early feedback to resolve issues and optimize the user experience.
4.3. Design for intuitive and ergonomic interactions that enhance user experience.
4.4. Provide clear and effective wayfinding mechanisms to help with user orientation and avoid confusion by minimizing cognitive load.
4.5. Make sure that interactive elements and important information are easily distinguishable. Guide attention by using appropriate colors, contrast, and size. Provide timely feedback.
4.6. Design objects to reflect real-world physics, lighting, and spatial alignment to increase realism and user immersion.
5. Guidelines for VR Interface Design: Ergonomics and User Experience (Adapted from 5(#ref5))
5.1. Avoid relying on 2D design principles. Tailor interfaces to support six degrees of freedom for more ergonomic and natural interactions.
5.2. Design with user posture and fatigue in mind to minimize physical strain during prolonged use.
5.3. Position interactive elements within easy, natural reach, particularly in the lower field of view, to enhance user comfort.
5.4. Arrange interface layouts in curved or circular patterns that align with natural hand movements for intuitive interaction.
5.5. Use storytelling techniques to create engaging and memorable VR experiences.
5.6. Use diegetic interface design by incorporating UI elements within the VR environment to maintain immersion and consistency.
5.7. Offer clear and accessible tutorials, ideally within a "Welcome Room," to help users learn controls and navigate the VR space effectively.
6. Guidelines for Human Factors and Ergonomic Design (Adapted from 6(#ref6))
6.1. Performance and Interaction
6.1.1. Achieve minimal latency, ideally around 20 ms or lower.
6.1.2. Maintain a minimum frame rate of at least 30 fps for images, 60 fps for graphics, and 90 fps for interactive content.
6.1.3. The frame rate in VR content must be synchronized with the refresh rate of the HMD to avoid dizziness and discomfort.
6.1.4. A smaller field of view (FOV) reduces immersion and cognitive engagement and necessitates more frequent screen adjustments, while a larger FOV, though more immersive, may cause dizziness or discomfort and can cause screen distortions.
6.2. Accessibility
6.2.1. Include tools for color correction, including grayscale mode, font size, visual contrast, and screen readers to facilitate users with visual impairment.
6.2.2. Include live captions and support for hearing aids to help users with hearing impairments.
6.3. Visual Fatigue
6.3.1. Take breaks every 15 minutes to prevent fatigue.
6.3.2. Higher dynamics in videos elevate visual fatigue. Vertical parallax induces visual fatigue. Motion parallax from head movements eases visual discomfort. Favor slow-motion parallax signals and avoid discontinuities.
6.3.3. Texture gradients induce fatigue. Sharp textures are perceived as unnatural depth cues. Replicate gradients that mimic real-life visual cues to provide accurate orientation information.
6.3.4. Decreasing the quality of 3D objects and minimizing their overlap is beneficial. Stereoscopic cue-based objects are primarily placed within the central field of vision.
6.3.5. Introducing blur may increase fatigue. Apply blur carefully, ensuring it affects only background elements and not key objects of interest in the scene.
6.3.6. High frequency of color changes and color temperature affect fatigue. Avoid colors with frequent and sudden changes, do not use highly saturated colors. Choose colors with low luminance to minimize fatigue.
7. Guidelines for 3D GUIs (Adapted from 7(#ref7))
7.1. Desing 3D interfaces to be as adaptive as 2D interfaces.
7.2. Incorporate multiple feedback methods.
7.3. Use space efficiently and manage cognitive load by aligning design with the user's mental model.
7.4. Ensure all system responses in VR are continuous and fluid, rather than discrete like in 2D planar interfaces.
7.5. Enable input control through the user's body orientation within the VR space to enhance precision.
8. Best Practices in VR (Adapted from 8(#ref8))
8.1. Bring the World to Life - Design complete and believable environments, regardless of complexity, for better immersion and enjoyment.
8.2. Enrich with the Right Senses
8.2.1. Guide the user's attention, providing a clear sense of purpose.
8.2.2. The experience should be responsive to the user's sensory capabilities.
8.2.3. Avoid reliance on excessive head movement, orient the experience to the user.
8.2.4. When the user is seated the placement of elements should be within a comfortable angle to the field of view.
8.2.5. Use haptic feedback and consider thermoception (temperature) or mechanoreception (vibration).
8.3. Users Avatar is the UI
8.3.1. Implement tools and menus as part of the user avatar.
8.3.2. Avoid not having an avatar body, as it can be disorienting - hands are essential.
8.3.3. Provide avatar customization options like gender, body type, and skin color.
8.3.4. Allow users to look around freely without unnatural consequences and avoid attaching elements to the users' view without deliberate reason.
8.3.5. Utilize hand interaction for enhanced presence. Rely on hand input instead of head selection for core interactions like selection, movement, and aiming.
8.3.6. Use gesture-based interactions to reveal menus and tools.
8.4. Design for Personal Space with Social Connections
8.4.1. Populate the environment with other characters or participants to minimize loneliness and facilitate social interaction.
8.4.2. Allow users to control their proximity to others to ensure comfort and security.
8.4.3. Set clear spaces for different levels of engagement and vulnerability.
8.5. Design for Multitasking
8.5.1. Provide ways for users to engage with the outside world while still being in the virtual environment
8.5.2. Anticipate the user's intent to leave the virtual environment and smooth the transition to the real world by "lifting the visor", reintroducing sound, orienting the user back to reality.
9. VR Design Best Practices (Adapted from 9(#ref9))
| Topic | Best Practices |
|---|---|
| Visualizations | For more natural interactions and multidimensional data analysis, visualizations should be used. Colors should serve as a distinguishing factor. Gamepad manipulation is preferred over hand tracking. |
| Haptic Feedback | Tools should be mimicked as accurately as possible. Visual feedback is better than audio or haptic feedback and combining different types of feedback is best. |
| Ray-Casting | Ray-casting should be used when high accuracy is required. It does not cause significant fatigue or mental strain. It works best when used with a stacked menu design. |
| Pre-attentive Processing | Vivid colors should be used to draw attention and save time. Avoid relying on colors to attract attention in the user's peripheral vision. To support color blindness, avoid using red/green, blue/purple, blue/green, and grey combinations. Larger objects should be used to indicate greater importance. Use spacing between objects to show similarity. Vertical arrangements should be used in search layouts. Common shapes with rounded and symmetrical edges should be chosen. Shapes and colors over text should convey meaning to users with low literacy, dyslexia, or vision issues. A clear distinction should be maintained between foreground elements and backgrounds. |
10. Design Recommendations UI Design (Adapted from 10(#ref10))
10.1. Design interactions by aligning the dimensionality of the input device with the virtual task. For example, 3D input devices like in-air controllers work best for 3D tasks such as pointing or grasping, while 2D tasks like typing or clicking are better suited to in-position widgets, button-based interfaces, or other constrained designs to ensure more intuitive use.
10.2. To prevent frustration or distraction, limit unnecessary motion by reducing degrees of freedom. For instance, when performing a 2D task using a 3D controller, constrain the interaction to a single plane or axis to improve effectiveness.
10.3. There is no best solution for VR interaction. The most effective technique depends on the task. It is important to assess the requirements and choose suitable or hybrid methods, such as combining in-air controllers for selection with voice commands for text input.
References
1(https://www.researchgate.net/publication/347978546_Evaluation_of_Graphical_User_Interfaces_Guidelines_for_Virtual_Reality_Games) S. Alves, A. Callado, and P. Juca, “Evaluation of Graphical User Interfaces Guidelines for Virtual Reality Games” in 2020 19th Brazilian Symposium on Computer Games and Digital Entertainment (SBGames), Recife, Brazil: IEEE, Nov. 2020, pp. 71–79. doi: 10.1109/SBGames51465.2020.00020.
2(https://www.researchgate.net/publication/340795839_Developing_the_'best_practices'_of_virtual_reality_design_industry_standards_at_the_frontier_of_emerging_media) M. LaRocco, “Developing the ‘best practices’ of virtual reality design: industry standards at the frontier of emerging media” J. Vis. Cult., vol. 19, no. 1, pp. 96–111, Apr. 2020, doi: 10.1177/1470412920906255.
3(https://www.researchgate.net/publication/328709883_Virtual_Reality_Applications_Guidelines_to_Design_Natural_User_Interface) D. Regazzoni, C. Rizzi, and A. Vitali, “Virtual Reality Applications: Guidelines to Design Natural User Interface” in Volume 1B: 38th Computers and Information in Engineering Conference, Quebec City, Quebec, Canada: American Society of Mechanical Engineers, Aug. 2018, p. V01BT02A029. doi: 10.1115/DETC2018-85867.
4(https://www.researchgate.net/publication/376667703_Exploring_the_Frontiers_of_User_Experience_Design_VR_AR_and_the_Future_of_Interaction) B. Hari Chandana, N. Shaik, and P. Chitralingappa, “Exploring the Frontiers of User Experience Design: VR, AR, and the Future of Interaction” in 2023 International Conference on Computer Science and Emerging Technologies (CSET), Bangalore, India: IEEE, Oct. 2023, pp. 1–6. doi: 10.1109/CSET58993.2023.10346724.
5(https://www.researchgate.net/publication/384463236_Construction_of_Interfaces_in_Virtual_Reality_a_systematic_review_focusing_on_Ergonomics_and_User_Experience) S. Lima, M. F. Catapan, and J. Sasaki Zeredo, “Construction of Interfaces in Virtual Reality: a systematic review focusing on Ergonomics and User Experience” in Symposium on Virtual and Augmented Reality, Manaus Brazil: ACM, Sep. 2024, pp. 257–260. doi: 10.1145/3691573.3691607.
6(https://index.ieomsociety.org/index.cfm/article/view/ID/17506) Z. Khan, V. Chellappa, and G. Ginda, “Virtual Reality (VR) User Interfaces: Guidelines for Human Factors and Ergonomic Design” in Proceedings of the International Conference on Industrial Engineering and Operations Management, Augsburg (Greater Munich), Germany: IEOM Society International, Jul. 2024. doi: 10.46254/EU07.20240127.
7(https://www.researchgate.net/publication/320742600_A_comparative_study_of_2D_and_3D_mobile_keypad_user_interaction_preferences_in_virtual_reality_graphic_user_interfaces) A. Kaur and P. G. Yammiyavar, “A comparative study of 2D and 3D mobile keypad user interaction preferences in virtual reality graphic user interfaces” in Proceedings of the 23rd ACM Symposium on Virtual Reality Software and Technology, Gothenburg Sweden: ACM, Nov. 2017, pp. 1–2. doi: 10.1145/3139131.3141221.
8(https://www.researchgate.net/publication/320623305_BEST_PRACTICES_FOR_DESIGNING_USER_EXPERIENCE_FOR_INTERNET_OF_THINGS_AND_VIRTUAL_REALITY?_sg=ODrah9KxmJhc7ixAA6Uss6-0OohdpJN9fvR2goBKiyOdnH4Ah0XXeHvQ8xrWg-wrh5eO1S8FQoXZDb4&_tp=eyJjb250ZXh0Ijp7ImZpcnN0UGFnZSI6InB1YmxpY2F0aW9uIiwicGFnZSI6Il9kaXJlY3QifX0) E. Shoikova and A. Peshev, “BEST PRACTICES FOR DESIGNING USER EXPERIENCE FOR INTERNET OF THINGS AND VIRTUAL REALITY” 2017.
9(https://scholarsjunction.msstate.edu/td/5161/) E. S. Wall, “An empirical study of virtual reality menu interaction and design” Apr. 2021.
10(https://www.researchgate.net/publication/377907737_Entering_the_Next_Dimension_A_Review_of_3D_User_Interfaces_for_Virtual_Reality) A. Yeo, B. W. J. Kwok, A. Joshna, K. Chen, and J. S. A. Lee, “Entering the Next Dimension: A Review of 3D User Interfaces for Virtual Reality” Electronics, vol. 13, no. 3, p. 600, Feb. 2024, doi: 10.3390/electronics13030600.