Saltar a qué hace la tienda
TFS PanamáPropuesta de tienda en línea

Prototipo con datos de ejemplo: productos, precios y conversaciones no son de TFS.

Pesca deportiva · Panamá · tres diseños

Propuesta A · Sonda

Una tienda, tres caras.

Tres propuestas de diseño para la tienda en línea de TFS Panamá. Las tres venden, cotizan y atienden al cliente igual; lo que cambia es cómo se presentan.

Elige un diseño en la barra de arriba y todas las pantallas de esta página cambian con él.

Demo en línea: tfs-demo.wave-syncs.com

Portada del diseño Sonda en celular

Qué hace la tienda

Cuatro frentes, iguales en los tres diseños.

En cada uno se separa lo que el prototipo ya hace de lo que hará la tienda real cuando se conecte con Odoo, Gemini y WhatsApp.

  • VentasComprar sin vueltas, y cotizar cuando hace falta.
  • ProductosCada producto, con lo que el pescador necesita saber.
  • Contacto con el clienteUn asesor siempre a mano, en la web y en WhatsApp.
  • SeguridadDatos protegidos, y nada que parezca lo que no es.

Ventas

Comprar sin vueltas, y cotizar cuando hace falta.

En el prototipo

  • Compra directa en tres pasos: carrito, entrega y pago.
  • El carrito avisa qué productos necesitan confirmar existencias y deja pasar cualquiera a una cotización.
  • Retiro en tienda o envío por provincia, con factura a nombre de empresa (RUC y DV).
  • Combos destacados y casilla de cupón de descuento.
  • Los métodos de pago están por definir con TFS: el pedido queda «pendiente de pago», nunca como cobrado.

En la tienda real

  • El pedido se crea en Odoo una sola vez, con su origen: web, chat o WhatsApp.
  • Se conecta el medio de pago que TFS elija.

Pruébalo en Sonda: catálogo · compra

Catálogo con precios en el celular, diseño Sonda

Productos

Cada producto, con lo que el pescador necesita saber.

En el prototipo

  • Catálogo por categoría, con precio y disponibilidad a la vista.
  • Ficha con galería, variantes, cantidad, especificaciones, compatibles y relacionados.
  • Medidor «Dónde trabaja»: a qué profundidad nada cada señuelo.
  • Un buscador propio en cada diseño: la Sonda, el Mapa de pesca o las Historias.
  • Lo que todavía no se sabe dice «Dato de Odoo»: no se inventa.

En la tienda real

  • Catálogo, precios y existencias se leen de Odoo: un solo lugar para mantenerlos.

Pruébalo en Sonda: ficha de un señuelo · catálogo

Buscador propio del diseño Sonda en el celular

Contacto con el cliente

Un asesor siempre a mano, en la web y en WhatsApp.

En el prototipo

  • Asesor por chat en todas las páginas: recomienda equipo y arma una cotización en borrador.
  • Sigue por WhatsApp con el código de la conversación (por ejemplo, TFS-4821), sin repetir nada.
  • Solicitud de cotización en tres pasos, con una nota por producto.
  • Estado del pedido o de la cotización con su código: línea de tiempo y siguiente paso.
  • Toda la tienda en español e inglés.

En la tienda real

  • El asistente usa Gemini desde el servidor y no confirma ventas por su cuenta: un asesor revisa.
  • WhatsApp Business Platform recibe la conversación con su contexto.

Pruébalo en Sonda: cotización · estado del pedido · el chat está en todas

Solicitud de cotización en el celular, diseño Sonda

Seguridad

Datos protegidos, y nada que parezca lo que no es.

En el prototipo

  • Un pedido solo se consulta con su código y el correo o teléfono del cliente. Si no coinciden, la respuesta es la misma que si no existiera: nadie puede adivinar pedidos ajenos.
  • Un pedido o una cotización se registran una sola vez aunque se haga doble clic.
  • Los formularios revisan correo, teléfono, RUC y DV, y dicen qué corregir.
  • Una compra hecha en la demo nunca se marca como pagada, y los datos de ejemplo están marcados como tales.

