Divi Design Showcase: novas inscrições de outubro de 2019

É aquela hora de novo! É hora do nosso Divi Showcase mensal, onde damos uma olhada em dez incríveis sites Divi feitos por membros da nossa comunidade. A cada mês, apresentamos os melhores sites da Divi enviados por nossa comunidade e hoje queremos compartilhar com vocês os dez melhores sites do mês de outubro. Ao longo da postagem, destacarei alguns dos meus recursos de design favoritos que me atraem para cada um dos sites.

Espero que você goste deles!

Divi Design Showcase: novas inscrições de outubro de 2019

1. Bots vs contras

Este site foi enviado por Wade McMaster. O site usa uma paleta de cores escuras com texto em branco e azul claro e destaques em todo. O menu é estreito e está separado da seção do herói por uma linha azul. A seção hero exibe uma imagem de fundo com o logotipo do site e a descrição em texto grande. Uma seção Sobre mostra as informações em duas colunas. Eu gosto da seção do blog, que é exibida em paralaxe sobre uma imagem de fundo com uma sobreposição estilizada. Ele exibe a última postagem do blog com texto de um lado como um CTA para ver o blog e uma postagem do blog do outro em um design de cartão. As páginas de papéis de parede e de blog exibem postagens de blog com cabeçalho, imagem de plano de fundo e barra lateral. A página de inscrição também é interessante. Ele exibe o formulário de inscrição como um CTA com marcadores em um lado para mostrar os benefícios da inscrição. As páginas exibem um design de menu diferente do da página inicial.

Visite o site

2. Match Design Media

Este site foi enviado por Sam Nicholson. O site exibe um vídeo de fundo em tela inteira com uma sobreposição de gradiente. O primeiro plano mostra o logotipo e os designs das linhas. O logotipo aumenta o zoom ao pairar e dois dos elementos da linha desaparecem para criar um efeito interessante de pairar. O elemento mais interessante é a maneira como o site usa divisores de seção. Ele coloca uma imagem de plano de fundo atrás do divisor e, em seguida, coloca um gradiente sobre ele. Contadores de números ou contadores de círculo são colocados sobre eles. O site usa muitos gradientes e texto estilizado para combinar. Os botões incluem os mesmos gradientes dos fundos. Os serviços são mostrados com um layout alternativo e incluem imagens que se inclinam ao passar o mouse. A seção Carreiras e a seção Contato incluem o mesmo efeito de inclinação. Tem muitas pequenas animações, como linhas que se inclinam no lugar durante o carregamento. O site também inclui um botão voltar ao topo estilizado e uma barra deslizante estilizada, que gostaria que se tornasse uma prática padrão para web design.

Visite o site

3. Pop de propriedade

Este site foi enviado por Kaelynn Midgley. Ele exibe um gradiente de fundo de largura total com um CTA de um lado e uma imagem em um dispositivo móvel do outro. A rolagem revela informações de um lado com um CTA e imagens de propriedades do outro com uma imagem colocada dentro de um contorno de laptop. Projetos semelhantes continuam em todo o site. Minha favorita é a seção sobre a comunidade. Inclui um layout de duas colunas com uma imagem de plano de fundo com uma sinopse sobreposta que inclui uma imagem, um texto e um botão e informações do outro lado. A página Como funciona mostra cada etapa em tela inteira com uma cor de fundo diferente para cada uma. Também gosto da página do blog, que inclui uma seção de herói, texto para informações, uma divisória e, em seguida, as postagens do blog. As postagens adicionam uma sombra de caixa à imagem em destaque. O menu inclui um CTA.

Visite o site

4. Pátria

Este site foi enviado por Jerome Bestel. Inclui muitos gráficos em todo o site, começando com a seção do herói, que exibe um grande gráfico de um lado e um CTA do outro. A rolagem mostra uma seção de duas colunas com um gráfico menor de um lado com um botão de chamada clicável e informações do outro lado. Este design alterna para baixo na página conforme você rola. Outras informações são fornecidas nas sinopses. Um controle deslizante permite que você mova um cursor e selecione um preço. As informações sobre a equipe são fornecidas com sinopses e incluem gráficos para imagens. O site usa um design minimalista e muito azul para o texto e planos de fundo para atrair o público-alvo. Cada uma das páginas segue um design semelhante, mas ainda tem algo único. O menu inclui um CTA de contato e um link de chamada clicável. Gosto especialmente dos grandes gráficos nas seções principais de cada página.

Visite o site

5. ChangeUp for Charity

Este site foi enviado por Dickon Kent. Ele tem um gradiente de fundo de largura total com um gráfico de um lado atrás de um CTA e um conjunto de imagens do outro lado que mostra o aplicativo em telefones celulares. As próximas seções mostram um texto com uma divisória e um título azul à esquerda e um smartphone com uma imagem do aplicativo e gráficos adjacentes à direita. O texto e os gráficos deslizam para o lugar conforme você rola. Um controle deslizante exibe logotipos sobre um fundo padronizado com gradiente. Um controle deslizante de depoimento de largura total inclui a imagem, o depoimento e a navegação por ponto e seta sobre o fundo azul que corresponde ao site. As informações são fornecidas em sinopses que incluem ícones circulados que correspondem ao estilo do site. O site faz excelente uso de cores e gradientes de marca azul e verde.

