Menú del Cliente

El menú del cliente es la página web pública en handy.cafe/{your-slug}. Los clientes acceden a ella escaneando el código QR en su mesa. Esta página describe el flujo del cliente de principio a fin para que puedas explicarlo al personal y planificar tu implementación.

Estructura de la URL

Cada mesa tiene una URL única con el formato handy.cafe/{cafe-slug}/{table-code}. El código QR codifica esta URL más un token de corta duración que prueba que la etiqueta es auténtica. Cuando el cliente escanea el QR:

1. Su teléfono abre la URL en el navegador predeterminado.
2. La página resuelve el slug y el código de mesa contra la API en la nube.
3. Si la mesa está fuera_de_servicio, la página muestra un aviso de no disponible.
4. Si la mesa está libre, la página explica que el personal aún no ha sentado al cliente y les pide que llamen para asistencia.
5. Si la mesa está en_uso, la página solicita el código de seguridad de 6 dígitos.

Verificación del Código de Seguridad

El código de seguridad asegura que solo el cliente actualmente sentado en la mesa pueda realizar pedidos. Previene que alguien que haya visto el QR en una foto o desde fuera de tu café realice pedidos fraudulentos.

Después de que el cliente ingresa el código:

1. La API valida el código contra el valor hash almacenado en la mesa.
2. Si es válido, se crea una sesión y se devuelve un token.
3. El token se almacena en una cookie (hc_menu_session). Un token Bearer de respaldo también se guarda en el almacenamiento local del dispositivo. Esto es necesario en iPhone Safari, que puede bloquear cookies de terceros en algunas configuraciones.
4. El cliente es redirigido al menú.

La sesión es válida por 24 horas desde su emisión. Si el cliente cierra el navegador y regresa en el mismo dispositivo, la sesión aún funciona y pueden reingresar sin volver a verificar.

Idiomas

El menú soporta 24 idiomas: árabe, alemán, griego, inglés, español, farsi, francés, hindi, indonesio, italiano, japonés, coreano, malayo, polaco, portugués, rumano, ruso, tailandés, tagalo, turco, ucraniano, urdu, vietnamita y chino.

En la primera visita, la página inspecciona el encabezado Accept-Language del navegador y elige la mejor coincidencia. El cliente puede cambiar el idioma en cualquier momento usando el selector en la parte superior del menú. El idioma elegido se recuerda para la sesión.

Los nombres de productos, descripciones e ingredientes no se traducen automáticamente; aparecen en el idioma que ingresaste en el editor de menús. Las etiquetas de la interfaz de usuario como "Add to Cart", "Checkout" y los mensajes del flujo de pago están completamente localizados.

Tema

El menú soporta un tema claro y un tema oscuro. El predeterminado es consciente del dispositivo: si el sistema operativo del cliente está configurado en modo oscuro, el menú se abre en modo oscuro. Un interruptor de tema en la parte superior permite al cliente cambiar.

Encabezado de Marca

El encabezado en la parte superior del menú muestra:

Personaliza estos campos para causar la mejor impresión al cliente. Los clientes reconocen la marca cuando el menú se parece a la señalización física de tu local.

Navegación del Menú

El menú está agrupado por categoría. Dentro de una categoría, los productos se muestran con una miniatura, nombre, breve descripción y precio.

Al tocar un producto se abre la ficha del producto. La ficha muestra:

• La foto completa.
• Descripción en Markdown.
• Línea de ingredientes.
• Chip de tiempo de preparación (solo cuando Mostrar Tiempo de Preparación en el Menú está habilitado).
• Etiqueta de unidad si está configurada (por ejemplo "250 ml").
• Selectores de variantes para cualquier grupo de variantes adjunto al producto.
• Incrementador de cantidad.
• Un botón de Añadir al Carrito.

Los grupos de variantes requeridos bloquean el botón de Añadir al Carrito hasta que el cliente selecciona una opción.

Carrito

El ícono del carrito se encuentra en una ubicación persistente para que los clientes puedan acceder a él desde cualquier pantalla. El contenido del carrito persiste a través de la navegación dentro del sitio; navegar del carrito al menú y viceversa no pierde los artículos.

El carrito permite al cliente:

• Ajustar la cantidad por línea.
• Eliminar una línea.
• Añadir una nota opcional.
• Proporcionar un número de teléfono (opcional).

El subtotal, IVA y total se muestran en tiempo real.

Realizar el Pedido

El paso de Checkout ofrece uno o dos métodos de pago dependiendo de tu configuración:

Efectivo

Si el pago en línea está deshabilitado en tu configuración, solo se muestra Efectivo. El cliente confirma el pedido y se envía inmediatamente. El cliente paga al cajero cuando llega el pedido.

En línea (Stripe Checkout)

Si el pago en línea está habilitado, En línea aparece como una opción. Al enviar:

1. El pedido se crea en estado pendiente.
2. Se devuelve un secreto de cliente de Stripe Checkout.
3. La interfaz de usuario incrustada de Stripe se abre en línea. El cliente ingresa los detalles de la tarjeta.
4. Al autorizarse con éxito, Stripe confirma el cargo y el pedido pasa a pagado.
5. El cliente ve la página de éxito.

Los pagos fallidos o abandonados dejan el pedido en estado pendiente. Se puede hacer un segundo intento desde la misma sesión, o el personal puede cancelar el pedido desde el panel de Pedidos.

Página de Éxito

Después de una presentación exitosa, el cliente llega a una página de recibo que muestra:

• Número de pedido y hora.
• Cada línea con cantidad, variantes y total de línea.
• Subtotal, IVA y total general.
• Método de pago.
• Ícono de estado de pago (pendiente para efectivo; pagado para en línea).
• Un CTA "Realizar Otro Pedido" que regresa al menú con la sesión intacta.
• Un enlace "Volver al Menú".

Sondeo del Estado del Pedido

Después de la presentación, la vista del pedido del cliente sondea el punto final de estado para reflejar actualizaciones desde la cocina. Si tu personal avanza un artículo de preparando a listo, el cliente ve la actualización de la insignia en la línea automáticamente en segundos.

Esto es útil para la recogida de autoservicio en un mostrador. El cliente puede relajarse en la mesa hasta que el menú les indique que el pedido está listo.

Lo que los Clientes No Pueden Hacer

• Los clientes no pueden navegar por el menú sin el código de seguridad. El paso de verificación siempre es requerido.
• Los clientes no pueden realizar pedidos para mesas que están libres o fuera_de_servicio.
• Los clientes no pueden editar o cancelar un pedido después de que ha sido enviado. La cancelación es una acción del personal desde el panel de Pedidos.

Consejos para una Experiencia Limpia del Cliente

• Imprime etiquetas QR con el nombre del café y una instrucción clara como "Escanea para ordenar. Pide al personal el código." Los clientes a veces pasan por alto el paso de verificación de otra manera.
• Mantén los nombres de categorías y productos cortos. Los nombres largos se ajustan en móviles y empujan las imágenes por debajo del pliegue.
• Sube al menos una foto por producto. Los menús con muchas imágenes convierten mejor que los menús solo de texto.
• Habilita Mostrar Tiempo de Preparación en el Menú solo después de que tu estimación dinámica se haya entrenado. Durante los primeros 30 días, el valor estático puede ser demasiado generoso o demasiado ajustado, y los clientes lo notan.
• Prueba el flujo completo tú mismo desde un teléfono antes de abrir a los clientes. Escanea un QR real, ingresa el código, realiza un pedido de prueba y verifica que el pedido aparezca en tu panel.