Material 3 Expressive: Building on the failures of flat design

The newest changes to Google’s influential design system are reviving some very old lessons.

A collection of buttons of various sizes and varied corner radii, with various blue/purple colours and different icons and/or labels
A whimsical cloud of Expressive buttons. (Google Design, 2025)

Life is too short to click on things you don’t understand.” — Jakob Nielsen

On May 13, 2025 Google unveiled “Material 3 Expressive” (M3E), a refresh to its Material Design (MD) design system built on top of the last big update, Material 3 (M3).

Chock full of big buttons, stylised text, and passionate colour, M3E is, at first glance, an update primarily championing experimentation with form, colour and shape, a new, artistic approach to product design.

Indeed, it’s been widely billeted as a young, fresh and hip refresh, and most coverage thus far has accepted this. But UX should never be reduced to just trendy visuals, and it would be a mistake to see M3E as simply a refresh to MD’s aesthetic sensibilities.

M3E is at its core speaking to the problems that a large plurality of users, particularly older age groups, have experienced to varying degrees with the dominant UI design paradigm of the last decade or so — ‘flat’ UI design. These overly-simplified designs showed a lack of clear interaction signifiers, leading to click uncertainty, and barriers to quick scanning.

Digging into the guidelines, the research, and the changes Google has pushed thus far, it’s clear that M3E represents the MD team’s attempt to address these limitations of flat UI design, applying the conclusions of UX researchers over the years, now supported by Google’s own usability studies.

A collection of 10 phone screen mockups on a pastel purple background, showing various concept designs that showcase the standout aesthetic features of Material 3 Expressive: experimentation with varied button sizes, lots of colour, and bohemian font choices
Some promo material for Google’s M3E update. I’m not sure what an ‘athleisure but elevated’ fit is either. (Start building, 2025)

Flat vs. skeuomorphic design

Coincidentally as I write this very paragraph, we can (but you probably won’t!) celebrate fifteen years since the worldwide release of Windows Phone 7 — October 21st, 2010.

Although I think it’s safe to say that Windows Phone is nowadays remembered more for its failure than anything else, Windows Phone 7 is today perhaps most important for its influence on the realm of interface design. From perhaps the earliest days of consumer computing, UIs relied on a set of principles known as skeuomorphism — taking physical cues from the real-world, like shadows, depth, and imagery, to communicate the functionality of an interface.

This methodology is today most fondly remembered from Apple’s early iOS apps, especially the ones which took skeuomorphism to an almost pantomime degree by imitating the functionality and look of real, traditional objects or devices. A notebook became a notes app with a yellow paper background and ruled margins; a newsagents’ cabinet carried over into the newsstand app, with digitally articulated oak wood-texture shelves.

Skeuomorphism was essentially a very complex set of signifiers — cues that an object uses to communicate how to use it — which communicated functionality to the user by relying on our real-world knowledge. Eventually, once interaction paradigms became cultural convention, skeuomorphic flourishes became visual flair and noise, distracting as it was no longer necessary to teach functionality by relating the real to the digital.

Flat design

By 2014, digital interfaces no longer seemed constrained by the users’ presumed greater familiarity with the physical world. Cue flat design. Windows 8 went full brutalist minimalism; iOS 7 stripped away all the Steve Jobs gloss; and Android Lollipop brought Material Design to the party. Material was always a little different, basing itself off a series of stacked-paper metaphors which included a healthy dose of drop shadows (NN/g called it ‘Flat 2.0’), but it was still, at its core, a flat approach.

A side-by-side comparison of two versions of the iPhone calendar app
When Apple adopted flat design: the calendar app’s skeuomorphic look in iOS 6 (left) vs. iOS 7 (right). (Moss, 2013)

Flat design’s philosophy, in the great modernist tradition, was exceedingly simple: remove everything that’s not needed.

Retreating from the overtly heavy visual ornamentation that skeuomorphism had become infamous for was a step in the right direction. But along with the trend toward simplification, researchers found that many flat design implementations also harboured a worrying tendency to go to far, to oversimplify, leaning too hard on assumptions of user familiarity with common layouts. In the name of minimalism, these flat UIs stripped away too many visual cues, leaving interactable elements without signifiers and creating interfaces that produced hesitation rather than harmony.

In the name of minimalism, these flat UIs stripped away too many visual cues, leaving interactable elements without signifiers and creating interfaces which produced hesitation rather than harmony

Ever since flat design emerged researchers, particularly those at the Nielsen Norman Group (NN/g), have been hard at work studying these usability challenges. In the interests of time and space, mine and yours, a short guide to some of the best research is presented below, although I recommend you take the time to read each article for yourself.

