Bem-vindo a ”Como criar um portfólio simples e eficaz com o Divi”. Nesta série, abordaremos tudo o que você precisa fazer para criar seu próprio site de portfólio e layout a partir do zero. Também veremos como usar nosso sistema de testes A / B, e o Divi Leads. Assim você consegue garantir que seu site seja eficiente para atrair novos clientes.
No artigo de hoje, estamos distribuindo três layouts para seu portfólio de projetos que são ótimos para exibir seu trabalho. Eles também são ótimos pontos de partida para novos layouts misturados que você mesmo cria. Portanto meu objetivo nessa minissérie é iniciar o processo de descobrir a melhor maneira de exibir seu trabalho. Logo, ao dar três opções diferentes que você pode experimentar, nosso intuito é ver o que funciona, o que não funciona, o que você gosta e o que você não gosta.
Como baixar, instalar e usar o pacote de layout de página do projeto:
Enfim quando baixado o Pacote de Layout Divi, você encontrará os seguintes arquivos dentro:
-all-project-layouts.json – são todos os três layouts em um arquivo .json
-Pasta de imagens em destaque – Eu uso o módulo de imagem em destaque em cada um desses layouts. O que significa que você precisará adicionar as imagens em destaque contidas nesta pasta ao layout correspondente para que elas apareçam.
-Pasta de Imagens da Galeria do Projeto 3 – Os módulos da Galeria não exportam todas as suas imagens. Então eu incluí todas essas imagens usadas dos três módulos do layout. Assim você pode adicioná-las facilmente.
-project-layout-1.json – O primeiro layout como um único arquivo.
-project-layout-2.json – O segundo layout como um único arquivo.
-project-layout-3.json – O terceiro layout como um único arquivo.
Depois de ter baixado o pacote de layout para o seu computador, você precisará localizá-lo na sua pasta de downloads e descompactá-lo. Em seguida, navegue até Divi> Divi Library e clique no botão “importar e exportar” na parte superior da página. Na guia “Importar”, escolha o layout desejado (ou o arquivo “Todos”) e importe-o para a sua Biblioteca Divi.
Posteriormente, você poderá adicionar esses layouts a novos projetos usando o Divi Builder indo em Load From Library> Add From Library e escolhendo o layout do projeto preferido. Não se esqueça de adicionar as imagens em destaque e as imagens da galeria separadamente!
Para ter acesso ao download, você precisará fazer o download no formulário que envia o link de download no seu e-mail. Além de poder baixar o DiviStar Layout Pack, também será enviado outro Pacote de Layout, além de fornecer uma fonte contínua de novos (e gratuitos) recursos, dicas e truques.
Caso você já esteja na lista, basta digitar seu endereço de e-mail abaixo e clicar em download. Dessa maneira você não será inscrito duas vezes.
Aplicando Princípios de Design aos seus Layouts de Página
Toda vez que eu sento para projetar uma página, fazer um layout de portfólio, ou qualquer outra coisa, tento revisitar brevemente alguns princípios básicos de design. Existe um ótimo site chamado learndesignprinciples.com que fornece explicações simples (com diagramas fáceis de entender) de quatro princípios básicos de design: Eixo, Simetria, Hierarquia e Ritmo.
Aqui está a breve descrição que Melissa, a criadora do learndesignprinciples.com, escreveu para cada um desses termos:
Eixo: o eixo é o princípio de organização mais básico e mais comum. Basicamente, o eixo é uma linha imaginária usada para organizar um grupo de elementos em um design. Portanto, nos diagramas o eixo é representado como uma linha tracejada.
Simetria: Simetria é quando os elementos são organizados da mesma maneira em ambos os lados de um eixo. Logo a perfeita simetria é quando os elementos são espelhados sobre o eixo e exatamente o mesmo em ambos os lados.
Hierarquia: Hierarquia é quando um elemento aparece mais importante em comparação com outros elementos em um design.
Ritmo: Ritmo é o movimento criado por um padrão repetido de formas.
Cada um desses termos tem um conjunto de diagramas de acompanhamento no site que eu relacionei acima. Dessa maneiro consigo ajudá-lo a visualizar completamente o que esses termos significam. Eu recomendo dar uma olhada.
Nos projetos abaixo, concentrei-me nos três primeiros princípios. Cada design tem um eixo que corre diretamente no meio. Não importa o que eu coloquei na página, concentrei-me em criar simetria equilibrando os elementos de cada lado desse eixo central invisível. E finalmente usei o princípio da hierarquia para comunicar a importância da imagem em destaque/descrição do projeto.
Tenho certeza que pensando nesses princípios, na próxima vez que decidir criar um post ou uma página, conseguirá organizá-lo de maneira atraente.
Layout da página do projeto 1
Este primeiro layout é uma simples e única coluna de imagens que exibe seu trabalho de maneira sucinta e trabalhada.
Layout da página do projeto 2
Com o segundo layout, um pouco mais complexo, ainda vemos o eixo central e a simetria em ambos os lados.
Layout da página do projeto 3
No terceiro layout, tudo o que eu queria fazer era fornecer uma maneira limpa e compacta de exibir um grande volume de trabalho. Portanto uma galeria de azulejos (como fomos mostrados por Josh Hall em sua minissérie ”Gallery Module”) foi o ajuste perfeito.
Enfim, aplicando esses princípios básicos de design, você pode criar algo visualmente atrativo e com a informações necessárias de um bom portfólio.
Comentários