Restaurandt - ¿Por qué esperar?

Restaurandt - ¿Por qué esperar?
  • Graphic
  • UX/UI
  • Development
Aplicación para reservar mesa y pedir con antelación. Diseño orientado al desarrollo ágil en equipo.

Contexto

Restaurandt nació como proyecto final del Bootcamp de Desarrollo Full-Stack de Upgrade Hub, desarrollado por un equipo de seis personas. El reto era claro: diseñar y construir desde cero una aplicación funcional que demostrase el dominio de todo el stack tecnológico aprendido durante el curso, desde el frontend en React hasta el backend con Node y MongoDB.

Dado que el foco del proyecto era técnico, la fase de diseño se planteó de forma deliberadamente estratégica: flujos simples, interfaz limpia y decisiones visuales que facilitasen la implementación por parte del equipo de desarrollo. No se trataba de reducir la ambición del producto, sino de priorizar la solidez funcional sobre la complejidad estética.

Desktop home de Restaurandt

El problema

Comer fuera en un descanso laboral corto puede convertirse en una experiencia frustrante. Esperar a ser atendido, pedir, esperar la comida y pagar en un tiempo limitado hace que muchas personas renuncien a disfrutar de un restaurante. Restaurandt responde a esa necesidad: reservar mesa y encargar la comida con antelación, para llegar al local con todo preparado y aprovechar el tiempo al máximo.

User Persona

Para acotar el diseño, definimos un perfil de usuario principal que guiase las decisiones del equipo.

Laura, 31 años. Técnica de marketing en una empresa del centro de Madrid.

Laura trabaja en jornada partida y dispone de 45 minutos para comer. Le gusta salir del despacho y comer en un restaurante cercano, pero la mayoría de los días acaba recurriendo al menú del bar de siempre porque el tiempo se le va en esperas. Es usuaria habitual de apps de delivery, pero preferiría comer sentada en un local si el proceso fuese más ágil. Valora la inmediatez, la claridad y no tener que lidiar con interfaces confusas cuando lleva ya cinco horas delante del ordenador.

Laura no es la única. Detrás de ella hay un perfil amplio de usuarios que comparten la misma fricción: el tiempo es el recurso más escaso, y la experiencia en restaurantes no siempre lo respeta.

Identidad de marca

La identidad visual fue diseñada íntegramente por mí. El nombre Restaurandt —con la d y la t separadas por el símbolo &— da lugar a un logotipo con carácter propio, donde el ampersand actúa como elemento diferenciador y aporta dinamismo a la marca. Se adoptó un rojo intenso como color principal, evocando la energía, el apetito y la inmediatez que definen la propuesta de valor del producto.

La versión reducida del logo, R&T, garantiza su legibilidad en la versión móvil sin perder reconocibilidad. El resultado es una identidad que transmite confianza, modernidad y un punto de carácter.

Flujos de navegación

Antes de pasar a Figma, el equipo dedicó tiempo a definir y validar internamente los flujos principales de la aplicación, con el objetivo de asegurarse de que cada pantalla tuviese un propósito claro y que ningún paso fuese superfluo.

Se identificaron tres flujos críticos sobre los que pivotaría todo el desarrollo:

  • Onboarding: registro e inicio de sesión, con acceso vía Google para minimizar la fricción.
  • Descubrimiento: búsqueda y selección de restaurante desde el listado principal.
  • Reserva y pedido: selección de platos, confirmación de mesa y hora de llegada.

Esta definición previa fue clave para que diseño y desarrollo hablasen el mismo idioma desde el primer día, evitando retrabajos y manteniendo el ritmo del equipo durante todo el sprint.

Diseño de la interfaz

La interfaz se diseñó en Figma, siguiendo un enfoque orientado a la claridad y a la facilidad de implementación. Cada pantalla fue pensada para cubrir los flujos principales con el menor número de pasos posible.

El sistema de tarjetas con bordes redondeados, el uso consistente del rojo como color de acción y la jerarquía tipográfica clara hacen que la interfaz sea intuitiva desde el primer uso, sin necesidad de instrucciones. La versión mobile adapta la experiencia con un layout en columna y botones de acción flotantes, manteniendo la coherencia visual con la versión desktop.

Vista de restaurante en Restaurandt

Desarrollo

El equipo implementó la aplicación utilizando React en el frontend, Node.js con Express en el backend y MongoDB como base de datos. La apuesta por flujos simples y bien definidos desde el diseño se tradujo en una implementación ágil, permitiendo al equipo completar con éxito todos los flujos principales: registro, búsqueda de restaurantes, reserva de mesa y pedido anticipado.

El hecho de no sobrecargar el diseño con funcionalidades secundarias fue una decisión que el equipo valoró muy positivamente, ya que permitió mantener el foco en la calidad del código y en la robustez de cada flujo.

Conclusiones

Restaurandt fue uno de los proyectos que mejor recepción tuvo entre los presentados en la edición del bootcamp, destacando tanto por la coherencia entre diseño y desarrollo como por la utilidad real de la solución planteada. Demostró que con un equipo multidisciplinar, una buena definición del problema y decisiones de diseño conscientes, es posible entregar un producto sólido, funcional y visualmente atractivo en un tiempo muy reducido.

El proyecto puso de manifiesto la importancia de que el diseño y el desarrollo trabajen desde el principio con los mismos objetivos, y supuso una prueba de que la simplicidad, bien ejecutada, es en sí misma una decisión de diseño de alto valor.

Si quieres saber más sobre este proyecto, puedes ponerte en contacto conmigo via mail o LinkedIn . Estaré encantado de responder a todas las preguntas.