Problema
O PBB é um método de produto com muito conteúdo (conceitos, etapas, livro, materiais) para públicos diferentes.
Como transformar um método em uma presença digital clara e colocá-la no ar?
Redesenho da presença digital do Product Backlog Building (PBB) em três idiomas, do design ao produto publicado, construído com IA usando Lovable.
Resumo executivo
Sobre o case
O que fiz
Redesenhei a presença digital e a arquitetura visual do site e construí o produto com IA (Lovable).
Meu papel
UI Design + AI-Assisted Development (do design à implementação).
Resultado
Site no ar, trilíngue (PT/EN/ES) productbacklogbuilding.com.br ↗
01 · Visão geral
Visão geral do projeto.
- Cliente
- Product Backlog Building (PBB)
- Período
- 2026
- Produto
- Site productbacklogbuilding.com.br
- Atuação
- UI Design + AI-Assisted Development
- Idiomas
- Português, English, Español
- Construção
- Lovable + Inteligência Artificial
- Site no ar
- productbacklogbuilding.com.br ↗
02 · Problema
O site precisava explicar muito sem parecer complexo.
Um método de produto reúne conceitos, frameworks, etapas, terminologias, materiais, treinamentos e públicos diferentes. Se tudo aparece com o mesmo peso, o site cansa. O desafio de UI era fazer o visitante entender, em poucos segundos:
O que é o PBB? Por que isso importa para mim? Como posso aprender ou aplicar o método?
03 · Design + implementação com IA
Aproximar design e implementação.
O diferencial deste projeto foi aproximar dois mundos que estiveram separados: Design e Implementação.
Além do trabalho de UI, construí e iterei o produto usando Lovable + IA, indo do design até o site publicado, em três idiomas, sem o handoff tradicional. As decisões visuais e de estrutura foram minhas; a IA acelerou a construção e a iteração, encurtando a distância entre ideia, protótipo e produto no ar.
Eu dirigi as decisões de design. A IA foi a alavanca de execução.
04 · Decisões de UI
Como chegamos lá.
- Problema
- Um visitante pode não saber o que é "Product Backlog Building", mas reconhece backlog desorganizado, prioridades pouco claras e desalinhamento entre negócio e time.
- Decisão
- A interface passou a trabalhar primeiro com situações reconhecíveis e só depois a aprofundar a explicação do método.
- Por quê
- Antes de explicar o método, precisava ficar claro por que ele existe.
- Problema
- Conteúdo educacional e técnico vira facilmente grandes blocos de texto.
- Decisão
- Priorizei headlines fortes, subtítulos objetivos, blocos menores, cards, listas, provas sociais, CTAs e variação de ritmo entre as seções.
- Por quê
- O visitante entende a proposta escaneando, sem precisar ler tudo.
- Problema
- O site precisava funcionar em PT, EN e ES, e o mesmo texto muda de comprimento em cada idioma.
- Decisão
- Estruturei componentes e espaçamentos para acomodar a variação sem quebrar a consistência.
- Por quê
- Internacionalização também é decisão de layout, não só de tradução.
05 · Meu papel
O que eu fiz.
Atuei como UI Designer + AI-Assisted Developer: análise da experiência existente, redesign visual, definição de hierarquia, organização das seções, componentes, estruturação das páginas, layout responsivo, adaptação para múltiplos idiomas e construção/iteração do produto com Lovable + IA.
06 · Resultado
No ar, em três idiomas.
O redesenho está no ar, em três idiomas, com uma presença digital mais clara e contemporânea para o método. Do design ao produto publicado, o projeto mostrou na prática a aproximação entre desenhar e entregar.
Continue explorando
Outros cases
Vamos conversar
Se você está buscando alguém para transformar problemas complexos em produtos mais simples, estratégicos e úteis, podemos conversar.