Primerospasitos,una compraespecial.
Zapatitos para bebés, con una cajita que la familia arma a su manera.
Una tienda de zapatitos completa, de la vitrina al pago, del envío al panel.
- Next.js 16
- React 19
- TypeScript
- Prisma
- MySQL
- Mercado Pago
Primerospasitos,una compraespecial.
Zapatitos para bebés, con una cajita que la familia arma a su manera.
- Next.js 16
- React 19
- TypeScript
- Prisma
- MySQL
- Mercado Pago
Una tienda de zapatitos completa, de la vitrina al pago, del envío al panel.
- Next.js 16
- React 19
- TypeScript
- Prisma
- MySQL
- Mercado Pago
La cajita
Cuantos más pares, menos cuesta cada uno.
El corazón de la tienda no es el par suelto: es la cajita. La familia elige hasta cuatro pares (color, modelo y talla a gusto) y el precio de cada uno baja con cada lugar ocupado. La misma cuenta vale en la vitrina, en el carrito, en el checkout y en el e-mail del 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 —Ahorro —
Cajita cerrada
Mezcla libre
Niño, niña, caña alta, velcro: cada par de la cajita puede ser de un modelo y de una talla.
División justa
Con más de cuatro pares, el carrito se divide en cajitas al menor precio, regla comprobada contra el cálculo exacto de 1 a 24 pares.
Modelo especial
Si un par cuesta más que el estándar, la cajita cobra solo la diferencia, y el descuento del paquete sigue valiendo.
La escala
Una vitrina tierna, un sistema entero.
Detrás de los zapatitos hay una tienda completa: catálogo, inventario, pago, envío, e-mails y un panel de gestión, todo en tres idiomas, con pruebas que pasan por diez tamaños de pantalla.
Líneas de código
TypeScript y CSS, sin contar bibliotecas
Pantallas
20 en la tienda y 22 en el panel
Rutas de API
Pago, envío, cupones, clientes y panel
Tablas en la base
MySQL con Prisma: pedidos, inventario por talla, cupones, historial
Zapatos en 3D
Cada modelo con su archivo 3D, en el escenario de la cajita
Ejecuciones de prueba
31 pruebas de navegador en 10 tamaños de pantalla
- 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
¿Qué talla?
Medir el piecito en la propia pantalla.
El mayor miedo al comprar zapatos de bebé por internet es equivocarse de talla. La tienda responde con una regla: se mide del talón a la punta del dedo gordo, se arrastra la regla y ella sugiere la talla correcta según la tabla de la tienda. Esta hace la misma cuenta, arrástrela, o solo desplace la página.
Una tabla, tres lugares
Los botones de talla, la regla y el tamaño real leen la misma tabla de la tienda.
Tamaño real, calibrado
Para que el dibujo tenga el tamaño de verdad, la pantalla se calibra con una tarjeta estándar (ISO ID-1).
Vibra cada medio centímetro
En Android, la regla da un toque de vibración cada 0,5 cm, para medir sin mirar.
- 139,0 cm
- 1410,0 cm
- 1510,5 cm
- 1611,0 cm
- 1711,5 cm
Use la 14 · entre dos tallas, la sugerencia es la mayor, para que no apriete.
El recorrido en el celular
Cada elección, un nuevo pasito.
Del descubrimiento de los modelos a la cajita personalizada, una experiencia diseñada para el toque.
Descubra
La vitrina separa niño y niña sin esconder nada: el filtro enciende los modelos de cada uno y apaga los demás.
Elija
Cada modelo aparece en 3D en la cajita, con las fotos reales al lado, y la talla sale de la regla.
Imagine
Paseo, fiesta, día a día o en pareja: las ocasiones muestran el par en el pie de quien lo va a usar.
Arme su cajita
Hasta cuatro pares en la misma cajita, y el carrito sigue ahí aunque la página se cierre.
Día y noche
La misma tienda, de día y de noche.
Cada pantalla se diseñó dos veces: en claro, para la mañana, y en azul marino, para quien compra con el bebé ya dormido. Desplace la página y amanece.
Sin destello
El tema se aplica antes de que la página se dibuje: quien eligió el oscuro no ve un destello blanco al abrir.
Queda guardado
La elección queda guardada en el dispositivo y vuelve en la próxima visita, una prueba automática lo comprueba.
Probado en los dos
Las pruebas de diseño pasan por los diez tamaños de pantalla en los dos temas.
Compra de verdad
Del clic al pago, nada es de adorno.
La vitrina es la parte que se ve. Por debajo, cada pedido recorre el camino de una tienda de verdad, y ese camino se auditó con la tienda funcionando, compra por compra.
- 27/27Pruebas de venta e inventario aprobadas en la auditoría
- 5 → 1Cinco compras del último par al mismo tiempo: solo una pasa
- 0Enlaces rotos en 93 páginas y 20 pantallas del panel
- 1×Cancelar dos veces devuelve los pares una sola vez
- 01Al instante
Inventario reservado
Los pares salen del inventario en el acto, talla por talla; dos pedidos nunca se llevan el mismo par.
- 02PAC · SEDEX
Envío cotizado
Melhor Envio o SuperFrete, con las cotizaciones guardadas en la base y una tabla propia si la API falla.
- 03Reglas
Cupón verificado
Porcentaje o valor, tope, pedido mínimo, límite de usos y uso por e-mail.
- 04Pix · tarjeta
Pago
Pix con QR y copia-y-pega, o tarjeta en hasta 12 cuotas, por la API de pedidos de Mercado Pago.
- 05Webhook
Confirmación segura
El aviso de Mercado Pago tiene la firma verificada, y el pago se consulta de nuevo en la fuente.
- 068 × 3
E-mail en el idioma correcto
Pedido recibido, pagado, enviado, cambio: ocho plantillas, en portugués, inglés y español.
- 07Seguimiento
Separar, enviar, entregar
Con código de seguimiento; el pedido que no se paga a tiempo se cancela solo y devuelve los pares.
- 08Reembolso
Cambio y devolución
Reembolso por Mercado Pago, el par de vuelta al inventario y la talla nueva reservada en el cambio.
Todo en el historialRegistrado
El ayudante
¿Le quedó una duda? Passinho responde.
La mascota de la tienda vive en la esquina de la pantalla. Conoce el camino de las dudas más comunes (talla, cajita, modelos) y, cuando hace falta una persona, pasa la conversación a WhatsApp con el mensaje ya escrito.
Respuestas escritas por la tienda
Un árbol de respuestas hecho por la propia tienda: Passinho nunca inventa plazo ni precio.
Seis poses
Saluda, señala, sostiene el zapatito, celebra, espera, duerme: un personaje entero, no un ícono.
Mensajes listos
En el panel, la tienda edita los textos de WhatsApp para pagado, enviado, retiro y recordatorio.
El panel
Toda la tienda en la palma de la mano.
Quien vende no necesita un programador en el día a día: son 21 pantallas de gestión, todas conectadas a la base, del pedido al precio, del e-mail al color del sitio. Y el panel también habla tres idiomas.
Ventas 6 pantallas
- Panel
- Pedidos
- Clientes
- Cupones
- Informes
- Papelera
Acceso que se protege
Sesión de 8 horas, límite de intentos por dirección y lista de direcciones permitidas.
Claves cifradas
Las credenciales de pago y envío quedan cifradas en la base (AES-256-GCM), nunca en texto plano.
Traducción ahí mismo
Productos, página de inicio y menú reciben inglés y español desde el propio panel.
Informes que comparan
Las ventas en horario de Brasilia, junto al período anterior.
Las tecnologías
De qué está hecho, pieza por pieza
Una tienda de verdad: la vidriera con los zapatitos en 3D, el carrito, el pago y el panel del dueño. Elige una pieza para ver qué hace aquí y en qué archivo está.
16tecnologías, en 4 capas
Pantalla
Servidor
Datos
Pago y pruebas
Las pantallas
La tienda, pantalla por pantalla.
Escritorio y celular diseñados por separado, cada uno a su ritmo: 23 pantallas en cuatro grupos, de la vitrina a la cajita cerrada.
Apertura: primeros pasitos
Los favoritos de las mamás
Los 19 modelos de la vitrina
Filtro niño: los demás se apagan, ninguno desaparece
Para cada momento
Por qué los piecitos los aman
En línea
Los 19 modelos, cada uno con su dirección.
La tienda está publicada. Cada zapatito tiene su página, con sus fotos, tallas e inventario de cada talla, elija uno y se abre en la tienda de verdad.
- 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
Tiendas y comercio electrónicoMeu Natal Digital