Julio César González García Estudiante de la carrera de Diseño Gráfico Universidad del Valle
2
INDICE Botones de atajo
1- Experiencia de Usuario
4
2- Especificaciones funcionales
5
3- UX design
7
4- UI design
12
3
EXPERIENCIA DE USUARIO La experiencia de usuario es el proceso que lleva a cabo el usuario cuando interactúa con un producto. Este concepto tiene su origen en el campo del Marketing online, estando muy vinculado con el concepto de Experiencia de Marca (pretensión de establecer una relación familiar y consistente entre consumidor y marca). A veces confundimos el concepto de experiencia de usuario con el de usabilidad. Veamos en qué se diferencian para entender mejor qué es la experiencia de usuario: Usabilidad: Es la facilidad con que las personas pueden utilizar una herramienta particular o cualquier otro objeto fabricado por humanos con el fin de alcanzar un objetivo concreto. Experiencia de usuario: Conjunto de factores y elementos relativos a la interacción del usuario, con un entorno o dispositivo concretos, cuyo resultado es la generación de una percepción positiva o negativa de dicho servicio, producto o dispositivo.
4
ESPECIFICACIONES FUNCIONALES
Las especificaciones funcionales son un paso que se debe realizar para facilitar las experiencias del usuario. Garret señala que es la descripción detallada de las funcionalidades que el sitio debe incluir para satisfacer las necesidades del usuario. Requiere además de una descripción del contenido que se requerirá en el sitio, es decir, que tipo de información se manejará, para quién estará disponible. Uno de los problemas del funcionamiento de las páginas web, para Steve Krug, es que la gente no averigua el funcionamiento de las cosas, sino que se las arreglan por sí mismos, lo que se aleja de la intención original del diseñador web. Eso sucede porque para la “gran mayoría carece de importancia el llegar a entender el funcionamiento de las cosas en tanto podamos usarlas. Y no hace falta la inteligencia, sino la escasez de cuidado y atención”.
5
UX Y UI DESIGN
Diseño Interactivo
UX
Diseño Visual
Esquema de Página Web
Estructura de Colores
Arquitectura de la Información
Diseñador Gráfico
Investigaciones de Usuarios
Diseños Escenarios
UI
Tipografía
OJO: Selecciona cualquier punto de tu interéz 6
¿QUÉ ES UX? Hace foco en el usuario y en la experiencia que se quiere lograr. UX se refiere a lo que experimenta el usuario antes, durante y después de interactuar con el artefacto. Sin incorporar al usuario, no se puede hacer UX. Por eso, 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. La validación se puede hacer de forma directa (pruebas con usuarios, entrevistas cualitativas, relevamiento de modelos mentales), o de forma indirecta (heat maps, A/B testing, click maps). La diferencia entre validación directa e indirecta, no es solamente metodológica.
Necesidades del Usuario
del Negocio
Limitaciones Técnicas
“La persona que realiza UX, es conocida como un UX Designer y como parte de sus responsabilidades está el de investigar qué es lo que las personas necesitan para cumplir sus objetivos y resolver sus dolores”. Home
7
Diseño Interactivo Es el proceso de generar y evaluar productos, sistemas o dispositivos que cumplan con el objetivo para el que fueron diseñados, y que apoyen las actividades que la gente realiza en su trabajo y en su vida diaria. También es la técnica por la cual se producen interfaces adecuadas entre el ser humano y los sistemas automatizados, con el fin de: Mejorar su eficiencia Disminuir la curva de aprendizaje Eliminar barreras en la frontera humano-máquina El diseño de interacción tiene como objetivo presentar a los usuarios de los artefactos experiencias útiles, satisfactorias y usables, es necesario conocer las acciones a través de las cuales cumple su cometido y los elementos implicados durante su desarrollo. El diseño de interacción cumple estas actividades: Identificación de las necesidades y establecimiento de requisitos. Desarrollo de bocetos. Construcción de prototipos. Evaluación de los resultados.
8
Mediante la realización de estas actividades el diseño de interacción investiga, propone y evalúa el desempeño de los artefactos en relación a sus usuarios. Por otro lado, quien lleva a cabo el diseño de interacción es un profesional que trabaja para definir cómo tiene que funcionar el producto para que sea útil y usable. Para conseguirlo, debe diseñar el producto desde el punto de vista del usuario, no desde el punto de vista técnico ni artístico. El diseñador de interacción debe interiorizar y entender los objetivos, tareas, necesidades y deseos que los usuarios tienen cuando están usando el producto.
Home
Esquema de P. Web Una manera simple de evaluar el diseño visual de un producto es preguntar: ¿Adónde se dirige la mirada primero? ¿Qué elementos llaman la atención del usuario inicialmente? ¿Son ellos diseñados para los productos importantes en los objetivos estratégicos? O este el primer objeto de su atenta distracción para sus metas. Dentro de las etapas en las que debe desarrollarse el diseño de un sitio web, el diseño visual es una de las últimas, ya que muchos de los aspectos visuales de la página dependen en gran medida de determinaciones tomadas en otras etapas del diseño. Esto no quiere decir que el diseño visual sea algo superficial o secundario. Por el contrario, al igual que otros aspectos del diseño de un sitio web, el aspecto visual puede influir en la popularidad del mismo. La estructura de navegación por un sitio web viene definida por la experiencia de navegación del visitante en virtud de la cual puede saltar de una página a otra dentro del sitio web utilizando el sistema de hipervínculos. La estructura de navegación se suele elegir en función del tipo de contenido. Existen distintos tipos de estructuras: Jerárquica y Lineal.
Lineal Es una estructura muy simple similar a las páginas de un libro. Desde una página concreta se puede ir a la página siguiente o la página anterior. Lineal con jerarquía Es una estructura híbrida que trata de aprovechar las ventajas de las dos estructuras anteriores. Red A partir de la página índice o principal se puede navegar a otra u otras sin ningún orden aparente. Es una estructura más libre pero no es aconsejable cuando el número de páginas es elevado porque desorienta al usuario al no saber dónde está ni disponer de recursos para ir donde desea. Home
9
Arq. de la Información Con el surgimiento de Internet en los años 60, la masificación de las redes internas universitarias (intranets), la creación del hipertexto y del HTTP como protocolo de comunicación útil para enlazar los diferentes medios; además del desarrollo del lenguaje HTML y sus descendientes, posibilitaron, a partir de los años 90, la aparición de una gran cantidad de recursos útiles de información en la red: Revistas electrónicas, portales, buscadores, etc. Pero junto a estos recursos, se han divulgado productos inconsistentes, sin una organización coherente de la información y que generan un proceso de recuperación sumamente dificultoso. Esta cantidad de datos e información requieren de una estructura y un desarrollo de métodos, disciplinas y a la vez de profesionales que permitan focalizar la necesidad de información de los usuarios, puesto que Internet ofrece diversas aplicaciones y alternativas de desarrollo para quien lo usa y ha contribuido a la formación de nuevas actividades, como la especializada en la Arquitectura de la Información (AI). Podemos definir al arquitecto de la información como el encargado de diseñar y crear el edificio, sus componentes, sus pasillos, sus espacios abiertos y sus zonas de servicios.
10
Sólo que ahora el edificio es digital, sus componentes son los contenidos informativos, y el espacio interno del mismo se crea con la organización de los contenidos y con los sistemas de navegación, acceso y etiquetado de la información. Richard Saul Wurman fue el primero en usar el término en su libro Arquitectos de la Información. En 1976, Wurman eligió este concepto como tema, debido a que como arquitectode profesión, le correspondió en ese año ser el máximo directivo de la conferencia anual del American Institute of Architects (AIA), realizada en la ciudad de Filadelfia, Estados Unidos. Home
Invest. de Usuario La investigación de UX (Experiencia de Usuario) es una importante inversión a lo largo de cualquier proceso de diseño. Comprende recabar y analizar datos de una manera para mejorar la usabilidad, utilizando un conjunto de técnicas de investigación (entrevistas, pruebas de usabilidad, y categorización de contenidos). El objetivo de la investigacion UX es ayudar en el proceso de comprender a nuestros usuarios. Al interactuar con nuestros usuarios finales, tenemos un mejor sentido del impacto de nuestro diseño en potenciales usuarios, dejando a un lado nuestras propias perspectivas, suposiciones y expectativas.
Escenarios Representar la realidad del usuario al más alto nivel. Crear un entorno para conocer y saber si nuestra propuesta de valor cubre las necesidades del prospecto. Intentar “casar” las necesidades del usuario con la misión de nuestro producto o empresa. Eso es sencillamente la creación de Escenarios. Escenario en UX, se suelen identificar a aspectos importantes que afectan a la utilización de un producto en el mundo real y que no se pueden identificar ni tenerse en cuenta de otro modo. Son útiles a lo largo del proceso de diseño, especialmente al desarrollar descripciones de tareas para las pruebas de usabilidad. Home
11
¿QUÉ ES UI? UI (por sus siglas en inglés User Interface) o en español Interfaz del Usuario, es la vista que permite a un usuario interactuar de manera efectiva con un sistema. Es la suma de una arquitectura de información mas elementos visuales mas patrones de interacción. El diseño UI podría definirse como una nueva tendencia en el diseño web que se enfoca en crear una interfaces entre las personas y los diferentes dispositivos digitales. Estos diseños deben de incluir en la interacción los elementos físicos o de hardware y elementos lógicos o de software, ya que se debe contemplar todo aquello con lo que el usuario tendrá interacción. Generalmente el diseño UI se relaciona mucho más con las áreas de la informática y el diseño web, ya que se refiere al contacto e interacción que el usuario crea a través de un celular o una computadora.
12
UX UI
Una buena UI nos permite dar una buena UX, pero no lo es todo, es un instrumento.
“Un UI Designer se encarga de crear visualmente la interfaz del producto para que vaya acorde a la experiencia del usuario. Además, crea elementos interactivos y se preocupa de que se vean bien en todas las plataformas (móvil, tableta, web).
Home
Diseño Visual
Estructura de Colores
Generalmente el diseño UI se relaciona mucho más con las áreas de la informática y el diseño web, ya que se refiere al contacto e interacción que el usuario crea a través de un celular o una computadora.
Es muy importante que elementos como el tono, el color o la luz se combinen de manera eficaz. A continuación te explicamos algunos trucos para elegir bien el esquema del color en el diseño UI.
La principal característica para que un diseño UI funcione correctamente, no es centrarse solamente en hacer una app o página llamativa por ejemplo, sino en crear un diseño que realmente sea utilizable y amigable. En ocasiones esto puede llevar a crear un diseño de app no agradable a la vista pero todo un éxito si se trabaja correctamente a nivel UI.
La adecuada elección del color no depende únicamente de la destreza técnica que emplee el diseñador para conseguir un acabado atractivo. Además de la claridad o la legibilidad, son muchos los factores que deben tenerse en cuenta antes de tomar una decisión. El diseño de interfaces se basa en la percepción y la experiencia del usuario. Home
Diseño Este sería el perfil más cercano a la imagen común que tenemos de un diseñador; aquel que se preocupa por los dibujos, las líneas, las tipografías, los iconos y colores y no tanto por cómo se conecta una página con otra, la ruta que sigue el usuario o la interacción de éste. Los diseñadores gráficos miran los pequeños detalles y con frecuencia trabajan en Photoshop con el zoom 4X o 8X puesto. Ellos producen diseños de alta calidad; desde el concepto a su ejecución, incluyendo las distintas resoluciones que se necesitan para el formato en el que se vaya a exportar el producto: web, móvil, papel…
Diseñador Gráfico
Tipografía
Así como los diseñadores UX están preocupados por cómo el usuario percibe el producto en su totalidad, en aspectos generales, el diseñador UI se preocupa sobre la forma y la distribución. Ellos se encargan de elaborar el diseño de cada página o de cada pantalla en la que el usuario interactúa. El diseñador UI ha de encargarse de que el diseño responda a las necesidades comunicativas que el UX le transmita. El diseñador UI es también el responsable de generar un estilo que se caracterice en todo el proyecto; una “imagen” que transmitir en la que haya coherencia entre todos los elementos visuales y diseño de todas las fases del producto.
Leer el texto nunca debe ser una lucha. Debe ser fácil y natural. La tipografía va mucho más allá de: qué fuente debo usar en ese proyecto? Todos sus proyectos, muy probablemente, tendrán textos. No sirve de nada pensar que esto es un problema y tener miedo de trabajar. Haga que su aliado para construir interfaces increíbles. Enfurezca la tipografía como parte de la UI. Explore las posibilidades. Deja que tus ojos sean el juez.
14
Home
COMPARTENOS
(Marca en esta casilla tus respuestas
)
¿Has quedado claro sobre UX design? Si Algo Mas o Menos No ¿Has quedado claro sobre UI design? Si Algo Mas o Menos
Nombre:
No
E- mail:
¿Te gusto este documento? Sexo: M
Si Algo Mas o Menos
F
Sugierenos
No ¿Entendistes los conceptos? Si Algo Mas o Menos
Enviar
No ¿Te Apuntas para recibir mas documentos como este?
¡Me Apunto! Haz click aquí para obtener otro con un descuento
15