ABC2018 Autumn: Android PIe UI Design
•
2 likes•1,104 views
This document discusses Android Pie UI design. It provides an overview of Android design history from Cupcake to Pie. It then discusses four key aspects of Android Pie UI design: 1) It uses Google's original Material Theme, 2) It utilizes a bottom app bar and bottom sheets instead of an app bar and hamburger menu, 3) It has a new navigational hierarchy with more simplified and subtle elements, and 4) It supports dark themes. Examples of apps that follow the Android Pie design are also presented.
Recommended
More Related Content
What's hot
What's hot (9)
Similar to ABC2018 Autumn: Android PIe UI Design
Similar to ABC2018 Autumn: Android PIe UI Design (20)
More from Nobuya Sato
More from Nobuya Sato (20)
Recently uploaded
Recently uploaded (20)
ABC2018 Autumn: Android PIe UI Design
- 1. Android Pie UI Design Nobuya Sato / @nobsato Secret Lab, Inc. www.secret-lab.jp Android Bazaar and Conference 2018 Autum Android Pie時代のUIデザイン
- 2. 佐藤 伸哉（@nobsato） 株式会社シークレットラボ 代表取締役／エクスペリエンスデザイナー Google Developers Expert (Product Design) Google certified Sprint Master Google Sprint Master
- 6. Android Design History Cupcake 1.5 2009/04 Donut 1.6 2009/09 Eclair 2.0/2.1 2009/10 Froyo 2.2 2010/05 Gingerbread 2.3 2010/12 Honeycomb 3.0/3.1/3.2 2011/02 Ice Cream Sandwich 4.0 2011/10 Jelly Bean 4.1/4.2/4.3 2012/06 Lollipop 5.0/5.1 2014/11 Kitkat 4.4 2013/09
- 7. Android Design History gerbread 12 Honeycomb 3.0/3.1/3.2 2011/02 Ice Cream Sandwich 4.0 2011/10 Jelly Bean 4.1/4.2/4.3 2012/06 Lollipop 5.0/5.1 2014/11 Marshmallow 6.0 2015/10 Kitkat 4.4 2013/09 Nougat 7.0/7.1 2016/08 Oreo 8.0/8.1 2017/08 Pie 9.0 2018/09
- 11. Android Pie UI Design #1 Android Pie UI is Google original Material Theme Android Pie UIは、Google独自のマテリアルシーミング
- 12. How Google created a custom Material theme Product teams from Gmail, Google News, Google Pay, and Google Home detail how Material Theming creates a cohesive, branded experience — and a roadmap for future redesigns.
- 16. Android Pie UI Design #2 No more App Bar (and Hamburger Menu). Use Bottom App Bar + Bottom Sheets and/or Backdrop App BarとHamburgerメニューではなく、 Bottom App BarとBottom Sheets、そしてBackdropを使う
- 20. Google
- 21. Android Pie UI Design #3 New navigational UI Hierarchy with more simplify and subtle elements. よりシンプルでめただなくしたUI要素と 新しいUIの階層構造
- 23. Settings
- 25. Android Pie UI Design #4 Rise of dark theme. ダークテーマ対応
- 27. Android Pie UI Design exapmle Google original Material Theme (#1), Bottom App Bar + Bottom Sheet (#2) , more simplify and subtle UI (#3) and adaptive for dark theme (#4) Google独自のMaterial Designに対応した最新のアプリ例
- 29. New redesigned Gmail Source: Ars Technica,
- 30. Optional: Material Theme Editor Customize your own brand with Material Theme Editor Material Theme EditorでMaterialデザインを独自ブランドにカスタマイズ
- 31. Material Theming … ability to systematically customize Material theme with Colors, Types, Shapes and Icons
- 32. Material System … evolving adaptable design system Material is an adaptable design system - backed by open-source code - that helps you design and build beautiful digital experiences. Constantly updated tools, resources, and components are made specifically with designers and developers in mind.
- 33. Material Theme Editor Material Theming is the ability to systematically customize Material Design to better reflect your product’s brand. Plugin for Sketch Coming soon?
- 36. Nobuya Sato / @nobsato Secret Lab, Inc. www.secret-lab.jp Thank You