Judge an App by its icon

Judge an App by its icon

Android and launcher (homescreen) icons: as with everything, it’s a lot more complicated than you’d think, once you look into it. But it’s not so complicated that I cannot run you through it in a few minutes! If you want to know all the latest news on the matter, do join.

This is aimed at designers, but with an hands-on approach.

Agenda:
* What is an Android launcher?
* The ways of the past: free for all, but also squares, but also any shapes
* The ways of the present: shortcuts and circles, pretty much, unless other shapes
* The ways of the future: adaptive icons

For each of the “ways” we’ll have a few tips and tricks and examples of how you’d set them up. The end goal is to have a sample project which has a few examples of all the aforementioned things, and a sample project that you can check out for reference.

-----

Hack & Tell presented at Novoda -> http://novoda.tv
Video: https://www.youtube.com/watch?v=CLV9HvubgIY

4580c218737149bf44d012a110612010?s=128

Sebastiano Poggi

July 12, 2017
Tweet

Transcript

  1. Sebastiano Poggi Novoda, Android & Identity GDE JUDGE AN APP

    BY ITS ICON #berthaisback
  2. What’s a launcher anyway?

  3. launcher homescree

  4. launcher homescreen

  5. app drawer

  6. pre-4.0 doesn’t exist

  7. our example

  8. meet Be"ha

  9. Old-school icon No background* Baked-in shadow & padding No vectors

    nor webp
  10. Round icon Has background Baked-in shadow No vectors nor webp

  11. Adaptive icon

  12. Adaptive icon

  13. Adaptive icon

  14. Adaptive icon

  15. Adaptive icon

  16. Has background Dynamic masking Can use vectors ! Adaptive icon

  17. it’s all about the layers

  18. it’s all about the layers

  19. None
  20. None
  21. Nick Butcher’s Adaptive Icons demo app

  22. None
  23. None
  24. None
  25. Has background Dynamic masking Can use vectors ! Adaptive icon

    Legacy icons Round icons Adaptive icons up to Android 7.0 from Android 7.1 from Android 8.0
  26. Legacy icons Round icons Adaptive icons up to Android 7.0

    from Android 7.1 from Android 8.0
  27. None
  28. from Android 7.1 Launcher sho"cuts

  29. Round icons Adaptive icons 7.1 only 8.0+

  30. h#ps://goo.gl/5KPtjV (pa" 1) and onwards Resources Nick Butcher’s Adaptive Icons

    on Medium h#ps://www.novoda.com/blog/exploring-android-nougat-7-1-app-sho"cuts/ Andrei’s App Sho"cuts on Novoda Blog h#ps://github.com/rock3r/launcher-icon Be"ha example project on GitHub Man Doubting created by Dooder - freepik.com Be"ha icon derived from Cornecoba - freepik.com
  31. …questions?