Material Design: Uma olhada no design da web atual

Já se passaram quase dois anos desde que o Google desenvolveu e anunciou na conferência Google I / O o projeto de material como um regulamento de design que viria a ser implementado e que embora num primeiro momento se centrasse na reprodução de conteúdos no sistema operativo Android, pretendia-se tornar uma tendência na web e em qualquer plataforma, o que hoje podemos confirmar. Embora ocasionalmente o tenhamos mencionado, a verdade é que nunca paramos para ver essa codificação em profundidade, por isso hoje vamos revisar seus princípios e seus traços mais característicos.

Quais são as características definidoras do material design? O que isso tem a ver com o movimento Flat Design?

O que dizer dessa tendência do web design?

Seu nome vem do sentido mais prático, a matéria ou os materiais precisam ser organizados e estruturados da forma mais eficiente possível e você se concentrará nisso. Este movimento visa acima de tudo flexibilidade, ergonomia e capacidade de dobrar e simplificar a construção de um site. Mas não só a dimensão espacial vai ocupar um lugar importante, mas também a do tempo, pois agora os elementos vão ocupar certas posições em determinados momentos, ou seja, o dinamismo também será um fator chave. Além disso, esses fatores serão inescapavelmente guiados pelo intelecto e pela lógica, o que acaba levando a uma busca pelo realismo e pela representação espacial da matéria física, na verdade leva em conta as leis da física e com ela os elementos (imagens, botões, painéis ...) não podem se cruzar porque têm maior peso e densidade visual, em vez disso, o que farão é sobrepor-se.

Ordem, clareza, legibilidade

Todos estes princípios decorrem naturalmente da forma como os componentes gráficos são geridos e distribuídos, incluindo a tipografia, que será sobretudo uma solução legível, a estrutura textual será convencional e fluida, a hierarquia visual motivada pela utilização de mais ou tons menos fortes gerando contrastes que também serão matizados de acordo com o tamanho e a ordem.

Iluminação e realismo

A lógica manifesta-se sobretudo no uso de efeitos de iluminação e na gestão de luzes e sombras. A iluminação é um grande indicador de proximidade, relevância e situação, pelo que esta se tornará uma ferramenta fundamental para influenciar essa hierarquia de que falávamos. Agora, botões, imagens e todos os elementos terão sombras que indicarão o grau de proximidade e nos ajudarão a nos posicionar no palco web.

O movimento é a ferramenta mais eficaz para captar a atenção e guiar o observador

Sua linguagem será óbvia, gráfica e esclarecedora aos olhos do usuário. Ao escolher uma opção ou ferramenta, ela se aproximará de nós, ampliando suas dimensões e vice-versa quando deixarmos de usá-la. Além disso, um item mudará de cor ou piscará se for absolutamente necessário para atrair nossa atenção.

Ritmo, ordem, linguagem

Não esqueçamos que, no fundo, estamos falando em um modo de discurso. Percorremos os recursos que o web design nos oferece e, portanto, todos os parâmetros técnico-expressivos têm um significado: desde a ordem de aparecimento, por exemplo primeiro as imagens e depois os botões flutuantes, até a velocidade com que aparecem, em que direção eles fazem isso e para que fim se movem. Tudo isso é importante porque não só o usuário é indicado de onde vem a informação, mas também a viagem é facilitada, os elementos são arranjados de forma a tornar o processo de leitura intuitivo, fácil e agradável. Sem dúvida, animação e dinamismo são pilares básicos.

Codificação ilimitada

Todos esses princípios ou padrões que estamos revisando são projetados e desenvolvidos para implementação em qualquer meio e plataforma, independentemente de sua natureza e do tamanho da tela que apresenta. De telefones celulares, tablets ou computadores. Todos os suportes e destinos possíveis suportam esta linguagem visual e de facto a sua transversalidade e compatibilidade é um dos seus ingredientes essenciais.

Design plano não é o mesmo que design de material

Embora compartilhem muitos pontos em comum, como o compromisso com o minimalismo mais retumbante, também existem enormes diferenças entre os dois códigos. Porém, eles não são incompatíveis e certamente podem ser perfeitamente combinados para obter os melhores acabamentos, mas falaremos disso em um post posterior.