Why Material Design?5:04 with Anwar Montasir
While Material Design could be called a design system, it’s a bit different from others you might have seen.
While Material Design could be called a design system, 0:00 it's a bit different from others you might have seen. 0:04 If you're building an app for Adobe, it's expected that you'll 0:08 strictly follow the guidelines from Adobe's Spectrum design system. 0:12 You'll use the specified fonts, colors, 0:16 spacing, and usability cues. 0:28 It's critical that your app reflect Adobe's branding, and 0:31 the app contents must speak in a manner consistent with Adobe's voice and tone. 0:36 If you're unfamiliar with how design systems traditionally work, check out 0:42 our Introduction to Design Systems course linked in the teacher's notes. 0:47 Material Design doesn't work in quite the same way. 0:53 Let's say you're designing a mobile app to be sold in the Google Play app store. 0:57 Perhaps it's a recipe app for a cooking magazine. 1:02 While it's possible you'll make a reference to certain aspects of Material 1:04 Design, you wouldn't necessarily follow it as a visual style guide. 1:09 After all, the design of the recipe app should reflect 1:14 the brand of the cooking magazine, not Google. 1:18 Here are a few apps selected by Google as 2019 Material Design Award winners. 1:22 A stress and anxiety management app called Reflectly. 1:30 An app for learning letter forms in a variety of international languages, 1:35 called Scripts. 1:40 And a travel planning application belonging to the website Trip.com. 1:41 And while these apps share certain design traits and 1:47 behaviors, they also look relatively unique compared to one another. 1:50 In 2018, Google added a term called Flexible Foundation to its list 1:57 of design principles to reinforce the idea that the number one goal of Material 2:03 Design is creating predictable user experiences with predictable interactions. 2:08 It's not about making Android apps look identical. 2:15 Unlike design systems that specify brand guidelines, 2:20 using Material Design is optional. 2:24 The Google Play Store won't reject a design for 2:27 failing to apply the Material Design visual language. 2:30 The store will reject an app, however, 2:34 if certain usability expectations are not met. 2:36 For example, the Back button in an Android app allows users to 2:41 navigate recently viewed screens in reverse chronological order. 2:46 Assigning unexpected actions to this button would be confusing 2:51 to Android users anticipating one predictable behavior. 2:56 I've included a link in the teacher's notes to a list of core app quality 3:01 requirements, listing usability guidelines that must be followed in any Android app. 3:06 Thinking about usability brings us to the key benefit of using the Material 3:13 Design documentation: understanding user expectations. 3:18 The apps built into an Android phone, such as Gmail and 3:24 the Photo Viewer, follow Material Design specifications. 3:28 And a good percentage of the apps in the Google Play Store do as well. 3:33 As a result, Android users feel familiar with interactive components 3:37 native to Material Design. 3:42 Let's look at the Gmail app as an example. 3:45 The most prominent interactive element is the Floating Action Button 3:48 in the lower right-hand corner. 3:52 Which, from this screen, allows me to compose a new message. 3:54 Tapping the menu icon in the upper left opens a navigation drawer, 3:59 from which I can navigate to different email folders. 4:04 Everything about these components, their structure and 4:08 design, the shadows they cast, the speed of their animations, 4:11 follows principles outlined in the Material Design documentation. 4:16 If you're building an app to be sold in the Google Play Store, 4:21 it's not expected that you make an app that looks like Gmail. 4:25 However, you should study the Material Design docs 4:29 to get a sense of what behavior and interactions Android users are used to. 4:33 And if an interactive pattern like a Floating Action Button or 4:38 navigation drawer is right for your content, 4:42 you need to understand the dos and don'ts for implementing each pattern. 4:45 Getting to know Material Design starts with understanding the virtual materials 4:50 that inform the appearance and behavior of Google's design language. 4:56 We'll examine these materials in our next video. 5:01
You need to sign up for Treehouse in order to download course files.Sign up