Web app para check-in de hoteles

Web app móvil para check-in online, upselling y experiencia sin fricciones en hoteles pequeños y medianos.

Prototipo en Figma

KPI's

Datos:

Al menos el 11% de clientes no contrataban por falta de la herramienta

Empresa:

+7% de nuevos clientes por funcionalidad específica
Mayor retención en llamadas de ventas y la creación de Webinars para mostrar herramienta

Cliente:

+19% de mejora en las calificaciones del cliente hacia el hotel
Ticket medio incrementado de media entre el +9% y +15% gracias al upselling
Reducción del tiempo de espera in situ de aproximadamente 5 minutos por huesped

Rol:
Diseñador de producto

Equipo:
1 Diseñador de producto (Figma)
1 Desarrollador Frontend (Java)
1 Desarrollador Backend (PHP)
1 QA tester (Automation)

Herramientas:
Figma, Illustrator, Photoshop, Zeplin

Duración:
12 semanas
Febrero - Mayo 2024

Contexto y problema

El sector hotelero independiente y de tamaño medio (80% de clientes del PMS) tenía un gap digital frente a grandes cadenas:

No contaban con un check-in online previo a la llegada.
Largas colas en recepción y pérdida de ingresos por falta de venta anticipada de extras.
En procesos de venta, la ausencia de esta funcionalidad suponía la pérdida del 11% de clientes potenciales que comparaban con otros PMS más completos.

Objetivo: Crear una solución web mobile-first para check-in online, integrada en el SaaS PMS de Avirato, que permitiera además upselling (habitaciones, extras, servicios premium) y redujera fricciones en la llegada.

Investigación

Stakeholders clave: dueños y managers de hoteles independientes, equipo de ventas, soporte técnico del PMS.

Métodos:

Entrevistas exploratorias con clientes piloto (n=7).
Feedback de demos en Webinars.
Datos cuantitativos obtenidos directamente del PMS central (reservas, valoraciones, upsellings, tiempos de espera).

Hallazgos:

Dueños con pocos empleados buscaban ahorro de tiempo operativo y una herramienta fácil de usar sin formación técnica.
Los huéspedes valoraban la rapidez de check-in y la transparencia en servicios extra.
La venta cruzada debía ser clara pero no intrusiva.

Buyer Persona

Isabel, 44 años

Dueña de hotel boutique

Hotel: 25 habitaciones, gestión con 3 empleados.
Objetivo: simplificar procesos para no depender de tanto personal.
Dolores: colas en recepción, formación constante de empleados, herramientas poco intuitivas.
Motivación: aumentar ticket medio con extras (desayunos, late check-out) sin presionar al cliente.
Comportamiento digital: usa PMS a diario, móvil y portátil indistintamente, valora rapidez y “plug & play”.

Javier, 52 años

Director de hotel de playa mediano

Hotel: 80 habitaciones, 15 empleados en temporada alta.
Objetivo: diferenciarse de cadenas grandes con servicios digitales modernos.
Dolores: huéspedes internacionales que exigen procesos ágiles, quejas en reseñas por esperas largas.
Motivación: mostrar imagen innovadora y captar clientes repetidores con buena experiencia digital.
Comportamiento digital: abierto a demos y webinars, busca soluciones escalables, preocupado por integración con sistemas de pago.

Arquitectura & flujos

Se diseñó un user flow completo (imagen adjunta), desde el inicio del check-in hasta la confirmación final:

Iniciar check-in → Seleccionar habitación.
Completar datos y documentos → Firmar digitalmente.
Opciones de upselling (habitaciones superiores, extras).
Confirmar pago.
Finalizar check-in → Recibir confirmación.

Iteraciones: 4 rondas de ajustes sobre copy, orden de pasos y pantallas de upselling.

Wireframes y exploraciones

Wireframes low-fi: exploración de 3 alternativas para orden de pasos.
Mid-fi y prototipos en Figma: testados con usuarios.
Decisión clave: el upselling debía mostrarse antes de la confirmación final, no al inicio (mejoró conversión +9%).

UI & sistema de diseño

Sistema de diseño creado ad hoc para el SaaS de Avirato.
Design tokens en Figma: tipografía, color, espaciados y componentes reutilizables.
Accesibilidad: contraste AA, inputs amplios, CTAs claros, proceso “step by step”.
Microcopy UX: copy directo y simple → “Terminar check-in”, “Confirmar habitación”, “Subir documento”.