introducción a los wireframes

WIREFRAMES clase 01

DIPLOMADO ARQUITECTURA DE INFORMACIÓN Y EXPERIENCIA DE USUARIO 2014

INTRODUCCIÓN

PRESENTACIÓNHola, soy Yerko Pezzopane, y bienvenidos al taller de Wireframes.

RODRIGO VERA YERKO PEZZOPANEDiseñador Gráfico

Diseñador UX Diseñador UX

@rots @ypezzopane

RODRIGO VERA YERKO PEZZOPANEDiseñador Gráfico

Diseñador UX Diseñador UX

@rots @ypezzopane

¿Diseñadores? ¿Periodistas? ¿Ingenieros?

¿Bibliotecarios?

LO QUE VEREMOS HOYUser Experience HCI y principios del diseño universal Sicología de las formas

¿ux?

USER EXPERIENCE

USER EXPERIENCE

Es un conjunto de factores, cuyo resultado es la creación de un producto o servicio.

!No depende sólo de factores de diseño, sino también de las emociones y sentimientos que

genera una marca en los usuarios.

USER EXPERIENCE

Para hacer UX hay que entender el producto, la situación, el contexto y los hábitos de uso de un

determinado grupo de personas.

USER EXPERIENCE

https://www.youtube.com/watch?v=m9R9z7P1eME

USER EXPERIENCE

USER EXPERIENCE

USER EXPERIENCE

USER EXPERIENCE

USER EXPERIENCE

USER EXPERIENCE

USER EXPERIENCE

USER EXPERIENCE

USER EXPERIENCE

USER EXPERIENCE

UsabilidadFactores humanos

Utilidad

HCI

Ergonomía

Rendimiento del sistema

Diseño

Accesibilidad

Marketing

INTERACCIÓN HUMANO COMPUTADOR

INTERACCIÓN HUMANO COMPUTADOR

Es la disciplina que estudia el intercambio de información mediante software entre las personas

y las computadoras.

Se encarga del diseño, evaluación e implementación de los aparatos tecnológicos interactivos con el objetivo de que el intercambio sea más eficiente: minimizar errores, incrementar la satisfacción, disminuir la

frustración y, en definitiva, hacer más productivas las tareas que rodean a las personas y los computadores.

INTERACCIÓN HUMANO COMPUTADOR

Lo primero y principal es la persona, el usuarioque utiliza el sistema.

INTERACCIÓN HUMANO COMPUTADOR

El buen diseño ayuda a la gente a hacercosas que nos importan.

INTERACCIÓN HUMANO COMPUTADOR

El buen diseño ayuda a la gente a hacercosas que nos importan.

INTERACCIÓN HUMANO COMPUTADOR

El buen diseño ayuda a la gente a hacercosas que nos importan.

INTERACCIÓN HUMANO COMPUTADOR

El buen diseño ayuda a la gente a hacercosas que nos importan.

INTERACCIÓN HUMANO COMPUTADOR

El mal diseño es frustrante.

INTERACCIÓN HUMANO COMPUTADOR

El mal diseño es frustrante e incluso cuesta vidas.

INTERACCIÓN HUMANO COMPUTADOR

El mal diseño es frustrante e incluso cuesta vidas.

INTERACCIÓN HUMANO COMPUTADOR

…e incluso cuesta vidas.

INTERACCIÓN HUMANO COMPUTADOR

A veces, las mejores interfaces se convierten en invisibles para nosotros, cuando pasamos de manipular la interfaz, a realizar tareas.

INTERACCIÓN HUMANO COMPUTADOR

INTERACCIÓN HUMANO COMPUTADOR

7 PRINCIPIOS DEL DISEÑO UNIVERSAL

7 PRINCIPIOS DEL DISEÑO UNIVERSAL

1. Igualdad de usoEl diseño debe ser fácil de usar y adecuado para todas las personas

independientemente de sus capacidades y habilidades.

