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

UX / UI Design Bootcamp

Image for post
Image for post

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.

Image for post
Image for post

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!

Image for post
Image for post

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:

UXER SCHOOL

Escuela de profesionales en Diseño y Experiencia de…

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch

Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore

Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store