Animação do hero da PDP Body Peptides — lata girando 360°
Produto digital

Welz Nutrition — Redesign

Pesquisa, avaliação e redesign do produto digital de uma marca nova de nutrição esportiva do grupo LIVE!.

Papel
Pesquisa, UX e Design — Franco Gomes Santos
Competências
IHC / Pesquisa com usuário Estatística / Análise de dados Programação Desenvolvimento web Produto digital UX / UI Design Pesquisa de mercado
Período
Agosto de 2026
Indicadores do projeto
150–220h
Horas especializadas (estimativa)
~19,4 mil
Linhas de código escritas à mão
~56 mil
Linhas de dados minerados
200+
Arquivos de trabalho (sem imagens)
7
Áreas de técnica/competência aplicadas
8
Ferramentas e tecnologias usadas
5 → 17 → 21
Fases → seções → entregas (EAP)
6
Parâmetros de negócio mapeados
36
Achados de usabilidade registrados (13 + 23)
Como navegar neste documento

Todo bloco com seta (▸) é expansível — clique pra abrir ou fechar. "Expandir tudo" / "Recolher tudo" controlam o documento inteiro de uma vez.

Decisões mais complexas seguem o "Meu Framework": Dado o problema → Pensei em → Por isso criei → O que me ajudou a — o raciocínio por trás da decisão, não só o resultado. Legenda abaixo; só a Fase 04 ganha uma 5ª linha excepcional, "Assim eu consigo".

Dado o problemaO que estava travando, na fala de quem usou ou na leitura da pesquisa. Uso essa linha pra registrar o sintoma antes de propor qualquer solução.
Pensei emA hipótese ou direção que considerei antes de decidir. Uso essa linha pra deixar rastro do raciocínio, não só da escolha final.
Por isso crieiA decisão que tomei diante da hipótese. Numa Fase ou Seção essa resposta é estrutural: aponto pras Seções, Tarefas ou Entregáveis logo abaixo, em vez de escrever uma frase nova.
O que me ajudou aO resultado ou aprendizado que essa decisão trouxe. Uso essa linha pra fechar o ciclo e checar se a decisão funcionou de fato.

Imagens abrem em modal com zoom 100% e link "Abrir em nova aba". Links de documentos, protótipos e Figma abrem direto em nova aba.

Fase 01

Briefing — contexto e objetivos

3 seções

Entender o pedido antes de propor qualquer solução: a Welz é a nova marca de nutrição esportiva do grupo LIVE!, lançando Body Peptides e Daily Hydration. O pedido foi ajustar o que já funciona pra marca — não reconstruir do zero.

Dado o problema

Welz é uma marca de produtos de nutrição, lançando 2 produtos inicialmente. Depois da minha avaliação profissional da página, notei alguns problemas de interação (UI e UX), eventuais decisões de comunicação equivocadas, e oportunidades de uso da proposta de valor — tanto na comunicação quanto na interatividade.

Pensei em

Definir o escopo do projeto — Pesquisa, Análise, Design e Avaliação — e começar pela pesquisa inicial da marca: identificar o posicionamento ético e executivo do produto e da marca, e os objetivos primários de comunicação do produto e/ou serviço.

Por isso criei
Seção 1.1

Objetivos do pedido

Três objetivos verificáveis por trás do pedido, tratados aqui como as 3 missões centrais do projeto.

Missão

Melhorar a experiência de uso

Reduzir fricção na navegação, na busca por informação e no fluxo de compra.

Missão

Aprimorar a proposta de valor

Comunicar de forma mais clara e convincente o que o produto entrega e por quê.

Missão

Reforçar o product-market fit já adotado

Ajustar o que já vinha funcionando pra marca, não reconstruir do zero.

Produto
Seção 1.2

Flags norteadoras

6 flags que vão coordenar toda a pesquisa seguinte.

Apelo à Ciência Irreverência sobre as Características do Produto Posicionamento, Abordagens e Estratégias de Venda Fricção de Navegação e Descoberta Clareza de Linguagem e Jargão Técnico Diferenciação e Ajuste ao Público-Alvo
Tarefa

Princípios de abordagem para todas as tarefas do projeto

Mentalidade para guiar os momentos de divergência e convergência do pensamento de design.

Produto
Seção 1.3

Metas de negócio e parâmetros de impacto

Redesign não é só design: desde o Briefing, mapeamos 6 parâmetros de negócio que funcionam como gatilho de teste pra cada decisão das fases seguintes e como base de cálculo pro ROI do projeto.

  • Adoção
  • Produtividade
  • Custo de Operação
  • Risco
  • Qualidade
  • Retenção

O detalhamento completo, com os 6 parâmetros, a correlação decisão a decisão e as métricas testáveis, está no "Assim eu consigo" da fase 4 — seções 4.6, 4.7 e 4.8.

2 exemplos de como um parâmetro vira gatilho de teste
Decisão de designHipóteseMétrica / parâmetro correlacionado
Kit Experimentação gratuito no carrinho (limite 1/CPF)Reduz a barreira do fardo fechado na 1ª compra sem virar custo de aquisição indefinidoTaxa de resgate do Kit vs. taxa de recompra em 60 dias — Adoção · Custo de Operação · Retenção
CTA "Compra única" como padrãoReduz fricção na 1ª compra frente ao padrão anterior (assinatura)Taxa de conversão no checkout (compra única) — Adoção · Produtividade
Tarefa

Mapear os parâmetros de negócio que vão medir o impacto do redesenho

6 parâmetros, diretos e indiretos, correlacionados a 12 decisões de design e a 11 métricas testáveis — consolidados nas seções 4.6–4.8, dentro do Redesign.

Produto Estatística
O que me ajudou a

O Entregável é a Estrutura Analítica do Projeto (EAP) — ao traduzir o pedido em 3 missões (seção 1.1), derivar as 6 flags norteadoras que guiam a pesquisa (seção 1.2) e mapear os parâmetros de negócio que medem o impacto do redesenho (seção 1.3), ficou claro que o Briefing precisava fechar num mapa único de tudo que o projeto ainda ia produzir. A EAP abaixo é esse mapa: as 5 fases, 24 seções e 21 entregas do projeto inteiro, do Briefing até a Validação & fechamento.

Seção 1.4

