SlideShare a Scribd company logo
1 of 38
Download to read offline
USER EXPERIENCE DESIGN
Diseñando la experiencia de usuario
     en interfaces interactivas
•  La evolución de internet ha cambiado la forma en que
   trabajamos, vivimos, aprendemos, nos divertimos y más.

•  Evolución usuarios internet: de 360 millones en 2000 a
   1800 millones en 2010 

•  El acceso multiplataforma y la difusión de los nuevos
   smartphones no tiene marcha atrás.

•  Los usuarios colaboran e intercambian información de
   forma ágil.

•  El consumidor actual es informado e inteligente:
   crossumer y prossumer.
Estamos ante un nuevo escenario


    
 Con nuevas formas de comunicarnos,
   relacionarnos, experimentar y compartir.
Lo más importante son las
  personas, debemos centrar
nuestro enfoque ahora más que
        nunca en ellas.
¿Cómo?
•  Generar nuevas formas de relacionarnos con
   nuestros usuarios, clientes, consumidores.

•  Buscar nuevas formas de transmitir mensajes.

•  Potenciar la interacción del consumidor con la marca
   a través de una experiencia directa.

•  Conectar con el consumidor a través de la red.
En este contexto la
experiencia de usuario cobra
   una nueva dimensión.
¿Qué es la experiencia de usuario?
•  La sensación, sentimiento, respuesta
   emocional y satisfacción del usuario respecto
   a un producto, resultado de interactuar con el
   producto y su proveedor (la marca).

•  Una experiencia positiva de usuario está en
   directa relación con una percepción positiva
   de la marca.
¿Y qué conseguimos si generamos
     experiencias positivas?
¡Engagement!

¡la vinculación de los usuarios con
             tu marca!
Diagrama de los elementos de la
          experiencia de usuario


 1.Objetivos.    
   2.Brand               4.Necesidades de    6.Arquitectura      8.Diseño de
 experience.         
      contenidos.
     de información.
      interfaz:
                                                                                9.Diseño visual
    3.Las                5.Especificaciones     7.Diseño de      Información +
necesidades de              funcionales
       interacción
      navegación
   usuario
Etapa 1
 
1. Objetivos del sitio
Corporativos, de negocio, comunicación etc.
 
2. Brand experience online
Atributos de marca que queremos que se identifiquen a
Medio plazo con la experiencia de uso.
 
3. Necesidades de usuario
Identificadas a través de la investigación de los usuarios.
Etapa 2

4. Requerimientos de contenido

 Elementos de contenido requeridos para
  satisfacer las necesidades de usuario.

5. Especificaciones funcionales

 Set de herramientas que el sitio debe
  incluir para satisfacer las necesidades del
  usuario.
Etapa 3
6. Arquitectura de la información

 Diseño estructural del espacio de información
  para facilitar el acceso intuitivo al contenido.


7. Diseño de interacción

 Desarrollo del flujo de las aplicaciones para
  facilitar las tareas del usuario, definiendo cómo el
  usuario interactúa con la funcionalidad del sitio.
Etapa 4


8. Diseño de interfaz: navegación e
 información

 Diseño de los elementos de la interfaz para
  facilitar la navegación e interacción del
  usuario .

 Diseño de la presentación de la información
  para facilitar la comprensión.
Etapa 5


9. Diseño visual

 Look & feel

 Tratamiento gráfico de los elementos de la
  interfaz.

 Diseño emocional.
MITOS Y LEYENDAS DE LA
EXPERIENCIA DE USUARIO
La gente lee el contenido de las
             webs.
Todas las páginas deben ser
accesibles en máximo 3 clicks.
La gente no escrolea.
Diseño es hacer que tu web se vea
              bien.
La accesibilidad es cara y
      complicada.
Los sitios accesibles son feos.
Una buena fotografía mejora la
   experiencia de usuario.
