Como você pode manter um estilo visual consistente para seu portfólio de desenvolvimento front-end?

Marcelo Albuquerque
4 min readJan 23, 2024

Fui abordado no LinkedIn com a pergunta título desse artigo e de fato é uma excelente pergunta, porém, as respostas e a forma como o próprio LinkedIn aborda esse assunto me pareceram um tanto quanto genéricas.

Uma abordagem genérica

Sugestões como "escolha um tema" ou "defina um esquema de cores" são respostas que pouco auxiliam nessa demanda. Quando vejo respostas semelhantes, simplesmente tendo a crer que estão utilizando uma abordagem genérica.

Se você é um desenvolvedor front-end, deveria primeiramente entender os fundamentos do design. Portanto, temas como: contraste, brilho, espaçamento, tipografia e cores; deveriam fazer parte integral da sua rotina de trabalho e estudos.

O problema de tentar se adequar a um nicho específico

Outra sugestão que me chamou muita atenção foi a "escolha um nicho". É uma sugestão no mínimo estranha, como posso me adequar a um nicho específico sendo um desenvolvedor front-end?

Atuando como desenvolvedor front-end vou desenvolver trabalhos para nichos que não possuem nenhuma relação visual entre sí. Exemplos:

  • Posso ser contratado para desenvolver uma landing page para uma farmácia, onde preciso adequar a linguagem visual a esse "nicho".
  • Também posso ser contratado para desenvolver um site para uma lanchonete.
  • Já desenvolvi uma landing page para uma profissional que atua como massagista.
  • Sites para instituições de caridade podem fazer parte do seu portfólio.

Observe que são "nichos" completamente distintos! Como posso criar uma identidade visual para meu portfólio tentando me adequar a todos esses "nichos"?

Óbviamente é impossível! Pois o conceito está errado!

Criando uma marca

Se você é um desenvolvedor front-end e deseja ter um portfólio, você automaticamente se transforma em uma marca, seja utilizando seu próprio nome ou utilizando um pseudônimo. Portanto, é importante ficar atento e não cair na armadilha de criar um porfólio utilizando uma identidade visual focada em um nicho específico. Sua identidade visual deve estar adequada a sua marca! Afinal, seu portfólio deve abrangir tipos diferentes de projetos.

Agora sim, pense em definir um "esquema de cores" para sua marca!

Minha sugestão pensando na marca para um desenvolvedor fron-end é escolher cores neutras, pois como em seu portfólio vamos ter trabalhos de nichos completamente distintos e cada um com suas cores, muitas delas vivas e coloridas e outras mais pesadas e sérias, precisamos ser o mais neutro possível para não haver conflitos.

Não estou dizendo que você não pode ter um pouco de colorido em sua marca… mas seja cauteloso e inteligênte!

Comece utilizando o Preto e Cinza como suas cores neutras, teste adicionar uma única cor de destaque como o vermelho, laranja ou verde. Pronto, você tem um esquema de cores construído para representar a sua marca!

Muito importante ficar atento ao contraste dessas cores para respeitar as normas WCAG.

Esquema de cores adequado ao tema Dark
Esquema de cores adequado ao tema Light

Volto a ressaltar que a marca para um desenvolvedor front-end pode ser seu próprio nome ou um pseudônimo.

Meu nome é “Marcelo Albuquerque” e utilizo esse nome como marca!

Ao acessar meu site: Marcelo Albuquerque, você vai observar que utilizei um esquema de cores focado no tema light:

Esquema de cores do meu site

Conclusão

O maior erro é gerar complexidade! Ao direcionar um usuário leigo — mesmo ele sendo um desenvolvedor front-end — para ferramentas como Coolors ou Adobe Color, você apenas está dificultando o processo de escolha de um esquema de cores, pois esse usuário não compreende os fundamentos do design e ao se deparar com milhares de opções de cores acaba ficando perdido em um mar de arco-íris.

Portanto, dedicar um tempo no estudo do design e em um primeiro momento escolher uma paleta simples com uma única cor de destaque, além de ser uma escolha segura, também é uma escolha sábia!

Quando mais tempo você dedicar ao estudo do design vai perceber que o grande desafio será a busca em simplificar os processos e não gerar complexidade!

--

--