Visite o site

6. Rebbl

Este site foi enviado por Dickon Kent. Este site usa um mega menu interessante com texto menor abaixo do texto principal. Passar o mouse sobre um dos links abre o menu para revelar mais links e imagens. A primeira seção da página inicial mostra uma imagem de largura total com espaço de um lado para um CTA e os produtos do outro lado. A rolagem revela um CTA de largura total que demonstra o produto e fornece um link para a loja. Uma seção de blog mostra categorias como cartões de blog. Clicar em um abre a página de arquivo dessa categoria de blog. As postagens do blog são apresentadas em grandes cartões com a categoria centralizada entre a imagem e o trecho. Um formulário de assinatura fino exibe o texto e o formulário sobre um padrão de fundo. As informações sobre a empresa e os produtos são mostradas em uma seção de duas colunas com grandes CTAs. Eu gosto do vídeo CTA que exibe um vídeo de fundo com um título e um botão na sobreposição. Um controle deslizante do Instagram incorporado fornece informações ao passar o mouse e abre as informações em um modal com um clique.

Visite o site

7. Jovens, falem!

Este site foi enviado por Michal Teska. É um layout de uma página que exibe uma imagem de fundo em tela inteira em paralaxe com uma sobreposição altamente opaca. A sobreposição inclui um slogan e um gráfico. Todas as seções têm um layout de duas colunas com texto em segundo plano em paralaxe com um gráfico em primeiro plano e texto no outro lado. Este design se alterna conforme você rola. Uma dessas seções tem seletores que são estilizados para combinar com o site. As informações sobre as pessoas envolvidas são criadas com sinopses que têm uma imagem em miniatura à esquerda e seu nome e localização à direita. Logotipos de parceiros são mostrados em escala de cinza e mudam para cores ao passar o mouse.

Visite o site

8. AWEOS

Este site foi submetido por Christos Papadopoulos. Um fundo animado cria o efeito de um cenário submarino com gráficos de desenho animado. Um CTA com um slogan e uma imagem animada fica no fundo. Um mega menu revela três colunas de links e imagens. A próxima seção fornece informações e inclui um link de chamada clicável e um link de consulta. Os membros da equipe são mostrados com uma imagem, nome, título, descrição e um botão para ouvir uma mensagem de áudio dessa pessoa. Os serviços são exibidos em sinopses que incluem ícones sob o texto. A página Projeto mostra exemplos em um cartão que rola ao passar o mouse. Cada uma das páginas dos Serviços segue um design semelhante, que inclui um cabeçalho com uma descrição e um link, seguidos de informações detalhadas. A página do blog e as postagens seguem um design de cabeçalho semelhante.

Visite o site

9. Marci Angeles

Este site foi enviado por Marci Angeles. O cabeçalho e o rodapé permanecem na tela enquanto você rola. Eles são transparentes, então o layout é visível. A página inicial mostra um fundo azul e várias imagens de amostras de trabalho. Clicar em uma imagem abre a página desse projeto, onde você pode ver os detalhes sobre o projeto. Cada um é mostrado como uma postagem de blog e inclui uma imagem em destaque, descrição, imagens, navegação para as postagens anteriores e posteriores e um formulário de contato. O rodapé não permanece na tela nas páginas do projeto. O cabeçalho e o rodapé têm um design simples e limpo. O cabeçalho inclui links para outros sites do proprietário, que usam cores suaves semelhantes a este. O rodapé inclui links para mídias sociais. Ambos possuem linhas que os separam do corpo do site.

Visite o site

10. ATG Europa

Este site foi enviado por Camiel Bos. O cabeçalho de tela inteira mostra um vídeo de fundo com um título e uma frase de efeito no canto inferior esquerdo da tela. Possui um mega menu e exibe links e postagens no hover. Ao rolar, você vê que o menu fica branco e tem uma borda curva e espelha a parte inferior da seção de vídeo. As informações são fornecidas na próxima seção e incluem um gráfico que corresponde ao tema do site. Setores atendidos, soluções e serviços são mostrados em imagens em paralaxe. Um CTA de contato exibe o título e o botão sobre uma imagem de fundo e inclui divisores de seção curvos para a parte superior e inferior para criar um design interessante. O site usa muitos divisores estilizados, padrões de fundo e elementos sobrepostos que se destacam muito bem enquanto mantêm um design limpo. O site faz excelente uso de imagens e cores.

Visite o site

Conclusão

Essas são as nossas 10 melhores inscrições para o site da comunidade Divi no mês de outubro. Esses sites estão incríveis e, como sempre, queremos agradecer a todos por seus envios!

Se você gostaria que seu próprio design fosse considerado, sinta-se à vontade para enviar um e-mail para nosso editor em nathan em elegant themes dot com. Certifique-se de deixar o assunto do email “ENVIO DO SITE DIVI”.

Também gostaríamos de ouvir de você nos comentários! Diga-nos o que você gosta nesses sites e se há algo que eles fizeram que você gostaria que ensinássemos no blog.

Imagem de destaque via ProStockStudio / shutterstock.com