Estrutura Analítica do Projeto (EAP)

  • 1.0Briefing
    • 1.1Objetivos do pedido
      • 1.1.1Melhorar a experiência de uso
      • 1.1.2Aprimorar a proposta de valor
      • 1.1.3Reforçar o product-market fit já adotado
    • 1.2Flags norteadoras
      • 1.2.1Derivar flags observáveis a partir dos 3 objetivos
    • 1.3Metas de negócio e parâmetros de impacto
      • 1.3.1Mapear os parâmetros de negócio que vão medir o impacto do redesenho
  • 2.0Discovery
    • 2.1Desk research
      • 2.1.1Levantar e mapear a literatura sobre colágeno, peptídeos e eletrólitos
    • 2.2Mineração de copy
      • 2.2.1Rodar o crawler e gerar os dashboards comparativos
    • 2.3Entrevistas Think Aloud
      • 2.3.1Conduzir e transcrever as 4 sessões
    • 2.4Auditoria do design system
      • 2.4.1Auditar o Figma institucional e extrair os tokens de marca
  • 3.0Avaliação
    • 3.1Usabilidade (Think Aloud)
      • 3.1.1Consolidar os achados em ranking + matriz CSD
    • 3.2Auditoria de UI
      • 3.2.1Marcar pins numerados + cards de citação sobre cada prancheta
    • 3.3Benchmark científico e regulatório
      • 3.3.1Mapear e classificar as alegações por risco regulatório
    • 3.4Mapas de jornada e proposta de valor
      • 3.4.1Sintetizar os achados dispersos em mapas visuais únicos
    • 3.5Heurísticas de Usabilidade
      • 3.5.1Rodar 4 varreduras automatizadas cobrindo todo o site
  • 4.0Redesign
    • 4.1Arquitetura da informação
      • 4.1.1Desenhar e publicar a Home + a navegação em 3 etapas do carrinho
    • 4.2Design de Interação
      • 4.2.1Flavor toggle líquido
      • 4.2.2Voo CTA → carrinho
      • 4.2.3Troca de card entre Assinatura e Compra única
    • 4.3Body Peptides — PDP
      • 4.3.1Reescrever a PDP bloco a bloco, aplicando vieses do Baralho
    • 4.4Carrinho — barganha e desconto
      • 4.4.1Implementar o motor de barganha + as micro-interações que o sustentam
    • 4.5Refinamento wireframe → código
      • 4.5.1Reconciliar wireframe, HTML publicado e Auditoria de UI
    • 4.6Metas de negócio por trás do redesign
    • 4.7Decisão → parâmetro correlacionado
    • 4.8Métricas e variáveis a testar
      • 4.8.1Consolidar metas, correlações e métricas de negócio do Redesign
  • 5.0Validação & fechamento
    • 5.1Status do projeto
      • 5.1.1Registrar o que está pronto, parcial e pendente
    • 5.2Referências
      • 5.2.1Consolidar e documentar todo o material de suporte, por fase
Produto
Seção 1.5

O que resolveu cada missão

Rastreando na EAP (seção 1.4) quais tarefas das fases seguintes efetivamente cumpriram cada uma das 3 missões da seção 1.1 — aplicado ao case, não genérico.

Missão 1.1.1

Melhorar a experiência de uso

Tarefas úteis 2.3.1 3.1.1 3.5.1 4.1.1 4.4.1

As 4 sessões Think Aloud (2.3.1) deram o achado mais duro do projeto: nenhum dos 4 participantes achou o site na 1ª busca no Google — isso virou Prioridade 1 do Ranking Consolidado (3.1.1, "Findability Severa"). A Home dualizada e o carrinho cadenciado em 3 etapas (4.1.1) resolveram o achado de auditoria sobre falta de indicador de progresso no checkout, e o motor de barganha (4.4.1) atacou a fricção específica de "não dá pra comprar pouco pra testar" com o Kit Experimentação. O follow-up heurístico em produção (3.5.1), rodado depois do redesenho fechado, confirmou que o stepper de quantidade ambíguo do site real — já resolvido no nosso carrinho desde a 1ª versão, nomeando a unidade como "fardo (6 latas)" — segue sem correção fora do nosso escopo aprofundado.

Missão 1.1.2

Aprimorar a proposta de valor

Tarefas úteis 2.1.1 2.2.1 3.3.1 3.4.1 4.3.1

O benchmark científico e regulatório (3.3.1) confirmou 0 claims de risco alto em 35 alegações da Welz, contra 6 encontrados em concorrentes — uma credibilidade que a comunicação original não explorava. O mapa de Proposta de Valor (3.4.1) e a reescrita da PDP bloco a bloco (4.3.1) traduziram esse achado em copy real: a analogia "colágeno pré-quebrado" antes do termo "peptídeos", resposta direta ao achado crítico do Think Aloud de que 3 de 4 participantes não entendiam o termo.

Missão 1.1.3

Reforçar o product-market fit já adotado

Tarefas úteis 2.4.1 3.2.1 4.5.1 5.1.1

A extração de tokens do Figma institucional (2.4.1) garantiu que o redesenho usasse a identidade de marca já validada — não uma nova. A Auditoria de UI (3.2.1) marcou também os pontos fortes, não só fragilidades, e a reconciliação final entre o wireframe v4, o HTML publicado e a própria auditoria (4.5.1) fechou o ciclo sem desviar do que já tinha sido aprovado. O escopo deliberadamente limitado a 2 páginas (5.1.1) é a prova prática do "ajustar o que já funciona, não reconstruir do zero" — as demais páginas viraram esqueleto de navegação, não um redesenho completo.

Produto
Fase 02

Discovery

4 seções

Minerar o próprio site, os concorrentes e a ciência por trás do copy — 4 frentes em paralelo, cada uma alimentando as fases seguintes.

Dado o problema

Considerando a necessidade de entender o produto, suas evidências e proposta de valor, o posicionamento em relação aos concorrentes, a avaliação da interface a nível de UX e UI, a percepção e identificação da proposta de valor pelos consumidores/usuários, e também mapear fricções em todo o serviço — nada disso ainda tinha resposta confirmada nesta fase. Cada frente abaixo nasceu de uma expectativa a ser testada, não de uma conclusão já validada.

Pensei em

Fazer avaliações por inspeção — auditoria de UI sobre o Figma institucional e benchmark científico/regulatório — e por avaliação direta com usuários — entrevistas Think Aloud. Cada uma dessas frentes foi desenhada pra levantar hipóteses sobre o produto e o mercado, não pra confirmá-las: a confirmação (ou refutação) ficaria por conta da fase de Avaliação, aplicando esses mesmos instrumentos sobre o comportamento e os achados reais.

Por isso criei
Seção 2.1

Desk research

Hipótese de partida: a Welz já teria lastro científico suficiente pra sustentar seus claims sobre colágeno, peptídeos e eletrólitos — sem levantar essa base, qualquer claim de copy seria só opinião. Quem confirmaria (ou refutaria) essa hipótese seria o Benchmark científico e regulatório, na Avaliação (seção 3.3).

Ilustrações
Infográfico sobre peptídeos bioativos
Como peptídeos de colágeno bioativos são digeridos, absorvidos e chegam ao músculo — material usado pra sustentar (ou questionar) os claims científicos do site.
Mapa mental sobre colágeno
Mapa mental (NotebookLM) consolidando as referências científicas sobre colágeno.
Mapa mental sobre eletrólitos
Mapa mental (NotebookLM) consolidando as referências sobre eletrólitos e hidratação.
Dado o problema

Quais evidências científicas realmente sustentam (ou contradizem) os claims que a Welz já fazia sobre colágeno, peptídeos e eletrólitos? Que contrapontos um usuário cético levantaria antes de comprar — e o site já responde a eles?

Pensei em

Inspecionar as referências científicas já citadas pelo site (e os contrapontos), com apoio do ChatGPT pra levantar objeções, consolidando tudo no NotebookLM.

Por isso criei
Tarefa

Levantar e mapear a literatura sobre colágeno, peptídeos e eletrólitos

Base científica pra sustentar (ou questionar) os claims do site.

O que me ajudou a

Os 2 mapas mentais e o infográfico deram a base científica que sustentou tanto o comparativo Welz x concorrentes (0 claims de risco alto em 35 alegações) quanto a decisão de copy de só introduzir "peptídeos" depois de uma analogia simples — sem esse levantamento, a reescrita da PDP não teria como equilibrar rigor científico e clareza.

IHC Mercado
Seção 2.2

Mineração de copy

Hipótese de partida: comparado aos concorrentes, o posicionamento científico da Welz seria mais forte do que a comunicação atual deixava transparecer. Rodar o crawler e cruzar claim a claim era o único jeito de testar isso — a confirmação (0 riscos altos vs. até 6 nos concorrentes) só viria na Avaliação (seção 3.3).

Painel Panorama por Marca do benchmarking científico
Painel "Panorama por Marca" — Welz com 0 achados de risco em 35 alegações, contra Liquidz (3) e Aguanacaixa (2).
Dado o problema

