Introduction
About ARENA
ARENAXR is a cross-platform network that serves as both a 3D scene editor and a virtual meeting space. Editors can easily build hybrid AR/VR reality environments where physical and remote users can interact in real time. The project originated in CMU WiSELAB (Wireless Sensing and Embedded System Lab), under the direction of Dr. Anthony Rowe.
Discover more about ARENA: https://docs.arenaxr.org/
Objective
My role in the project was UIUX development and Interaction design for its workroom feature. Since it was in a primary phase of the project, the team focused more on the scene editor function instead of in-scene interactions. There were no UI elements besides the control blocks as placeholders. As a primary UIUX designer, I addressed the user demands and generated a clear set of interface, determined a proper user flow, and made specific optimization towards the headset user experience.
1
Design an usable interface for both mobile and headset ends.
3
Replace three.js element in order to enhance the project library
2
Realize 80% of expected functions with basic UI elements.
4
Refine overall user experience of current product
Design Outcome
Generation of ARENA Interface
The biggest difference I made on the system is the regeneration of the VR/AR operation system interface: the previous design of the interface was made by internal modellers which shows entirely no interactive functions and definitely not visually accessible. Based on the previous design codes and its library structure, I decided to first change 80% of the UI components to replace the library elements and make the interface into a MVP status.
Interface codes, Two themes
Design Outcome
Deployment of ARENA Interface
In collaboration with the programming group, I made adjustments and replaced the current buttons and tabs in the 3D object schema library of ARENA. The current object library was based on three.js library, which fortunately allows the auto-shrinking of text and clicking effect of the buttons. Animations of more complicated operations may be deployed in the future.
Basic UI Elements are tested and deployed into system
Design Outcome
Reframed User Journey
I conducted a series of user interviews and addressed a proper flow for those interfaces. I then proposed separate user flows for the headset and mobile devices. These ideas were further evidenced and adjusted by a series of user validations.
Enhanced User Flow
Design Outcome
Optimzation of Headset Interface
When implementing the interface in system and testing, the lab clients and I found an urgent need for a specific, optimized solution for the headsets as they have disparities in operation and interaction modes.
Ideation
Initial 3D Menu Bar
Being inspired by Oculus UI, we decided to add a built-in menu tab that could be called out anytime in the meeting. This tab is called “initial3D”, anchored with the user and could be switched on/off by head movements. Our purpose is to avoid the plain buttons which are similar to mobile interfaces, but emphasize the 3D realm of the controls. This design shares the same style with the basic UIs.
However, it is specifically difficult to implement the curved surface via JavaScript due to the limitation of the object-based attribute of the method. Since ARENA has already allowed object editing via importing from blender, a possible solution for Initial3D is allowing the primitive, build-in UIs to be imported as models (3dm, obj or gltf).
Conclusion
Afterthoughts
ARENA is my first project as an Interface/Experience designer in relation with the Extended Reality field, also my first project working in a real, lab environment. In the collaboration process, I gained invaluable experience working with multiple roles. I also realized there is no specific answer to a problem in the technological field. When dealing with the modeling issues, ARENA used multiple ways to process the files, such as use original three.js library, 3D modeler - gltf conversion, and Unity as API in the editor... This experience also unbounds my thinking in the designing process -- sometimes "designing" is a small part of the design process, while researching on the users are more important.
Copyright © 2020-2023, CONIX Research Center. ARENA is a project led by Carnegie Mellon University.