Material 3 Expressive: Better, Easier, Emotional UX

https://news.ycombinator.com/rss Hits: 18
Summary

Most importantly, expressive design is about improving user experience. M3 Expressive’s strategic use of color, size, shape, and containment follows from long-standing design principles and best practices, drawing attention to key elements and helping users navigate more quickly. We brought a diverse set of people into a lab with the very latest eye-tracking glasses and had them interact with 10 different apps in both Material 3 Expressive and current Material 3 versions, randomly ordered. Participants were able to spot key UI elements up to four times faster in the M3 Expressive designs, suggesting that they steer user attention toward the most important part of the screen. We’ve seen many apps achieve these levels of improvement, which extend beyond eye-fixation times. The time it takes to tap on key actions, for example, decreased by seconds across different expressive designs we tested. The email-app case study below persuasively illustrates the benefits of expressive principles. For example, the Send button in the new design (on the right) is larger, placed just above the keyboard, and uses a secondary color to draw attention to it. The non-expressive design, by contrast, places the small Send button in the top-of-screen toolbar alongside other controls like attaching a file. When participants were asked to “send the email,” their eyes saw the button four times faster in the expressive design.

First seen: 2025-05-16 08:42

Last seen: 2025-05-17 02:45