Introducción a UX

Módulo 1
Elementos de UX
HTML5: Fundamentos Web
Introducción a UX

Elementos de UX
Existen diversos elementos sobre los que se En la siguiente diapositiva se muestra el modelo
toman decisiones. Lo que se decide en cada uno de 5 capas propuesto por Jesse James Garrett,
condiciona la experiencia final en: en las que podemos diferenciar los elementos de
la experiencia de usuario.
● Plano de estratégia.

● Plano de alcance.

● Plano de estructura.

● Plano de esqueleto.

● Plano de superficie.
Introducción a UX

Los elementos de la Experiencia del Usuario

Web como interfaz de software Concreto Culminación Web como sistema de hipertexto

Diseño Visual: tratamiento gráfico de los elementos de la Diseño Visual: tratamiento visual de los elementos de textos y
Diseño visual
interfaz (el ¨look¨del ¨look & feel¨). gráficos en la página y componentes de navegación.

Diseño de Interfaz: como en Estudio de Interacción Diseño de Navegación: diseño de elementos de interfaz para
humano-Computador tradicional: diseño de los elementos de la Diseño de la Diseño de la facilitar el movimiento de los usuarios a través de la
interfaz para facilitar la interacción del usuario con la funcionalidad. interfaz navegación arquitectura de la información.
Diseño de la Información: en el sentido de Tufte, diseño de la Diseño de la Información: en el sentido de Tufte, diseño de la
Diseño de la información
presentación de la información para facilitar el entendimiento. presentación de la información para facilitar el entendimiento.

Diseño de la Interacción: desarrollo del flujo de las aplicaciones Arquitectura de la Información: el diseño estructural del

Tiempo
para facilitar las tareas del usuario, definiendo cómo el usuario Diseño de la Arquitectura de la espacio de información para facilitar el acceso intuitivo al
interactúa con la funcionalidad del sitio. interacción información contenido.

Especificaciones Funcionales: ¨set de herramientas¨: descripciones Requerimientos de contenido: Definición de los elementos
detalladas de las funcionalidades que el sitio debe incluir para Especificaciones Requerimientos de contenido requeridos para satisfacer las necesidades
satisfacer las necesidades del usuario. funcionales de Contenido del usuario.

Necesidades del Usuario: objetivos para el sitio externamente Necesidades del Usuario: objetivos para el sitio externamente
derivados, identificadas a través de la investigación de los usuarios, derivados, identificadas a través de la investigación de los
Necesidades del Usuario
etno/tecno/psicográficos, etc. usuarios, etno/tecno/psicográficos, etc.
Objetivos del Sitio: de negocios, creativos u otros generados de Objetivos del Sitio: de negocios, creativos u otros generados
manera interna para el sitio. Objetivos del Sitio de manera interna para el sitio.

orientada a tareas Abstracto Concepción orientada a información

Introducción a UX

Una dualidad básica:

La web fue concebida como un espacio de

información hipertextual, pero el desarrollo de
tecnologías cada vez más sofisticadas han
nutrido su uso como interfaz remota de
software.

Esta naturaleza dual ha guiado a confusiones,

ya que los practicantes del desarrollo de UX han
intentado adaptar su terminología a casos más
allá del alcance de su aplicación original.
Introducción a UX

La imagen no está completa: producto como producto como

funcionalidad información
El modelo delineado no incluye consideraciones Concreto

secundarias (como las que surgen durante el

Superficie: Diseño visual
desarrollo técnico y de contenido) que pueden
influir en las decisiones durante el desarrollo de la
Diseño de la Diseño de la

UX. Además, este modelo no describe un modelo Esqueleto:

interfaz navegación

del proceso de desarrollo, ni define los roles

Diseño de la información

dentro del equipo de desarrollo de UX. Lo que

Tiempo
Diseño de la Arquitectura de la
Estructura:
busca definir son las consideraciones clave que interacción información

forman el desarrollo de la UX en la Web

actualmente. Alcance: Especificaciones Requerimientos
funcionales de Contenido

Necesidades del Usuario

Estrategia:
Objetivos del Sitio

Abstracto
Introducción a UX

De lo abstracto a lo concreto

● Estrategia: ¿Por qué estamos creando este ● Estructura: “Dadas las especificaciones
producto? ¿Qué problemas resuelve? ¿Qué funcionales, la estructura del software
necesidades satisface? ¿Alguien lo desea?, determinará cómo el usuario interactúa con
¿Quiénes? ¿Por qué? ¿Qué valor les aporta? ella”. Dados los requerimientos de contenido,
Etc. definirá la navegación a partir de la
Arquitectura de la Información (cómo se
● Alcance: Define las especificaciones funciona-
organizan los contenidos para facilitar el
les (por ejemplo, poder reproducir vídeo) y los
entendimiento del usuario).
requerimientos de contenido (descripción de
los elementos que se requieren para el ● Esqueleto: Tratará el Diseño de la Información,
desarro- el Diseño de la Interfaz y también el Diseño de
llo del producto, por ejemplo, qué videos serán la Navegación.
reproducidos).
● Superficie: Es la capa más concreta del
desarrollo del producto (diseño visual).
¡Sigamos
trabajando!