Como o discurso de venda da Welz se compara, claim a claim, com o que os concorrentes diretos estão dizendo — e quais dessas alegações realmente se sustentam nas referências científicas por trás delas?

Pensei em

Minerar via script em Python os apelos de venda do próprio site e de 9 concorrentes diretos, cruzando cada claim encontrada com as referências científicas levantadas na seção 2.1.

Por isso criei
Tarefa

Rodar o crawler e gerar os dashboards comparativos

9 concorrentes diretos, claim a claim.

O que me ajudou a

O painel "Panorama por Marca" mostrou a Welz com 0 achados de risco em 35 alegações, contra Liquidz (3) e Aguanacaixa (2) — um diferencial competitivo que ainda não estava sendo comunicado, e que virou a base do Benchmark científico e regulatório (seção 3.3) e do bloco Comparativo na PDP redesenhada.

Programação Mercado
Seção 2.3

Entrevistas Think Aloud

Hipótese de partida: existiam fricções de uso que nenhuma auditoria de conteúdo sozinha revelaria — só observar pessoas reais tentando comprar poderia confirmar onde elas de fato travavam. As 4 sessões foram desenhadas pra testar essa hipótese; o Ranking Consolidado e a Matriz CSD, na Avaliação (seção 3.1), é que confirmariam quais fricções eram reais e quão graves.

Dado o problema

Onde exatamente pessoas reais travam ao tentar entender e comprar os produtos da Welz — não o que elas dizem que achariam, mas o que de fato acontece quando usam o site ao vivo?

Pensei em

Rodar 4 sessões de Think Aloud com pessoas de alta compatibilidade com o público (corredores, farmacêutica, fisioterapeuta, entusiasta de musculação), sem uma definição formal de persona prévia.

Por isso criei
Tarefa

Conduzir e transcrever as 4 sessões

Protocolo de verbalização (think aloud) durante o uso real do site.

O que me ajudou a

A consolidação das 4 sessões virou a fonte primária de quase todo o projeto: o Ranking Consolidado de Problemas e a Matriz CSD (seção 3.1) nasceram direto dela, e achados específicos — como a incompreensão do termo "peptídeos" e a rejeição da assinatura na 1ª compra — motivaram decisões de copy e de carrinho até no Redesign (fase 4).

IHC
Seção 2.4

Auditoria de UI

Hipótese de partida: a interface institucional já violaria heurísticas de usabilidade consagradas, mesmo antes de qualquer teste com usuário. Extrair tokens e marcar heurísticas eram os dois lados da mesma inspeção — mas só o Think Aloud, na Avaliação, confirmaria se essas violações de fato afetavam o comportamento real de quem tentava comprar.

Dado o problema

Quais tokens de cor, tipografia e componentes já estavam validados no Figma institucional — e, além disso, onde a interface institucional já viola heurísticas de usabilidade consagradas (Nielsen), antes mesmo de qualquer entrevista com usuário?

Pensei em

Extrair diretamente do Figma institucional (home, PDP, checkout) os tokens e componentes em uso, consolidando 6 componentes atômicos com variações de estado, e sobrepor duas camadas de marcação sobre as mesmas 6 pranchetas: achados de conteúdo/estratégia e achados de craft de UI, com heurísticas de Nielsen inclusas.

Por isso criei
Tarefa

Auditar o Figma institucional, extrair tokens e avaliar heurísticas de usabilidade

6 componentes atômicos mapeados, mais 2 camadas de achados (conteúdo/estratégia e craft de UI) sobre as 6 pranchetas, heurísticas de Nielsen inclusas.

O que me ajudou a

Essa dupla leitura — tokens institucionais + heurísticas violadas — garantiu que o redesenho reforçasse o product-market fit já adotado (missão 1.1.3) sem repetir os mesmos problemas de craft de UI identificados logo na largada, antes mesmo do Think Aloud confirmar o impacto deles no usuário real.

UX/UI
O que me ajudou a

As lições abaixo só existem porque a Avaliação (fase 3) aplicou essas hipóteses no mundo real e confirmou (ou refutou) cada uma — a fase 2 levantou a pergunta, a fase 3 é que respondeu. Este bloco é retroalimentado pela fase 3: cada item cita a seção que fechou o ciclo.

  • Hipótese confirmada — evidência já existia, faltava exposiçãoO desk research (2.1) levantou a hipótese de que a Welz já tinha lastro científico pra boa parte dos claims; o Benchmark científico e regulatório (3.3) confirmou: 0 claims de risco alto contra 6 nos concorrentes. O problema nunca foi falta de evidência, e sim falta dela na comunicação.
  • Hipótese confirmada — a vantagem regulatória era um diferencial prontoA mineração de copy (2.2) apostou que comparar claim a claim com 9 concorrentes revelaria vantagem competitiva; o mesmo Benchmark (3.3) confirmou o placar (0 vs. até 6 riscos) — pronto pra virar argumento de venda, não construído do zero.
  • Hipótese confirmada — findability é problema de uso, não de mensagemAs entrevistas Think Aloud (2.3) foram desenhadas pra testar se existiam fricções que a auditoria de conteúdo não veria; o Ranking Consolidado e a Matriz CSD (3.1) confirmaram: achado #1 do projeto, 4 de 4 participantes não achavam o site.
  • Hipótese confirmada — inspeção heurística antecipa o que o teste com usuário confirmaA Auditoria de UI (2.4) apostou que violações de heurísticas de Nielsen já seriam visíveis antes de qualquer entrevista; a Auditoria de UI da Avaliação (3.2), com achados de craft de UI e citações reais, confirmou boa parte delas — inspeção especializada e teste com usuário se reforçam, não se substituem.
Fase 03

Avaliação

5 seções

O que trava a experiência de compra, na fala de quem tentou — 5 frentes, cada uma com seu próprio tipo de evidência.

Dado o problema

As hipóteses levantadas na Discovery (fase 2) — lastro científico, vantagem regulatória, fricções de uso reais e violações de heurística — ainda eram suposições, não fatos confirmados. Faltava aplicá-las contra o comportamento real de quem tenta comprar.

Pensei em

Rodar os mesmos instrumentos da Discovery agora com foco em confirmar ou refutar cada hipótese — Think Aloud, Auditoria de UI e Benchmark —, consolidando os achados em ranking de prioridade e em mapas de jornada e proposta de valor. A escolha de qual abordagem rodar em cada frente seguiu a matriz de priorização de pesquisa de Ananda Nadya, que cruza Clareza do problema (baixa↔alta) com Risco (baixo↔alto) em 4 quadrantes. A Usabilidade (3.1) caiu em Research Heavy — baixa clareza sobre a fricção real de quem tenta comprar, alto risco de atacar o problema errado, o que pedia pesquisa primária qualitativa (Think Aloud). O Benchmark científico e regulatório (3.3) caiu em Research Light — clareza baixa sobre o posicionamento frente aos concorrentes, mas risco baixo, resolvido com desk research rápida via crawler contra parâmetros ANVISA/EFSA. Já com achados primários em mãos, a Auditoria de UI (3.2) e os Mapas de jornada e proposta de valor (3.4) caíram em Design Heavy — clareza alta, mas risco ainda alto sobre craft de UI e proposta de valor, o que justificou consolidar tudo em material pronto pra virar decisão de design. Por fim, as Heurísticas de Usabilidade (3.5), rodadas só depois do redesenho publicado, caíram em Ship it & Measure — alta clareza sobre o que já foi decidido, baixo risco por ser uma varredura automatizada de confirmação, não uma investigação nova.

