Afastar brutalismo, há uma nova tendência de web design na cidade. Bem-vindo ao neubrutalismo de palco, que é uma combinação refrescante da tendência brutalista com a tendência moderna e minimalista que agracia nossas telas há muitos anos. Continue lendo para conhecer os principais recursos deste novo design, incluindo o que procurar, exemplos do mundo real, além de alguns modelos de web design inspirados em neubrutalistas de ThemeForest.
Ok, então o que realmente é o Neubrutalismo?
Amigos (ou inimigos) da tendência do brutalismo web design saberão que é um estilo que ganhou seu nome devido à sua afinidade com o brutalismo na arquitetura, ou seja, rejeita pompa decorativa e cerimônia em favor de superfícies ásperas, inacabadas, formas inusitadas, materiais sólidos , e pequenas características contrastantes. O Barbican de concreto pesado em Londres é um exemplo clássico de arquitetura brutalista.
Certamente não será do gosto de todos, mas o web design brutalista pode ser visto como rejeitando a web mais popular e mais suave e adotando formas duras, cruas ou desconfortáveis. Para ver mais exemplos de sites brutalistas, confira brutalistwebsites.com.
Inspiração
É difícil lá fora: um olhar sobre o brutalismo no web design
Ian Yates
O neubrutalismo leva as tendências recentes do site para o próximo nível – ele mantém sua vantagem ao combinar o estilo incomum com padrões mais modernos de animação, ilustração e texto. Embora o neubrutalismo seja um termo não oficial no momento, já está sendo falado no mundo do web design e é o tipo de coisa que pega, então é ótimo estar à frente da curva!
Se você é novo no neubrutalismo, aqui estão algumas características a serem observadas:
- Feia (é): Se você ama ou odeia esse estilo, ele adiciona variedade ao mínimo moderno estilo que tem sido popular por muitos anos. Neubrutalismo favorece imagens que parecem ‘um pouco fora’ – seja através de cores incomuns ou escolhas de design. Em última análise, chama a atenção por se destacar das tendências modernas de web design que vieram antes.
- Cores conflitantes: Esta é uma tendência de site que não tem medo de se destacar – as cores geralmente são conflitantes, mas suaves. Certamente não segue a filosofia ‘menos é mais’.
- Sem gradientes: Essa tem sido uma grande tendência nos últimos anos, mas o neubrutalismo favorece cores planas em um estilo quase pop-art.
- Tipografia moderna: Embora o brutalismo muitas vezes opte por uma tipografia estranha, esticada ou complicada, o neubrutalismo tende a seguir as regras da tipografia moderna para permitir uma legibilidade mais fácil. Pense que fundos e cores estranhos encontram texto geométrico e legível. Mais sobre isso em um momento.
- Animações: Apesar do estilo voltar ao passado em sua ingenuidade geral, a adição de animações modernas ajuda a modernizar mais uma vez o visual.
Uma Palavra sobre Tipografia Neubrutalista
Ao percorrer os exemplos de sites neubrutalistas abaixo, você provavelmente notará a tipografia usada para os títulos – quase todos usam tipos de letra grotescos peculiares.
Eles geralmente estão um pouco além do que definiríamos como grotesco (ou grotesca) e desloque-se para o mostrar mundo das fontes, mas não importa como você as define, elas certamente causam impacto. Obtenha acesso ilimitado a muitas fontes grotescas da Web no Envato Elements agora mesmo!
“Uma fonte sem serifa grotesca não possui uma serifa, que é um pequeno traço extra comumente visto no final de alguns tipos de letra. Tem, em vez disso, uma borda mais abrupta.”- Daisy Ein
Exemplos do mundo real de Neubrutalismo
Continue lendo para 10 exemplos de design neubrutalista que chegam à web agora. Qual é seu favorito?
1. Gumroad
Confira as cores suaves, conflitantes e sem gradientes combinadas com contornos pretos grossos. A tipografia é moderna e fácil de ler, diferenciando-a dos estilos muitas vezes mais desajeitados preferidos no design brutalista. As animações também ajudam a modernizar o design brutalista.
2. Figma
Um dos exemplos mais famosos de web design neubrutalista, o Figma evita sombras em todas as imagens, optando por linhas pretas mais nítidas e escuras ao redor das formas. Tons conflitantes, como laranja e amarelo, também parecem um pouco desafiadores aos olhos, o que os ajuda a se destacar.
3. Agência Goodkids
Assim que você coloca um pé errado no site Goodkids, é impossível perder as 404 animações superdimensionadas que se empilham desigualmente umas sobre as outras para preencher a tela. Os emojis sorridentes têm um tom semelhante ao fundo bege do site, fazendo com que pareçam um pouco chocantes e, portanto, estranhamente atraentes.
4. Readymag
Canalizando tendências de design retrô, você seria perdoado por pensar que o site da Readymag vem direto dos anos 90. Animações sutis ajudam a lembrar ao usuário que esta é de fato uma escolha de design moderno! Os botões de navegação cinza lisos são atraentes em sua simplicidade.
5. Pizza Pizza
Confiante em sua simplicidade, Pizza Pizza opta por um vermelho liso contra o preto – parece um pouco difícil para os olhos, mas você não pode deixar de continuar procurando. A falta de imagens na página inicial também vai contra a maioria dos sites ricos em imagens.
6. Guiacirugiacardiaca. com
Imagens planas e suaves contra tipografia minimalista e moderna, o Guia de Cirurgia Cardíaca é um exemplo clássico de web design neubrutalista. A simplicidade impressionante encontra toques modernos, como o cursor quando você rola sobre as partes do conteúdo e o logotipo que gira quando o usuário rola.
7. Christou 1910 Dias
O texto em negrito branco contra blocos coloridos conflitantes é difícil de ler – portanto, você presta atenção extra! Animações modernas, como nuvens alegres, preenchem este site divertido, uma ótima justaposição contra o esquema de cores planas.
8. Mais
Laranja e lilás? Amarelo limão e azul royal? Combinações ousadas, mas o site da Plus combina todas elas para um visual inegavelmente neubrutalista. Animações arrojadas e os novos malditos quase gamificam este site ousado.
9. Mafanfá
À medida que você rola, animações divertidas entram em ação neste site neubrutalista. Muito se pensou em como o usuário interage com o site – quando o mouse passa sobre certos elementos, muitos mudam de cor ou se movem. Até certo ponto, o usuário cria o site que gostaria de ver.
10. Castor e Pólux
Um site com muito texto, o Castor & Pollux é salpicado de cores à medida que o usuário rola. Até os botões de compartilhamento social evitam a iconografia clássica que você pode esperar em favor da sinalização de texto simples.
Modelos da Web Inspirados no Neubrutalismo
1. Remake – Tema Mínimo
Com mais de 10 skins pré-fabricadas para mostrar seu trabalho, o Remake é um tema versátil de web design. O tema Kyona, por exemplo, usa uma pitada de cores brilhantes contra tons mais suaves. Os modelos também vêm com um projeto único e páginas de estudo de caso – perfeitos para exibir seu trabalho com estilo.
Refazer a demonstração do WordPress
2. Trito – Modelo de Site de Portfólio Pessoal Figma
Cores planas encontram imagens modernas e ilustrações contemporâneas neste modelo de design de web neubrutalista. Um modelo de portfólio pessoal de uma página, projetado especialmente para desenvolvedores ou designers mostrarem suas habilidades. Ele vem com um modo claro e escuro, para que você possa editar seu modelo de acordo com seu gosto. Lançado em maio de 2022, fica claro que o Trito foi projetado com as últimas tendências de design da web em mente.
3. Orido – Modelo Figma de Site de Portfólio Pessoal
Também lançado em maio deste ano, Orido vem com modo claro e escuro, além de fontes e ícones gratuitos. O vibrante esquema de cores amarelo e roxo e as opções de fonte legíveis são um aceno para a mais recente tendência de web design.
4. Khulna – Modelo HTML de Agência Digital Mínima Colorida
Um modelo de web design simples e fácil de seguir, confira as cores escolhidas na seção de portfólio. Este modelo vem com recursos, incluindo a revolução do Slider para o conteúdo do herói de forma rápida e fácil, bem como um design de layout responsivo. As páginas do blog também são bem projetadas.
Até Você!
Agora que você aprendeu tudo sobre a tendência de sites de neubrutalismo e explorou alguns dos meus principais temas e modelos da web, é hora de ser criativo! Escolha um tema deste post que funcione para você ou vá para ThemeForest e encontre ou crie o seu próprio. Quais tendências de sites são as suas favoritas no momento?
Originally posted 2022-05-19 11:19:42.
