Desarrollo de Aplicaciones y Experiencia de Usuario · 2do Semestre

Diseño Centrado en el Usuario (UX)

Los estudiantes aplican metodologías para entender al usuario, sus necesidades y comportamientos antes de diseñar una solución tecnológica.

Acerca de este tema

La Programación de Interfaces (UI) se enfoca en la construcción de la capa visual con la que interactúan los usuarios. En I Medio, los estudiantes aprenden a aplicar principios de diseño como la jerarquía visual, el uso del color y la tipografía para guiar la navegación. Este tema conecta la creatividad artística con la precisión técnica de la programación, cumpliendo con los estándares de diseño de soluciones tecnológicas del currículum chileno.

Los alumnos exploran cómo crear interfaces que sean no solo atractivas, sino también funcionales y accesibles. Se pone especial énfasis en el diseño responsivo, asegurando que las aplicaciones funcionen bien en diversos dispositivos. El aprendizaje de UI es altamente visual y experimental; los estudiantes se benefician de analizar interfaces exitosas y fallidas, aplicando esos aprendizajes en la construcción de sus propios proyectos digitales.

Objetivos de Aprendizaje

• Analizar las necesidades y comportamientos de usuarios específicos para informar el diseño de una solución tecnológica.
• Evaluar la usabilidad de prototipos de interfaces digitales mediante pruebas con usuarios representativos.
• Diseñar flujos de interacción y wireframes basados en la investigación de usuarios y principios de diseño UX.
• Comparar diferentes metodologías de investigación de usuarios para seleccionar la más adecuada a un problema dado.
• Criticar el diseño de aplicaciones existentes identificando puntos débiles en la experiencia del usuario.

Antes de Empezar

Fundamentos de Diseño de Interfaces (UI)

Por qué: Los estudiantes necesitan comprender los principios básicos de la interfaz visual para poder aplicar el diseño centrado en el usuario de manera efectiva.

Introducción a la Programación y Lógica

Por qué: Una comprensión básica de cómo funcionan las aplicaciones y la lógica de programación ayuda a los estudiantes a diseñar soluciones factibles y a entender las limitaciones técnicas.

Vocabulario Clave

Diseño Centrado en el Usuario (DCU)	Una filosofía de diseño que pone las necesidades, deseos y limitaciones de los usuarios finales en el centro de todo el proceso de diseño.
Investigación de Usuarios	El proceso sistemático de comprender las actitudes, comportamientos y necesidades de los usuarios a través de métodos como entrevistas, encuestas y pruebas de usabilidad.
Prototipado Rápido	La creación de versiones tempranas y simplificadas de un producto o interfaz para probar conceptos y obtener retroalimentación rápidamente.
Wireframe	Una representación visual de bajo nivel de la estructura y el diseño de una interfaz, enfocada en la disposición de elementos y la funcionalidad, sin detalles visuales.
Test de Usabilidad	Una evaluación de un producto o prototipo realizada por usuarios representativos que intentan completar tareas específicas, observando su desempeño y recogiendo sus opiniones.

Ideas de aprendizaje activo

Paseo por la Galería: Análisis de Jerarquía Visual

Se muestran capturas de pantalla de aplicaciones populares. Los estudiantes deben marcar con flechas dónde se dirige su mirada primero, segundo y tercero, discutiendo cómo el tamaño y el color de los botones influyen en sus acciones.

⏱ 40 min·Grupos pequeños

Generar misión

Pensar-Emparejar-Compartir: El Desafío de la Accesibilidad

Se entrega un diseño con poco contraste o fuentes muy pequeñas. Los estudiantes deben proponer cambios individuales para hacerlo accesible a personas con baja visión, comparando sus soluciones con un compañero.

⏱ 30 min·Parejas

Generar misión

Círculo de Investigación: UI Kit Comunitario

Los grupos deben definir un conjunto de colores, botones y fuentes que representen la identidad de su colegio. Deben justificar sus elecciones basándose en la psicología del color y la legibilidad para crear una interfaz coherente.

⏱ 60 min·Grupos pequeños

Generar misión

Conexiones con el Mundo Real

Los diseñadores UX de empresas como Google y Apple realizan entrevistas y pruebas de usabilidad con personas de diversas edades y habilidades para asegurar que sus aplicaciones, como Google Maps o la App Store, sean fáciles de usar para todos.

Equipos de desarrollo de videojuegos emplean diseñadores UX para crear experiencias de juego inmersivas. Realizan pruebas con jugadores para ajustar controles, interfaces y la curva de dificultad, asegurando que el juego sea desafiante pero no frustrante.

Las instituciones financieras, como bancos o fintechs, contratan especialistas UX para diseñar sus aplicaciones móviles. El objetivo es simplificar procesos complejos como transferencias o solicitudes de crédito, haciéndolos intuitivos para usuarios con distintos niveles de conocimiento tecnológico.

Cuidado con estas ideas erróneas

Idea errónea común

Diseñar una interfaz es solo elegir colores que me gusten.

Qué enseñar en su lugar

El diseño UI debe seguir principios de usabilidad y accesibilidad. El uso de herramientas de contraste de color ayuda a los estudiantes a ver que la estética debe estar al servicio de la función.

Idea errónea común

Una interfaz cargada de elementos es más profesional.

Qué enseñar en su lugar

El minimalismo suele mejorar la experiencia del usuario al reducir la carga cognitiva. Las actividades de rediseño de interfaces complejas enseñan el valor de la simplicidad.

Ideas de Evaluación

Boleto de Salida

Entregue a cada estudiante una tarjeta con el nombre de una aplicación conocida (ej. Spotify, WhatsApp). Pida que escriban dos necesidades de usuario que esa aplicación resuelve y un aspecto de su diseño que podría mejorarse para un grupo específico de usuarios (ej. adultos mayores).

Verificación Rápida

Muestre a los estudiantes un wireframe simple de una pantalla de registro. Pregunte: '¿Qué información es esencial en esta pantalla según los principios de DCU? ¿Qué elemento podría ser confuso para un usuario nuevo?' Recoja las respuestas para evaluar la comprensión inicial.

Evaluación entre Pares

En parejas, los estudiantes intercambian un boceto de wireframe para una función simple (ej. añadir un amigo). Cada estudiante evalúa el wireframe de su compañero basándose en dos criterios: Claridad de la navegación y suficiencia de la información. Deben escribir una sugerencia constructiva para cada criterio.

Preguntas frecuentes

¿Qué es la jerarquía visual en UI?

Es la organización de los elementos de una interfaz de manera que el usuario entienda qué es más importante. Se logra mediante el uso de tamaños, colores, pesos de fuente y espacios en blanco.

¿Qué herramientas se usan para diseñar interfaces?

Herramientas como Figma o Adobe XD son el estándar industrial, pero para niveles iniciales, incluso Canva o Google Slides permiten entender los conceptos de diseño visual y prototipado.

¿Cómo ayuda el aprendizaje activo a dominar la programación de interfaces?

Al realizar críticas constructivas de interfaces reales y colaborar en la creación de guías de estilo, los estudiantes internalizan los principios de diseño de forma práctica. El aprendizaje activo les permite ver el impacto directo de un cambio visual en la facilidad de uso de una herramienta.

¿Por qué es importante el diseño responsivo?

Porque hoy en día los usuarios acceden a la información desde celulares, tablets y computadores. Una interfaz debe adaptarse automáticamente al tamaño de la pantalla para no perder funcionalidad.