Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

ABC2018 Autumn: Android PIe UI Design

400 views

Published on

Android Bazaar and Conference 2018 Autumn in Kawasaki: 「Android Pie時代のUIデザイン」発表資料(2018年10月13日、川崎市産業振興会館)
https://abc.android-group.jp/2018a/

Published in: Design
  • Be the first to comment

ABC2018 Autumn: Android PIe UI Design

  1. 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. 2. 佐藤 伸哉(@nobsato) 株式会社シークレットラボ 代表取締役/エクスペリエンスデザイナー Google Developers Expert (Product Design) Google certified Sprint Master Google Sprint Master
  3. 3. 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
  4. 4. 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
  5. 5. Android Pie UI Design #1 Android Pie UI is Google original Material Theme Android Pie UIは、Google独自のマテリアルシーミング
  6. 6. 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.
  7. 7. 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を使う
  8. 8. Google
  9. 9. Android Pie UI Design #3 New navigational UI Hierarchy with more simplify and subtle elements. よりシンプルでめただなくしたUI要素と 新しいUIの階層構造
  10. 10. Settings
  11. 11. Digital Wellbeing
  12. 12. Android Pie UI Design #4 Rise of dark theme. ダークテーマ対応
  13. 13. Goole News YouTube
  14. 14. 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に対応した最新のアプリ例
  15. 15. New redesigned Gmail Source: Ars Technica,
  16. 16. Optional: Material Theme Editor Customize your own brand with Material Theme Editor Material Theme EditorでMaterialデザインを独自ブランドにカスタマイズ
  17. 17. Material Theming … ability to systematically customize Material theme with Colors, Types, Shapes and Icons
  18. 18. 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.
  19. 19. 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?
  20. 20. Nobuya Sato / @nobsato Secret Lab, Inc. www.secret-lab.jp Thank You

×