Visão Geral
A Jus21 vende dezenas de cursos preparatórios para o Exame de Ordem e concursos jurídicos através de uma plataforma de ensino. Cada curso tem sua página de vendas — e todas elas eram texto corrido: parágrafos e listas simples, colados no editor de conteúdo da plataforma, sem hierarquia visual, sem ritmo, sem design.
Meu trabalho foi criar um modelo de página de vendas que funcionasse dentro das restrições reais do editor — que remove scripts, folhas de estilo externas e qualquer recurso carregado de fora — e transformá-lo em um sistema replicável, aplicado curso a curso em um ritmo de produção contínuo.
Resultado: mais de 7 páginas produzidas no novo padrão em 6 semanas, com aumento de 10% nas vendas, redução de 30% no tempo até o aluno encontrar o curso que procura e alunos permanecendo mais tempo lendo o conteúdo das páginas.
"Design não é o que você faz quando tem todas as ferramentas. É o que você faz com as ferramentas que a plataforma deixa passar."
Contexto e Restrições
As páginas vivem dentro do editor de conteúdo da plataforma de ensino da Jus21 — um ambiente com regras próprias que qualquer solução precisava respeitar. Em vez de tratá-las como obstáculo, mapeei cada restrição e a converti em decisão de design:
Quando a tentativa de usar uma biblioteca de ícones via CDN foi bloqueada pela sanitização da plataforma, a resposta virou padrão: 14 emojis distintos operam como sistema de ícones do modelo — do ✅ que marca cada item incluído no curso ao ⚠️ da caixa de atenção. Universais, acessíveis em qualquer dispositivo e imunes a qualquer filtro de código.
O Problema
Um aluno decidindo onde investir sua preparação para a OAB encontrava páginas que não respondiam às perguntas dele — nem visualmente, nem estruturalmente:
Pesquisa e Personas
Trabalhei com duas personas primárias, construídas a partir do conhecimento da equipe do curso sobre quem chega a essas páginas — e do dado mais importante do tráfego: 62% acessam pelo celular.
As duas personas fazem perguntas que a página precisa responder em segundos: "até quando tenho acesso?", "corrige minhas peças?", "quando começa?". Essas perguntas viraram componentes dedicados — o card duplo de datas, a tabela de itens incluídos e a caixa de Acesso — em vez de frases dentro de parágrafos.
Uma decisão consciente do projeto: as páginas de curso não têm seção de depoimentos própria. A prova social da Jus21 vive centralizada na homepage e em uma página dedicada — curar depoimentos específicos para cada um dos dezenas de cursos seria um custo editorial permanente, inviável para parte do catálogo. Melhor uma prova social forte e centralizada do que seções vazias ou genéricas espalhadas.
Anatomia da Página
O modelo tem 12 seções em uma ordem deliberada — cada bloco cumpre uma função no funil de decisão, da atenção ao fechamento. Como o botão de compra pertence à plataforma, o conteúdo inteiro é o argumento de venda:
Sistema de Componentes
O que começou como uma página virou um sistema: 10 padrões reutilizáveis que se recombinam conforme o curso. É isso que permitiu produzir mais de 7 páginas em 6 semanas mantendo consistência total:
Para cursos oferecidos com e sem mentoria individual, o sistema estabeleceu um par de versões: a v1 (padrão) e a v2 (com mentoria), que reaproveita a estrutura e adiciona os blocos específicos. Duas páginas de venda, um único trabalho de design.
Design System
A paleta espelha o universo jurídico: navy profundo como cor institucional, dourado como acento de valor, creme para superfícies de destaque. A estética é de cantos retos e divisores finos — sobriedade de documento, não de landing page genérica.
Design Visual
O modelo aplicado à página do 46º Exame de Ordem — 2ª Fase de Direito Administrativo, a referência que padronizou todas as páginas seguintes:
Processo de Produção
Um sistema de design só vale se a produção acompanha. O fluxo de trabalho envolve a Product Manager do curso e eu, em papéis claros:
Substituições em massa via expressões regulares em HTML cheio de entidades (é e afins) corromperam conteúdo em dois episódios. O processo migrou para substituições pontuais, linha a linha — mais lento por edição, muito mais rápido no total, porque retrabalho zero.
Resultados
Medidos pela plataforma após a adoção do novo formato nas páginas de curso:
Aprendizados
"A pergunta certa nunca foi ‘o que eu faria com liberdade total?’ — foi ‘qual é o melhor design que sobrevive a este editor?’"