El diseño tiene que ser original.
Si tu diseño es bueno, los
“pequeños detalles” no importan.
Necesitas rediseñar tu sitio
    periódicamente.
Los iconos mejoran la usabilidad.
Tú eres igual a tus usuarios.
Un buscador solucionará los
 problemas de navegación.
El homepage es la página más
        importante.
Flash es malo.
No necesitas el contenido para
     diseñar el website.
Si funciona para Amazon,
     funciona para ti.
Los test de usabilidad son caros.
Referencias
•  Steve Krug  Don’t Make Me       •      e Myth of Originality: Why
      ink
                              things that many deem
•  Jakob Nielsen eye-tracking           original are actually not
   study from 2008
                                   •      e $300 Million Button
•  David Hamill Stop Counting
   Clicks
                         •    Design is in the Details
•     e myth of the page fold:     •    Fresh vs. Familiar: How
   evidence from user testing
          Aggressively to Redesign
•  Paging vs. Scrolling: Looking
   for the Best Way to Present     •      e Importance Of Labels
   Search Results
                 •    Are developers people?
•  Prioritizing web usability.
    •    30 Usability Issues to Be
•  Deciding When Graphics Will          Aware of
   Help (and When ey Won’t)
¡GRACIAS!
HUGO CAMPODÓNICO
hugocampodonico@gmail.com

More Related Content

What's hot

Taller práctico de comunicación digital para asociaciones
Taller práctico de comunicación digital para asociacionesTaller práctico de comunicación digital para asociaciones
Taller práctico de comunicación digital para asociacionesWorköholics
 
