AI-DrivenUX ResearchStyle GuideNext.js

Este Portfólio

A união entre design editorial e inteligência artificial: como orquestrei agentes e pesquisa para construir uma marca pessoal viva.

Ano

2026

Papel

Product Designer · AI Orchestrator

Contexto

Rebranding completo de marca pessoal. O objetivo foi desenhar e construir um ecossistema digital que evidenciasse, na prática, minha capacidade em unir pesquisa, validação, UX/UI e orquestração de Inteligência Artificial sem rótulos corporativos.

Um meta-case: o processo completo de criação deste portfólio — da pesquisa guiada por IA à construção de um guia de estilos acessível, demonstrando a capacidade técnica e orquestração na prática.

Abertura: O Contexto e o Desafio

O Ponto de Partida

O mercado atual exige mais do que portfólios estáticos; exige evidências de raciocínio lógico e domínio das novas ferramentas. O desafio era construir um produto que não apenas dissesse o que eu sei fazer, mas que fosse a prova técnica viva da minha experiência como Product/UX Designer.

O Papel da IA

Neste projeto, atuei como um orquestrador utilizando uma arquitetura de múltiplos agentes (via MCP e GenAI). O agente 'Frontend Specialist' atuou construindo os componentes com Tailwind, enquanto o 'Orchestrator' coordenava a lógica sistêmica. Todo o trabalho foi guiado por 'Skills' injetadas no contexto, garantindo regras estritas de Clean Code e restrições de Frontend Design para manter o visual editorial limpo e consistente.

Cenário: A necessidade de evidenciar maturidade técnica em um mercado saturado

Objetivo: Construir um produto que fosse, em si mesmo, uma prova de orquestração de IA

Metodologia: União de fundamentos de design, pesquisa heurística e AI-Driven workflows

Estratégia e Pesquisa (Discovery)

A fundação antes da automação: Mesmo com o uso intenso de inteligência artificial na codificação, o pilar de qualquer produto digital é a estratégia humana. Antes de abrir o Figma ou acionar os agentes de código, mapeei detalhadamente a jornada da persona (Tech Recruiters e Leaders) e utilizei a Matriz de Impacto vs Esforço para priorizar quais informações da interface trariam o maior retorno de valor no menor tempo de leitura.

Fundamentos: A pesquisa guia a IA, e não o contrário

Foco: Mapeamento da jornada focado em escaneabilidade

Priorização: Matriz de Impacto vs Esforço para estruturar as seções do MVP

Persona e Jornada do Recrutador
Mapeamento da jornada: focando em escaneabilidade e rápida identificação de habilidades.
Matriz de Impacto vs Esforço
Priorização de features: focando em Vitórias Rápidas para a navegação do portfólio.
A Marca: Dualidade e Orquestração

Para a identidade visual do portfólio, desenvolvi uma logomarca que traduzisse exatamente essa nova fase da minha carreira: Thiago Castro // .

A escolha das duas barras (`//`) representa o lado do Código, da Tecnologia e da Inteligência Artificial. Em contraste, o pingo finalizado com textura de aquarela (`.`) simboliza a sensibilidade do Design, a Arte e a Criação Humana. É o equilíbrio perfeito entre a precisão da engenharia e a emoção do design.

Orquestração de IA e Fluxo de Trabalho

A IA como parceira, não como criadora: Todas as decisões de arquitetura de informação e estrutura de navegação foram minhas. Utilizei a IA para analisar benchmarks do mercado e validar minhas hipóteses sobre o que Tech Recruiters e líderes buscam em um portfólio. As ferramentas de IA funcionaram como extensores da minha capacidade técnica, ajudando a iterar ideias rapidamente antes de fecharmos a identidade visual.

Workflow: Uso de IA para validação de hipóteses e benchmarks

Execução: Redução do tempo entre ideação e implementação via agentes MCP

Visão: IA aplicada como acelerador técnico, mantendo o controle das decisões de UX

Fluxo de Trabalho com IA
Ilustração do workflow: Ideação, Orquestração de IA, Guia de Estilo e Design-to-Code.
O Guia de Estilos

Por que não um Design System complexo? Com base na minha experiência construindo Design Systems completos (como no projeto Mentor Cycle), entendi que, para a escala e escopo de um portfólio pessoal, um Design System seria um overengineering desnecessário. Optei estrategicamente por criar um Guia de Estilos robusto, focado no essencial: tipografia expressiva, cores de alto contraste e componentes limpos, o que garantiu leveza e velocidade de desenvolvimento.

Decisões Visuais: Para transmitir maturidade e sofisticação sem o uso de rótulos, as escolhas focaram no minimalismo. Utilizei uma paleta neutra (Areia e Off-White) para dar espaço ao conteúdo, e a fonte 'Instrument Serif' para títulos, garantindo um tom editorial e elegante.

Capa do Guia de Estilos
Capa do Guia de Estilos focada em minimalismo e estética editorial.
Cores e Tipografia
Paleta de Cores e Tipografia. A escolha pela 'Instrument Serif' traz um tom clássico, enquanto a 'Inter' garante máxima legibilidade.
Componentes de UI
Botões baseados em princípios de acessibilidade. Alto contraste para ações principais e visualização limpa para ações secundárias.
Componentes de Interface (Cards e KPIs)
Padrões de UI aplicados em cartões e indicadores de performance (KPIs).
O Impacto e Resultados

O resultado final não é apenas um site, mas um produto construído com as melhores práticas de mercado.

Orquestração Real: Este portfólio tangibiliza a minha jornada. Ele demonstra que consigo conduzir um projeto desde a pesquisa profunda até a entrega em código, escolhendo as ferramentas e os workflows corretos para otimizar o tempo sem perder a qualidade estética e a acessibilidade.

100%

Desenvolvimento AI-Driven

0

Overengineering

1

Guia de Estilos Minimalista e Eficaz
Reflexão Sincera (Retrospectiva)

A balança entre IA e Emoção: O maior desafio em um portfólio AI-Driven é garantir que a precisão da máquina não ofusque a sua identidade criativa. A escolha por um visual editorial e tons de areia foi justamente para ancorar o toque humano no processo.

O que faria diferente hoje: Embora eu pudesse ter focado em animações complexas ou integrações mirabolantes, optei por manter o design extremamente simples e sólido. O objetivo principal sempre foi mostrar quem eu sou e como eu trabalho de forma objetiva. Em iterações futuras, talvez explore mais algumas micro-interações, mas sempre preservando essa objetividade clara e focada no resultado.

Autocrítica: A execução muito objetiva deixou espaço para explorar mais micro-interações no futuro

Lição: Voltar às origens do design para embasar decisões é um diferencial produtivo

Evolução: A IA deve atuar como uma parceira e assistente, nunca como a tomadora de decisão