PROPUESTA DE PROYECTO · CNL-WD16

Desarrollo de E-commerce en Webflow para Suplementos

PREPARED FOR

Dulce Romero

01

Resumen

Esta propuesta contempla el desarrollo de una tienda en línea en Webflow para la venta de suplementos, con catálogo de productos organizado, variantes por presentación o sabor, control de inventario y pagos con tarjeta de crédito/débito a través de Stripe.

‍

Se presentan dos opciones de alcance para que el cliente elija según su presupuesto y objetivos:

‍

  • Opción A — Solo E-commerce: El usuario entra directamente a la tienda, navega el catálogo de productos y realiza su compra. Sin secciones de marca adicionales.
  • Opción B — Landing Page + E-commerce: Sitio completo con página de inicio que presenta la marca (historia, beneficios, diferenciadores) y, dentro del mismo sitio, la tienda para comprar los productos.

‍

Ambas opciones incluyen diseño personalizado, gestión de inventario por variante y checkout funcional desde el primer día.

Objetivo

El objetivo del proyecto es ofrecer al cliente un canal de venta digital propio, sin depender de marketplaces externos, donde sus clientes puedan conocer los productos, ver variantes disponibles, verificar existencias y completar su compra de forma rápida y segura.

‍

La Opción A está pensada para quienes quieren arrancar con lo esencial: una tienda funcional, bien diseñada y lista para vender cuanto antes. La Opción B agrega una capa de marca que ayuda a construir confianza, comunicar los diferenciales del producto y convertir visitantes nuevos en compradores, algo especialmente valioso en la industria de suplementos donde la credibilidad es clave.

‍

Ambas opciones están construidas sobre Webflow, lo que garantiza un diseño visual cuidado y un panel de administración sencillo que el cliente puede manejar sin conocimientos técnicos para actualizar productos, precios e inventario.

02

From challenge
to clear direction.

01

Solución propuesta

Opción A — Solo E-commerce

‍

Desarrollo de una tienda en línea en Webflow con:

‍

  • Diseño UI/UX personalizado de la tienda, alineado a la identidad de marca.
  • Catálogo de productos (hasta 6 productos iniciales, escalable).
  • Fichas de producto con galería de imágenes, descripción, precio y variantes (sabor, presentación, tamaño, etc.).
  • Sistema de inventario por variante con estado visual de "agotado".
  • Checkout y pagos con tarjeta de crédito/débito, Apple Pay y Google Pay vía Stripe.
  • Optimización responsiva (móvil, tablet y escritorio).
  • Testing de flujos de compra e inventario previo al lanzamiento.
  • Publicación del sitio en dominio del cliente.
  • Soporte incluido por 6 meses.

‍

Opción B — Landing Page + E-commerce

‍

Todo lo incluido en la Opción A, más:

‍

  • Diseño UI/UX completo de la landing page (home): hero, sección de beneficios/diferenciadores, sección de productos destacados, llamadas a la acción y footer.
  • Hasta 4 secciones de contenido de marca (hero, beneficios, testimonios o resultados, llamada a la acción).
  • Navegación integrada entre la landing y la tienda dentro del mismo sitio.
  • Soporte incluido por 6 meses.
02

Por qué este enfoque

Webflow permite construir tanto una tienda minimalista y enfocada en conversión (Opción A) como un sitio de marca completo con e-commerce integrado (Opción B), sin necesidad de plataformas separadas ni integraciones complicadas.

‍

La arquitectura de CMS Collections para los productos hace que agregar nuevos suplementos en el futuro sea tan sencillo como llenar un formulario desde el panel de Webflow — sin tocar código, sin depender de un desarrollador para cada actualización.

‍

El inventario se gestiona por variante, lo que significa que si un suplemento existe en tres sabores, cada sabor tiene su propio stock y el sistema automáticamente marca como "agotado" el que se queda sin existencias, sin afectar a los demás.

‍

El checkout es procesado por Stripe, uno de los procesadores de pago más seguros y confiables del mundo, con soporte nativo para tarjetas mexicanas, Apple Pay y Google Pay.

03

Beneficios

  • Tienda lista para vender desde el día uno, sin depender de marketplaces ni plataformas de terceros.
  • Diseño personalizado, alineado a la identidad de la marca de suplementos.
  • Gestión de inventario por variante, sin riesgo de vender productos agotados.
  • Pagos seguros con Stripe, Apple Pay y Google Pay.
  • Panel de administración sencillo, para que el cliente actualice productos, precios e inventario sin asistencia técnica.
  • Escalable desde el inicio, preparado para crecer de 6 productos a los que se necesiten sin reconstruir el sitio.
  • (Opción B) Sitio de marca completo, que genera confianza y comunica los diferenciadores del producto antes de que el cliente llegue al carrito.
04

Por qué Craft Next Labs

En Craft Next Labs, no solo creamos experiencias digitales, las diseñamos con propósito. Nuestro equipo cuenta con una profunda experiencia en diseño y desarrollo web, desarrollo móvil y estrategia digital, asegurando que cada proyecto esté diseñado para generar impacto.

‍

Vamos más allá de la estética, enfocándonos en funcionalidad, rendimiento y engagement del usuario. Desde el primer momento, nos comprometemos a ofrecer soluciones digitales innovadoras y de alto rendimiento que impulsen marcas, mejoren la experiencia del usuario y generen resultados reales.

03

Inversión

Desglose de inversión

‍

Opción A — Solo E-commerce