Matriz de priorização de pesquisa — onde caiu cada abordagem (3.1–3.5)
Risco ↑
Research Heavy
Baixa clareza · Alto risco — pesquisa primária aprofundada antes de decidir.
3.1 Usabilidade (Think Aloud)
Design Heavy
Alta clareza · Alto risco — achados viram workshop de ideação e decisão de design.
3.2 Auditoria de UI3.4 Mapas de jornada e proposta de valor
Research Light
Baixa clareza · Baixo risco — pesquisa rápida e barata só pra destravar clareza.
3.3 Benchmark científico e regulatório
Ship it & Measure
Alta clareza · Baixo risco — implementa e mede, sem pesquisa primária nova.
3.5 Heurísticas de Usabilidade (follow-up em produção)
Clareza do problema →
Por isso criei
Seção 3.1

Usabilidade (Think Aloud)

13 achados mapeados, 5 críticos. Nenhum dos 4 participantes achou o site na primeira busca no Google. O termo "peptídeos" não é compreendido por 3 de 4 pessoas.

🏆 Ranking Consolidado de Problemas
#ProblemaFreq.GravidadeImpacto
1Findability Severa4/4CríticoImpede completamente o acesso
2Jargão Incompreensível3/4CríticoImpede a compreensão do valor
3Falta de Flexibilidade (Sabores)3/4AltoBarreira pra experimentação
4Comunicação Ineficaz3/4AltoUsuário não se sente motivado
5Checkout Frustrante2/4AltoAumenta fricção no checkout
6Problemas Técnicos2/4MédioGera frustração
7Preço Elevado2/4MédioPode barrar a conversão
8Ausência de Avaliações1/4AltoReduz confiança (perfil técnico)
9Dados Científicos Confusos1/4MédioReduz credibilidade (técnico)
📌 Matriz CSD

Achados das 4 sessões Think Aloud organizados em Certezas (confirmadas pela pesquisa), Suposições (hipóteses com alguma evidência, ainda precisam de validação) e Dúvidas (questões abertas que o processo não respondeu).

✅ Certezas
  • Findability é o maior gargalo4/4 participantes — 100%O site não é encontrado; Instagram é o gateway.
  • Jargão "peptídeos" não é compreendido3/4 participantes — 75%Apenas Caroline (farmacêutica) conhece o termo.
  • Usuários preferem compra única para primeira experiência4/4 participantes — 100%Assinatura é rejeitada para experimentação.
  • Falta de flexibilidade na quantidade é uma barreira3/4 participantes — 75%Fardos fechados impedem experimentação.
  • Proposta de valor não é clara na página inicial3/4 participantes — 75%Usuários precisam rolar para entender o produto.
🔶 Suposições
  • Login social aumentaria a conversãoEvidência em 2/4 participantesThales e Fani sentiram falta; Caroline preferiu criar conta.
  • Problemas técnicos afetam a experiênciaEvidência em 2/4 participantesFani e Kátia relataram problemas com rolagem/carrossel.
  • Preço é uma barreira para alguns perfisEvidência em 2/4 participantesFani e Kátia consideraram caro; Thales e Caroline não mencionaram.
  • Rigor científico é decisivo para perfis técnicosEvidência em 1/4 participantesKátia (fisioterapeuta) e Caroline (farmacêutica) valorizam fontes.
  • Avaliações autênticas aumentariam a confiançaEvidência em 1/4 participantesCaroline buscou avaliações no Instagram por falta delas no site.
❓ Dúvidas
  • Qual a proporção de usuários técnicos vs. não-técnicos?Caroline e Kátia representam perfis técnicos; Thales e Fani, não. Qual é a maioria?
  • Qual é a quantidade ideal mínima para experimentação?3 latas? 2 latas? 1 lata? É viável para o negócio?
  • Os problemas técnicos são recorrentes ou específicos?Fani e Kátia usam Mac/Chrome. O problema é generalizado?
  • Qual é a elasticidade-preço do produto?Quanto os usuários estariam dispostos a pagar?
  • Como comunicar "peptídeos" sem perder a credibilidade científica?Precisa equilibrar acessibilidade e rigor.
  • O menu "Ciência" é relevante para a maioria dos usuários?Thales e Fani não clicaram; Caroline e Kátia sim.
Dado o problema

A hipótese levantada na Discovery (seção 2.3) — de que existiam fricções de uso que nenhuma auditoria de conteúdo revelaria — precisava ser consolidada em prioridade: quais achados eram mais frequentes e mais graves, e quais eram só ruído pontual de uma pessoa.

Pensei em

Organizar os achados brutos das 4 sessões num ranking por frequência/gravidade e numa Matriz CSD (Certezas, Suposições, Dúvidas), separando o que já está confirmado do que ainda precisa de mais evidência.

Por isso criei
Tarefa

Consolidar os achados em ranking + matriz CSD

Certezas, Suposições e Dúvidas, priorizadas por frequência e gravidade.

O que me ajudou a

Confirmou a hipótese da Discovery: Findability Severa ficou em 1º lugar no ranking (4/4, crítico) e Jargão Incompreensível em 2º (3/4, crítico) — os dois problemas que mais moldaram a Home dualizada, o menu único e a decisão de introduzir "peptídeos" só depois da analogia "colágeno pré-quebrado" no Redesign.

IHC Estatística
Seção 3.2

Auditoria de UI

2 camadas de marcação sobre as 6 pranchetas reais do Figma institucional (conteúdo/estratégia e craft de UI), complementadas pela avaliação da arquitetura de informação — sitemap e fluxo de compra do site atual, com 17 rupturas marcadas.

Ilustrações
Auditoria de UI completa sobre as 6 pranchetas institucionais
As 6 pranchetas com achados de conteúdo/estratégia e de craft de UI marcados sobre a própria tela. Clique pra abrir no FigJam.
Arquitetura da informação atual: sitemap, fluxo de compra e rupturas navegacionais da Home, com 17 pontos marcados
Arquitetura da informação atual — sitemap, fluxo de compra e o detalhe de rupturas navegacionais da Home, com os 17 pontos de UX/UI/Copy/Funil e a legenda por fonte. Clique pra ver em 100%.
Dado o problema

A hipótese levantada na Discovery (seção 2.4) — de que a interface institucional já violaria heurísticas de usabilidade consagradas — precisava ser registrada de forma rastreável, prancheta a prancheta, e não só apontada em texto solto. E a própria arquitetura de informação e o fluxo de compra do site atual, discutidos até aqui só em texto corrido, precisavam de um registro visual que tornasse rastreáveis os pontos de ruptura pro funil de venda.

Pensei em

Marcar 2 camadas de achados sobre as mesmas 6 pranchetas institucionais — conteúdo/estratégia e craft de UI (heurísticas de Nielsen inclusas) — com pins numerados e cards de citação, destacando também os pontos fortes, não só as fragilidades. Em paralelo, desenhar o sitemap e o fluxo de compra do site atual num fluxograma dedicado no FigJam, cruzando o crawl real do site com os achados das entrevistas Think Aloud, da própria auditoria de UI e da auditoria heurística — 17 pontos de ruptura de UX, UI, Copy e funil, cada um com a fonte que o sustenta.

Por isso criei
Tarefa

Marcar pins numerados + cards de citação sobre cada prancheta

Pro achado mais crítico, recriamos o layout com setas vermelhas apontando o problema.

Tarefa

Mapear a arquitetura de informação atual e marcar rupturas

Sitemap + fluxo de compra + detalhe da Home, com 17 pontos de UX/UI/Copy/Funil cruzando Think Aloud, auditoria de UI e auditoria heurística.

O que me ajudou a

Confirmou boa parte da hipótese da Discovery: heurísticas como Consistência e Padrões e Controle e Liberdade do Usuário já apareciam violadas nas pranchetas, e essas mesmas violações se repetiam na prática ao longo do funil de compra real — achados que, juntos, orientaram diretamente a arquitetura de informação do Redesign (menu único, indicador de progresso no carrinho).

