Além do Cargo: presença, relacionamento e venda em uma só plataforma
Desenvolvida para o autor Carlos Cavalheiro, a plataforma Além do Cargo conecta a apresentação da obra e do autor à venda do livro físico, ao relacionamento com leitores e à gestão dos pedidos.
O projeto reúne site institucional, loja, blog, campanhas de e-mail e painel de gestão em uma experiência integrada. A identidade em preto e dourado, a tipografia editorial e a adaptação a diferentes telas reforçam a apresentação da obra.
Minha atuação combinou desenho da jornada, organização dos processos e construção da solução digital com Lovable, conectando a experiência do leitor às necessidades de quem administra a operação.
O desafio: conectar a divulgação à operação da venda
O desafio de negócio era reunir etapas que costumam depender de ferramentas e controles separados: despertar interesse pelo livro, captar contatos, receber pagamentos, organizar entregas e manter o leitor informado.
A solução foi concebida para dar continuidade a essa jornada. O visitante conhece a obra, pode entrar na lista de interessados ou comprar o livro, escolhe como recebê-lo e acompanha o pedido. Na gestão, conteúdo, contatos, campanhas e pedidos ficam reunidos em uma mesma plataforma.
Uma experiência de compra que considera a realidade do leitor
• Apresentação da obra e do autor: página com vídeos, pilares do livro, depoimentos, perguntas frequentes e oferta, organizada em seções editáveis.
• Captação de interessados: formulário com validação de contato, seleção de cidade e estado e mensagem automática de boas-vindas.
• Compra do livro físico: pagamento por cartão, Pix ou boleto, com aplicação de cupons promocionais.
• Entrega ou retirada: cálculo de frete e prazo para envio, ou retirada com o autor sem cobrança de frete. Os dados solicitados se ajustam à modalidade escolhida.
• Acompanhamento do pedido: consulta com número do pedido e e-mail do comprador, etapas visuais de atendimento e informação de rastreamento quando disponível.
Gestão para acompanhar o que acontece depois da compra
O painel administrativo reúne pedidos, pagamentos, produtos, estoque, cupons e contatos. A equipe pode buscar e filtrar pedidos, acompanhar a modalidade de entrega e atualizar o andamento do atendimento.
A integração com o Stripe sincroniza informações de pagamento. Com o Melhor Envio, a operação consulta fretes e emite etiquetas. Quando um pedido é marcado como enviado, o comprador recebe uma mensagem com as informações de rastreamento.
O painel também apresenta faturamento, ticket médio, volume de pedidos, conversão e contatos, com filtros por período e distinção entre contatos do formulário e compradores. Esses indicadores apoiam o acompanhamento da operação e a identificação de pontos que merecem atenção.
Conteúdo e relacionamento com autonomia
O gerenciador visual permite editar textos, reorganizar seções e ativar ou desativar conteúdos da página inicial sem alterar código. O blog amplia o espaço para artigos, imagens e conteúdos relacionados à obra.
A central de e-mails reúne o histórico de mensagens e permite organizar campanhas com segmentação por localização e origem do contato. A integração com o Brevo apoia os envios, enquanto o descadastro em um clique permite ao destinatário interromper o recebimento das campanhas.
Na prática, a plataforma oferece recursos para dar continuidade ao relacionamento com os leitores e atualizar a comunicação conforme a agenda do autor.
Base técnica a serviço da experiência e da continuidade
A solução foi construída com Lovable, React, TypeScript, TanStack Start e PostgreSQL. A preparação das páginas no servidor apoia o carregamento inicial e a leitura do conteúdo pelos mecanismos de busca. Também foram configurados títulos e descrições de página, informações de compartilhamento e dados estruturados sobre a obra e as ofertas.
O projeto inclui controle de acesso por perfil, validação de dados e tratamento do conteúdo inserido na plataforma. As integrações de pagamento foram desenhadas para lidar com notificações repetidas e permitir a reconciliação de informações quando necessário.
O valor da entrega está na conexão entre as etapas: comunicação, compra, atendimento e gestão passam a compor uma jornada coordenada. O case demonstra como uma necessidade comercial pode orientar a construção de uma solução digital com processos e responsabilidades definidos.
Arquitetura e detalhes técnicos
Aplicação e interface
Plataforma desenvolvida com React 19, TypeScript e TanStack Start v1, com renderização no servidor (SSR) e arquitetura preparada para execução em edge runtime. TanStack Router organiza a navegação e TanStack Query gerencia consultas e sincronização de dados na interface.
A camada visual utiliza Tailwind CSS v4, componentes shadcn/ui e Lucide Icons, com layout responsivo e identidade editorial em preto e dourado.
Backend e banco de dados
Backend em Lovable Cloud e PostgreSQL, com políticas de Row-Level Security (RLS) e controle de acesso baseado em papéis (RBAC).
As operações de servidor utilizam Server Functions tipadas com createServerFn. O gerenciamento de migrações utiliza Drizzle ORM, enquanto Zod realiza a validação dos dados de entrada.
Gestão de conteúdo
CMS visual com criação, edição, reordenação por arrastar e soltar e ativação ou desativação de seções da página inicial, sem necessidade de alterar código.
Blog integrado com editor de conteúdo rico, imagens destacadas, tags e estimativa de tempo de leitura. Sua exibição no menu acompanha o status de publicação dos conteúdos.
E-commerce e pagamentos
Integração com Stripe Checkout para pagamentos por cartão de crédito, Pix e boleto.
O fluxo inclui validação de CPF/CNPJ por dígitos verificadores, máscaras de preenchimento, controle de estoque e cupons de desconto fixos ou percentuais, com validade e limites de utilização.
A sincronização de pagamentos utiliza webhooks com tratamento idempotente, prevenção de pedidos duplicados e mecanismos de reconciliação manual e automática para situações de contingência.
Logística e acompanhamento de pedidos
Integração com Melhor Envio para cotação de frete e prazo em tempo real e emissão de etiquetas. O checkout oferece preenchimento de endereço por CEP e diferencia envio pelos Correios de retirada com o autor, ajustando os dados exigidos à modalidade escolhida.
O acompanhamento solicita número do pedido e e-mail do comprador, apresenta uma linha do tempo do atendimento e disponibiliza o rastreamento quando aplicável. A atualização para o status de envio aciona um e-mail transacional com as informações de entrega.
Comunicação e automação de marketing
Integração com Brevo e templates responsivos em React Email para mensagens transacionais e campanhas.
A central permite acompanhar mensagens enviadas e organizar campanhas segmentadas por estado, cidade e origem do contato. A API do IBGE alimenta a seleção de estados e municípios, e a base de contatos pode ser exportada em CSV.
O descadastro de campanhas funciona em um clique, com token assinado por HMAC.
Dashboard e operação administrativa
Painel com indicadores de faturamento, ticket médio, pedidos, conversão e contatos, filtros por período e distinção entre contatos captados e compradores.
A gestão de pedidos inclui paginação, busca, filtros por pagamento e modalidade de entrega, além de ações em lote com confirmação.
Segurança de aplicação
Os controles implementados incluem:
Políticas de acesso aos dados com RLS e permissões por perfil.
Validação de entradas com Zod.
Sanitização de HTML com DOMPurify para mitigação de XSS.
Assinatura de mídias protegidas no servidor.
Verificação da consulta de pedidos por número e e-mail.
Tratamento idempotente de eventos de pagamento.
SEO e integrações de conteúdo
Renderização no servidor, títulos e descrições configuráveis, URLs canônicas e metadados Open Graph e Twitter para compartilhamento.
Marcação estruturada Schema.org com FAQPage e Book/Product, além de incorporação de vídeos e Shorts do YouTube à experiência editorial.