En la tienda real

  • Las claves de Odoo, Gemini, WhatsApp y pagos viven solo en el servidor, nunca en el navegador.
  • Precios, existencias y totales los calcula el servidor con Odoo: el navegador no puede cambiarlos.
  • Permisos mínimos, registros de auditoría y protección contra solicitudes abusivas.
  • Entornos separados de desarrollo, pruebas y producción.

Esta demo se sirve por HTTPS con cabeceras de seguridad, sin analítica ni anuncios, y fuera de los buscadores.

Pruébalo en Sonda: estado del pedido, con un código de ejemplo y un correo que no sea el suyo

Estado de un pedido en el celular, diseño Sonda

Los diseños

Misma tienda, tres maneras de contarla.

Las filas están alineadas para comparar de un vistazo. Cada diseño tiene su demo y sus videos, en vertical para Reels y en horizontal para computadora.

  • ASondaOscuro y deportivo
  • BCarta náuticaClaro y editorial
  • CHistoriasVivo y de cartel
A

Sonda

Oscuro y deportivo

La Sonda TFS en la portada del diseño A

Pieza distintiva

La Sonda TFS: el cliente elige dónde pesca y qué especie busca, y el equipo recomendado aparece como ecos en una ecosonda.

Cómo se ve

  • Abismo
  • Océano
  • Turquesa
  • Ámbar
  • Espuma

Barlow Condensed en cursiva para los títulos, Instrument Sans e IBM Plex Mono.

Encaja si

TFS quiere verse técnica y de alto rendimiento, con la misma fuerza visual de su Instagram.

Abrir la demo
B

Carta náutica

Claro y editorial, como una carta de navegación

El Mapa de pesca en la portada del diseño B

Pieza distintiva

El Mapa de pesca: se toca una zona de Panamá (Bocas del Toro, Chiriquí, Coiba, Las Perlas o Bahía Piñas) y muestra especies típicas y equipo para empezar, como guía orientativa.

Cómo se ve

  • Mar
  • Vidrio
  • Boya
  • Bruma
  • Papel

Bricolage Grotesque para los títulos, Figtree y JetBrains Mono.

Encaja si

Se busca una tienda tranquila y muy legible, que oriente al cliente según dónde va a pescar.

Abrir la demo
C

Historias

Vivo y de cartel, con resaltados tipo pegatina

Una historia abierta en el diseño C

Pieza distintiva

Las Historias, como en Instagram: combos, cañas, carretes, señuelos, horario y comunidad, con cotizar y agregar sin salir de la historia.

Cómo se ve

  • Tinta
  • Turquesa
  • Coral
  • Sol
  • Espuma

Bowlby One para los títulos, Outfit y Space Mono.

Encaja si

Buena parte del público llega desde Instagram y se quiere empujar ofertas y combos.

Abrir la demo

Cómo probarla

La demo se usa como la tienda de verdad.

Cómo sigue

Primero la tienda, Odoo al final.

Todo se construye sobre un catálogo de prueba, detrás de la misma interfaz que después leerá Odoo. Así la integración no frena el resto del trabajo.

  1. 1–2
    Planificación y diseño

    Tres diseños navegables con datos de ejemplo, en español e inglés.

    Aquí estamos
  2. TFS elige el diseño

    El que mejor la represente, o uno con piezas de otro.

  3. 3
    Carrito, cotizaciones y pedidos

    Con datos de prueba y un servidor que valida precios y evita duplicados.

  4. 4
    Asistente con IA y WhatsApp Business

    Gemini desde el servidor y la conversación que sigue en WhatsApp con su contexto.

  5. 5
    Integración con Odoo

    Primero una auditoría y solo lectura; después, cotizaciones y pedidos.

  6. 6
    Pruebas, validación y despliegue

    Pruebas de seguridad, validación comercial con TFS y publicación.