sexta-feira, 27 de junho de 2014

O que é Material Design presente no Android L? Entenda o novo conceito

Google apresentou na quarta-feira (25) no Google I/O uma versão antecipada do Android L, cujo design revelou ser também a nova linguagem visual adotada para todas as plataformas. Ao mudar a aparência noAndroid, no Drive, no Chrome e no Chrome OS, a novidade chamada “Material Design”, seguirá o mesmo estilo adotado em maio na última atualização do Google+.
A nova linha de design já promete inovar produtos como Google DriveGoogle Calendar e Gmail, contando com uma hierarquia simplificada, bastante cor e novos ícones e tipografias. A aposta é se inspirar em materiais e objetos do mundo real, que causam reflexos a quem os manuseia assim como a web deveria ser pensada.
Aparência do Google Calendar após mudanças nas plataformas do Google promovidas pelo Material Design (Foto: Reprodução/Google).
Aparência do Google Calendar após mudanças nas plataformas do Google promovidas pelo "Material Design" (Foto: Reprodução/Google).
Na prática, o novo layout vai contar com novidades como: interações em terceira dimensão; aplicação de um sistema de camadas, que pulam umas em frente às outras para separar e trazer novas informações; facilidades na transição entre aplicativos em plataformas móveis, como smartphones e tablets; mais animações e feedbacks por meio de comandos touch (sensíveis ao toque).
Para apresentar os princípios da linguagem visual, o Google disponibilizou alguns postais em kits impressos  entregues a participantes da conferência. Com um desenho simples e ilustrativo, os postais também continham legendas que explicavam cada um destes princípios. Confira:
Material é a metáfora
Metáfora material é a teoria que unifica espaço racional a um sistema em movimento. Nosso material é baseado em uma realidade tátil, inspirado em nosso estudo de papel e tinta e aberto à imaginação e à magia.
Primeiro princípio do Material Design: Material is the metaphor (Foto: Reprodução/Google).Primeiro princípio do "Material Design": Material is the metaphor (Foto: Reprodução/Google).
Superfícies são intuitivas e naturais
Superfícies e arestas fornecem pistas visuais que permeiam a nossa experiência da realidade. O uso de atributos táteis familiares dialoga com as partes mais primitivas do nosso cérebro, ajudando-nos a tomar dimensão das proporções.
Segundo princípio do Material Design: Surfaces are intuitive and natural (Foto: Reprodução/Google).Segundo princípio do "Material Design": Surfaces are intuitive and natural (Foto: Reprodução/Google).
Dimensão permite interação
Os fundamentos de luz, superfície e movimento são fundamentais para entender como os objetos interagem entre si. Uma iluminação realista destes objetos revela junções, separa espaços e indica as partes que podem ser movidas.
Terceiro princípio do Material Design: Dimensionality affords interaction (Foto: Reprodução/Google).Terceiro princípio do "Material Design": Dimensionality affords interaction (Foto: Reprodução/Google).
Um design adaptado
Um sistema de design único organiza os espaços e as interações. Cada elemento reflete uma visão diferente deste mesmo sistema. Toda forma de enxergar deve ser pensada sob medida para o tamanho e a interação adequada a cada dispositivo. Cores, iconografia, hierarquia e relações espaciais permanecem constantes.
Quarto princípio do Material Design: One adaptive design (Foto: Reprodução/Google).Quarto princípio do "Material Design": One adaptive design (Foto: Reprodução/Google).
O conteúdo é vivo, vigoroso e intencional
Design arrojado cria hierarquia, significado e foco. Escolhas específicas de cores, figuras de ponta a ponta, tipografia em larga escala e o uso de espaço negativo criam imersão e dão clareza.
Quinto princípio do Material Design: Content is bold, graphic, and intentional (Foto: Reprodução/Google).Quinto princípio do "Material Design": Content is bold, graphic, and intentional (Foto: Reprodução/Google).
Cores, superfície e iconografia enfatizam ações
As ações do usuário são a essência do Design de Experiência. Ações essenciais são pontos de inflexão que transformam todo o projeto. A ênfase neste aspecto faz com que uma função principal esteja imediatamente visível e se ligue a pontos de interesse do usuário.
Sexto princípio do Material Design: Color, surface, and iconography emphasize actions (Foto: Reprodução/Google).Sexto princípio do "Material Design": Color, surface, and iconography emphasize actions (Foto: Reprodução/Google).
Usuários iniciam transição
Trocas de interface derivam sua fonte de ações iniciadas pelos usuários. Animações que derivam do toque respeitam e reforçam o usuário como motor principal das transições.
Sétimo princípio do Material Design: Users initiate change (Foto: Reprodução/Google).Sétimo princípio do "Material Design": Users initiate change (Foto: Reprodução/Google).
Animação é coreografada em um palco compartilhado
Toda ação se passa em um único ambiente. Os objetos são apresentados ao usuário sem quebrar a continuidade da experiência, mesmo quando eles se transformam e se reorganizam entre si.
Oitavo princípio do Material Design: Animation is choreographed on a shared stage (Foto: Reprodução/Google).Oitavo princípio do "Material Design": Animation is choreographed on a shared stage (Foto: Reprodução/Google).
Movimento gera significado
Movimentos são significativos e adequados, servindo para concentrar a atenção e manter a continuidade. O feedback é sutil, mas perceptível. As transições são eficientes e coerentes.
Nono princípio do Material Design: Motion provides meaning (Foto: Reprodução/Paulo Finotti)Nono princípio do "Material Design": Motion provides meaning (Foto: Reprodução/Paulo Finotti)
Confira o vídeo que mostra uma prévia do Material Design. Mais informações podem ser lidas em inglês napágina oficial do projeto.

Via TNW, Tech Tudo.
Anterior
Proxima

Postador

0 comentários:

Os comentários serão moderados antes de publicar! respondo todos, obrigado por comentar.