7 PRINCIPIOS DEL DISEÑO UNIVERSAL

1. Igualdad de usoEl diseño debe ser fácil de usar y adecuado para todas las personas

independientemente de sus capacidades y habilidades.

7 PRINCIPIOS DEL DISEÑO UNIVERSAL

2. FlexibilidadEl diseño debe poder adecuarse a un amplio rango de preferencias

y habilidades individuales.

7 PRINCIPIOS DEL DISEÑO UNIVERSAL

2. FlexibilidadEl diseño debe poder adecuarse a un amplio rango de preferencias

y habilidades individuales.

7 PRINCIPIOS DEL DISEÑO UNIVERSAL

3. Simple e intuitivoEl diseño debe ser fácil de entender independientemente de la experiencia, los

conocimientos, las habilidades o el nivel del usuario.

7 PRINCIPIOS DEL DISEÑO UNIVERSAL

3. Simple e intuitivoEl diseño debe ser fácil de entender independientemente de la experiencia, los

conocimientos, las habilidades o el nivel del usuario.

7 PRINCIPIOS DEL DISEÑO UNIVERSAL

4. Información fácil de percibirEl diseño comunica de manera eficaz la información necesaria para el usuario.

7 PRINCIPIOS DEL DISEÑO UNIVERSAL

4. Información fácil de percibirEl diseño comunica de manera eficaz la información necesaria para el usuario.

7 PRINCIPIOS DEL DISEÑO UNIVERSAL

5. Tolerante a erroresEl diseño debe minimizar las acciones accidentales o fortuitas que

puedan tener consecuencias fatales o no deseadas.

7 PRINCIPIOS DEL DISEÑO UNIVERSAL

5. Tolerante a erroresEl diseño debe minimizar las acciones accidentales o fortuitas que

puedan tener consecuencias fatales o no deseadas.

7 PRINCIPIOS DEL DISEÑO UNIVERSAL

6. Escaso esfuerzoEl diseño debe poder ser usado eficazmente y con el mínimo esfuerzo posible.

7 PRINCIPIOS DEL DISEÑO UNIVERSAL

6. Escaso esfuerzoEl diseño debe poder ser usado eficazmente y con el mínimo esfuerzo posible.

7 PRINCIPIOS DEL DISEÑO UNIVERSAL

7. Dimensiones apropiadasLos tamaños y espacios deben ser apropiados para el alcance, manipulación y uso

por parte del usuario, independientemente de su tamaño, posición, y movilidad.

7 PRINCIPIOS DEL DISEÑO UNIVERSAL

7. Dimensiones apropiadasLos tamaños y espacios deben ser apropiados para el alcance, manipulación y uso

por parte del usuario, independientemente de su tamaño, posición, y movilidad.

SICOLOGÍA DE LAS FORMAS

GESTALT

QUÉ ES GESTALT

Gestalt es un término introducido por primera vez por Christian von Ehrenfels que a su vez es un

vocablo alemán que no tiene una traducción única, aunque se lo entiende generalmente como "forma",

"totalidad", "configuración“, “unión”.

es una corriente de la psicología moderna, surgida en Alemania a principios del siglo XX y cuyos exponentes más

reconocidos han sido los teóricos Max Wertheimer, Wolfgang Köhler, Kurt Koffka y Kurt Lewin.

QUÉ ES GESTALTMEDIOS DIGITALES: ENTENDER A LAS PERSONAS, CONSTRUIR PARA ELLLAS DMU 2011Rodrigo García R.

ENTENDER A LAS PERSONAS

Fuentes:http://www.webdesignerdepot.com/2011/08/strengthening-behavioral-cues-in-ux-web-design-with-gestalt-principles/

Estímulos Respuestas

Gestalt (Forma)El campo de la psicología de la Gestalt explica

cómo la mente percibe y organiza los estímulos visuales.

Thursday, November 10, 11

