Este documento discute el diseño de interfaces de usuario (UI) y la experiencia del usuario (UX). Resalta la importancia de centrarse en el usuario y hacer que la navegación sea fácil y lógica. También cubre temas como transiciones, inspiración en el diseño, y concluye que la interacción en la interfaz es fundamental para una buena experiencia del usuario.

1. 10.07.2014
USER EXPERIENCE / UI

2. UXUSER
EXPERIENCE
UI / User Interface

3. UI
Diseño Visual
Interface
aTipografíaFormasColoresImágenes
Diagramación Transiciones Responsivo Interacción

4. “It’s not just it looks
like and feels like.
Design is how it works”
STEVE JOBS

5. USUARIO DE MI APP
Concentrarse en el
usuario, hacerles más
fácil y lógica la
navegación.

6. 5 Preguntas que uno
debe hacerse al
usar una app
¿ Esta interface me muestra lo que tengo que saber en este preciso instante ?
¿ Es fácil encontrar la información que estoy buscando, o tengo que empezar a probar
nuevos caminos ?
¿ Puedo usar esta interface sin haber visto un tutorial o instrucciones ?
¿Son obvias las cosas que puedo hacer en esta pantalla ?
¿ Hay pasos tediosos o repetitivos que puedo acortar o eliminar ?

7. BUENA INTERFAZ
BUENA USABILIDAD

8. Hoy las INTERFACES son DINAMICASTRANSICIONES

9. TRANSICIONES
REALIDAD
Natural / Lógico

10. TRANSICIONES
IRREAL
Confusión / Angustia

11. EJEMPLOS DE TRANSICIONES EN INTERFACES
SCROLL
S

12. EJEMPLOS DE TRANSICIONES EN INTERFACES
TOGGLE MENU

13. EJEMPLOS DE TRANSICIONES EN INTERFACES
COMENTARIOS

14. EJEMPLOS DE TRANSICIONES EN INTERFACES
PULL TO REFRESH

15. EJEMPLOS DE TRANSICIONES EN INTERFACES
BARRA DE NAVEGACIÓN

16. EJEMPLOS DE TRANSICIONES EN INTERFACES
EFECTOS
COMPLEMENTARIOS
A ELEMENTOS

17. LAS NUEVAS TECNOLOGÍAS
EN LAS INTERFACES HAN
AYUDADO A MEJORAR LA
EXPERIENCIA DE LOS
USUARIOS

18. LA INSPIRACIÓN ESTÁ EN TODAS PARTES
LIBROS
NATURALEZA
JUEGOS
DISEÑO INDUSTRIAL
APPSREVISTAS

19. BUEN DISEÑO DE INTERFAZ
CLARIDAD PARA EL USUARIO
FLUJO ÓPTIMO DE ACCIONES
EMPATÍA / EXPERIENCIA DE USUARIO
FIDELIZACIÓN

20. CONCLUSIONES
La interacción en una interfaz es fundamental para una
buena experiencia de usuario.
El usuario debe saber qué pasó, no lo dejemos perdido.
Definir el diseño de la interfaz, de acuerdo al contexto.
Conectar la intensión con la acción del usuario, para una
experiencia más fluida.
Pequeños detalles de diseño pueden ser significativos para el
uso de una interfaz.

21. TIPS / INSPIRACIÓN
www.capptivate.co
www.dribbble.com
www.designmeltdown.com
www.behance.net
www.google.com/design

22. ACTIVIDAD
1. STORYBOARD CONTEXTO DE USUARIO

23. ACTIVIDAD
2. Flujo de Aplicación