1. Uso "desequilibrado" do espaço
O espaço pode ter uma enorme influência em um projeto de design. Ela afeta o fluxo visual e pode gerar engajamento.
Ultimamente, muitos projetos adotaram uma abordagem mais equilibrada e simétrica ao uso do espaço, mas isso está mudando novamente com mais sites que apresentam um uso "desequilibrado" do espaço. (E é muito bom.)
Estamos chamando essa tendência de "desequilibrada", porque o espaço aberto pode ou não usar um contrapeso para impedir que o design pareça desequilibrado. Existem várias maneiras diferentes de fazê-lo: com espaço em branco, em imagens, com camadas e como os elementos são empilhados e com padrões. Essa pode ser uma técnica bastante desafiadora, pois os pontos de interrupção responsivos podem mudar drasticamente a aparência do espaço se você não tomar cuidado.
Cada um desses projetos aborda o espaço "desequilibrado" de uma maneira diferente e igualmente elegante.
O Yukon 1000 cria dois bits diferentes de espaço desequilibrado de duas maneiras diferentes:
- No lado esquerdo da tela, com espaço em branco de fundo para o qual a imagem não se estende e inclui camadas de texto.
- Na imagem em si com uma forma distinta e muito espaço aberto na água.
Ambos os elementos são desequilibrados quando estão sozinhos, mas combinados o espaço aberto à esquerda e o espaço aberto na imagem puxam o olho de volta para a área de conteúdo intermediária do design.
O site Art of Tea usa espaço na imagem com um bom empilhamento e o uso de formas no posicionamento de objetos em um espaço desequilibrado. Observe como o lado esquerdo da imagem é comparado com a desolação do lado direito. Até o texto se estende apenas parcialmente.
Essa estética ajuda a atrair os olhos pela tela para ler o texto e depois passar o rolo de papel.
O Growcase pode ser um estudo de caso no uso do espaço em si, mas com foco na parte superior da tela. A identidade da marca se estende por cerca de um terço do caminho e é alcançada por nada além de um pequeno trio de links de mídia social / portfólio.
Também há muito espaço abaixo e espaços negativos em cada um dos blocos do portfólio. As áreas em preto o guiam pelo design, esteja você pronto para movê-lo ou não.
2. Novos conceitos do controle deslizante de imagem
Faz tanto tempo que os designers de sites praticamente declararam que os sliders estavam mortos.
Eles voltaram.
Mas eles parecem muito diferentes e são muito mais interessantes.
A tendência no design de slider é usar elementos deslizantes com animações e formas interessantes que não se parecem com sliders. O interessante são os pontos em comum entre eles - mesmo que pareçam espetacularmente diferentes.
Cada um desses exemplos de controle deslizante:
- Usa um ponteiro de círculo que se expande quando você passa o mouse sobre um elemento de clique
- Dicas visuais, como setas de navegação, estão presentes
- Cada site apresenta algum tipo de conteúdo do portfólio
- As imagens do controle deslizante podem ficar isoladas e não são cobertas com palavras ou outros elementos
Além disso, cada exemplo possui alguns truques divertidos.
O Clarity usa um controle deslizante que se move automaticamente com base na posição do mouse e em todas as imagens, dentro do quadro do círculo.
O Revise Concept também usa um controle deslizante de rolagem automática com imagens que se movem na diagonal. Você também pode usar as setas para rolar para frente e para trás por conta própria.
O Prezman apenas visualiza o controle deslizante na página inicial, mas clique sobre ele e ele se expande para tela cheia para mostrar uma variedade de partes do portfólio com animação simples, mas elegante.
3. Dados do Coronavírus
O sinal mais óbvio do coronavírus no design do site é o número de sites que contêm informações sobre o vírus. As tendências parecem ser designs de sites que fornecem diferentes tipos de visualizações de dados sobre o COVID-19.
O Google tem uma página (simples no formato real do Google), mas esses exemplos levam os dados a novos níveis visuais. As visualizações de dados variam nos dados apresentados - local versus mundial - e na forma como as informações são reunidas.
Embora todos esses sites tenham finalidades distintas, eles fornecem bons exemplos de como lidar com grandes quantidades de dados em um formato visual.
O Coronavirus Now pega uma variedade de dados e usa potes virtuais de bolas para mostrar relações proporcionais entre três pontos de dados. O que é realmente interessante nesse design é o uso de animação e rotulagem para tornar os dados compreensíveis.
O Painel de dados global COVID-19 divide informações e pontos de dados diferentes em vários tipos de gráficos - barra, círculo e muito mais. O uso de visualizações diferentes pode facilitar para as pessoas que entendem e compreendem os dados de maneiras diferentes para entender melhor as informações.
O Mapa de Índice de Vulnerabilidade da Comunidade COVID-19 usa um sistema de mapeamento para mostrar onde possíveis surtos. O uso de dados do mapa pode ser uma maneira mais compreensível de visualizar dados complicados.
Conclusão
Embora duas dessas tendências de design de sites não tenham nada a ver com o coronavírus, começaremos a ver mais coisas que são influenciadas por esse problema de saúde em todo o mundo. Preste atenção e é provável que o design comece a mudar para elementos com menos grupos grandes de pessoas, o uso de máscara facial e as imagens sejam mais comuns, e mesmo as cores podem desbotar em tons mais suaves. Já estamos vendo o impacto no design e é provável que continue a influenciar as tendências.