Logic Board UI
WebXR work for Atmos, a US-based start-up (California, San Francisco).
The LOGIC BOARD UI panel is another task I worked on to display logic components that could be wired together to give functionality to any object or scene that the users would create with the ATMOS world editor.
For this task, I worked on:
- Designing UI elements and layouts
- Coding a WebXR prototype to review, test and validate the design in VR mode
The image below shows the custom design for the LOGIC BOARD UI panel matching the sci-fi look-and-feel.
The Making Of
As a first step, I created lo-fi wireframes to represent the actual plane primitive (the one below in light-grey color) that would use a texture to render the immersive UI's custom design in the subsequent iterations.
The image below shows the LOGIC BOARD UI panel layout positioned to the left of the ATMOS world editor.
Before working on the custom design, I created a rough WebXR prototype to test the LOGIC BOARD UI panel's size and position and validate comfort and readability in VR mode.
As a final step, I created a static mockup to present and validate the requested sci-fi look-and-feel we implemented in the ATMOS world editor.
The images below show the wireframes/plane primitive and the designed graphic elements to render as textures.
The images below show the ATMOS world editor UI implementing the completed LOGIC BOARD UI panel matching the custom design and sci-fi look-and-feel.
Check out more works for Atmos: