Figma desde Cero

Este curso propone construir una aplicación móvil para reservar turnos en una clínica barrial, desde el primer mapa de pantallas hasta un prototipo navegable que otra persona pueda revisar. El escenario es deliberadamente concreto: una paciente necesita encontrar una especialidad, elegir un horario disponible, confirmar la reserva y consultar sus próximos turnos. Cada decisión visual deberá responder a esa tarea, no a una colección de efectos decorativos.

En el primer módulo aprenderás a orientarte en Figma mediante un archivo organizado para TurnoClaro. Identificarás el lienzo, las páginas, el panel de capas y las propiedades de selección usando una pantalla de agenda como referencia. Después crearás frames para móvil y escritorio, separarás contenedores de contenido y practicarás una jerarquía de capas que permita localizar rápidamente encabezado, filtros, lista y navegación. La unidad sobre color y tipografía convierte esa estructura en un sistema pequeño: una escala tipográfica, colores de acción y estados con suficiente contraste, además de estilos que puedan cambiarse sin corregir cada objeto manualmente.

El segundo módulo se concentra en decisiones que deben sobrevivir a cambios de contenido. Construirás con Auto Layout un botón cuyo texto puede cambiar de “Buscar horario” a “Confirmar turno” sin deformarse. Luego transformarás una tarjeta de turno y un campo de selección en componentes reutilizables. Las variantes representarán estados observables, como disponible, seleccionado, deshabilitado y con error, evitando duplicados ambiguos. En prototipos interactivos conectarás una búsqueda, una pantalla de resultados, un detalle de turno y una confirmación. La prioridad será que cada conexión tenga un propósito verificable: navegación, validación, apertura de un detalle o retorno a la agenda.

El tercer módulo reúne esas decisiones en un proyecto completo. Primero producirás wireframes de baja fidelidad para cuatro recorridos: buscar especialidad, escoger horario, confirmar una reserva y cancelar una reserva pendiente. Incluirás estados vacíos, errores de validación y ausencia de conexión, porque una pantalla principal no representa toda la experiencia. Después aplicarás el sistema visual y ensamblarás las pantallas usando componentes y Auto Layout. La fase de prototipo añadirá conexiones, mensajes de confirmación y una ruta alternativa cuando no existan horarios.

El trabajo final será un archivo de Figma organizado en páginas de exploración, componentes, wireframes, diseño visual, prototipo y notas de entrega. Deberás documentar decisiones como el orden de las acciones, el texto de los estados y la razón para usar una variante en lugar de una copia. La comprobación combinará inspección del archivo y ejecución del flujo: una persona deberá localizar una especialidad, escoger un horario y confirmar el turno sin recibir instrucciones adicionales. También revisarás contraste, nombres de capas, consistencia de espaciado y comportamiento ante textos más largos.

Los planes de siete y treinta días no añaden herramientas nuevas: convierten el proyecto en una práctica graduada. El primero sirve para completar sesiones breves de exploración, estructura, componentes y prototipado. El segundo organiza iteraciones, revisión y documentación. El cierre establecerá qué conservar, qué simplificar y qué validar después. La evidencia de aprendizaje será el archivo funcional, el registro de decisiones y una lista de problemas todavía abiertos; no una afirmación general de dominio.