SPEX

UX Research · Physical Prototyping · Visual Design Figma · Fusion360 · Illustrator Team of 3 Spring 2021

The Problem

Knowledge workers face constant pressure to learn new tools without slowing down. When they hit a wall, the usual solution is to leave their workflow, search forums and tutorials that rarely address their exact situation, and piece together an answer from fragments. Research backed what we were already experiencing as remote students: 48% reported the pandemic had worsened their ability to focus, while immersive learning correlated with a 35% engagement increase and 90% better retention through direct experience.

The question we formed: how might we help people learn new skills efficiently, without pulling them out of the work they are trying to do?

Research

Team brainstorm session in Mural
Team brainstorm via Mural
Affinity matrix mapping assumptions to opportunities
Affinity matrix mapping assumptions to opportunities

The team brainstormed across technology, workplace behavior, and social patterns using Mural, then mapped assumptions against an affinity matrix to find where a single solution could address multiple pain points at once. Primary and secondary research pointed to a consistent gap: people want to be shown how to do things, not sent somewhere else to find out.

Framing

Six-panel storyboard showing Jeremy using Spex to navigate an unfamiliar tool
Future-state storyboard: Jeremy experiences an enhanced workflow with Spex

I illustrated a six-panel storyboard following Jeremy, a visual designer navigating an unfamiliar tool on deadline. He lowers the Spex visor, the interface overlays his workspace, he asks a question by voice, Spex scans his screen, loads a community skill, and he follows along without leaving his task. The storyboard gave the team a concrete scenario to design toward and became the shared reference point for interaction decisions throughout the project.

System Design

Before any physical form took shape, we mapped the full input/process/output system: accelerometer and gyroscope for positioning, LiDAR and camera for environment scanning, microphone for voice, bone-conduction audio output, and a flexible microLED display. Understanding the components first clarified what the hardware needed to contain.

I created the v2 orthographic projections in Adobe Illustrator, translating the team's physical explorations into dimensioned drawings that reflect the shift from the boxier early form to the rounded frame that prototyping produced.

Input/process/output component diagram
Input/process/output component diagram
v2 orthographic projections in Adobe Illustrator
v2 orthographic projections, Adobe Illustrator

Physical Prototyping

Each team member built a physical prototype to test form and visor mechanics. My prototype focused on the experience of looking through the visor, arriving at a curved form that felt more resolved to wear. Jennifer's magnetically attached visor revealed that extending the display too far forward required nose support. Eduardo's exploration showed the visor needed to be detachable and raised above the eye-line for clear visibility.

The prototypes changed the drawings. The boxier v1 silhouette gave way to the rounded v2 form after testing.

PJ's physical prototype
PJ's prototype
Jennifer's physical prototype
Jennifer's prototype
Eduardo's physical prototype
Eduardo's prototype

User Interface

The goal was a minimal interface driven by voice, gesture, and visual feedback. I conducted a heuristic evaluation of the prototype against Nielsen's ten usability heuristics, working through the interface systematically to surface assumptions the team hadn't questioned. Three findings directly reshaped the design: the interface needed three clearly named modes, Help, Community, and Create, rather than a feature-dense single view; audio feedback had to pair explicitly with visual confirmation rather than operate independently; and UI placement needed to be user-controlled through gesture rather than fixed by the system.

The team designed ten gesture commands as a complete voice alternative for noisy or public environments, each mapped to a specific system behavior to keep the interaction model learnable without reference.

Spex UI dialogue screen 1
Spex UI dialogue screen 2
Ten gesture commands for voice-free interaction
Ten gesture commands for voice-free interaction

Final Deliverables

The final deliverables spanned physical and digital: a stylized illustrated render, Fusion360 form studies documenting the visor in closed and open configurations alongside an exploded component view, and UI prototype videos showing the initial screen scan, gesture interactions, and overlay button behaviors.

3D user visualization
Stylized product render in Adobe Illustrator
Stylized product render, Adobe Illustrator
Exploded side view of Spex form
Exploded diagonal side view of Spex form
Spex 3D form, visor closed
Spex 3D form, visor open
Exploded component view in Fusion360
Exploded component view, Fusion360
Screen scan on first use
Hide and Reveal gesture
Pinch Resize gesture
Ask Spex
Battery alert
Dropdown menu

Reflection

Working as remote students during the pandemic, we were designing for a problem we were living in. That proximity kept the research grounded and the constraints honest, but it also meant the physical prototype never had a stranger's hands on it. The UI was never tested outside the team. The heuristic evaluation was the right tool for what we could do, but it can only surface what an evaluator already knows to look for. Real users would have found things we couldn't.

That's the thing I'd change. Not the concept, not the process, but the exposure. Getting a prototype in front of even two or three people outside the classroom would have stress-tested assumptions the heuristic evaluation left intact. It's the gap I think about most when I look at this work now.

What the project did well was stay whole. Most student projects fragment: the research points one direction, the prototype goes another. SPEX held together from the system diagram through the physical form through the UI. The storyboard made that possible. Having a concrete human scenario to design toward kept every decision tethered to the same use case, and that coherence shows in the final deliverables.