Jan 2024 - April 2024
Client Project
Product Designer
XR Prototyper
Front-end Developer
Figma
Blender
HTML/CSS/JS (with A-Frame)
Spatial Interaction Design
Virtual Reality (Web)
Healthcare
Our client, the University of Michigan Transportation Research Institute (UMTRI) is a multidisciplinary, applied research org. With annual expenditures between $15-20M, they have produced 1,000+ studies, potentially addressing problems that affect 1.3 million people and $70 billion economic costs.
We want to find out the key factors that are holding parents' back from participating, given recruitment exposure is good but actual signup rate is less than ideal.
We scheduled 8 stakeholder interviews with both clients and target audience. The flyer only interests parents when researchers are present explaining study specs, which is ineffective and impractical.
Key findings are:
01. Tasks are very straightforward with researchers' instructions.
02. Studies are completely safe and ethical, and personal information are completely made untraceable.
03. One lab space contains multiple equipment, reused by different studies.
With this question in mind, we started brainstorming solutions.
"See and experience" poses a strong requirement for interactivity and immersiveness. Meanwhile, accessibility and cost also determines whether client is going to adopt the product eventually.
By these standards, we are able to pick "WebVR" as primary choice.
Low cost and short time in production.
Passive lecturing, lacks interactivity and user freedom of exploration
Not accessible enough for average users who may well not have a headset; high production costs
Good immersion and interactivity
Accessible and convenient, has headset option but not required
light-weight development and production
Good immersion and interactivity
From previous user research, we learned that parents value safety, data usage and compensation. From field trip, we learned how the equipment actually works and the spatial arrangements.
As a result, we created hi-fi prototypes in Figma that visualize the essentials.
Key interactions should:
01. offer user freedom and control to navigate the space
02. provide meaningful information upon user inquiry
03. encourage user engagement
We further animated the Figma prototype to fuel imagination.
With the high fidelity prototype, I was able to implement the experience within 1 week. The programming language I chose was JavaScript and graphic framework is A-Frame, which provides abundant community resources for me to start with.
Feel free to click and play around the prototype in the embedded link below <3
There were several important considerations that traditional UX projects would not really cater to, and scalability is one of them. We made sure to lower the effort for the maintenance of current code, and for adopting this tool if clients want a completely different experiment setting in the future.
Granting user full sense of control introduces the risk of them triggering undesired effects on accident. To prevent that, I fine tuned the thresholds for target areas such that it generates less errors during user testing.
Product Manager & Coordinator: Xiaokun Qian
UX Designer: SiSi Chen
3D Designer: Chengdai Yang, Tongyu Lian
Lead Research Technician: Jamie Moore
Lead Research Area Specialist: Sheila Ebert
Professor Doshi Aalap
