FUNDAMENTOS Y PROCESO UX

FUNDAMENTOS Y PROCESO UX

ENFOQUE PRÁCTICO

¿Qué es UX ?

UX es asegurarse que el sistema sea: Útil → Resuelve un problema real Usable → Fácil de usar Rápido → No hace esperar Confiable → Funciona cuando se necesita En arquitectura: Cada decisión técnica impacta estos 4 pilares.

EL PROCESO UX en 5 Pasos

Crear 1-2 User-Personas (plantilla simple):

PASO 1: ENTENDER A TU USUARIO (Research) ¿Qué hacer concretamente? Entrevistas de 15 minutos con 5-7 usuarios Preguntar: "Contame la última vez que usaste [sistema similar]" "¿Qué te frustró?" "¿Qué te gustó?" NO preguntar: "¿Te gustaría que tenga X característica?" (las opiniones mienten)

Mapear el User Journey actual (en una hoja):

[Entra al sistema] → [Busca materia] → [Selecciona horario] 😐 😤 😰

→ [Confirma] → [¿Inscripto?] 😱 ❓

PASO 2: DEFINIR PROBLEMAS ESPECÍFICOS

¿Qué hacer?Identificar los 3 mayores puntos de dolor del journey:Plantilla de problema:

Priorizarlos por:Frecuencia (¿cuántos usuarios lo sufren?)Impacto (¿qué tan grave es?)Factibilidad técnica (¿se puede resolver?)

PASO 3: IDEAR SOLUCIONES (Design)

Aplicar checklist de:

• ¿Hay feedback claro de qué pasó?
• ¿El usuario puede deshacer si se equivocó?
• ¿Los botones dicen claramente qué hacen?
• ¿Carga rápido? (si no, ¿hay loader?)

Entregable: 2-3 wireframes de soluciones

¿Qué hacer?

• Sketching rápido (boceto):
• Doblar una hoja en 8 cuadrados
• 1 minuto por cuadrado
• Dibujar 8 ideas diferentes de solución (no importa si son malas)
• Elegir las 2 mejores

Wireframes de baja fidelidad:

• Dibujar a mano o en Figma/Excalidraw
• Solo cajas, texto, botones (sin colores ni diseño lindo)
• Enfocarse en: ¿Qué elementos van? ¿En qué orden? ¿Qué es más importante?

PASO 4: PROTOTIPAR E ITERAR

• Definir requerimientos arquitectónicos:

¿Qué hacer?

• Prototipo clickeable (Herramientas: Figma, Marvel, InVision)
• Conectar wireframes para simular flujo
• No necesita verse bonito, necesita funcionar
• Toma 1-2 horas armar uno básico

Prototipo técnico:

• Implementar la parte más riesgosa primero
• Ejemplo: "¿Podemos garantizar inscripción en < 2 seg con 500 usuarios concurrentes?"
• Hacer prueba de carga simple

PASO 5: TESTEAR CON USUARIOS REALES

Test de usabilidad de 5 minutos:Reclutá 5 usuarios Darles una tarea concreta: MAL: "Explorá el sistema" BIEN: "Inscribite a la materia 'Base de Datos II' en horario de mañana" Técnica "Think Aloud": "Decime en voz alta qué estás pensando mientras usás el sistema"

NO ayudar, NO explicar nada. Solo observar y anotar dónde se traban Preguntas post-test: Del 1-10, ¿qué tan fácil fue?¿Qué fue lo más confuso?¿Algo que cambiarías? Analizar patrones: Si 3+ personas se traban en el mismo lugar → HAY PROBLEMA Priorizar arreglos y repetir test

Métricas UX Concretas

Métricas de usuario (analytics): Net Promoter Score (NPS): "Del 1-10, ¿recomendarías este sistema?" Task Completion Time: ¿Cuánto tardan en completar acción clave? Bounce Rate: ¿Se van rápido sin hacer nada? Support Tickets: ¿Cuántos piden ayuda?

Métricas técnicas (medibles en código): Time to Interactive (TTI): < 3 segundos First Contentful Paint: < 1.8 segundos Task Success Rate: > 90% de usuarios completan la tarea Error Rate: < 5% de errores en flujos críticos

Herramientas:

• Google Analytics (comportamiento)
• Hotjar (heatmaps, grabaciones de sesión)
• Sentry (tracking de errores)
• Lighthouse (performance)

Ejercicios