← Volver← Back

D'Fruta MadreD'Fruta Madre

En producciónIn production
Portada del proyecto
Captura 1 del proyectoCaptura 2 del proyecto

D'Fruta Madre vende fresas con crema y derivados, y toma todos sus pedidos por WhatsApp. Este proyecto convierte ese flujo manual en uno guiado: la página convence (landing de marca con menú, prueba social y contacto) y luego construye el pedido completo con 'el armador' — un catálogo con todo el menú a domicilio donde los productos configurables se arman con un wizard paso a paso y los directos se agregan por cantidad. El resumen llega a WhatsApp listo para enviar. La mayoría de los usuarios llega desde el celular (QR en el punto físico / Instagram), por eso todo el diseño es mobile-first y el contenido está 100 % en español.D'Fruta Madre sells strawberries with cream and related products, and takes all its orders via WhatsApp. This project transforms that manual process into a guided one: the website draws customers in (a branded landing page with a menu, social proof, and contact information) and then builds the complete order using “the builder”—a catalog featuring the entire delivery menu where customizable products are put together using a step-by-step wizard and non-customizable items are added by quantity. The order summary is sent to WhatsApp, ready to be delivered. Most users access the site from their cell phones (via a QR code at the physical location or Instagram), which is why the entire design is mobile-first and the content is 100% in Spanish.

Stack tecnológicoTech stack

  • React
  • Vite
  • TypeScript
  • Tailwind

ArquitecturaArchitecture

D'Fruta Madre

Decisiones claveKey decisions

  • Motor de armado genérico en lugar de flujos por productoGeneric builder engine over per-product flows

    Cada producto tiene un proceso de armado distinto (pasos, reglas, precio); modelarlo como configuración de datos que el motor renderiza evita duplicar UI y lógica con cada producto nuevo.Each product has a distinct assembly process (steps, rules, pricing); modeling it as data configuration the engine can render avoids duplicating UI and logic for every new product.

  • Sin backend — pedido entregado por WhatsAppNo backend — order handoff via WhatsApp

    El negocio ya opera por WhatsApp; un checkout propio con servidor y pagos online agregaría infraestructura y fricción sin valor en esta etapa.The business already operates through WhatsApp; a custom checkout with a server and online payments would add infrastructure and friction without value at this stage.

  • Navegación por estado en memoria en lugar de routerIn-memory state navigation over a router

    El flujo es un funnel lineal de una sola sesión, sin necesidad de deep-linking ni historial navegable entre pasos.The flow is a single-session linear funnel with no need for deep-linking or navigable history between steps.