‍

  • Diseño UI/UX (proveído por colaborador externo): Diseño de fichas de producto, listado de catálogo, carrito y flujo de compra. — $5,000 MXN
  • Desarrollo en Webflow (CMS + productos + variantes): Maquetación del diseño, configuración de colecciones, fichas de producto, variantes e inventario. — $6,500 MXN
  • Configuración de checkout + Stripe: Conexión de pasarela de pago y pruebas de flujo de compra. — $2,000 MXN
  • Optimización responsiva + Testing + Publicación: Ajustes móvil/tablet, validación de flujos y puesta en producción. — $1,500 MXN
  • Soporte: INCLUIDO POR 6 MESES — Cambios menores y asesoría general. Posterior a este periodo, $250 MXN por hora.

‍

Total Opción A: $15,000 MXN (NO INCLUYE IVA)

‍

Opción B — Landing Page + E-commerce

‍

  • Diseño UI/UX completo (proveído por colaborador externo): Diseño de landing page (hero, secciones de marca, llamadas a la acción) + tienda completa. — $12,000 MXN
  • Todo lo incluido en desarrollo Opción A. — $10,000 MXN
  • Desarrollo de la landing page en Webflow: Maquetación del diseño, implementación de secciones, animaciones y navegación. — $6,500 MXN
  • Integración visual landing ↔ tienda: Navegación fluida entre ambas secciones dentro del mismo sitio. — $1,500 MXN
  • Soporte: INCLUIDO POR 6 MESES — Cambios menores y asesoría general. Posterior a este periodo, $250 MXN por hora.

‍

Total Opción B: $30,000 MXN (NO INCLUYE IVA)

PROJECT TOTAL
MXN
34800
Subtotal
30000
Tax rate
16

Costos adicionales

Este proyecto requiere algunos servicios externos que no están incluidos en el costo de desarrollo:

‍

  • Webflow eCommerce Standard (plan recomendado): Hasta 500 productos/variantes, 2% de comisión por transacción y carrito/checkout personalizado. Dos opciones de pago disponibles:
    • Mensual: $42 USD/mes (aproximadamente $727 MXN/mes, tipo de cambio referencia $17.30 MXN/USD)
    • Anual: $29 USD/mes facturado anualmente, es decir $348 USD/año (aproximadamente $502 MXN/mes o $6,020 MXN/año) — representa un ahorro de $156 USD anuales (~$2,699 MXN) vs. el plan mensual.
  • Comisión de Stripe por transacción: Aproximadamente 3.6% + $3 MXN por transacción con tarjeta.
  • Dominio personalizado: Desde $300 MXN anuales, vía GoDaddy, Google Domains o proveedor similar.
  • Correo corporativo (opcional): A través de Google Workspace o similar, desde $6 USD/usuario al mes(aproximadamente $104 MXN/usuario/mes).

‍

Nota: Los costos pueden variar dependiendo del proveedor, volumen de transacciones, tipo de cambio y necesidades específicas del cliente.

04

Cronograma

Opción A — Solo E-commerce

‍
Duración estimada: 2-3 semanas

‍

  • Semana 1: Diseño UI/UX de la tienda, fichas de producto y flujo de compra.
  • Semana 2: Desarrollo en Webflow, configuración de CMS, variantes e inventario.
  • Semana 3: Configuración de Stripe, testing de flujos y publicación.

‍

Opción B — Landing Page + E-commerce
‍

Duración estimada: 4-5 semanas

‍

  • Semana 1-2: Diseño UI/UX completo (landing + tienda).
  • Semana 3: Desarrollo de la landing page en Webflow.
  • Semana 4: Desarrollo de la tienda, CMS, variantes e inventario.
  • Semana 5: Configuración de Stripe, integración landing ↔ tienda, testing y publicación.

‍

Los tiempos pueden variar ligeramente dependiendo de la disponibilidad de contenido (textos, imágenes, logotipos) por parte del cliente.

05

Términos y condiciones

  • Las tarifas listadas corresponden exclusivamente al desarrollo del sitio en Webflow con las funcionalidades descritas en esta propuesta, según la opción elegida. Cualquier funcionalidad no especificada se considerará fuera de alcance.
  • Para iniciar el proyecto, se requiere un anticipo del 50% del costo total. El 50% restante se liquida al momento de la entrega, una vez que el cliente haya revisado y aprobado el producto final. (Pueden platicarse esquemas de pago alternativos según las necesidades del cliente; cualquier ajuste al plan de pagos se detallará en el contrato formal posterior a la aceptación de esta propuesta.)
  • El proyecto incluye soporte sin costo durante 6 meses posteriores a la entrega. Cualquier ajuste, mejora o actualización fuera de este periodo tendrá un costo de $250 MXN por hora.
  • Las comisiones por transacciones y costos asociados a servicios externos —incluyendo Webflow, Stripe, dominio, correo corporativo u otros servicios de terceros— no están incluidos en el precio del desarrollo y deberán ser cubiertos directamente por el cliente conforme a las tarifas de cada proveedor.
  • Cualquier servicio externo necesario para la operación del proyecto —como cuentas de Webflow, Stripe u otros proveedores— deberá ser contratado y administrado directamente por el cliente.
  • El cliente es responsable de entregar todo el contenido (fotografía de producto, textos, logotipos, etc.) de forma clara y en tiempo para cumplir con los plazos establecidos, y conserva la titularidad total sobre dicho contenido.
  • Cualquier cambio significativo en la estructura, reglas de negocio o funcionalidades que no esté contemplado en el alcance originalmente definido podrá cotizarse por separado.
  • En caso de cancelación del proyecto por parte del cliente una vez iniciado el desarrollo, este deberá cubrir los costos correspondientes al trabajo realizado hasta la fecha. (Las condiciones específicas de cancelación se detallarán en el contrato formal posterior a la aceptación de esta propuesta.)
READY WHEN YOU ARE

¿Construimos lo que sigue?

Si tienes preguntas o quieres ajustar algún punto de esta propuesta, conversemos antes de avanzar.

Hablemos de la propuesta
↗