Flat design & click uncertainty: The 22 percent problem

In 2017, Kate Moran and the NN/g team ran an extensive eyetracking study into the then-emerging flat design. They presented 71 users with 9 different pairs of website designs: one with strong visual signifiers (colour, shading, and/or depth); and one with weak or non-existent signifiers (utilising reduced contrast and/or containment). Participants were presented with simple real-world tasks, such as “You will see a page from a hotel website. Reserve this hotel room.

Side-by-side closeup of two different text treatments
A closeup of a jewellery website target link tested by NN/g, strong-signifier (left) and weak-signifier (right) versions. (Moran, 2017a)

The results were revealed in one much-discussed article, ‘Flat UI Elements Attract Less Attention and Cause Uncertainty’, from which two damning statistics emerge:

  • Users spent 22 percent more time completing tasks on pages with weak signifiers.
  • They also had 25 percent more page fixations on the weak-signifier pages, i.e. their eyes spent more time scanning the page before they found what they needed.
Side-by-side comparison of heatmaps
The heatmap of the jewellery website pair shows stronger fixations on the strong-signifier interface (left) versus the weak-signifier version (right). The user task was to find the pearl jewellery. (Moran, 2017a)

I should note here that the NN/g study was not embarking on a tirade against the whole of flat design. However, the core tenet of flat design is simplification of an interface, and the point of the study was to discover how the extent to which this principle is applied affects usability. Many flattened interfaces suffer from these exact pitfalls, and the stimuli pairs that Moran et al. tested were in fact sourced from real website pages.

(Just the other day I actually ran into an e-commerce website which shared the same button styling, or lack thereof, as in the weak-signifier version of the jewellery website above — evidently the study’s lessons remain relevant to this very day)

Click certainty vs. uncertainty

NN/g’s heatmaps revealed what Moran labelled “click uncertainty.” On the strong-signifier pages, user attention was more often than not far more focused and confident on than on the flat pages. Because the flat versions of each page had stripped away certain cues that users rely on to differentiate what’s clickable and what’s not, they had to spend more time scanning the page, expending more cognitive load to locate the UI element which would complete the task given to them.

It’s the opposite of what good UX aims for. To quote Moran:

We want our users to have experiences that are easy, seamless, and enjoyable. Users need to be able to look at a page, and understand their options immediately. They need to be able to glance at what they’re looking for and know instantly, ‘Yep, that’s it.’

But although it was a significant, extensive piece of research, Moran’s study was not the first — and would not be the last — to sound the alarm on the potential pitfalls of flat design.

Further UX research

One of the earliest studies addressing the usability drawbacks of flat UI designs focused on an early progenitor of the trend: Windows 8. NN/g’s ‘Windows 8 — Disappointing Usability for Both Novice and Power Users’ (2012) strongly rejected the overtly flat changes Windows 8 had touted: poorly signposted buttons, hardly distinguishable from text labels or info cards, and icons that were “flat, monochromatic, and coarsely simplified,” falling into the background of the overall information architecture.

Screenshot of a dark-blue settings menu with a 3x3 grid of white menu link buttons
A disturbingly flat settings menu in Windows 8. (Nielsen, 2012)

And similar conclusions to the Windows 8 article were noted in two other studies in 2015:

Lücken et al. published ‘Evaluation of buttons in the context of the Flat Design style,’ which found that stripping away strong visual affordances from a button exponentially raises user hesitation time, and decreases the chance it actually gets clicked.

In Burmistrov et al.’s ‘Flat Design vs Traditional Design,’ the task of identifying clickable objects created a higher cognitive load and rate of error in flat website designs than in ‘traditional’ site designs. Scanning in a grid of flat icons also took twice as long as scanning in a grid of skeuomorphic ones.

Stripping away strong visual affordances from a button exponentially raises user hesitation time, and decreases the chance it actually gets clicked.

An NN/g study from 2015, ‘Long-Term Exposure to Flat Design: How the Trend Slowly Decreases User Efficiency,’ was one of the earliest to note that young adult users were more effective at identifying clickable elements in flat interfaces, while also pointing out that flat design had trained users to spend more time hesitating before clicking. But despite younger users’ superior performance with flat UIs, the study noted that “young adult users don’t enjoy click uncertainty any more than other user groups.”