UX/UI IHC
Seção 3.3

Benchmark científico e regulatório

0 claims de risco alto em 35 alegações mapeadas na Welz, contra 6 encontrados em concorrentes.

Dado o problema

A hipótese levantada na Discovery (seções 2.1 e 2.2) — de que a Welz já teria lastro científico e vantagem regulatória sobre os concorrentes — precisava de um veredito claim a claim, não só uma impressão geral de que "a ciência parece sólida".

Pensei em

Classificar as 35 alegações da Welz e as dos 9 concorrentes contra os parâmetros ANVISA/EFSA, usando a mesma árvore de decisão de 6 níveis (Grade A-E) aplicada nas duas pontas.

Por isso criei
Tarefa

Mapear e classificar as alegações por risco regulatório

Contra parâmetros ANVISA/EFSA.

O que me ajudou a

Confirmou as duas hipóteses da Discovery: 0 claims de risco alto em 35 alegações da Welz, contra 6 encontrados em concorrentes — um diferencial competitivo real, que virou a base do bloco Comparativo na PDP redesenhada.

Mercado Estatística
Seção 3.4

Mapas de jornada e proposta de valor

Os achados viraram 3 mapas no FigJam: Jornada do Usuário, Jornada do Cliente e Proposta de Valor do Body Peptides.

Ilustrações
Jornada do Usuário
Jornada do Usuário (site)
Jornada do Cliente
Jornada do Cliente (jornada ampla de cuidado com o corpo)
Proposta de Valor Body Peptides
Proposta de Valor — Body Peptides
Dado o problema

Os achados das 3 frentes anteriores (Think Aloud, Auditoria de UI, Benchmark) estavam dispersos em documentos separados — sem consolidá-los visualmente, ficaria difícil enxergar onde a jornada do usuário e a proposta de valor do produto realmente se cruzavam (ou se perdiam).

Pensei em

Sintetizar os achados dispersos em 3 mapas no FigJam: a Jornada do Usuário (site), a Jornada do Cliente (cuidado com o corpo, mais ampla) e a Proposta de Valor do Body Peptides.

Por isso criei
Tarefa

Sintetizar os achados dispersos em mapas visuais únicos

Um mapa por tipo de jornada + um de proposta de valor.

O que me ajudou a

Os 3 mapas viraram a ponte direta entre a Avaliação e o Redesign: a Proposta de Valor orientou a reescrita da PDP bloco a bloco, e a Jornada do Usuário sustentou a decisão de reorganizar a arquitetura de informação do site inteiro, não só uma página isolada.

UX/UI Produto
Seção 3.5

Heurísticas de Usabilidade

Follow-up (14/09/2026): 10 heurísticas de Nielsen testadas direto no site em produção — 23 achados, 2 críticos.

🔎 Top achados — site em produção
#AchadoGravidadeHeurística
1Política de Privacidade cita a marca "LIVE!" e linka pro site erradoCríticoH2 · Correspondência
2Stepper de quantidade soma 6 latas por clique sem avisarCríticoH6 · Reconhecimento
3Link "Ciência" do menu aponta pra uma âncora que não existeAltoH4 · Consistência
4"Assinatura" pré-selecionada e destacada sobre compra únicaAltoH3 · Controle
5Erro de checkout só como banner genéricoAltoH9 · Diagnóstico
6Modal "perfis falsos" bloqueia a home toda sessão novaMédioH3 · Controle
Dado o problema

Depois do redesenho fechado, ainda não havia uma checagem formal de quais problemas do site real em produção persistiam ou não — nem confirmação de que os achados das seções 3.1-3.4 de fato tinham sido resolvidos nas duas páginas redesenhadas.

Pensei em

Rodar 4 varreduras automatizadas em paralelo (Chrome, viewport 1278×888) cobrindo navegação global, home, ciência, produtos/PDPs, carrinho, checkout, conta/login, blog e páginas institucionais, testando as 10 heurísticas de Nielsen direto em welznutrition.com.br.

Por isso criei
Tarefa

Rodar 4 varreduras automatizadas cobrindo todo o site

Navegação, home, ciência, PDPs, carrinho, checkout, conta, blog e institucionais.

O que me ajudou a

23 achados, 2 críticos — o mais grave: a Política de Privacidade em produção ainda cita a marca errada ("LIVE!"). Mas também confirmou uma decisão do Redesign: o carrinho redesenhado já nomeia a unidade corretamente como "fardo (6 latas)", enquanto o stepper do site em produção ainda soma 6 latas por clique sem avisar — prova prática de que o nosso redesenho evitou esse problema antes mesmo dele ser formalmente encontrado aqui.

IHC
O que me ajudou a

Confirmar 13 achados de usabilidade (5 críticos) — o mais grave: nenhum dos 4 participantes achou o site na 1ª busca no Google (Findability, CSD 4/4) — e cruzar isso com o Benchmark científico (0 riscos altos) fechou o ciclo de hipóteses aberto na Discovery (fase 2), retroalimentando o "O que me ajudou a" daquela fase com a confirmação de cada uma.

Fase 04

Redesign

8 seções

Da página transacional pra uma landing que conta a história certa — reorganização da arquitetura de informação do site inteiro, com 2 casos mais aprofundados.

Dado o problema

O Ranking Consolidado (Avaliação, seção 3.1) confirmou 9 problemas atravessando a experiência inteira — não bastava mexer numa página isolada; a solução precisava reorganizar a arquitetura de informação do site inteiro, com 2 casos aprofundados dentro dela. Pra decidir o que atacar primeiro entre as 4 frentes abaixo, cruzei Impacto (no usuário e na conversão) com Esforço (de implementação) numa matriz de priorização — usando as metas de negócio da seção 1.3 como critério de desempate quando duas frentes empatavam em Impacto e Esforço. A Arquitetura da informação (4.1) e a PDP do Body Peptides (4.3) caíram as duas em Grande Aposta (alto impacto, alto esforço); o empate foi resolvido pelas metas — 4.1 entrou primeiro porque ataca Adoção e Produtividade no site inteiro, resolvendo a Findability Severa ("impede completamente o acesso") e destravando o tráfego que a PDP (4.3) precisa pra converter, cujo ganho é sobretudo de Qualidade e Risco (comparativo científico, prova social). O Carrinho — barganha e desconto (4.4) caiu em Quick Win (alto impacto, baixo esforço): Kit Experimentação e desconto progressivo atacam direto Adoção, Retenção e Custo de Operação com uma implementação mais contida. Já o Refinamento wireframe → código (4.5) caiu em Tarefa Ingrata (baixo impacto visível, alto esforço de reconciliação) — sozinho, perderia pra qualquer Quick Win; entrou mesmo assim porque suas metas (Custo de Operação, Risco, Qualidade) protegem o investimento já feito nas outras 3 frentes.

Matriz de priorização Impacto × Esforço — metas de negócio como desempate (4.1, 4.3–4.5)
Impacto ↑
Quick Win
Alto impacto · Baixo esforço.
4.4 Carrinho — barganha e desconto
Metas: Adoção · Retenção · Custo de Operação
Grande Aposta
Alto impacto · Alto esforço.
4.1 Arquitetura da informação4.3 Body Peptides — PDP
Metas: 4.1 — Adoção · Produtividade · 4.3 — Adoção · Qualidade · Risco
Preenchimento
Baixo impacto · Baixo esforço. Nenhuma atividade do Redesign caiu aqui.
Tarefa Ingrata
Baixo impacto · Alto esforço.
4.5 Refinamento wireframe → código
Metas: Custo de Operação · Risco · Qualidade
Esforço →
Pensei em

