51

Android adaptive icon templates for Photoshop, Sketch, Illustrator, Affinity Designer

over 6 years ago from , Founder at Bjango

I’ve created some templates for the new Android O adaptive icons. Adaptive icons are pretty different to the current Android app icons. Adaptive icons are masked by the launcher, the mask can be a range of shapes, and the icons now have two layers to assist with animation and open up more possibilities for their use.

The templates are available for Photoshop, Sketch, Illustrator and Affinity Designer. All free and open source under the BSD license (do whatcha like).

Please let me know if you have any questions. Feedback welcome.

Android adaptive icon templates

4 comments

  • Jesus GallentJesus Gallent, over 6 years ago

    Thanks Marc, good work!

    1 point
  • Raphael Lopes, over 6 years ago

    Thank you so much Marc! Your help for the community is always huge and it's very welcome!

    When Google say: "The system reserves the outer 36 dp on each of the 4 sides to create interesting visual effects, such as parallax or pulsing".

    In your opinion, what Google is planning by saying "interesting visual effects, such as parallax or pulsing"? Some kind of notification in the icon?

    Tks a lot again! :)

    1 point
    • Marc EdwardsMarc Edwards, over 6 years ago

      Not a problem at all. :) Please let me know if you spot anything incorrect or confusing in the templates.

      36dp is tons of padding, so I think they’re just giving themselves lots of room to do cool things. Zooming and panning could definitely use the extra space.

      These examples show the ability off well:

      Some other random ideas they could be used for:

      • Sample a colour from the background to use in other parts of the UI, explicitly knowing it’s a background colour (something you can’t do if it’s a single layer).
      • Fading in the foreground first, then the background behind it as a transition effect.
      • Allow an update to just the foreground image, and keep the background static while the top of the icon changes with a push effect.
      • Some kind of bounce effect for notifications, where the foreground and background jump out of time (think macOS Dock bounce, but a bit more fun).

      I think they just want to keep their options open, and this new icon format should serve them well for the future.

      3 points