More recently, in 2022’s ‘From skeuomorphism to flat design,’ Urbano et al. delineated and tested three interface design styles: flat, skeuomorphic, and ‘skeuominimalist’. The researchers created mockups reflecting the differences between the three styles, incorporating their approaches to colour and shading, adding varying degrees of visual signifiers for interactable elements. Their findings revealed that purely flat designs significantly increase click error rates across all age groups, and for older users, task completion time was notably sabotaged.

One common thread runs through the research: flat design’s tendency to strip away visual signifiers from interfaces inevitably impairs usability. It made interfaces harder to use, especially for older users. Rather than focusing user attention on what matters, making UIs too clean, too white, too flat has the opposite effect: users can lose the ability to discern what they should be paying attention to at all, generating click hesitation and increasing scanning time.

While our humble UX researchers have been studying these issues for many years, not many companies have actually noticed and followed suit — but with M3E, Google has bucked the trend.

From flat design to Material 3 Expressive

The example below is a screenshot from one of Google’s new M3E guideline articles, and it perfectly demonstrates how Google has brought the weight of UX research to bear on their design philosophy:

A side-by-side comparison showing two versions of a financial app home screen
Do’s and don’t’s from Google’s new guidelines. (Start building, 2025)

The flat design (left) uses implicit whitespace and section labels to enable users to understand the structure, requiring extra cognitive effort and potentially introducing click hesitancy.

The expressive design (right), by contrast, has instant visual structure:

  • Containment using contrasted shades is used to signify important interactive elements.
  • Common region boundaries — stronger than proximity or similarity alone — separate distinct groups of elements in a rounded container. The subtle corner shape between each element in the container, background colour dividers between the contained buttons, makes each a distinct element.
  • Stronger colours make buttons more obvious against the light background.

Colour and shade are used not for visual flair, but to efficiently signal key interactive elements and instantly communicate visual structure, ensuring the user doesn’t get lost in whitespace.

The changes so far

We haven’t seen full overhauls of apps that resemble the bold and experimental mockups shown in M3E’s initial load of promo material. But since June of this year, Google has begun rolling out design refreshes to their roster of apps, implementing changes that take cues from the new Expressive guidelines:

A side-by-side comparison showing two versions of the Gmail email app inbox screen
The Gmail inbox, before (left) and after (right) M3E. (Simons & AssembleDebug, 2025)
A side-by-side comparison showing two versions of the Google One settings screen
The settings page of the Google One app, before (left) and after (right) M3E. (Li, 2025)

Again, containment (each settings link and each email get their own containers), common region (related settings and emails list explicitly grouped) and stronger colours (see the M3E Gmail’s compose button) are all strategically implemented, adding important signifiers to critical interactions, and creating immediately clear structure.

We were lucky enough to get a large amount of the research behind these changes published by Google. And it’s clear from their findings that these changes were aimed at solving the problems with flat design that we’ve seen in the research so far — lack of clear signifiers leading to click uncertainty and barriers to scanning.

Google’s research findings

In the snappy article which explained the research behind the update, ‘Better, Easier, Emotional UX,’ the MD design team waxed lyrical about the origins of M3E:

Back in 2022, our research intern was studying user sentiment toward Material Design in Google apps. After mentioning her initial findings to colleagues in a Munich beer hall, she sparked a team-wide design debate: Why did all these apps look so similar? So boring? Wasn’t there room to dial up the feeling?

A collection of 9 phone screen mockups on a pastel purple background, showing various concept designs that showcase the standout aesthetic features of Material 3 Expressive: experimentation with varied button sizes, lots of colour, and bohemian font choices
Dial up the FEELING! (Start building, 2025)

The results of this debate speak for themselves. Instead of just redesigning based on designerly intuition, Google embarked on a massive three-year-long, 18,000 participant-strong research study, testing hundreds of design variations across 46 different research studies and conducting surveys and focus groups to gather emotional responses.

Material 3 Expressive was the result, and Google’s findings validate everything that UX researchers have been pointing out about flat design for years: click uncertainty, barriers to scanning, and age gaps.

4x faster discovery

Using the latest eye-tracking equipment to analyse where users attention was focused, Google had participants interact with 10 different apps pairs: one in current M3 style, and a new M3E version.

One example was that of an email app: where the current M3 Gmail design relied on whitespace alone to contain the key action (sending the email), hiding it in the top app bar next to other secondary buttons, the M3 Expressive design heightened the visual signifiers, making the primary interaction a large, explicitly contained and contrasted button, placed just above the keyboard.

Users discovered the send button four times faster in the Expressive redesign.

A side-by-side comparison showing two versions of an email drafting screen
Two versions of a concept email app Google used in its testing. (Better, Easier, 2025)

