Falar sobre um projeto
Início
  • Captura de Portfólio, imagem 1 de 1

Portfólio

Projeto autoral + front-end do zero | HTML, CSS e JavaScript

Plataforma
HTML, CSS e JavaScript
Período
ago. de 2024 a jul. de 2025
Stack
  • HTML
  • CSS
  • JavaScript
  • JSON
  • Git

Visão geral

Meu portfólio pessoal é um projeto autoral criado para representar com precisão minha identidade visual e minha trajetória como desenvolvedor front-end. A proposta vai além de exibir trabalhos, ele foi pensado como uma experiência de marca pessoal, com uma estética moderna, criativa e profissional baseada em uma paleta de laranja e cinza.

Contexto e objetivo

O desenvolvimento se estendeu por cerca de 11 meses, conciliando estudos em Análise e Desenvolvimento de Sistemas com entregas reais como freelancer. O objetivo era construir uma vitrine que comunicasse maturidade técnica, consistência visual e capacidade de execução, criando uma navegação fluida e envolvente do início ao fim.

O desafio

O maior desafio foi equilibrar personalidade visual com clareza e performance, sem depender de frameworks. Era necessário manter ritmo, legibilidade e responsividade em todas as seções, além de sustentar uma experiência dinâmica com animações e interações sem comprometer leveza, organização de código e consistência estética.

A estratégia

Estruturar o portfólio como uma narrativa de navegação, onde cada seção reforça uma etapa da minha identidade profissional. A alternância de cores e a hierarquia de conteúdo foram planejadas para criar ritmo visual e conduzir o usuário de forma natural, mantendo previsibilidade na leitura e atenção nos pontos mais importantes.

O que foi implementado

Front-end desenvolvido do zero:

  • HTML, CSS e JavaScript puro: estrutura completa sem frameworks para manter controle total de performance, responsividade e personalização visual.
  • Padronização visual: definição consistente de tipografia, tamanhos, espaçamentos e contraste para manter legibilidade e unidade.
  • Navegação com ritmo: alternância de cores entre seções para criar uma experiência mais envolvente durante a rolagem.

Interações e experiência dinâmica:

  • Carregamentos e comportamentos dinâmicos: implementação de fluxos que tornam a experiência mais responsiva e viva.
  • Animações e microinterações: efeitos visuais planejados para reforçar modernidade sem comprometer a performance.
  • Modais e botões de ação: abertura de modais, interações com CTAs e comportamentos responsivos integrados ao layout.

Suporte de IA e estrutura complementar:

  • Codex da OpenAI: uso do agente para gerar a base do back-end a partir de prompts técnicos elaborados com precisão.
  • Integração front-end e lógica: implementação das conexões necessárias para garantir funcionamento integrado e consistente das funcionalidades.

Resultado

O resultado é um portfólio que funciona como vitrine e como produto, comunicando identidade, consistência e execução técnica. Ele representa o que sou capaz de construir hoje e também a forma como evoluo continuamente, com um projeto vivo, em constante refinamento, acompanhando minha trajetória profissional e minha busca por inovação.