Primeirospassinhos,uma compraespecial.
Sapatinhos para bebês, com uma caixinha que a família monta do seu jeito.
Uma loja de sapatinhos completa, da vitrine ao Pix, do frete ao painel.
- Next.js 16
- React 19
- TypeScript
- Prisma
- MySQL
- Mercado Pago
Primeirospassinhos,uma compraespecial.
Sapatinhos para bebês, com uma caixinha que a família monta do seu jeito.
- Next.js 16
- React 19
- TypeScript
- Prisma
- MySQL
- Mercado Pago
Uma loja de sapatinhos completa, da vitrine ao Pix, do frete ao painel.
- Next.js 16
- React 19
- TypeScript
- Prisma
- MySQL
- Mercado Pago
A caixinha
Quanto mais pares, menos cada um custa.
O coração da loja não é o par avulso: é a caixinha. A família escolhe até quatro pares, cor, modelo e tamanho à vontade, e o preço de cada um cai a cada vaga preenchida. A mesma conta vale na vitrine, no carrinho, no checkout e no e-mail do pedido.
- 1 parR$ 39,90R$ 39,90
- 2 paresR$ 34,95R$ 69,90
- 3 paresR$ 31,63R$ 94,90
- 4 paresR$ 29,98R$ 119,90
R$ 39,90 por par
Total —Economia —
Caixinha fechada
Mistura livre
Menino, menina, cano alto, velcro: cada par da caixinha pode ser de um modelo e de um tamanho.
Divisão justa
Com mais de quatro pares, o carrinho se divide em caixinhas pelo menor preço, regra conferida contra o cálculo exato de 1 a 24 pares.
Modelo especial
Se um par custa mais que o padrão, a caixinha cobra só a diferença dele, e o desconto do pacote continua valendo.
A escala
Uma vitrine fofa, um sistema inteiro.
Por trás dos sapatinhos há uma loja completa: catálogo, estoque, pagamento, frete, e-mails e um painel de gestão, tudo em três idiomas, com testes que passam por dez tamanhos de tela.
Linhas de código
TypeScript e CSS, sem contar bibliotecas
Telas
20 na loja e 22 no painel
Rotas de API
Pagamento, frete, cupom, cliente e painel
Tabelas no banco
MySQL com Prisma: pedidos, estoque por tamanho, cupons, histórico
Sapatos em 3D
Cada modelo com o seu arquivo 3D, no palco da caixinha
Execuções de teste
31 testes de navegador em 10 tamanhos de tela
- Next.js 16.3
- React 19.2
- TypeScript 5.9
- Tailwind CSS 4.3
- Prisma 6.19
- MySQL
- next-intl 4.14
- three.js 0.180
- React Three Fiber 9
- GSAP 3.15
- Motion 13
- Zustand 5
- Mercado Pago SDK 3.6
- Zod 3
- Nodemailer
- Playwright 1.56
Qual o número?
Medir o pezinho na própria tela.
O maior medo de comprar sapato de bebê pela internet é errar o número. A loja responde com uma régua: mede-se do calcanhar à ponta do dedão, arrasta-se a régua e ela sugere o número certo pela tabela da loja. Esta aqui é a mesma conta, arraste, ou só role a página.
Uma tabela, três lugares
Os botões de tamanho, a régua e o tamanho real leem a mesma tabela da loja.
Tamanho real, calibrado
Para o desenho ter o tamanho de verdade, a tela é calibrada por um cartão padrão (ISO ID-1).
Vibra no meio centímetro
No Android, a régua dá um toque de vibração a cada 0,5 cm, para medir sem olhar.
- 139,0 cm
- 1410,0 cm
- 1510,5 cm
- 1611,0 cm
- 1711,5 cm
Use o 14 · entre dois números, a sugestão é o de cima, para não apertar.
A jornada no celular
Cada escolha, um novo passinho.
Da descoberta dos modelos à caixinha personalizada, uma experiência desenhada para o toque.
Descubra
A vitrine separa menino e menina sem esconder nada: o filtro acende os modelos de cada um e apaga os outros.
Escolha
Cada modelo aparece em 3D na caixinha, com as fotos reais ao lado, e o tamanho sai da régua.
Imagine
Passeio, festinha, dia a dia ou em dupla: as ocasiões mostram o par no pé de quem vai usar.
Monte sua caixinha
Até quatro pares na mesma caixinha, e o carrinho continua lá mesmo se a página fechar.
Dia e noite
A mesma loja, de dia e de noite.
Toda tela foi desenhada duas vezes: no claro, para a manhã, e no azul-marinho, para quem compra com o bebê já dormindo. Role a página e o dia nasce.
Sem clarão
O tema é aplicado antes de a página desenhar: quem escolheu o escuro não vê um flash branco ao abrir.
Fica guardado
A escolha fica salva no aparelho e volta na próxima visita, um teste automático confere isso.
Testado nos dois
Os testes de layout passam pelos dez tamanhos de tela nos dois temas.
Compra de verdade
Do clique ao Pix, nada é de enfeite.
A vitrine é a parte que se vê. Por baixo, cada pedido percorre o caminho de uma loja de verdade, e esse caminho foi auditado com a loja rodando, compra por compra.
- 27/27Testes de venda e estoque passando na auditoria
- 5 → 1Cinco compras do último par ao mesmo tempo: só uma passa
- 0Links quebrados em 93 páginas e 20 telas do painel
- 1×Cancelar duas vezes devolve os pares uma vez só
- 01Na hora
Estoque reservado
Os pares saem do estoque no ato, tamanho por tamanho; dois pedidos nunca levam o mesmo par.
- 02PAC · SEDEX
Frete cotado
Melhor Envio ou SuperFrete, com as cotações guardadas no banco e uma tabela própria se a API cair.
- 03Regras
Cupom conferido
Porcentagem ou valor, teto, pedido mínimo, limite de usos e uso por e-mail.
- 04Pix · cartão
Pagamento
Pix com QR e copia-e-cola, ou cartão em até 12 vezes, pela API de pedidos do Mercado Pago.
- 05Webhook
Confirmação segura
O aviso do Mercado Pago tem a assinatura conferida, e o pagamento é consultado de novo na fonte.
- 068 × 3
E-mail no idioma certo
Pedido recebido, pago, enviado, troca: oito modelos, em português, inglês e espanhol.
- 07Rastreio
Separar, enviar, entregar
Com código de rastreio; o pedido que não é pago no prazo se cancela sozinho e devolve os pares.
- 08Estorno
Troca e devolução
Estorno pelo Mercado Pago, o par de volta ao estoque e o tamanho novo reservado na troca.
Tudo no históricoRegistrado
O ajudante
Ficou uma dúvida? O Passinho responde.
O mascote da loja mora no canto da tela. Ele conhece o caminho das dúvidas mais comuns, número, caixinha, modelos, e, quando precisa de gente, entrega a conversa no WhatsApp com a mensagem já escrita.
Respostas escritas pela loja
Uma árvore de respostas feita pela própria loja: o Passinho nunca inventa prazo nem preço.
Seis poses
Acena, aponta, segura o sapatinho, comemora, espera, cochila: um personagem inteiro, não um ícone.
Mensagens prontas
No painel, a loja edita os textos do WhatsApp para pedido pago, enviado, retirada e lembrete.
O painel
A loja inteira na palma da mão.
Quem vende não precisa de programador no dia a dia: são 21 telas de gestão, todas ligadas ao banco, do pedido ao preço, do e-mail à cor do site. E o painel também fala três línguas.
Vendas 6 telas
- Painel
- Pedidos
- Clientes
- Cupons
- Relatórios
- Lixeira
Acesso que se protege
Sessão de 8 horas, limite de tentativas por endereço e lista de endereços permitidos.
Chaves cifradas
As credenciais de pagamento e frete ficam no banco cifradas (AES-256-GCM), nunca em texto puro.
Tradução ali mesmo
Produto, página inicial e menu ganham inglês e espanhol pelo próprio painel.
Relatório que compara
As vendas no horário de Brasília, lado a lado com o período anterior.
As tecnologias
Do que é feito, peça por peça
Uma loja de verdade: a vitrine com os sapatinhos em 3D, o carrinho, o pagamento e o painel do dono. Escolha uma peça para ver o que ela faz aqui e em que arquivo está.
16tecnologias, em 4 camadas
Tela
Servidor
Dados
Pagamento e testes
As telas
A loja, tela por tela.
Desktop e celular desenhados à parte, cada um no seu ritmo: 23 telas em quatro grupos, da vitrine à caixinha fechada.
Abertura: primeiros passinhos
Os queridinhos das mães
Os 19 modelos da vitrine
Filtro menino: os outros apagam, nenhum some
Para cada momento
Por que os pezinhos amam
No ar
Os 19 modelos, cada um com o seu endereço.
A loja está publicada. Cada sapatinho tem a sua página, com as fotos, os tamanhos e o estoque de cada número, escolha um e ele abre na loja de verdade.
- Starzinho Glitter DouradoR$ 39,90
Starzinho Branco Cano AltoR$ 39,90- Starzinho Preto Cano AltoR$ 39,90
- Starzinho Rosa BebêR$ 39,90
Starzinho Vermelho JacaréR$ 39,90
Vision Branco Glitter RosaR$ 39,90
Vision Branco LilásR$ 39,90
Starzinho Verde MusgoR$ 39,90
Vision Branco PretoR$ 39,90
Vision Branco Azul BebêR$ 39,90
Starzinho BrancoR$ 39,90
Starzinho PretoR$ 39,90- Starzinho Azul BebêR$ 39,90
Starzinho Velcro BrancoR$ 39,90
Starzinho Velcro PretoR$ 39,90
Starzinho Rosa EspelhadoR$ 39,90
Starzinho Rosa RaposinhaR$ 39,90
Starzinho Berlim BrancoR$ 39,90
Starzinho Berlim PretoR$ 39,90
Lojas e e-commerceMeu Natal Digital