That’s a significant improvement, and it demonstrates just how much more of an additional cognitive load was added by the flatter information architecture and reduced visual signifiers that flat design boasted. The benefits also extended beyond fixation time: across all the Expressive design apps tested, the time users took to tap on the key action actually decreased by seconds.

The key takeaway isn’t only that Google’s M3E designs are better, but that the research was right: flattening an interface too much results in decreased ease of scanning, and hesitancy about where to click.

Age gaps flattened

As we’ve seen, digital products usually exhibit a measurable performance difference between younger and older users. Older age groups take longer to identify key UI elements, while younger users can often pick up on subtle design cues which allow them to identify key actions much faster.

So perhaps the most important finding from Google’s research is that their Expressive design tactics have resulted in a dramatic erasure of this gap in performance:

Line graph showing that UI elements were spotted faster (in seconds) in expressive designs across all age groups
Chart of M3 vs M3E fixation times per age group. (Better, Easier, 2025)

Yet M3E not just about trying to help older users become digital natives. With this update, the Google Design team has acknowledged that visual signifiers do cognitive work that benefits all users. Strategically applied shading, borders and containment are hallmarks of good design, not just visual flair for the sake of visual flair.

Strategically applied shading, borders and containment are hallmarks of good design, not just visual flair for the sake of visual flair.

Conclusion: The return of colour

The MD team obviously aren’t high on nostalgia for skeuomorphism. They aren’t bringing back wood panelling, glass sheen or yellow note paper textures — they’re bringing back functional signifiers, the visual cues that help users identify interactive elements and allow them to understand the information architecture at a glance. M3E is a data-driven correction to the problems of flat design that researchers have noted for more than a decade.

Mind you, the update isn’t perfect. The two new wavy progress indicators, while a lovely idea, do look a bit like a shuffling worm and a wobbly intestinal tract. You be the judge:

Animation of linear and circular purple progress indicators showing determinate progress and indeterminate progress
M3E’s new earthworm & human intestine indicators. (Progress indicators, 2025)

It’s probably not a coincidence that M3 Expressive comes at a time when it seems like the whole world is retreating from minimalism: style, buildings, design everywhere, just look around! Vogue Australia’s guide to 2025’s interior design trends even reads like it could be a pitch for M3E — ‘express yourself,’ ‘bolder is better,’ ‘the return of colour.’

This is the line us UX designers must tread. Trends, to a certain extent, allow us to identify what users are familiar with, what they might find the most ‘modern’ or appealing.

But an app isn’t a house. It’s a 2D tool, projected on a crystalline display, that solves a problem for a user, and I would argue the aesthetic choices of our 2D tools may have far more of a knock-on effect on usability scores than aesthetic interior design choices do. Perhaps it’s because we interact with our apps with the minutia of fingers and eyes alone, rather than the full-body experience of a house. Or perhaps it’s just discipline tunnel vision.

The research — from NN/g’s heatmaps to Google’s 18,000-person studies — has definitively shown that blindly following popular trends (i.e. flat design) without studying the utility impact can do far more harm than good.

As designers, we should never have let ourselves be satisfied with the assumption that, since many users have become familiar with general interface patterns, we can afford to go totally minimalist in our approach to content, layout and signifiers. Conventions are a powerful and necessary tool, and designers should always aim to leverage a users’ existing knowledge. But there are limits to every law. UI design, particularly for products used by a broad range of ages like Android, should be able to articulate itself for every user, offering clarity of function as well as simple form.

Rather than let their design guidelines enter a phase of rampant design cacophony, Google have chosen to build on the years of usability research accumulated since flat design’s inception. It’s an incredibly encouraging development.

On one last point — although this article is primarily about the research trail from the earliest flat design studies to M3E — it would be remiss of me not to note M3E’s exciting new aesthetic possibilities. In a culture when users are becoming increasingly bored with minimalist trends, interfaces injected with additional artistic intent and emotional appeal have the potential to stand out from the bland, unexciting competition.

The keywords of M3 Expressive — delight, joy, playfulness, modernity — are exciting for designers and users alike, but these touches must be applied with intent, skill and strategy, always testing with that age-old question, so often lost in translation: ‘does this improve the end user experience?

Sources

Better, Easier, Emotional UX. (2025, May). Google Design. https://design.google/library/expressive-material-design-google-research

Budiu, R. (2025, October 10). Liquid Glass Is Cracked, and Usability Suffers in iOS 26. Nielsen Norman Group. https://www.nngroup.com/articles/liquid-glass/