Redesenhar a Home, a PDP do Body Peptides e o Carrinho de Compra em 3 frentes paralelas — arquitetura de informação, narrativa de conteúdo e motor comercial —, cada decisão rastreável até um achado específico confirmado na Avaliação.

Por isso criei
Seção 4.1

Arquitetura da informação

Home de acesso dualizado, menu único interconectando todas as páginas, carrinho ganhando 3 etapas cadenciadas (Carrinho → Entrega → Pagamento) — eliminando a camada redundante de catálogo e deixando o limite de escopo explícito onde a página ainda é esqueleto.

Arquitetura da informação sugerida: sitemap e fluxo de compra do redesign, com correções e melhorias potenciais marcadas
Arquitetura da informação sugerida — o par direto da AI-Atual (seção 3.2), com as correções de navegação já aplicadas e as melhorias potenciais ainda em aberto, cada uma com defesa. Clique pra ver em 100%.
Dado o problema

O achado de Auditoria de UI (seção 3.2) sobre falta de indicador de progresso no checkout, somado à ausência de um menu único interconectando as páginas, exigia repensar a arquitetura de informação do site inteiro, não só uma tela.

Pensei em

Desenhar uma Home de acesso dualizado (os dois produtos lado a lado, sem hierarquia imposta) interconectada por um único menu, com o carrinho ganhando 3 etapas cadenciadas (Carrinho → Entrega → Pagamento) — mapeando essa arquitetura na AI-Sugerida do FigJam antes de implementar, pra visualizar lado a lado com a AI-Atual (seção 3.2) onde cada ruptura navegacional seria de fato resolvida.

Por isso criei
Tarefa

Desenhar e publicar a Home + a navegação em 3 etapas do carrinho

Os dois produtos lado a lado, sem hierarquia imposta entre eles.

O que me ajudou a

Resolveu diretamente o achado de progresso ausente no checkout (3.2) e a fricção de navegação identificada no Think Aloud (3.1) — a 1ª etapa do carrinho depois virou objeto de um redesenho aprofundado por conta própria (seção 4.4). Comparada lado a lado com a AI-Atual, a nova arquitetura confirma 3 ganhos diretos de navegação: elimina o hub "Produtos" redundante (Home já dualizada dá acesso direto aos 2 produtos), resolve a ausência de indicador de progresso no carrinho, e torna o limite do escopo visível em toda página esqueleto via modal de aviso — nenhum dos três existia no site atual.

UX/UI Produto
Seção 4.2

Design de Interação

3 micro-interações líquidas calibradas isoladamente, num laboratório dedicado, antes de irem pro código real da PDP e do carrinho.

Tarefa

Flavor toggle líquido

2 elementos (bolha + rastro) + filtro SVG goo (feGaussianBlur + feColorMatrix) fazem o thumb esticar, encolher e se fundir ao trocar de sabor.

Flavor toggle líquido trocando entre Yuzu e Limonada com Framboesa
Captura real da tela: troca Yuzu ↔ Limonada c/ Framboesa (Body Peptides), thumb esticando e se fundindo em goo líquido.
Tarefa

Voo CTA → carrinho

O botão morpha (Flubber) num círculo, viaja até a bolsa e é absorvido, com drop-shadow nas duas etapas do voo.

Botão Adicionar ao Carrinho morphando num círculo líquido com o texto Item adicionado
Captura real da tela: clique no CTA, morph Flubber em círculo, texto "Item adicionado" e absorção.
Tarefa

Troca de card entre Assinatura e Compra única

4 fases assimétricas, sem morph de path — só width/height/border-radius. Bug de sequenciamento corrigido depois de observado em uso real.

Card do produto encolhendo, viajando e reaparecendo na coluna Compra única
Captura real da tela: card saindo da Assinatura, bolha viajando, e reaparecendo como card na Compra única.
UX/UI Dev web
Seção 4.3

Body Peptides — PDP

Da página transacional original pra uma landing narrativa de 13 seções, cada uma resolvendo um achado específico da pesquisa.

Ilustrações — capturas reais
Captura real — Hero e Proposta de valor
Hero + Proposta de valor, com marcações de decisão de design.
Captura real — Kit Experimentação e Comparativo
Kit Experimentação + Comparativo.
Captura real — FAQ e Por trás da marca
FAQ + "Por trás da marca" (efeito halo da LIVE!).
Captura real — CTA final
CTA final ecoando o Kit Experimentação.
Levantamento — viés e pesquisa por bloco da PDP
BlocoViés aplicadoPesquisa / CSD (o problema)
01 · HeroContexto · Superioridade de ImagemAchado #4 — "essa informação poderia até vir antes" (Fani)
02 · Proposta de valorAncoragemAchado #4 — recomendação: valor no banner principal
03 · O que são peptídeos?Atalho MetafóricoAchado #2 (Crítico) — "não tô entendendo o que é peptídio" (Thales)
04 · Como age + a provaAutoridade · AncoragemAchado #9 — "não tô conseguindo verificar o controle" (Kátia)
05 · Quando tomarProgresso IniciadoPonto positivo confirmado — "parece super simples" (Fani)
06 · Kit ExperimentaçãoEscolha Limitada (invertido)Achado #3 + CSD 100% — "só dá pra comprar 14 sachês" (Kátia)
07 · ComparativoEnquadramento · HaloCSD — rigor científico decisivo p/ perfis técnicos
08 · Prova socialProva SocialAchado #8 — "não tem avaliação de quem comprou" (Caroline)
09 · Modo de uso + calculadoraAtalho de FluênciaExtensão do Achado #3 — sem CTA colado
10 · Decisão de compraEfeito Padrão (invertido)CSD 100% — compra única preferida na 1ª experiência
11 · FAQCuriosidadeConfirma o Achado #3 pra quem pula pro FAQ
12 · Por trás da marca (LIVE!)Efeito HaloExtensão do Achado #8 — credibilidade emprestada
13 · CTA finalNovo ComeçoFecha o arco dos blocos 06+10
Dado o problema

9 dos 13 blocos da PDP precisavam responder direto a um achado específico confirmado no Think Aloud ou na Matriz CSD (seção 3.1) — ver tabela acima, bloco a bloco; sem essa rastreabilidade, a landing viraria só copy bonito, sem lastro de pesquisa.

Pensei em

Reescrever a PDP transacional original como landing narrativa de 13 seções, cada uma justificada por uma carta do Baralho de Vieses e por um achado específico da Avaliação — o termo "peptídeos" só aparece depois da analogia "colágeno pré-quebrado".

Por isso criei
Tarefa

Reescrever a PDP bloco a bloco, aplicando vieses do Baralho

O termo "peptídeos" só aparece depois da analogia "colágeno pré-quebrado".

O que me ajudou a

Confirma na prática o achado #2 (crítico) do Think Aloud — a incompreensão do termo "peptídeos" — e vira a peça mais aprofundada e mais documentada do projeto: cada decisão de copy defensável bloco a bloco, na Defesa das Escolhas de Design.

UX/UI Dev web
Seção 4.4

Carrinho — barganha e desconto

2ª rodada de redesenho, agora com objetivo comercial explícito: aumentar ticket médio e giro via barganha (Kit Experimentação, desconto progressivo, troca de card em 1 clique).

Dado o problema

O achado #3 (Alto) + CSD 100% do Think Aloud — "só dá pra comprar 14 sachês" (Kátia) — mostrou que o fardo fechado impedia qualquer experimentação de baixo risco; depois do escopo original fechado, esse mesmo achado virou gatilho de uma 2ª rodada com objetivo comercial explícito.

Pensei em