El campo de la sicología de la Gestalt explica cómo la mente humana percibe y organiza los estímulos visuales

ILUSIONES ÓPTICAS

¿Pueden contar la cantidad de puntos blancos?

ILUSIONES ÓPTICAS

¿Estructura con tres extremidades?

ILUSIONES ÓPTICAS

¿copas?

MEDIOS DIGITALES: ENTENDER A LAS PERSONAS, CONSTRUIR PARA ELLLAS DMU 2011Rodrigo García R.

ENTENDER A LAS PERSONAS

Fuentes: http://www.sapdesignguild.org/resources/optical_illusions/index.html

Thursday, November 10, 11

¿Se mueve?

ILUSIONES ÓPTICAS

La mente configura, a través de ciertas leyes, los elementos que llegan a ella a través de los canales

sensoriales (percepción) o de la memoria (pensamiento, inteligencia y resolución de problemas).

ESTO NOS LLEVA A QUE...

ESTO NOS LLEVA A QUE...

!La percepción humana pasa por un proceso de

reestructuración que configura a partir de esa información una forma, un gestalt, que se

destruye cuando se intenta analizar.

EN RESUMEN

El campo de la sicología de la Gestalt explica cómo la mente humana percibe y organiza los estímulos visuales

✓Relación entre las partes y el todo en la percepción visual: “El todo es algo mas que la suma de sus partes”

✓Los estímulos visuales son complejos por lo que nuestra mente tiende a simplificar y buscar el orden.

✓Podríamos referirnos a la Experiencia de Usuario es saber cómo percibimos el mundo y sus estímulos

LEYES DE GESTALT

Proximidad

LEYES GESTALT

1Similitud2Cierre3

1. PROXIMIDAD

Objetos cercanos entre si tienden a ser percibidos como un grupo

1. PROXIMIDAD

Objetos cercanos entre si tienden a ser percibidos como un grupo

MEDIOS DIGITALES: ENTENDER A LAS PERSONAS, CONSTRUIR PARA ELLLAS DMU 2011Rodrigo García R.

ENTENDER A LAS PERSONAS

Fuentes:http://www.webdesignerdepot.com/2011/08/strengthening-behavioral-cues-in-ux-web-design-with-gestalt-principles/

Proximidad

Gestalt: 3 Principios

Objetos cercanos entre sí tienden a ser percibidos como un grupo.

1

Thursday, November 10, 11

1. PROXIMIDAD

Objetos cercanos entre si tienden a ser percibidos como un grupo

1. PROXIMIDAD

Objetos cercanos entre si tienden a ser percibidos como un grupo

2. SIMILITUD

Objetos similares entre si tienden a ser percibidos como un grupo

2. SIMILITUD

Objetos similares entre si tienden a ser percibidos como un grupo

2. SIMILITUD

Objetos similares entre si tienden a ser percibidos como un grupo

2. SIMILITUD

Objetos similares entre si tienden a ser percibidos como un grupo

2. SIMILITUD

MEDIOS DIGITALES: ENTENDER A LAS PERSONAS, CONSTRUIR PARA ELLLAS DMU 2011Rodrigo García R.

ENTENDER A LAS PERSONAS

Gestalt: 3 Principios

SimilaridadObjetos similares entre sí entre sí tienden a ser percibidos como un grupo.

2

Thursday, November 10, 11

Objetos similares entre si tienden a ser percibidos como un grupo

3. CIERRE

Bastan algunas partes del objeto para percibir el objeto competo

3. CIERRE

Bastan algunas partes del objeto para percibir el objeto competo

3. CIERRE

Bastan algunas partes del objeto para percibir el objeto competo

SOBRE GESTALTCada vez que enfrentamos el diseño de una interfaz digital estamos poniendo a prueba estas leyes. Por eso es importante que desiciones tomamos a la hora de desarrollar una interfaz Debemos ponernos en el lugar de los usuarios.

FIN CLASE 01