Design Challenge · Sr. Product Designer
El momento, cuadra. La cuadra, también.
Juntarse no cuesta. Organizarse sí.
Recorrido de usuario
Como organizadora histórica del grupo, quiero delegar la coordinación en un sistema que cruce las rutinas de todos de forma asíncrona, para mantener el hábito de vernos cada 15 días sin sufrir el desgaste mental de organizarlo.
Victoria quiere juntar a sus amigos pero está cansada de ser la que siempre insiste. Las agendas complejas, los hijos y la distancia hacen que coordinar algo por chat sea imposible.
Cada amigo entra a la app cuando puede y carga su realidad en segundos: Ignacio sus mellizos y menú vegano, Blas y Andrea los horarios de sus hijos, Mariano la casa disponible, y Rafael el preaviso que necesita para viajar desde Córdoba.
El sistema trabaja en segundo plano absorbiendo la complejidad. Cruza las franjas horarias semanales, barrios, restricciones alimentarias y tiempos de viaje de todo el grupo.
En lugar de abrir una votación que genere más debate, la app muestra una única solución cerrada directamente en la pantalla de inicio: "Cuadró. Sábado 20:30 en lo de Mariano. Menú apto vegano y coordinado con el viaje de Rafael."
El grupo hace lo único que el sistema no puede hacer por ellos: confirmar con un tap. Se elimina el peso de la organización y Victoria vuelve a disfrutar de la juntada como una invitada más.
El desafío
Se presentó el caso de Victoria, diseñadora gráfica que tiene un grupo de amigos con quienes solía juntarse cada 15 días. Compromisos laborales, familiares y mudanzas fueron diluyendo esa tradición.
El objetivo: diseñar una experiencia de producto que facilite encuentros regulares entre personas con realidades y preferencias diversas.
Los personajes
Antes de abrir Figma, analicé cada perfil no como un personaje de un brief sino como un usuario con fricciones concretas que el producto tenía que resolver.
Victoria
La que históricamente organizó todo y cargó el peso del grupo. El producto existe para librarla de ese rol.
Mariano
Su casa y su cocina son recursos del grupo que nunca se activaron solos. Cuadra los activa automáticamente.
Ignacio
Su pareja Antoine es vegano. Tiene mellizos. Es quien más valora el encuentro pero tiene menos margen. Cuadra nunca propone un lugar sin opciones para Antoine.
Rafael
Viaja a Buenos Aires para ver al grupo. Cada vez que vuelve, el grupo no puede. Cuadra le da la anticipación que necesita para que el viaje valga la pena.
Andrea
Necesita días de anticipación para organizar el cuidado de su hijo antes de comprometerse. Cuadra nunca propone sin ese margen.
Blas
Vida muy ocupada. Ventana de tiempo finísima. Cuadra detecta esa ventana sin pedirle nada extra.
El problema real
La primera lectura era obvia. Necesitaba llegar más profundo.
El afecto existe. Lo que no existe es el sistema que lo traduzca en un encuentro. Cuadra no organiza eventos, absorbe ese costo.
La solución
Un sistema que trabaja en silencio, conoce a cada integrante del grupo y propone el encuentro cuando las condiciones se alinean. No requiere que nadie organice. No requiere que nadie elija. El grupo hace una sola cosa: confirmar.
01
Nombre, ciudad, barrio, restricciones, días de preaviso, disponibilidad de casa, preferencia de encuentro y semana típica. Nunca se vuelve a preguntar.
02
La semana llega precargada con la rutina de cada uno. Solo se ajusta lo que cambió. Si nada cambió, ni hace falta abrir la app.
03
Cuando todos coinciden, Cuadra detecta el momento y elige el lugar. Día, hora, lugar y contexto, todo resuelto y explicado.
La resolución
El proceso no fue lineal. Arrancó por el problema, pasó por los perfiles y terminó en las decisiones de sistema.
Victoria no es solo "diseñadora de 38 años". Es quien carga con el peso organizativo del grupo. Rafael no es solo "el que vive en Córdoba". Es quien más esfuerzo hace para verse con sus amigos y más seguido se frustra cuando no puede. Cada perfil tenía una tensión de diseño adentro.
El principio que guió todo: el grupo no debería tomar ninguna decisión que el sistema pueda tomar por ellos.
| ¿Cuándo pueden verse? | El sistema cruza disponibilidades. |
| ¿Dónde se juntan? | El sistema propone según perfiles. |
| ¿Quién organiza? | Nadie. Cuadra lo resuelve solo. |
| ¿Por qué ese lugar? | El sistema lo explica en una línea. |
Cada campo del onboarding tiene un uso directo en el sistema. Si no afecta ninguna decisión de Cuadra, no está.
| Restricciones alimentarias | → afecta la propuesta de lugar. |
| Días de preaviso | → afecta cuándo se propone. |
| Casa disponible | → entra al pool de lugares. |
| Ciudad y barrio | → calcula zona de encuentro. |
| Semana típica | → base del match semanal. |
El sistema hace cálculos complejos en el fondo. El usuario ve una sola cosa: "Cuadró. Sábado 20:30. En casa de Mariano." Con una línea de contexto: "Cocinero del grupo, apto vegano para Antoine, sin límite de horario." La complejidad del sistema se convierte en la simplicidad de la experiencia.
| Welcome | Presenta el producto en 5 segundos. |
| Profile Setup | Recolecta lo que el sistema necesita. |
| Typical Week | Establece la base de disponibilidad. |
| Create Group | Define las preferencias colectivas. |
| Home | Estado del grupo en tiempo real. |
| Match Proposal | El momento que el producto existe para generar. |
| Group Detail | Transparencia de lo que sabe Cuadra. |
| Encuadra | La memoria del vínculo. |
| Celebration | El cierre emocional del flujo. |
Decisiones de diseño
Decisión 01 · La grilla de disponibilidad
Decisión 02 · Quién elige el lugar
Decisión 03 · La información del perfil
Decisión 04 · Las franjas horarias
Decisión 05 · El flujo del match
Microinteracciones
Dropdown
Frecuencia de encuentro
Especificado en el briefLista expandible con selección única. El componente más explícito del flujo como interacción.
Pills de selección múltiple
Restricciones alimentarias
Tap activa/desactiva. Estado en #00C9A7 con checkmark. Una persona puede tener más de una restricción.
Pills de selección múltiple
Preferencias del grupo
Mismo comportamiento. Comunica preferencias sin formularios.
Switches
Toggles del perfil
Feedback visual inmediato. Componentizados y consistentes a lo largo del onboarding.
Interacción principal
Grilla de disponibilidad semanal
7 días × 4 franjas horarias. El gesto más repetido de la app. Precargada con la semana típica, solo se ajusta lo que cambió.
Sistema de diseño
Cada elemento de la UI fue diseñado como un componente consistente, desde los bloques de la grilla hasta los switches del perfil. La librería completa está disponible en el Figma File.
Decisiones de sustracción
Identidad
El nombre
El logo
Cuatro bloques oscuros separados en grilla 2×2. Los espacios entre ellos representan las calles. Un punto #00C9A7 en el centro representa el punto de encuentro. El logo es una metáfora del producto.
El color
Verde estándar (#22C55E), asociación directa con finanzas. Descartado.
Coral, en UI un punto pequeño en ese tono lee como error o alerta. Descartado.
#00C9A7, turquesa tirando a verde. Sin connotación financiera ni de error. El mismo color del bloque seleccionado en la grilla, logo y producto hablan el mismo idioma visual.
Encuadra
"Memoria" era genérico y frío. "Historial" era de banco.
Encuadra = en + cuadra = enmarcar. Cada encuentro queda enmarcado en el tiempo con fotos, fecha y lugar. La bitácora del grupo. Se construye sola después de cada encuentro.
Próximas iteraciones