Burmistrov, I., Zlokazova, T., Izmalkova, A., & Leonova, A. (2015). Flat Design vs Traditional Design: Comparative Experimental Study. In M. Fetter, P. Palanque, T. Gross, J. Abascal, M. Winckler, & S. Barbosa (Eds.), Human-Computer Interaction — INTERACT 2015 (Vol. 9297, pp. 106–114). Springer International Publishing AG. https://doi.org/10.1007/978-3-319-22668-2_10

Google Design. (2025, May 14). Introducing: Material 3 Expressive. YouTube. https://www.youtube.com/watch?v=n17dnMChX14

Li, A. (2025, July 31). Google One Material 3 Expressive redesign drops the graphics. 9To5Google. https://9to5google.com/2025/07/31/google-one-material-3-expressive/

Loranger, H. (2015, March 8). Beyond Blue Links: Making Clickable Elements Recognizable. Nielsen Norman Group. https://www.nngroup.com/articles/clickable-elements/

Lücken, M., Bruder, G., Steinicke, F. (2015). Evaluation von Buttons im Kontext des Gestaltungsstils Flat Design [Evaluation of Buttons in the Context of the Flat Design Style]. In M. Pielot, S. Diefenbach & N. Henze (Ed.), Mensch und Computer 2015 — Tagungsband (pp. 307–310). Berlin, München, Boston: De Gruyter. https://doi.org/10.1515/9783110443929-039

Moran, K. (2015, September 27). Long-Term Exposure to Flat Design: How the Trend Slowly Decreases User Efficiency. Nielsen Norman Group. https://www.nngroup.com/articles/flat-design-long-exposure/

Moran, K. (2015, September 27). Flat Design: Its Origins, Its Problems, and Why Flat 2.0 Is Better for Users. Nielsen Norman Group. https://www.nngroup.com/articles/flat-design/

Moran, K. (2017, September 3). Flat UI Elements Attract Less Attention and Cause Uncertainty. Nielsen Norman Group. https://www.nngroup.com/articles/flat-ui-less-attention-cause-uncertainty/

Moran, K. (2017, October 15). Response to Criticisms of Flat-Design Eyetracking Study. Nielsen Norman Group. https://www.nngroup.com/articles/response-criticisms-flat-design/

Moss, C. (2013, September 18). 23 Side-By-Side Comparisons Of How Apple’s New iPhone Software Will Change Your Favorite Apps. Business Insider. https://www.businessinsider.com/ios-6-versus-ios-7-apps-2013-9

Nielsen, J. (2012, November 19). Flat Design: Its Origins, Its Problems, and Why Flat 2.0 Is Better for Users. Nielsen Norman Group. https://www.nngroup.com/articles/windows-8-disappointing-usability/

Norman, D. (2008, November 17). Affordances and Design. JND. https://jnd.org/affordances-and-design/

Norman, D. (2008, November 17). Signifiers, not affordances. JND. https://jnd.org/signifiers-not-affordances/

Progress indicators. (2025). Material 3 Components. https://m3.material.io/components/progress-indicators/guidelines

Sassall, Y. (2024, November 14). The 15 design trends you’ll be in seeing in 2025 and beyond. Vogue Australia. https://www.vogue.com.au/vogue-living/design/decor-trends-2025/image-gallery/8a0c4e8a1db9042a17cd6a8eec7e9112

Simons, H. & AssembleDebug. (2025, June 30). Gmail is getting even more Material 3 Expressive UI changes (APK teardown). https://www.androidauthority.com/gmail-expressive-redesign-apk-teardown-3572169/

Spiliotopoulos, K., Rigou, M., & Sirmakessis, S. (2018). A Comparative Study of Skeuomorphic and Flat Design from a UX Perspective. Multimodal Technologies and Interaction, 2(2), 31. https://doi.org/10.3390/mti2020031

Start building with Material 3 Expressive. (2025, May 13). Material 3 Blog. https://m3.material.io/blog/building-with-m3-expressive

Thornley, N., Simpson, B., Feldman, J., Gilbert, M. (2024, May 13). What does your UI say to your users?. Material 3 Blog. https://m3.material.io/blog/testing-material-3

Urbano, I. C. V. P., Guerreiro, J. P. V., & Nicolau, H. M. A. A. (2022). From skeuomorphism to flat design: age-related differences in performance and aesthetic perceptions. Behaviour & Information Technology, 41(3), 452–467. https://doi.org/10.1080/0144929X.2020.1814867


Material 3 Expressive: Building on the failures of flat design was originally published in UX Collective on Medium, where people are continuing the conversation by highlighting and responding to this story.

 

This post first appeared on Read More