Técnico

Ícones de Diálogo (Dialog Icons)

Se tem algo que estou certo é que a Guideline do Android não é seguida. Quer seja porque existe flexibilidade, quer seja porque muitos nem a conheçam ou acreditem na sua existência.

Continuo postando alguns detalhes, simples, sobre a Guideline dos ícones, e já percebi que alguns a acharam complicada, isso porque quem tem buscado mais a respeito disso tem sido os desenvolvedores, me pergunto até agora porque designers ainda não se encantaram com o Android. Existe e vai existir em breve uma carência por designers que entendam de intefaces para Android, isso porque por hora alguns leigos estão se aventurando a criar interfaces para apps Android (o motivo de diversas apps com interfaces horríveis). Pense nisso.

Bom, vamos ao tópico, Ícones de diálogo são mostrados em caixas de diálogo “pop-up” que alertam o usuário para algum tipo de interação. Eles usam um gradiente de luz e sombra interior, a fim de destacar-se contra um fundo escuro.

Conforme descrito no fornecimento de conjuntos específicos da resolução (ou densidade como geralmente aparece na Guideline) do ícone, você deve criar conjuntos de ícones separados para as telas de baixa,  média, e alta densidade. Isso garante que seus ícones serão exibidos corretamente em toda gama de dispositivos em que o aplicativo pode ser instalado. Ver novamente, eternamente, a Tabela 1.

Como diz o bom ditado, recordar é viver, veja no tipo de ícones a resolução para o ícone de diálogo.

Baixa 24 x 24

Média 32 x32

Alta 48 x48

É impressionante como essa Guideline é quase como uma lavagem cerebral, as diferenças são mínimas, mas é sempre repetida a mesma coisa, como se fosse até mesmo voltado a desenvolvedores, pois me pergunto se vale a pena dizer novamente a um designer a frase:

“Lembre-se de exportar o arquivo como png e com fundo transparente”.

É perigoso alguém me xingar de tanto que repito isso, mas a Guideline repete isso sempre, a cada explicação de ícone, e reforço, me parece que foi escrita para desenvolvedor, devida a sua simplicidade e sua repetição de coisas óbvias.

Todas as versões do Android

As diretrizes a seguir descrevem como criar ícones de diálogo para todas as versões da plataforma Android.

Estrutura
Ícones de diálogo tem um safeframe de 1 pixel. A forma base deve caber dentro do safeframe, mas o anti-alias de uma forma redonda podem se sobrepor ao safeframe, recorda-se de como é? Acredito que sim.
Todas as dimensões especificadas nesta página são baseados em um tamanho de 32×32 pixels em um stage do tipo Photoshop. Mantenha um pixel de preenchimento ao redor da caixa delimitadora dentro do modelo do Photoshop.

O que? Como? Não entendi.

Avalie a imagem, abaixo, o gradiente, o preenchimento, e o safeframe verde escuro.

Luz, efeitos e sombras

Ícones de diálogo são planos e vistos de frente. A fim de destacar-se contra um fundo escuro, eles são construídos utilizando-se um gradiente de luz e sombra interna.

Passo a passo

Criar as formas básicas usando uma ferramenta como o Adobe Illustrator ou Fireworks.
Importar a forma em uma ferramenta como o Adobe Photoshop e redimensionar a imagem para 32×32 px em um fundo transparente.
Adicionar os efeitos observados na Figura 2.
Exportar o ícone de 32×32 como um arquivo PNG com transparência (é repetir demais?)

4 Comments

  • Fernando Valentini disse:

    É realmente para nós que estamos mais no mundo do design é um tanto que repetitivo, mas o importante para mim é que estou aprendendo muito sobre essas guidelines para Android gostaria que a Adobe tivesse lançado algo assim para RIA’s se é que não criou e eu não saiba. E cara se depois puder responder aquele email ficarei muito grato. Gostaria de dizer que entendo a correria que você deve estar. Abraços e feliz ano novo para vc e a equipe DClick!

  • Eduardo Horvath disse:

    Pô verdade, ainda não te respondi, mals, correria de final de ano. Essa semana te respondo…

  • Vinicius Malveste disse:

    Boa tarde, Este post teve alguma atualização? Digo, na tabela tem apenas 3 tamanhos de resolução, LDPI, MDPI E HDPI, porém hoje tem a resolução XHDPI, voce tem alguma outra tabela desse tipo?

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

Compartilhe isso: