PROJECT OVERVIEW
XR Industrial: A VR Training Platform & Companion App for Industrial Safety
XR Industrial is a VR training platform that helps manufacturing safety facilitators create custom training scenarios by simulating workplace hazards and forklift operations. Developed by Futurus and set for release in Q2 2025, it includes an iPad-based companion app for placing, modifying, and managing training assets. I was contracted to design the MVP app, translating wireframes into high-fidelity UI designs and developing a design system with colors, icons, and typography.
MY ROLE
UI Designer
TIME FRAME
3 weeks
TOOLS
Figma, Figjam, Confluence
BACKGROUND
Documentation and Design Objectives
GOAL
Design an Minimum Viable Product (MVP) that proves the concept of a simple, intuitive authoring tool for training facilitators to customize safety scenarios.
MY ROLE
Transformed low-fidelity wireframes into high-fidelity designs.
Developed a cohesive design system (color palette, typography, icons/graphics).
Ensured usability and accessibility for facilitators working in manufacturing settings.
OBJECTIVES
Serve as a proof of concept for training scenario customization through an iPad app.
Allow facilitators to add, edit, and manage props and hazards in a 2D representation of the VR environment.
Support essential editing functions like rotate, move, delete, undo/redo, and object grouping.
Enable facilitators to lock objects and multi-select items for easier scene arrangement.
ANALYZE
Contractor Provided Wireframes
Analyzing the provided wireframes
The documentation provided by the contractor included detailed explanations of the functions and features of each screen, along with a general guideline outlining the flow of the companion app. This allowed me to better understand how to approach the final designs and ensure that each screen functioned as intended.
DESIGN
UI Design System
Typography and Color Palette
After presenting multiple typography and color palette options, the contractor chose Roboto as the font for the companion app, referencing their previous experience using it in past products. They also requested orange as the primary color, which led me to develop a cohesive color palette around it.
Iconography
The contractor provided a general guideline for the desired icons, so I designed a set with sizes that aligned seamlessly with both the UI screens and the contractor's preferences.
Layout & Spacing
I established a layout grid and defined spacing for the UI components to serve as a reference for developers, ensuring consistency in the future development of the MVP app.
DELIVER
Final Design Screens & Hand Off File
Final High Fidelity Screens
Using the provided wireframes and UI design system, I developed a set of high-fidelity screens. These designs were refined following a round of feedback and critique from the contractor, resulting in the final version.
How I created a Hand Off File for Developers
Since the contractor had already provided developers with existing documentation outlining the general flow and features of the companion app, I opted for a minimal approach to annotations. Instead, I focused on clearly labeling each flow with its corresponding screens and ensuring that every screen was development ready and accessible with Figma’s dev mode. Additionally, I organized the Figma file into sections, making it easy to access components of the UI design system, wireframes, and high-fidelity screens.
A special thank you to Annie Eaton and Futurus for giving me an opportunity to take part in this exciting project!
Getting the chance to contribute to a project that enhances workplace safety by preventing injuries, while also integrating virtual reality technology, was an incredibly rewarding experience. I'm excited to see Industrial XR roll out to market soon and I wish Futurus the best of luck!
REFLECT