Implementar um motor de barganha e desconto no carrinho — Kit Experimentação gratuito (limite 1/CPF), desconto progressivo por quantidade, conversão de 1 clique entre Compra Única e Assinatura — sustentado por 3 micro-interações líquidas próprias, calibradas antes num laboratório dedicado.

Por isso criei
Tarefa

Implementar o motor de barganha + as micro-interações que o sustentam

Kit gratuito (limite 1/CPF), desconto progressivo, conversão de 1 clique Compra Única ↔ Assinatura.

O que me ajudou a

Resolveu a barreira de experimentação identificada no Think Aloud e abriu uma alavanca comercial nova (ticket médio e giro de produto) que não fazia parte do escopo original — motivo pelo qual essa seção nasceu depois do fechamento inicial do Redesign.

Dev web Produto
Seção 4.5

Refinamento wireframe → código

Wireframe em 4 versões no Figma (v1→v4), implementação em HTML/CSS/JS puro também refinada em várias rodadas (design1→design3), GSAP + ScrollTrigger.

Ilustrações — wireframe v4
Wireframe v4 — bloco Hero
Bloco 01 · Hero, com viés e achado anotados no wireframe.
Wireframe v4 — bloco Comparativo
Bloco 07 · Comparativo, mantido da v1.
Wireframe v4 — bloco Decisão de compra
Bloco 10 · Decisão de compra, invertido pela CSD 100%.
Wireframe v4 — fix bloco 13
Bloco 13 (fix) — 1 dos 2 ajustes da reconciliação final.
Dado o problema

O wireframe (Figma) e o HTML publicado tinham divergido ao longo de 4 rodadas de refinamento — sem uma reconciliação final, a Auditoria de UI (seção 3.2) ficaria com achados sem correspondência garantida no código real.

Pensei em

Reconciliar formalmente o wireframe v4 com o HTML já implementado e com a Auditoria de UI, aplicando os 2 últimos ajustes que ainda faltavam antes de considerar o Redesign fechado.

Por isso criei
Tarefa

Reconciliar wireframe, HTML publicado e Auditoria de UI

v4 aplica os 2 últimos ajustes que ainda faltavam.

O que me ajudou a

Fechou o ciclo entre design e código — nenhum achado da Auditoria de UI ficou só no papel, e o wireframe v4 virou o registro oficial de como cada decisão de design foi, de fato, implementada.

Dev web UX/UI
O que me ajudou a

Síntese do que a fase de Redesign confirmou na prática, aplicando os achados da Avaliação:

  • Arquitetura resolve mais do que uma página sozinhaA Home dualizada e o carrinho em 3 etapas (4.1) resolveram 2 achados de uma vez — progresso ausente no checkout (3.2) e fricção de navegação (3.1) — confirmando que o problema nunca foi só a PDP.
  • Rastreabilidade bloco a bloco sustenta a landing9 dos 13 blocos da PDP (4.3) respondem a um achado específico — sem essa disciplina, o redesenho seria só copy bonito, não uma resposta a pesquisa real.
  • Um achado pode virar alavanca comercial depois do escopo fechadoO mesmo achado #3 do Think Aloud que motivou o Kit Experimentação na PDP (4.3) voltou, meses depois, como gatilho do motor de barganha do carrinho (4.4) — pesquisa e comércio se reforçando.
  • Reconciliação final evita achado perdidoSem a seção 4.5, parte dos achados da Auditoria de UI (3.2) teria ficado só no wireframe, sem virar código publicado.
Assim eu consigo

Controlar, medir e gerenciar o impacto das decisões de design e mensurar o retorno do investimento e/ou validações de comportamento dos clientes.

Seção 4.6

Metas de negócio por trás do redesign

6 parâmetros, diretos e indiretos, um por cor — a base contra a qual toda decisão de Redesign (4.1–4.5) é medida.

