Skip to main content

Google updates Material Design to work better on large screens ahead of I/O 2021 push

Ahead of I/O 2021 next week, Google has updated Material Design to expand its “adaptive capabilities to help prepare your apps for all form factors,” namely large screens. Most developers today are focused on phones, but the company is specifically looking at tablets and desktops. This takes the form of new guidance and design documents, as well as updated components. 

The goal is to make it easy for apps to “scale and adapt while maintaining consistent layouts using components optimized for each device.” 

As a system capability, layout and component responsiveness are now baked into our Material guidelines. Our layout guidance, along with components and their design documentation, have all been updated to describe a method of creating interfaces that can adapt to changes in screen size and shape.

Google begins by explaining the fundamentals of layout, starting with the three primary aspects of a Material app: body, navigation, and app bars. There’s guidance on how to work on large screens, given “more space available to display content and actions.” The “Responsive layout grid” and “Component behavior” documents have also been updated.

Meanwhile, the components themselves have been updated to better scale and adapt, with guidance available in each article. The full list of what’s changed is below, while the navigation rail (as seen on photos.google.com today) has been updated and is available on Android (1.4.0-beta release), in addition to Flutter.

Google has also updated the Material Baseline Design Kit on Figma. More will be shared at I/O 2021, with sessions from the Material Design team about large screens:

FTC: We use income earning auto affiliate links. More.

You’re reading 9to5Google — experts who break news about Google and its surrounding ecosystem, day after day. Be sure to check out our homepage for all the latest news, and follow 9to5Google on Twitter, Facebook, and LinkedIn to stay in the loop. Don’t know where to start? Check out our exclusive stories, reviews, how-tos, and subscribe to our YouTube channel

Comments

Author

Avatar for Abner Li Abner Li

Editor-in-chief. Interested in the minutiae of Google and Alphabet. Tips/talk: abner@9to5g.com