Cursos de verano Bizbak UPV/EHU: Marketing Online: Experiencia de usuario (UX...
Cursos de verano Bizbak UPV/EHU: Marketing Online: Experiencia de usuario (UX...Cursos de verano Bizbak UPV/EHU: Marketing Online: Experiencia de usuario (UX...
Cursos de verano Bizbak UPV/EHU: Marketing Online: Experiencia de usuario (UX...The Social Experience
 
Introduccion a UX para estudiantes de marketing y publicidad
Introduccion a UX para estudiantes de marketing y publicidadIntroduccion a UX para estudiantes de marketing y publicidad
Introduccion a UX para estudiantes de marketing y publicidadSol Mesz
 
Hablemos de UX - José Ma. Medina, UX UI designer
Hablemos de UX - José Ma. Medina, UX UI designerHablemos de UX - José Ma. Medina, UX UI designer
Hablemos de UX - José Ma. Medina, UX UI designerJosé Ma. Medina
 
Introducción usabilidad y ux mejorandola-natalia
Introducción usabilidad y ux   mejorandola-nataliaIntroducción usabilidad y ux   mejorandola-natalia
Introducción usabilidad y ux mejorandola-nataliaBrainy Bog
 
Simple Steps to UX/UI Web Design- Español
Simple Steps to UX/UI Web Design- EspañolSimple Steps to UX/UI Web Design- Español
Simple Steps to UX/UI Web Design- EspañolKoombea
 
Heurísticas, Taller UX - Agosto 2016
Heurísticas, Taller UX - Agosto 2016Heurísticas, Taller UX - Agosto 2016
Heurísticas, Taller UX - Agosto 2016taller_ux
 
Introducción a Experiencia de usuario y Usabilidad
Introducción a Experiencia de usuario y UsabilidadIntroducción a Experiencia de usuario y Usabilidad
Introducción a Experiencia de usuario y UsabilidadAdriana Tienda
 
Posicionamiento en buscadores
Posicionamiento en buscadoresPosicionamiento en buscadores
Posicionamiento en buscadoresWorköholics
 
Usabilidad y Experiencia de Usuario
Usabilidad y Experiencia de UsuarioUsabilidad y Experiencia de Usuario
Usabilidad y Experiencia de UsuarioWorkshop Digital
 
Tema 3. usabilidad version 2011
Tema 3. usabilidad version 2011Tema 3. usabilidad version 2011
Tema 3. usabilidad version 2011Angelito Maik
 
creatividad aplicada en Internet
creatividad aplicada en Internet creatividad aplicada en Internet
creatividad aplicada en Internet MARIA MEJIAS
 

What's hot (17)

Diseño Web
Diseño WebDiseño Web
Diseño Web
 
Taller práctico de comunicación digital para asociaciones
Taller práctico de comunicación digital para asociacionesTaller práctico de comunicación digital para asociaciones
Taller práctico de comunicación digital para asociaciones
 
UX para dispositivos móviles
UX para dispositivos móvilesUX para dispositivos móviles
UX para dispositivos móviles
 
Cursos de verano Bizbak UPV/EHU: Marketing Online: Experiencia de usuario (UX...
Cursos de verano Bizbak UPV/EHU: Marketing Online: Experiencia de usuario (UX...Cursos de verano Bizbak UPV/EHU: Marketing Online: Experiencia de usuario (UX...
Cursos de verano Bizbak UPV/EHU: Marketing Online: Experiencia de usuario (UX...
 
UX Trends 2017 Report
UX Trends 2017 ReportUX Trends 2017 Report
UX Trends 2017 Report
 
Introduccion a UX para estudiantes de marketing y publicidad
Introduccion a UX para estudiantes de marketing y publicidadIntroduccion a UX para estudiantes de marketing y publicidad
Introduccion a UX para estudiantes de marketing y publicidad
 
Hablemos de UX - José Ma. Medina, UX UI designer
Hablemos de UX - José Ma. Medina, UX UI designerHablemos de UX - José Ma. Medina, UX UI designer
Hablemos de UX - José Ma. Medina, UX UI designer
 
Introducción usabilidad y ux mejorandola-natalia
Introducción usabilidad y ux   mejorandola-nataliaIntroducción usabilidad y ux   mejorandola-natalia
Introducción usabilidad y ux mejorandola-natalia
 
M2 DiseñO Web
M2   DiseñO WebM2   DiseñO Web
M2 DiseñO Web
 
Simple Steps to UX/UI Web Design- Español
Simple Steps to UX/UI Web Design- EspañolSimple Steps to UX/UI Web Design- Español
Simple Steps to UX/UI Web Design- Español
 
Heurísticas, Taller UX - Agosto 2016
Heurísticas, Taller UX - Agosto 2016Heurísticas, Taller UX - Agosto 2016
Heurísticas, Taller UX - Agosto 2016
 
Introducción a Experiencia de usuario y Usabilidad
Introducción a Experiencia de usuario y UsabilidadIntroducción a Experiencia de usuario y Usabilidad
Introducción a Experiencia de usuario y Usabilidad
 
Posicionamiento en buscadores
Posicionamiento en buscadoresPosicionamiento en buscadores
Posicionamiento en buscadores
 
Experiencia de usuario y Usabilidad
Experiencia de usuario y UsabilidadExperiencia de usuario y Usabilidad
Experiencia de usuario y Usabilidad
 
Usabilidad y Experiencia de Usuario
Usabilidad y Experiencia de UsuarioUsabilidad y Experiencia de Usuario
Usabilidad y Experiencia de Usuario
 
Tema 3. usabilidad version 2011
Tema 3. usabilidad version 2011Tema 3. usabilidad version 2011
Tema 3. usabilidad version 2011
 
creatividad aplicada en Internet
creatividad aplicada en Internet creatividad aplicada en Internet
creatividad aplicada en Internet
 

Similar to User experience design

Juan Merodio. Las redes sociales como herramienta de marketing y fidelización
Juan Merodio. Las redes sociales como herramienta de marketing y fidelizaciónJuan Merodio. Las redes sociales como herramienta de marketing y fidelización
Juan Merodio. Las redes sociales como herramienta de marketing y fidelizaciónFundación FYDE-CajaCanarias
 
arquitecturadelainformacin01-131111090833-phpapp02 (1).pptx
arquitecturadelainformacin01-131111090833-phpapp02 (1).pptxarquitecturadelainformacin01-131111090833-phpapp02 (1).pptx
arquitecturadelainformacin01-131111090833-phpapp02 (1).pptxCarmenKeim2
 
Cursos de verano Bizbak UPV/EHU: Marketing Online: Experiencia de usuario (UX...
Cursos de verano Bizbak UPV/EHU: Marketing Online: Experiencia de usuario (UX...Cursos de verano Bizbak UPV/EHU: Marketing Online: Experiencia de usuario (UX...
Cursos de verano Bizbak UPV/EHU: Marketing Online: Experiencia de usuario (UX...Virginia Aguirre
 
Arquitectura de la información 01
Arquitectura de la información 01Arquitectura de la información 01
Arquitectura de la información 01Worköholics
 
Conversion thursday - User Experience
Conversion thursday - User ExperienceConversion thursday - User Experience
Conversion thursday - User ExperienceHitz Kareaga
 
Presentación Estudiantes Webmaster Area 2º Curso
Presentación Estudiantes Webmaster Area 2º CursoPresentación Estudiantes Webmaster Area 2º Curso
Presentación Estudiantes Webmaster Area 2º CursoThe Social Experience
 
Introducción al Diseño web
Introducción al Diseño webIntroducción al Diseño web
Introducción al Diseño webciwmx
 
La interacción y el diseño
La interacción y el diseñoLa interacción y el diseño
La interacción y el diseñoBrandi Minaya
 
Usabilidad en la empresa 2.0
Usabilidad en la empresa 2.0Usabilidad en la empresa 2.0
Usabilidad en la empresa 2.0Jorge Márquez
 
Clase1: La web, los usuarios y la arquitectura de la Información
Clase1: La web, los usuarios y la arquitectura de la InformaciónClase1: La web, los usuarios y la arquitectura de la Información
Clase1: La web, los usuarios y la arquitectura de la InformaciónBenjamín Preller
 
Presenta Usabilidad 2009
Presenta Usabilidad 2009Presenta Usabilidad 2009
Presenta Usabilidad 2009qweos
 
Tema 3: Diseño - Desarrollo
Tema 3:   Diseño - DesarrolloTema 3:   Diseño - Desarrollo
Tema 3: Diseño - Desarrollopromperuvirtual
 
"UX Design for Mobile Developers" - Andres Jordan Zeballos - GDG Cochabamba
"UX Design for Mobile Developers" - Andres Jordan Zeballos - GDG Cochabamba"UX Design for Mobile Developers" - Andres Jordan Zeballos - GDG Cochabamba
"UX Design for Mobile Developers" - Andres Jordan Zeballos - GDG Cochabambagdgsantacruz
 
ciberperiodismo
ciberperiodismociberperiodismo
ciberperiodismoDianCOC
 

Similar to User experience design (20)

Juan Merodio. Las redes sociales como herramienta de marketing y fidelización
Juan Merodio. Las redes sociales como herramienta de marketing y fidelizaciónJuan Merodio. Las redes sociales como herramienta de marketing y fidelización
Juan Merodio. Las redes sociales como herramienta de marketing y fidelización
 
arquitecturadelainformacin01-131111090833-phpapp02 (1).pptx
arquitecturadelainformacin01-131111090833-phpapp02 (1).pptxarquitecturadelainformacin01-131111090833-phpapp02 (1).pptx
arquitecturadelainformacin01-131111090833-phpapp02 (1).pptx
 
Cursos de verano Bizbak UPV/EHU: Marketing Online: Experiencia de usuario (UX...
Cursos de verano Bizbak UPV/EHU: Marketing Online: Experiencia de usuario (UX...Cursos de verano Bizbak UPV/EHU: Marketing Online: Experiencia de usuario (UX...
Cursos de verano Bizbak UPV/EHU: Marketing Online: Experiencia de usuario (UX...
 
Arquitectura de la información 01
Arquitectura de la información 01Arquitectura de la información 01
Arquitectura de la información 01
 
Conversion thursday - User Experience
Conversion thursday - User ExperienceConversion thursday - User Experience
Conversion thursday - User Experience
 
Presentación Estudiantes Webmaster Area 2º Curso
Presentación Estudiantes Webmaster Area 2º CursoPresentación Estudiantes Webmaster Area 2º Curso
Presentación Estudiantes Webmaster Area 2º Curso
 
Que Es La User Experience
Que Es La User ExperienceQue Es La User Experience
Que Es La User Experience
 
Introducción al Diseño web
Introducción al Diseño webIntroducción al Diseño web
Introducción al Diseño web
 
La interacción y el diseño
La interacción y el diseñoLa interacción y el diseño
La interacción y el diseño
 
Webinar 5 principios de usabilidad para hacer tu sitio web exitoso
Webinar 5 principios de usabilidad para hacer tu sitio web exitosoWebinar 5 principios de usabilidad para hacer tu sitio web exitoso
Webinar 5 principios de usabilidad para hacer tu sitio web exitoso
 
Usabilidad en la empresa 2.0
Usabilidad en la empresa 2.0Usabilidad en la empresa 2.0
Usabilidad en la empresa 2.0
 
05 usabilidad y gestión web
05 usabilidad y gestión web05 usabilidad y gestión web
05 usabilidad y gestión web
 
Clase1: La web, los usuarios y la arquitectura de la Información
Clase1: La web, los usuarios y la arquitectura de la InformaciónClase1: La web, los usuarios y la arquitectura de la Información
Clase1: La web, los usuarios y la arquitectura de la Información
 
Presenta Usabilidad 2009
Presenta Usabilidad 2009Presenta Usabilidad 2009
Presenta Usabilidad 2009
 
USER EXPERIENCE
USER EXPERIENCEUSER EXPERIENCE
USER EXPERIENCE
 
Tema 3: Diseño - Desarrollo
Tema 3:   Diseño - DesarrolloTema 3:   Diseño - Desarrollo
Tema 3: Diseño - Desarrollo
 
"UX Design for Mobile Developers" - Andres Jordan Zeballos - GDG Cochabamba
"UX Design for Mobile Developers" - Andres Jordan Zeballos - GDG Cochabamba"UX Design for Mobile Developers" - Andres Jordan Zeballos - GDG Cochabamba
"UX Design for Mobile Developers" - Andres Jordan Zeballos - GDG Cochabamba
 
Usabilidad web
Usabilidad webUsabilidad web
Usabilidad web
 
Tips usabilidad
Tips usabilidadTips usabilidad
Tips usabilidad
 
ciberperiodismo
ciberperiodismociberperiodismo
ciberperiodismo
 

User experience design

  • 1. USER EXPERIENCE DESIGN Diseñando la experiencia de usuario en interfaces interactivas
  • 2. •  La evolución de internet ha cambiado la forma en que trabajamos, vivimos, aprendemos, nos divertimos y más. •  Evolución usuarios internet: de 360 millones en 2000 a 1800 millones en 2010 •  El acceso multiplataforma y la difusión de los nuevos smartphones no tiene marcha atrás. •  Los usuarios colaboran e intercambian información de forma ágil. •  El consumidor actual es informado e inteligente: crossumer y prossumer.
  • 3. Estamos ante un nuevo escenario Con nuevas formas de comunicarnos, relacionarnos, experimentar y compartir.
  • 4. Lo más importante son las personas, debemos centrar nuestro enfoque ahora más que nunca en ellas.
  • 6. •  Generar nuevas formas de relacionarnos con nuestros usuarios, clientes, consumidores. •  Buscar nuevas formas de transmitir mensajes. •  Potenciar la interacción del consumidor con la marca a través de una experiencia directa. •  Conectar con el consumidor a través de la red.
  • 7. En este contexto la experiencia de usuario cobra una nueva dimensión.
  • 8. ¿Qué es la experiencia de usuario? •  La sensación, sentimiento, respuesta emocional y satisfacción del usuario respecto a un producto, resultado de interactuar con el producto y su proveedor (la marca). •  Una experiencia positiva de usuario está en directa relación con una percepción positiva de la marca.
  • 9. ¿Y qué conseguimos si generamos experiencias positivas?
  • 10. ¡Engagement! ¡la vinculación de los usuarios con tu marca!
  • 11. Diagrama de los elementos de la experiencia de usuario 1.Objetivos. 2.Brand 4.Necesidades de 6.Arquitectura 8.Diseño de experience. contenidos. de información. interfaz: 9.Diseño visual 3.Las 5.Especificaciones 7.Diseño de Información + necesidades de funcionales interacción navegación usuario
  • 12. Etapa 1   1. Objetivos del sitio Corporativos, de negocio, comunicación etc.   2. Brand experience online Atributos de marca que queremos que se identifiquen a Medio plazo con la experiencia de uso.   3. Necesidades de usuario Identificadas a través de la investigación de los usuarios.
  • 13. Etapa 2 4. Requerimientos de contenido Elementos de contenido requeridos para satisfacer las necesidades de usuario. 5. Especificaciones funcionales Set de herramientas que el sitio debe incluir para satisfacer las necesidades del usuario.
  • 14. Etapa 3 6. Arquitectura de la información Diseño estructural del espacio de información para facilitar el acceso intuitivo al contenido. 7. Diseño de interacción Desarrollo del flujo de las aplicaciones para facilitar las tareas del usuario, definiendo cómo el usuario interactúa con la funcionalidad del sitio.
  • 15. Etapa 4 8. Diseño de interfaz: navegación e información Diseño de los elementos de la interfaz para facilitar la navegación e interacción del usuario . Diseño de la presentación de la información para facilitar la comprensión.
  • 16. Etapa 5 9. Diseño visual Look & feel Tratamiento gráfico de los elementos de la interfaz. Diseño emocional.
  • 17. MITOS Y LEYENDAS DE LA EXPERIENCIA DE USUARIO
  • 18. La gente lee el contenido de las webs.
  • 19. Todas las páginas deben ser accesibles en máximo 3 clicks.
  • 20. La gente no escrolea.
  • 21. Diseño es hacer que tu web se vea bien.
  • 22. La accesibilidad es cara y complicada.
  • 24. Una buena fotografía mejora la experiencia de usuario.
  • 25. El diseño tiene que ser original.
  • 26. Si tu diseño es bueno, los “pequeños detalles” no importan.
  • 27. Necesitas rediseñar tu sitio periódicamente.
  • 28. Los iconos mejoran la usabilidad.
  • 29. Tú eres igual a tus usuarios.
  • 30. Un buscador solucionará los problemas de navegación.
  • 31. El homepage es la página más importante.
  • 33. No necesitas el contenido para diseñar el website.
  • 34. Si funciona para Amazon, funciona para ti.
  • 35. Los test de usabilidad son caros.
  • 36. Referencias •  Steve Krug  Don’t Make Me •  e Myth of Originality: Why ink things that many deem •  Jakob Nielsen eye-tracking original are actually not study from 2008 •  e $300 Million Button •  David Hamill Stop Counting Clicks •  Design is in the Details •  e myth of the page fold: •  Fresh vs. Familiar: How evidence from user testing Aggressively to Redesign •  Paging vs. Scrolling: Looking for the Best Way to Present •  e Importance Of Labels Search Results •  Are developers people? •  Prioritizing web usability. •  30 Usability Issues to Be •  Deciding When Graphics Will Aware of Help (and When ey Won’t)