A typical flow of a gallery app that changes the Shared Element after a Window Transition.

🌄 How did I get there?

Many apps that use images has some kind of feature to pick images from a gallery in order to add them in the app.

You can choose to use a default Intent to pick image and pray for user having some gallery app that resolves that Intent (usually all manufacturer have a default gallery app embedded).

And when you have to pick more than one image?

In most of case you don’t have an embedded solution or you have different user experiences that differ per app…

And when you have the same feature in more and more projects?

It’s better to build a library to do this. …

Image for post
Image for post

How to apply meaningful and delightful motion in a sample Android app

According to Material Design specs:

“Motion design can effectively guide the user’s attention in ways that both inform and delight. Use motion to smoothly transport users between navigational contexts, explain changes in the arrangement of elements on a screen, and reinforce element hierarchy.”

The app mustn’t let the user lose the focus on the content during animations. There’s a post from John Sherwin saying there are two kinds of animation: the ‘sparkle animation’ and the ‘obvious animation’:

“Sparkle animations are cool to look at, but generally pull our attention away from content or important tasks.”

“Obvious animations are exactly what they sound like! They… obey the laws of physics by accelerating, moving and then decelerating in a way that seems natural to us. It’s so natural that to an average user they become almost invisible.”

Image for post
Image for post
Imagem do Google

Como criar ícones animados através de imagens vetoriais que irão incrementar a experiência do usuário a partir do Android Lollipop

De acordo com as especificações do Material Design:

“Animações podem existir dentro de todos os componentes de um aplicativo e em todas as escalas, desde ícones detalhados a transições-chave e ações.”

Um ícone de menu que suavemente se transforma em uma seta serve para duas funções: informar ao usuário e fasciná-lo quando uma animação é usada além do óbvio.

Image for post
Image for post
Ícone de menu que se transforma em uma seta. GIF do Material Design specs


André Mion

🇧🇷 Android Engineer living in 🇵🇹 • Full time Husband and Dad • Occasionally Drummer and Inline Skater… I write mostly about Android and Tech…

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store