Metas de negócio por trás do redesign — 6 parâmetros, diretos e indiretos
Adoção
  • Taxa de conversão visita→compra (direto)na PDP e no funil de carrinho redesenhados.
  • Taxa de resgate do Kit Experimentação (direto)a isca de baixo risco criada pra destravar a 1ª compra.
  • Conversão de 1 clique Compra Única → Assinatura (direto)no carrinho.
  • Crescimento de tráfego direto/orgânico (indireto)atribuível à melhoria de findability (achado crítico #1 da Avaliação).
  • Uso da calculadora de consumo mensal (indireto)como ponto de entrada de compra.
Produtividade
  • Tempo até a decisão de compra (direto)1ª visita à PDP até o add-to-cart.
  • Nº de etapas até o checkout completo (direto)carrinho cadenciado em 3 passos com indicador de progresso.
  • Taxa de abandono por etapa do carrinho (direto)
  • Redução no tempo de atendimento (indireto)sobre dúvidas já cobertas no copy (jargão "peptídeos", quantidade mínima).
  • Scroll depth até a conversão (indireto)mede o esforço até a decisão nos 13 blocos narrativos.
Custo de Operação
  • Custo de aquisição por conversão (direto)considerando o Kit Experimentação gratuito (limite 1/CPF).
  • Volume de tickets de atendimento (direto)sobre pontos já resolvidos (ex.: unidade "fardo (6 latas)" nomeada desde a 1ª versão).
  • Custo de manutenção do design system (indireto)tokens ainda duplicados entre a PDP e as páginas novas.
  • Custo de devolução/troca (indireto)atribuível a expectativa mal comunicada sobre quantidade ou cobrança.
Risco
  • Claims em risco alto/muito alto — ANVISA/EFSA (direto)dado já coletado: 0/35 na Welz vs. 6 em concorrentes.
  • Achados críticos/altos ainda abertos em produção (direto)dado já coletado: 23 achados no follow-up heurístico, 2 críticos.
  • Risco de conformidade legal (direto)ex.: Política de Privacidade citando a marca errada ("LIVE!").
  • Risco reputacional de depoimentos fictícios (indireto)na prova social — pendência explícita.
  • Risco de churn (indireto)nas páginas-esqueleto (Entrega, Pagamento, Conta).
Qualidade
  • Taxa de erro/achados de usabilidade (direto)dado já coletado: 13 achados no Think Aloud, 5 críticos.
  • Core Web Vitals — LCP, CLS, INP (direto)da PDP com as animações scroll-driven.
  • Satisfação pós-compra — CSAT/NPS (direto)ainda não instrumentado.
  • Qualidade percebida da marca (indireto)efeito halo do grupo LIVE! e credibilidade científica no comparativo.
  • Consistência de acessibilidade (indireto)prefers-reduced-motion, aria-*, navegação intacta sem animação.
Retenção
  • Taxa de recompra do fardo de 6 (direto)em até 60 dias após resgate do Kit Experimentação.
  • Retenção em Assinatura vs. cancelamento (direto)
  • LTV por CPF (indireto)cruzado com o custo do Kit Experimentação gratuito.
  • Recorrência de acesso à Home dualizada (indireto)retorno pra considerar o 2º produto (Daily Hydration).
Produto Estatística
Seção 4.7

Decisão → parâmetro correlacionado

12 decisões de design do Redesign, cada uma correlacionada a 1-3 dos 6 parâmetros da seção 4.6 — mesma cor, mesmo parâmetro.

Decisão → parâmetro correlacionado (12 completas)
Decisão de designParâmetros correlacionados
Arquitetura da informação — Home dualizada + menu único + carrinho em 3 etapas
AdoçãoProdutividade
PDP como landing narrativa — "peptídeos" só após a analogia "colágeno pré-quebrado"
AdoçãoQualidade
Kit Experimentação gratuito (4 latas, 2 sabores, limite 1/CPF)
AdoçãoCusto de OperaçãoRetenção
Desconto progressivo + conversão 1 clique Compra Única ↔ Assinatura
AdoçãoRetenção
Calculadora de consumo mensal conectada ao carrinho
ProdutividadeAdoção
Comparativo científico Welz x concorrentes
QualidadeRisco
Prova social + efeito halo do grupo LIVE!
QualidadeRisco
Micro-interações líquidas (flavor toggle, voo CTA, troca de card, feedback de adição)
QualidadeProdutividade
Indicador de progresso em 3 etapas no carrinho
ProdutividadeQualidade
Modal de aviso de escopo nas páginas-esqueleto
RiscoQualidade
Pendência — padronização de design tokens (PDP vs. páginas novas)
Custo de Operação
Auditoria heurística de acompanhamento no site em produção (14/09)
RiscoQualidade
Produto Estatística
Seção 4.8

Métricas e variáveis a testar

11 decisões com hipótese e métrica primária já definidas — prontas pra virar experimento (A/B ou pré/pós) se o projeto avançar pra produção instrumentada.

Métricas e variáveis a testar, se implementado (11 completas)
Decisão de designHipóteseMétrica primária
CTA "Compra única" como padrãoReduz fricção na 1ª compra vs. padrão anterior (assinatura)Taxa de conversão no checkout (compra única)
Kit Experimentação (2 latas/sabor)Reduz a barreira do fardo fechado na 1ª compraTaxa de add-to-cart do Kit vs. fardo de 6
Kit Experimentação gratuito no carrinho (limite 1/CPF)Reduz a barreira sem virar custo de aquisição indefinidoTaxa de resgate do Kit vs. taxa de recompra em 60 dias
Desconto progressivo + conversão visível no carrinhoDesconto explícito no carrinho converte mais que só na PDPTaxa de conversão pra Assinatura dentro do carrinho
Bloco "O que são peptídeos?"Reduz abandono por incompreensão do termoScroll depth / bounce rate antes vs. depois do bloco
Calculadora "quanto você precisa por mês"Aumenta confiança na quantidade sem empurrar consumoTaxa de interação com o slider/input
Comparativo (tabela Welz x concorrentes)Retém o público técnico (achado CSD)Scroll-to-view + dwell time na seção
Prova social real + halo LIVE!Aumenta confiança de quem nunca comprouCTR nas fotos / clique em "Conhecer a loja oficial"
FAQ nova pergunta (aberta por padrão)Resolve dúvida residual que ainda barra o KitCliques em "Adicionar Kit Experimentação" pós-FAQ
Animações scroll-triggeredAumentam percepção de qualidade sem prejudicar performanceCore Web Vitals real-user (LCP, CLS, INP) antes/depois
Vídeo do mecanismo com mute padrãoAutoplay silencioso não reduz engajamentoTaxa de un-mute manual
Tarefa

Consolidar metas, correlações e métricas de negócio do Redesign

6 parâmetros (4.6), 12 decisões correlacionadas (4.7) e 11 métricas testáveis (4.8).

Estatística Produto
Fase 05

Status e Referências

2 seções

Fechar o escopo com transparência: o que está pronto, o que é só esqueleto de navegação, e a contabilidade de tudo que sustenta o projeto — as metas de negócio por trás das decisões agora vivem no Redesign (fase 4.6–4.8). Sem framework de justificativa nesta fase — o conteúdo abaixo já é sincronizado direto do Portfolio v1 (index_bkp.html).

Seção 5.1

Status do projeto

Escopo fechado em 2 páginas com redesenho aprofundado (PDP + Carrinho); demais páginas existem só como esqueleto de navegação, com aviso explícito em modal.

Entregáveis desta fase
  • ✓PDP do Body Peptides redesenhada como landing narrativa (13 seções)
  • ✓Copy completo com mapeamento de vieses bloco a bloco
  • ✓Design tokens extraídos do Figma
  • ~Versão empacotada para publicação — status de deploy no Firebase ainda não confirmado
  • ✓Home dualizada (hero com os dois produtos, banners, rodapé) — agora abre pelo Portfolio
  • ✓Carrinho de Compra — mini-cart + tela cheia, com marcador de 3 etapas (1ª aprofundada; 2ª-3ª ainda esqueleto)
  • ✓Motor de barganha e desconto no carrinho — Kit Experimentação gratuito, desconto progressivo, conversão de 1 clique
  • ✓3 micro-interações líquidas próprias, catalogadas em laboratório dedicado
  • ✓Calculadora de consumo mensal (PDP) conectada ao carrinho via modal
  • ✓Menu interconectando todas as páginas do site
  • ✓Aviso de limite de escopo — modal nas páginas fora do redesenho aprofundado
  • ✓Justificativa da arquitetura de informação e das escolhas de design
  • ~Verificação visual da PDP em browser real — via Chrome headless; fluidez do scroll real ainda não avaliada
  • Depoimentos reais, substituindo os fictícios da prova social
Outros pontos do status
  • O que existe só como esqueleto de navegaçãoDaily Hydration, Por quê Welz, Minha conta e as etapas 2-3 do Carrinho (Entrega, Pagamento) servem só de suporte de acesso até a PDP e a 1ª etapa do carrinho — as duas com redesenho de fato aprofundado, com aviso automático em modal.
  • Pendências registradas pra uma próxima faseAnimações e transições mais fluidas na PDP (nunca testadas com scroll real), melhoria de conteúdo da Home (hoje deliberadamente mínima), finalização das subpáginas de checkout e conta, padronização de design tokens entre a PDP e as páginas novas.
  • Como acessar o projeto finalO protótipo publicado abre pela Home (home.html) — o menu leva a qualquer página, incluindo a PDP e o carrinho completo. O ícone de bolsa abre o mini-carrinho em qualquer página.
  • Como entender o limite do escopo3 lugares reforçam a mesma delimitação: o modal de aviso em toda página fora da PDP/carrinho, a nota de escopo em docs/03_redesign.md, e este próprio bloco de status.
Metas de negócio, correlação e métricas testáveis

O framework completo de metas de negócio — 6 parâmetros, a correlação decisão a decisão e as métricas testáveis — foi trazido pra dentro do Redesign, como "Assim eu consigo" da fase 4: Metas de negócio (4.6), Decisão → parâmetro (4.7), Métricas a testar (4.8).

Tarefa

Registrar o que está pronto, parcial e pendente

E deixar o limite do escopo visível em 3 lugares diferentes.

Produto
Seção 5.2

Referências

A contabilidade: quanto material foi de fato produzido, minerado ou escrito — ~19,4 mil linhas de código à mão, ~56 mil linhas de dados minerados.

PythonTypeScript / Node.jsGSAP + ScrollTrigger Figma + FigJamClaude CodeNotebookLM Firebase HostingChatGPT
Técnicas e abordagens aplicadas, por área
ÁreaTécnicas
IHC / PesquisaThink Aloud, heurísticas de Nielsen, matriz CSD, auditoria de UI em dupla camada, mapas de jornada
EstatísticaFrequência/gravidade de achados, ranking, tamanho de efeito (Cohen's d), comparação de claims
ProgramaçãoPython (crawling/ETL), TypeScript (MCP com testes), JS vanilla (GSAP)
Dev webHTML/CSS/JS sem framework, scroll-driven, acessibilidade, componentes compartilhados
Produto digitalArquitetura de informação, escopo e priorização, decisões com justificativa
UX/UIWireframing progressivo (4 versões), design system, motion design
Pesquisa de mercadoBenchmark de 9 concorrentes, comparação regulatória (ANVISA/EFSA)
Tarefa

Consolidar e documentar todo o material de suporte, por fase

Pra deixar rastreável o que sustenta cada decisão contada nas fases acima.

Programação Dev web
Acessar redesign →