Material 3’s Expressive Motion for XRDesign with ShapesXR

Motion is a "delight " .. Not anymore!

In some of my projects—and I bet many XR designers out there would agree—I’ve often heard motion in immersive design dismissed as something purely for "delight." But what we’re seeing more and more is a flipped script. Motion is no longer just the garnish. It’s becoming the guide.

‍

In immersive UX, where spatial interfaces hover around the user, static cues often fall short. According to Brandhive Dubai, animation does more than look good, it helps users focus, process, and emotionally connect. Motion, when done well, isn’t fluff, it’s function. It quietly says, “Look here. This just changed. You’re moving forward.”

‍

Material 3’s new Expressive design system brings this into sharp focus. Their motion philosophy is rooted in physics-based easing, shape morphing, and named transitions like expressive-expand or expressive-fade. Their system-wide research showed that users could locate what they needed up to four times faster—even across age groups. For immersive UX, that’s gold, especially in headsets and future smart glasses, where attention and orientation are fragile.

‍

‍

So what does this mean for us as XR designers?
It means motion is not a cherry on top of design. It is the design.

The way a menu fades in, the bounce of a selected object, the pace of a zoom, all of these act as spatial signposts, to guide cognition and emotion at the same time. Especially in XR, motion tells the brain what matters, and when.

‍

‍

To prototype this further, I did a quick test using ShapeXR’s new animation feature. I applied the expressive-fade motion to a simple to do list interface—just enough to observe how simple expressive 3 motion can shift focus and ease the user into state changes without overwhelming them.

‍

‍

‍

If you pay attention to each interactions, Instead of content snapping in or out, the gentle fade and the bounce interface on interactions gave the brain a beat to catch up, something that really matters when users are already navigating layered spatial layouts in VR. It took a bit of trial and error to find a motion that could truly mimic and simulate the feel of Material 3’s expressive design system that i'd like . But by combining a few of the motion tools ShapeXR provides, I managed to get pretty close and honestly, I’m quite happy with the result.

‍

‍

‍

‍

I also shared this prototype with couple of dev that i knew, to compare it with the motion guidelines I had already laid out in Figma. The result? they do find the prototype handoff faster to demontsrate the kind of motion and animation i'd like to apply to the interface. Having motion behavior visually tested, like Figmotion but spatial bridged the gap between intent and implementation almost instantly.


Thanks for reading ! ❤️

‍

‍