En este proyecto
Campaments i Més
Dar claridad a un proceso de reserva complejo.
Quien organiza una acampada necesita encontrar un terreno y saber cómo avanzar hasta cerrar la estancia. A partir de los wireframes del cliente, definí las conexiones entre pantallas y diseñé los pasos y estados que faltaban para orientar al usuario entre condiciones y validaciones.
- Equipo
- K·Factor
- Cliente final
- Campaments i Més
- Colaboración
- Aura · desarrollo
- Año
- 2026
- Lectura
- 7 min
El proyecto de un vistazo
- Desafío
- Guiar al usuario desde la búsqueda de un terreno hasta el cierre de la estancia, en un proceso con distintas condiciones, validaciones y pagos.
- Mi papel
- Responsable del diseño UX/UI dentro del equipo de K·Factor, en colaboración con desarrollo.
- Decisión clave
- Conectar las pantallas y definir qué información y acciones necesita el usuario en cada etapa, incluidas las esperas y los errores.
- Resultado
- Pantallas para escritorio y móvil, con los recorridos, estados y componentes preparados en Figma.
Contexto y alcance
Los wireframes no resolvían todo el recorrido
Campaments i Més ofrece terrenos de acampada a entidades de ocio infantil y juvenil. Además de encontrar un espacio, tenían que registrarse, solicitar la estancia y completar los pagos, permisos y el cálculo final del coste.
Revisé las transiciones entre pantallas y resolví los pasos que faltaban. En cada etapa definí qué información mostrar, qué podía hacer el usuario y cómo explicarle el siguiente paso, según su entidad y el estado de la reserva.
Arquitectura de la información
Cómo se conecta toda la web
Había que unir la búsqueda, los favoritos y el comparador con la ficha del terreno. Después venían el registro, la solicitud y el área privada. La información sobre la organización y la ayuda también tenían su lugar.
Fuimos ajustando la estructura y los recorridos según las necesidades que surgían al revisar la búsqueda, la reserva y el alta.
Diseño de interacción
Empezar fácil. Concretar después.
Quería que buscar un terreno fuera la primera acción en la home. El buscador reúne fechas, plazas, zona y terreno o población. Los filtros más detallados llegan después.
También diseñé cómo elegir fechas concretas o flexibles, indicar participantes y encontrar un terreno por su nombre. Para móvil preparé dos variantes: una entrada compacta y un formulario vertical.
Favoritos y comparación
Afinar y comparar para decidir
Al entrar desde una categoría de la home, la búsqueda conserva ese filtro. Los favoritos permiten guardar terrenos y verlos en lista o mapa. El comparador coloca hasta cinco opciones juntas para revisar sus diferencias.
Flujo de reserva
Qué pasa después de solicitar un terreno
Enviar la solicitud no confirma la reserva. Primero, la central la revisa; después se paga el anticipo y se comprueba el justificante. Tenía que quedar claro cuándo actuar y cuándo esperar.
El flujo muestra esos pasos y lo que ocurre al terminar la estancia: confirmar los asistentes reales y revisar el coste final.
Flujo de alta
El alta cambia según la entidad
Una agrupación de MEG se busca en la lista; otras organizaciones necesitan encontrar su entidad o darla de alta. Las entidades externas reciben el acceso después de una revisión.
El NIF permite comprobar si la entidad ya está registrada. Si coincide, se muestran las entidades encontradas para elegir la correcta o indicar que ninguna corresponde. Antes de crear una nueva, se pide revisar el nombre para evitar duplicados por errores al escribirlo.
La decisión de diseño fue resolver qué hacer ante una coincidencia y guiar al usuario antes de crear otra entidad.
Ficha del terreno y checkout
Solicitar no es confirmar la reserva
La ficha reúne fotos, servicios, ubicación, disponibilidad y condiciones. Al solicitar el terreno, las fechas y los participantes se conservan, incluso si hay que iniciar sesión.
Quien hace la solicitud y quien será responsable de la estancia pueden ser personas distintas. Separé sus datos y aclaré el siguiente paso: la petición se revisa antes de pagar.
Estados y seguimiento
La espera también necesita un estado
Al revisar el recorrido, detecté que faltaba un paso entre enviar la solicitud y poder pagar. Añadí «solicitud recibida, pendiente de validación»: la petición había llegado, pero la reserva aún no estaba confirmada.
Los pasos terminados siguen visibles junto al actual y los pendientes. Tras la confirmación, un aviso recuerda que hay que contactar con el propietario para concertar la visita previa. Sus datos ya están disponibles.
Iteración del área privada
Cerrar la estancia también es un flujo
La tabla de asistentes quedaba al final de la página y la encuesta interrumpía la liquidación. Reuní la tabla y el cierre de estancia en la misma vista, con un aviso para confirmar los asistentes.
Añadí el coste orientativo justo después de la tabla, para consultarlo antes de confirmar. La encuesta pasó después de la liquidación y antes del contacto. Así, las tareas para cerrar la estancia quedaban juntas.
Sistema UI y componentes
Explicar de dónde sale el precio
El precio cambia según la entidad, las fechas y el mínimo de personas que cobra el terreno. Preparé las variantes del resumen para explicar cada cálculo y separar el total del anticipo.
Por ejemplo, si van 8 personas y se cobra un mínimo de 10, hay que explicar ese precio sin cambiar los 8 asistentes reales. También definí qué muestran los formularios al escribir, elegir una opción o corregir un error.
Diseño, desarrollo y cliente
Revisar las propuestas juntos
Proponía el recorrido y el diseño y los revisaba con Aura, de desarrollo. Después los presentábamos en la reunión semanal con Campaments i Més y ajustaba las pantallas y los componentes según lo acordado.
La hoja de seguimiento recogía los cambios y pendientes. Por ejemplo, acordamos dejar visible el desglose de precios. Yo diseñaba cómo mostrarlo; desarrollo se encargaba del cálculo.
Entregué en Figma las pantallas de escritorio y móvil, los componentes y las indicaciones de comportamiento: el recorrido principal, las esperas, los errores y las condiciones que podían cambiarlo.
Aprendizaje
El valor de decidir juntos
Este proyecto me hizo ver el valor de las reuniones semanales para contrastar propuestas con desarrollo y las personas del cliente implicadas, compartir dudas y acordar las decisiones del proyecto.
