Diseño UX / UI
2
Indice
Kassandra Belén Ortiz Uzaga. Estudiante de Diseño Gráfico.
@: belortiz1899@gmail.com
Introducción 3 UX,UI, IxD 4 UX: Experiencia de usuario 5 UI: Interfaz del usuario 6 IxD: Diseño de interacción 7 Arquitectura de información 9 Etapas de UX y UI 10 Proceso 11 Técnicas 12 Herramientas 13 Prototipos 14 Conclusión 15
Diseño UX/UI
3
Diseño UX/UI
Introducción Diariamente usamos multitud de dispositivos, aplicaciones y sitios web; una interacción a través de la interfaz de usuario, que es el espacio y punto de encuentro entre usuario y producto. El UX y el UI son estudios que se realizan al principio del proyecto y buscan tener un conocimiento del público objetivo al que va a dirigirse. De este modo, todo el contenido (textos, imágenes y sonidos) y el diseño de la interfaz irán dirigidos específicamente para satisfacer las particularidades de dicha comunidad objetivo de la manera más fácil posible.
4
UX,UI, IxD
Diseño UX/UI
5
Diseño UX/UI
UX: Experiencia de usuario Se refiere al grado de satisfacción que tiene un usuario al usar un sitio o aplicación la cual viene de la mano con una mejora constante de usabilidad y accesibilidad, para que al usuario le agrade estar en el sitio, al momento de hablar de UX, nos referimos a qué, cuándo, dónde y cómo una persona accede a nuestra plataforma, y no le tiene que costar al usuario mucho tiempo.
Resulta fundamental en el diseño de la experiencia, comprender en primer lugar a los usuarios y sus verdaderas motivaciones y necesidades, considerar desde ese lugar qué interfaz, qué contenidos y qué interacciones lograrán el resultado buscado, y finalmente, validar con usuarios los resultados que produce la interfaz propuesta.
6
UI: Interfaz del usuario El diseño de interfaces o la interfaz del usuario es uno de los elementos que componen la UX y su aporte principal es que ayuda a navegar por la página fácilmente. Incluye todos los elementos que te permiten interactuar con un dispositivo como los elementos visuales, botones e iconos. Lo podemos definir como la interfaz de usuario la cual permite tener el control de un sitio o aplicación. Hace foco en el artefacto, o, dicho de otra manera, en lo que está dentro de la pantalla.
Diseño UX/UI
7
IxD: Diseño de interacción Se trata de definir las formas de operar la interfaz (por ejemplo, si el ingreso de información o selección se produce mediante teclado, mouse, touch, o una combinación de ellos), los flujos de operación y las respuestas del sistema. En definitiva, pone el foco en el contacto entre el usuario y el artefacto. El diseño de interacción hace referencia al diseño de productos, entornos, sistemas y servicios centrados en el usuario, con un justo balance entre las expectativas del usuario, los objetivos comerciales del desarrollo y el avance tecnológico.
Diseño UX/UI
8
INTERFAZ
INTERACCIÓN
(UI Interfaz del usuario) (IxD: Diseño de interacción)
Diseño UX/UI
EXPERIENCIA (UX: Experiencia de usuario)
La experiencia de usuario junto con la interfaz de usuario y el diseño de interacciones forman un equipo ideal, para crear buenos y funcionales productos digitales de todo tipo; desde Apps hasta páginas web.
9
Arquitectura de información La Arquitectura de información es otro factor de importancia en la UX. Esta se centra en la organización y estructura del contenido de forma que el usuario pueda navegar por él. Digitalmente hablando, las variaciones son muchas, podemos tener desde un simple y sencillo sitio hasta un sistema de información complejo.
Diseño UX/UI
10 Diseño UX/UI
U
A EB
1-R E
Q U TO IEN IM ER
E M
N
EÑ O
S
E PL 3-IM
La experiencia de usuario y la interfaz del usuario son necesarias para la realización de un producto software (aplicaciones móviles, eBooks, páginas web, etc). Los elementos: prueba, requerimientos, implementación y diseño, hacen énfasis en las labores de Arquitectura de información y Diseño de la interacción. Es importante señalar que la creación de software es un proceso en forma de espiral.
4-P R
Etapas de UX y UI
TA C
IÓN
IS D 2-
11 Diseño UX/UI
Proceso Las etapas se dividen en cuatro momentos por los que transcurre la labor del diseñador de software. Estas etapas pueden ser vistas tanto de forma lineal como iterativa. El resultado de estas etapas se materializa en forma de entregables o artefactos.
Investigación:
Organización:
Diseño:
Prueba:
12 Diseño UX/UI
Técnicas Las técnicas no están obligatoriamente relacionadas con las etapas, por lo que pueden usarse en cualquier momento del proyecto. Todo depende de lo que se quiera obtener con la técnica Técnicas básicas de un proceso de diseño: -Reunión. -Entrevista y Encuesta. -Observación. Técnicas usadas para la búsqueda de información: -Tormenta de ideas (brainstorming). -Focus group. -Crítica de diseños anteriores.
Técnicas muy usadas para la organización: -Organización de tarjetas (card sorting). -Agrupación. -Secuencia (Análisis de secuencia). Técnicas para el funcionamiento del producto: -Análisis de tareas (Task Analysis). -Flujogramas. -Paseo cognitivo. Técnicas para diseñar el producto: -Diagramación en papel. -Diagrama de organización (Blueprint). -Prototipado digital. Técnicas para hacer los test del diseño planteado: -Crítica de diseño con usuarios y clientes -Pruebas con usuarios -Evaluación heurística
13 Diseño UX/UI
Herramientas Las herramientas para el trabajo del diseñador de experiencia de usuario varían según las posibilidades del proyecto. En el mercado existen tanto herramientas profesionales de un alto costo monetario como herramientas gratuitas.
Como ejemplos tenemos:
Manejo de encuestas en línea:
-Survey Manager de Netquest -E-encuestas Mapeo de contenidos y conceptos:
-MindManager -CMapTools Representación de contenidos:
-Axure RP Pro -SmartDraw
14 Diseño UX/UI
Prototipos Es muy frecuente crear prototipos en HTML usando algún editor como Adobe Dreamweaver, o usando Microsoft PowerPoint para lograr un prototipo semifuncional creado en forma de presentación. En la actualidad se pueden usar algunos sistemas de gestión de contenidos (CMS) para crear prototipos muy similares en funcionamiento al producto final.Aunque existen numerosas aplicaciones que sirven de herramientas para el trabajo del diseñador de experiencia de usuario, el papel y el lápiz han sido y siguen siendo las más usadas
15 Diseño UX/UI
Conclusión La experiencia y la interfaz de usuario son valiosas herramientas a la hora de crear un producto digital, y que este sea útil y fácil de usar. Tanto la UX y la UI se complementan entre si, junto con el diseño de interacción y la arquitectura de información. Aquí te mostramos lo básico que debes saber sobre este tema, solo hace falta ponerlo en práctica.
¿Te gustó el contenido? ¡Suscribete para recibir más eBooks como este gratis! Nombre: E-mail: ¡Me apunto!