Módulo 3: Diseño de Interacción

Gonzalo García de Vinuesa Díaz del Río
UXER SCHOOL
Published in
3 min readMar 19, 2019

UX / UI Design Bootcamp

El diseño de interacción es el esqueleto de todo producto digital, es el trabajo entre bambalinas para dar forma y estructura a tu proyecto. Es la fase donde se establecen los contenidos, interfaces e interacciones enfocadas al mundo digital.

Comenzamos con la arquitectura de la información, que permite definir la estructura de nuestro producto para que sea fácil y comprensible por parte de nuestro usuario, construyendo herramientas de orientación y búsqueda que permiten una gestión satisfactoria de la información que se almacena en dichas estructuras. Para entenderlo, se presentan casos prácticos, los ámbitos de su aplicación, modelos mentales, y lo ponemos en práctica a través de dos ejercicios, el Card Sorting y los Tree Testing.

Para visualizar estas estructuras recurrimos a los flowcharts o diagramas de flujo, y aprendemos sobre ellos, su función y la simbología ANSI, siempre apoyados con ejemplos y casos prácticos, por supuesto.

Otro elemento fundamental de este proceso son los Grids, que permiten visualizar de forma rápida y en fases tempranas del prototipo la estructura de nuestra interface y la distribución del contenido. Aprendemos qué son, sus orígenes, cómo se construyen, para qué sirven, sus ventajas, tipologías de grids, tipos de diseños (adaptativo y responsive), y los sistemas de retículas.

Aprendemos también qué son las guías de estilo para definir las normas de diseño que tendrá nuestro producto digital y sirva de hoja de ruta para terceros a la hora de externalizarlo. Descubrimos conceptos como Material Design vs Human Interface Guidelines (Android vs iOs): principales diferencias en barras de estado, barras de navegación, tipografías…

Ponemos las manos también sobre los llamados patrones de diseño, definiendo qué son, sus ventajas y desventajas, beneficios a nivel de navegación, estructura y contenido, reforzando con ejemplos de colecciones para User Interface y ayudándonos con recursos de inspiración.

No nos olvidamos de la metodología Atomic Design, y descubrimos sus ventajas, desventajas, y las diferencias latentes frente a los Sistemas de Diseño.

Todo diseño tiene su lado oscuro, y es donde aparecen los Dark Patterns, los patrones oscuros que se utilizan de forma intencionada para engañar al usuario y que lleve a cabo acciones contra su voluntad. ¡No tengas miedo, sabremos cómo afrontarlos y vencerlos!

Tras ello, es necesario empezar a comprender qué es un prototipo, sus objetivos, en qué punto del proceso de diseño se encuentra, y las diferencias entre sketching y wireframes. Establecemos a su vez las bases de un prototipo funcional (wireframe+workflow) con ejemplos de proyectos reales y una visión general de las herramientas más punteras del mercado.

Tengamos en cuenta que todas estas herramientas se aplican de forma directa en el proyecto que desarrollamos a lo largo del curso, por lo que las clases teorico-prácticas se refuerzan a su vez con el desarrollo de este trabajo.

Si buscas tener una vista general del curso, accede a la bitácora en la que podrás ver los diferentes módulos de los que se compone nuestro UX / UI Design Bootcamp.

¿Quieres saber más acerca del planteamiento, los mentores o bien, que hablemos del curso? Solicita una llamada en la página:

--

--