SlideShare uma empresa Scribd logo
1 de 64
(av) Ayer Viernes ®2008 Ayerviernes S.A. Metodología de Diseño Centrado en el Usuario Darcy Vergara - Pedro Arellano - Maximiliano Martin AyerViernes Marzo - 2008 Arquitectura de Inforación - Estudios de Usuarios - Accesibilidad
(av) Ayer Viernes ®2008 Ayerviernes S.A.
Diseño  centrado  en las  personas   ,[object Object],(av) Ayer Viernes ®2008 Ayerviernes S.A.
(av) Ayer Viernes ®2008 Ayerviernes S.A. Investigación aplicada al diseño No se trata de “ cientificar”  el diseño sino establecer guías estratégicas, fundadas en la investigación de usuarios y en dinámicas colaborativas  De manera de tener un encuadre metodológico que delimite los objetivos del proyecto y permita no salirse de este marco referencial.  ¿Cómo funciona?
(av) Ayer Viernes ®2008 Ayerviernes S.A. Identificar la necesidad de un DCU El diseño satisface las especificaciones de la organización y de los usuarios Entender y especificar el contexto de uso Especificar los requerimientos de los usuarios y de la organización  Evaluar diseño a partir de los requerimientos Producir soluciones de diseño The interdependence of human-centered design activities Prototyping Social Action  Esko Kurvinen
(av) Ayer Viernes ®2008 Ayerviernes S.A. Arhippainen, Tähti, 2003 Entender la interacción...
(av) Ayer Viernes ®2008 Ayerviernes S.A. ¿Cuál es el valor de integrar a personas (usuarios) dentro de los procesos de diseño?
(av) Ayer Viernes ®2008 Ayerviernes S.A. El valor del codiseño con los usuarios en etapas tempranas del proyecto, radica en que ellos son los que introducen innovaciones, detectan fallos... en fin, los usan  ¿Pero, cómo sacarles provecho? Stand By
(av) Ayer Viernes ®2008 Ayerviernes S.A. ¿Cuantos usuarios testear?
(av) Ayer Viernes ®2008 Ayerviernes S.A. ¿Cuantitativo o Cualitativo? ¿Cómo nos aproximamos a ellos?
(av) Ayer Viernes ®2008 Ayerviernes S.A. Triangular las fuentes Integración metodología cuanti y cuali
(av) Ayer Viernes ®2008 Ayerviernes S.A. ¿Qué triangular? ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
(av) Ayer Viernes ®2008 Ayerviernes S.A. ¿Pero, cómo sacarles provecho?
(av) Ayer Viernes ®2008 Ayerviernes S.A. Por el contrario de lo que se pueda creer ,  no   hay que  escucharlos ,  sino que hay que   observarlos ...  Los focus groups, no son pruebas de usabilidad Los usuarios no son diseñadores ni los diseñadores no son usuarios
(av) Ayer Viernes ®2008 Ayerviernes S.A. ,[object Object],Entonces...
(av) Ayer Viernes ®2008 Ayerviernes S.A. ,[object Object],[object Object],[object Object],[object Object],[object Object]
(av) Ayer Viernes ®2008 Ayerviernes S.A. Pero...  ¿qué hacer si no tengo laboratorio, ni usuarios? sólo casos extremos Agudizar el sentido común y tomar un genérico... ! no leo, hojeo Casi nunca tomo decisiones óptimas Me las arreglo como puedo Odio los banners
(av) Ayer Viernes ®2008 Ayerviernes S.A. Scientific Web Design: 23 Actionable Lessons from Eye-Tracking Studies Aprovecharnos de las convenciones No hay nada más claro y efectivo que un  link azul subrayado ,[object Object],[object Object],NO  sacar conclusiones fuera de contexto
(av) Ayer Viernes ®2008 Ayerviernes S.A.
(av) Ayer Viernes ®2008 Ayerviernes S.A.
(av) Ayer Viernes ®2008 Ayerviernes S.A. ¿Qué y cuando probar con usuarios? ,[object Object],[object Object],[object Object],[object Object],[object Object]
(av) Ayer Viernes ®2008 Ayerviernes S.A. ¿Qué y cuando probar con usuarios? ,[object Object],[object Object],[object Object],[object Object],[object Object]
(av) Ayer Viernes ®2008 Ayerviernes S.A. ¿Qué y cuando probar con usuarios? ,[object Object],[object Object],[object Object],[object Object],[object Object]
(av) Ayer Viernes ®2008 Ayerviernes S.A. ¿Qué y cuando probar con usuarios? ,[object Object],[object Object],[object Object],[object Object],[object Object]
(av) Ayer Viernes ®2008 Ayerviernes S.A. ¿Qué y cuando probar con usuarios? ,[object Object],[object Object],[object Object],[object Object],[object Object]
Arquitectura de la Información (av) Ayer Viernes ®2008 Ayerviernes S.A.
Proceso vs Producto (av) Ayer Viernes ®2008 Ayerviernes S.A.
¿Arquitectura de la Información? Orden  de la información  Beneficio  para los usuarios  Encontrabilidad  de los contenidos Calidad  de los contenidos  Convertir  datos en contenidos digitales. (av) Ayer Viernes ®2008 Ayerviernes S.A.
Pero... Conjugar muchas y diferentes visiones (av) Ayer Viernes ®2008 Ayerviernes S.A.
Funcionalidad y contenido. Necesidades de la organización. Necesidades del público (usuarios). Sistemas de organización. Navegación. Rotulado. Búsqueda. ¿Cómo? (av) Ayer Viernes ®2008 Ayerviernes S.A.
investigar la organización  (cuáles son los  objetivos  de la organización) (av) Ayer Viernes ®2008 Ayerviernes S.A.
investigación de usuarios empatía = modelos mentales (av) Ayer Viernes ®2008 Ayerviernes S.A.
resultados de las investigaciones... técnicas índices de contenido card sorting definir jerarquías (av) Ayer Viernes ®2008 Ayerviernes S.A.
índices de contenido card sorting definir jerarquías  (av) Ayer Viernes ®2008 Ayerviernes S.A.
índices de contenido card sorting definir jerarquías (av) Ayer Viernes ®2008 Ayerviernes S.A.
índices de contenido card sorting definir jerarquías Capa superior - interfaz Capa intermedia - contenido - interacciones Capa inferior - base de datos  (av) Ayer Viernes ®2008 Ayerviernes S.A.
Capa superior - interfaz Capa intermedia - contenido - interacciones Capa inferior - base de datos  Contenido fundamental Opciones necesarias Agrupación por tema por función  por jerarquía Etiquetado o  rotulaciones (av) Ayer Viernes ®2008 Ayerviernes S.A.
Resultado... (av) Ayer Viernes ®2008 Ayerviernes S.A.
(av) Ayer Viernes ®2008 Ayerviernes S.A.
Capa superior - interfaz Capa intermedia - contenido - interacciones Capa inferior - base de datos  (av) Ayer Viernes ®2008 Ayerviernes S.A.
(av) Ayer Viernes ®2008 Ayerviernes S.A.
Capa superior - interfaz Capa intermedia - contenido - interacciones Capa inferior - base de datos  (av) Ayer Viernes ®2008 Ayerviernes S.A.
recursos La biblia de la AI,  Information Architecture for the World Wide Web   Information Architecture Glossary (Whitepaper) de Kat Hagedorn. Information Architecture: Blueprints for the Web (Paperback) de Christina Wodtke. The Elements of User Experience: User-Centered Design for the Web de Jesse James  Garrett . No me hagas pensar  de Steve Krug. Designing Web Usability: The Practice of Simplicity de Jakob Nielsen. (av) Ayer Viernes ®2008 Ayerviernes S.A.
(av) Ayer Viernes ®2008 Ayerviernes S.A.
(av) Ayer Viernes Es para las personas
(av) Ayer Viernes Foto de  asferic Flick Principios de Accesibilidad - Directrices de Accesibilidad  para el Contenido  Web 1.0 - Para las  personas  (Usuarios) -  Derechos  Humanos  (Declaración Universal Art. 27.1 1984) - Distintos  niveles  de Accesibilidad - Acceso Universal o Acceso para Todos - Desarrolladores  (AIs, Psicologos, Periodistas, Diseñadores, Profesores de Castellano, Publicistas, etc.) - Capacidad de entregar  Alternativas
(av) Ayer Viernes ¿Por qué una Web Accesible? ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
(av) Ayer Viernes ¿Qué es crear Web Accesible? - Implementar las 14  Pautas de accesibilidad , normativa que explica como hacer accesibles los contenidos - Revisar los puntos de verificación según el nivel de accesibilidad a cumplir - Concientizar a los desarrolladores
(av) Ayer Viernes ¿Cuándo implementarla? En desarrollos completos siempre En desarrollos terminados caso por caso :) ;) Estrategia AI Contenidos Diseño Front
(av) Ayer Viernes Desarrollando accesiblemente Estrategia AI Contenidos Diseño Front :) Definir el nivel A AA AAA Prioridad 1 =  tiene Prioridad 2 =  debe Prioridad 3 =  puede
(av) Ayer Viernes ¿Cómo evaluarla? Definir el nivel ,[object Object],A Prioridad 1 14  (65) ;)
(av) Ayer Viernes Tipos de Verificación Automática ,[object Object],- TAW - HERA - Examinator - Titles - Contrastes - Textos de Vínculos - Contrastes y Color - Ver sin CSS - Ver sin imágenes - HTML semántico - Tamaños relativos - Correcta Degradación  - WebDeveloper - WAVE - Accesibility
(av) Ayer Viernes Validemos Automática - Varios - Sin imágenes - Sin CSS - Verificar HTML - Verificar CSS
(av) Ayer Viernes Validemos Automática -  Varios :( - Sin imágenes  - Sin CSS - Verificar HTML  - Verificar CSS
(av) Ayer Viernes Validemos Automática -  Varios :( - Sin imágenes - Sin CSS - Verificar HTML - Verificar CSS
(av) Ayer Viernes Validemos Automática -  Varios :( - Sin imágenes - Sin CSS - Verificar HTML - Verificar CSS
(av) Ayer Viernes Validemos Automática -  Varios :( -  Sin imágenes :( -  Sin CSS - Verificar HTML - Verificar CSS
(av) Ayer Viernes Validemos Automática - Varios :( - Sin imágenes :( -  Sin CSS :) -  Verificar HTML - Verificar CSS
(av) Ayer Viernes Validemos Automática - Varios :( - Sin imágenes :( - Sin CSS :) -  Verificar HTML :( - Verificar CSS
(av) Ayer Viernes Validemos Automática - Varios :( - Sin imágenes :( - Sin CSS :) - Verificar HTML :( - Verificar CSS :(
(av) Ayer Viernes Validemos Manual Pauta 1 Proporcione alternativas equivalentes para el contenido visual y auditivo - Proporcione un contenido que, presentado al usuario, cumpla esencialmente la misma función o propósito que el contenido visual o auditivo. 1.1  Proporcione un  texto equivalente  para todo elemento no textual  Por ejemplo, en HTML: 1.2   Proporcione  vínculos redundantes  en formato texto para cada zona activa de un mapa de imagen del servidor. [Prioridad 1] 1.3   Hasta que las aplicaciones de usuario puedan leer automáticamente el texto equivalente de la banda visual, proporcione una  descripción auditiva  de la información importante de la pista visual de una presentación multimedia [Prioridad 1] 1.4  Para toda presentación multimedia tempodependiente (Por ejemplo, una película o animación)  sincronice alternativas equivalentes  (Por ejemplo, subtítulos o descripciones de la banda visual) con la presentación. [Prioridad 1] 1.5   Hasta que las aplicaciones de usuario interpreten el  texto equivalente para los vínculos de los mapas  de imagen de cliente, proporcione vínculos de texto redundantes para cada zona activa del mapa de imagen de cliente. [Prioridad 3] - Ejemplos - Técnicas HTML - Técnicas CSS Verificar punto por punto ¿Aplica? Aplicar :) Ejemplo
(av) Ayer Viernes Recursos Información oficial -  W3C España   http://www.w3c.es / -  Introducción a la Accesibilidad  http://www.w3c.es /Traducciones/es/WAI/intro/accessibility -  SIDAR  http://w ww.sidar.org/que/ge/cs.php -  Accesibilidad e Internet  www.inclusio ndigital.net/albergue/accesibilida d.pdf - http://www.discapnet.es/web_accesible/wcag10/WAI-WEBCO NTENT-19990505_es.html -  http://usuarios.discapnet. es/disweb2000/PautaWAI/LPVWCAG10.htmTAW Extenciones d e FireFox - WebDeveloper  - WAVE - Accesibility Validadores -  HERA  http://ww w.sidar.org/ -  Examinator  http://www.accesible.com.ar/examinator -  Validador d e HTML   http://validator.w3.org/ - V alidador de CSS   http://jigsa w.w3.org/css-validator/ -  TAW Test de Accesiblidad  Web  http://www.tawdis.net/
(av) Ayer Viernes Desarrollado por personas
(av) Ayer Viernes ®2008 Ayerviernes S.A. Muchas Gracias :) Darcy Vergara - Pedro Arellano - Maximiliano Martin AyerViernes Marzo - 2008 Ayer Viernes www.darcy.cl  - pedroarellano.wordpress.com - www.maximili ano.cl www.ayerviernes.com

Mais conteúdo relacionado

Mais procurados

Introducción a UX
Introducción a UXIntroducción a UX
Introducción a UX
tayzee
 
Principios de Usabilidad para Dominar la Red
Principios de Usabilidad para Dominar la RedPrincipios de Usabilidad para Dominar la Red
Principios de Usabilidad para Dominar la Red
Jose Maria Diaz
 

Mais procurados (20)

Usabilidad y Experiencia de Usuario
Usabilidad y Experiencia de UsuarioUsabilidad y Experiencia de Usuario
Usabilidad y Experiencia de Usuario
 
Evaluación de la Usabilidad de un sitio web
Evaluación de la Usabilidad de un sitio webEvaluación de la Usabilidad de un sitio web
Evaluación de la Usabilidad de un sitio web
 
Clase 6 Usabilidad
Clase 6 UsabilidadClase 6 Usabilidad
Clase 6 Usabilidad
 
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
 
Antecedentes del Diseño Centrado en el Usuario (Diseño de productos)
Antecedentes del Diseño Centrado en el Usuario (Diseño de productos)Antecedentes del Diseño Centrado en el Usuario (Diseño de productos)
Antecedentes del Diseño Centrado en el Usuario (Diseño de productos)
 
Pruebas De Usabilidad
Pruebas De UsabilidadPruebas De Usabilidad
Pruebas De Usabilidad
 
Ux teoría historia-métodos
Ux teoría historia-métodosUx teoría historia-métodos
Ux teoría historia-métodos
 
Introducción a UX
Introducción a UXIntroducción a UX
Introducción a UX
 
Calidad de software - usabilidad y accesibilidad
Calidad de software - usabilidad y accesibilidadCalidad de software - usabilidad y accesibilidad
Calidad de software - usabilidad y accesibilidad
 
Dossier informativo del Programa Superior en Diseño Centrado en el Usuario, E...
Dossier informativo del Programa Superior en Diseño Centrado en el Usuario, E...Dossier informativo del Programa Superior en Diseño Centrado en el Usuario, E...
Dossier informativo del Programa Superior en Diseño Centrado en el Usuario, E...
 
El diseñador a medias (con notas). UX Spain 2013
El diseñador a medias (con notas). UX Spain 2013 El diseñador a medias (con notas). UX Spain 2013
El diseñador a medias (con notas). UX Spain 2013
 
Personas e investigación de usuarios
Personas e investigación de usuariosPersonas e investigación de usuarios
Personas e investigación de usuarios
 
SEO Social: Cómo diseñar una estrategia de Marketing Multicanal
SEO Social: Cómo diseñar una estrategia de Marketing MulticanalSEO Social: Cómo diseñar una estrategia de Marketing Multicanal
SEO Social: Cómo diseñar una estrategia de Marketing Multicanal
 
La importancia del trabajo colaborativo en Arquitectura de Información
La importancia del trabajo colaborativo en Arquitectura de InformaciónLa importancia del trabajo colaborativo en Arquitectura de Información
La importancia del trabajo colaborativo en Arquitectura de Información
 
De la usabilidad a los usuarios
De la usabilidad a los usuariosDe la usabilidad a los usuarios
De la usabilidad a los usuarios
 
Diseño de Experiencia de Usuario UxD
Diseño de Experiencia de Usuario UxDDiseño de Experiencia de Usuario UxD
Diseño de Experiencia de Usuario UxD
 
Creación de Personas, tareas, escenarios y mapas de contenido
Creación de Personas, tareas, escenarios y mapas de contenidoCreación de Personas, tareas, escenarios y mapas de contenido
Creación de Personas, tareas, escenarios y mapas de contenido
 
Principios de Usabilidad para Dominar la Red
Principios de Usabilidad para Dominar la RedPrincipios de Usabilidad para Dominar la Red
Principios de Usabilidad para Dominar la Red
 
Taller Fundamentos de Experiencia de Usuario 01/03
Taller Fundamentos de Experiencia de Usuario 01/03Taller Fundamentos de Experiencia de Usuario 01/03
Taller Fundamentos de Experiencia de Usuario 01/03
 
¿Cómo diseñar SUNAT.gob.pe? Aplicando Diseño Centrado en el Usuario
¿Cómo diseñar SUNAT.gob.pe?  Aplicando Diseño Centrado en el Usuario ¿Cómo diseñar SUNAT.gob.pe?  Aplicando Diseño Centrado en el Usuario
¿Cómo diseñar SUNAT.gob.pe? Aplicando Diseño Centrado en el Usuario
 

Destaque

Flickr en Iphone
Flickr en IphoneFlickr en Iphone
Flickr en Iphone
Jaime Canet
 
Lc2 Soporte Imagenes
Lc2 Soporte ImagenesLc2 Soporte Imagenes
Lc2 Soporte Imagenes
Jaime Canet
 
Metodología de la Investigación para Diseño Gráfico
Metodología de la Investigación para Diseño GráficoMetodología de la Investigación para Diseño Gráfico
Metodología de la Investigación para Diseño Gráfico
Karina Paz
 

Destaque (13)

Analisis de usuario
Analisis de usuarioAnalisis de usuario
Analisis de usuario
 
Flickr en Iphone
Flickr en IphoneFlickr en Iphone
Flickr en Iphone
 
Lc2 Soporte Imagenes
Lc2 Soporte ImagenesLc2 Soporte Imagenes
Lc2 Soporte Imagenes
 
Diseño centrado en el usuario.
Diseño centrado en el usuario.Diseño centrado en el usuario.
Diseño centrado en el usuario.
 
Metodología del Diseño Centrado en las Personas
Metodología del Diseño Centrado en las PersonasMetodología del Diseño Centrado en las Personas
Metodología del Diseño Centrado en las Personas
 
Diseño centrado en la personas (kit de herramientas)
Diseño centrado en la personas (kit de herramientas)Diseño centrado en la personas (kit de herramientas)
Diseño centrado en la personas (kit de herramientas)
 
Tema 3 diseño centrado usuario (2013)
Tema 3 diseño centrado usuario (2013)Tema 3 diseño centrado usuario (2013)
Tema 3 diseño centrado usuario (2013)
 
Metodología de la Investigación para Diseño Gráfico
Metodología de la Investigación para Diseño GráficoMetodología de la Investigación para Diseño Gráfico
Metodología de la Investigación para Diseño Gráfico
 
Diseño centrado en el usuario (diseño industrial conoce lo nuevo).
Diseño centrado en el usuario (diseño industrial conoce lo nuevo).Diseño centrado en el usuario (diseño industrial conoce lo nuevo).
Diseño centrado en el usuario (diseño industrial conoce lo nuevo).
 
Diseño Centrado en el Usuario: UX, IxD, Usabilidad aplicada
Diseño Centrado en el Usuario: UX, IxD, Usabilidad aplicadaDiseño Centrado en el Usuario: UX, IxD, Usabilidad aplicada
Diseño Centrado en el Usuario: UX, IxD, Usabilidad aplicada
 
El Usuario
El UsuarioEl Usuario
El Usuario
 
diseño del producto y proceso
diseño del producto y procesodiseño del producto y proceso
diseño del producto y proceso
 
Métodos de Investigación en Diseño
Métodos de Investigación en DiseñoMétodos de Investigación en Diseño
Métodos de Investigación en Diseño
 

Semelhante a Metodología de Diseño Centrada en el Usuario

Tecnologiaweb 101114145311-phpapp02
Tecnologiaweb 101114145311-phpapp02Tecnologiaweb 101114145311-phpapp02
Tecnologiaweb 101114145311-phpapp02
zaritarodriguez02
 
Minería datos con SQL Server 2012
Minería datos con SQL Server 2012Minería datos con SQL Server 2012
Minería datos con SQL Server 2012
Eduardo Castro
 
Tecnologia web
Tecnologia webTecnologia web
Tecnologia web
Meli Vidal
 
Ponencia vitalas telecom2010_v4.0
Ponencia vitalas telecom2010_v4.0Ponencia vitalas telecom2010_v4.0
Ponencia vitalas telecom2010_v4.0
eduardobustos
 
Ponencia vitalas telecom2010_v4.0
Ponencia vitalas telecom2010_v4.0Ponencia vitalas telecom2010_v4.0
Ponencia vitalas telecom2010_v4.0
TELECOM I+D
 

Semelhante a Metodología de Diseño Centrada en el Usuario (20)

Tecnologiaweb 101114145311-phpapp02
Tecnologiaweb 101114145311-phpapp02Tecnologiaweb 101114145311-phpapp02
Tecnologiaweb 101114145311-phpapp02
 
Lecciones aprendidas creando una red social
Lecciones aprendidas creando una red socialLecciones aprendidas creando una red social
Lecciones aprendidas creando una red social
 
User Experience, UX & UI
User Experience, UX & UIUser Experience, UX & UI
User Experience, UX & UI
 
Introducción a Azure Machine Learning
Introducción a Azure Machine LearningIntroducción a Azure Machine Learning
Introducción a Azure Machine Learning
 
Introducción al análisis predictivo con SQL Server
Introducción al análisis predictivo con SQL ServerIntroducción al análisis predictivo con SQL Server
Introducción al análisis predictivo con SQL Server
 
Presentacion Starting Pack BI Open Source
Presentacion Starting Pack BI Open SourcePresentacion Starting Pack BI Open Source
Presentacion Starting Pack BI Open Source
 
Minería datos con SQL Server 2012
Minería datos con SQL Server 2012Minería datos con SQL Server 2012
Minería datos con SQL Server 2012
 
Webinar Dic 2016 BOC Cloud_v1
Webinar Dic 2016 BOC Cloud_v1Webinar Dic 2016 BOC Cloud_v1
Webinar Dic 2016 BOC Cloud_v1
 
[Code Camp 2009] Desarrollando sitios web escalables con ASP.NET MVC (Rodolfo...
[Code Camp 2009] Desarrollando sitios web escalables con ASP.NET MVC (Rodolfo...[Code Camp 2009] Desarrollando sitios web escalables con ASP.NET MVC (Rodolfo...
[Code Camp 2009] Desarrollando sitios web escalables con ASP.NET MVC (Rodolfo...
 
Tecnologías para hacer Arquitectura de Información
Tecnologías para hacer Arquitectura de InformaciónTecnologías para hacer Arquitectura de Información
Tecnologías para hacer Arquitectura de Información
 
Tecnologia web
Tecnologia webTecnologia web
Tecnologia web
 
Tecnología CASE
Tecnología CASE Tecnología CASE
Tecnología CASE
 
Arquitectura Evolutiva
Arquitectura EvolutivaArquitectura Evolutiva
Arquitectura Evolutiva
 
Arquitectura De La Informacion
Arquitectura De La InformacionArquitectura De La Informacion
Arquitectura De La Informacion
 
VITALAS, hacia una nueva generación de buscadores multimedia
VITALAS, hacia una nueva generación de buscadores multimediaVITALAS, hacia una nueva generación de buscadores multimedia
VITALAS, hacia una nueva generación de buscadores multimedia
 
User Experience Research: los métodos más usados en Mercado Libre
User Experience Research: los métodos más usados en Mercado LibreUser Experience Research: los métodos más usados en Mercado Libre
User Experience Research: los métodos más usados en Mercado Libre
 
Ponencia vitalas telecom2010_v4.0
Ponencia vitalas telecom2010_v4.0Ponencia vitalas telecom2010_v4.0
Ponencia vitalas telecom2010_v4.0
 
Ponencia vitalas telecom2010_v4.0
Ponencia vitalas telecom2010_v4.0Ponencia vitalas telecom2010_v4.0
Ponencia vitalas telecom2010_v4.0
 
Presentación IGALIA
Presentación IGALIAPresentación IGALIA
Presentación IGALIA
 
Introducción a HTML5 y CSS3 - ArtMedia 2011
Introducción a HTML5 y CSS3 - ArtMedia 2011Introducción a HTML5 y CSS3 - ArtMedia 2011
Introducción a HTML5 y CSS3 - ArtMedia 2011
 

Mais de Maximiliano Martin

Evaluación, Diseño Front CSS
Evaluación, Diseño Front CSSEvaluación, Diseño Front CSS
Evaluación, Diseño Front CSS
Maximiliano Martin
 
Marcado HTML Resumen y Evaluación
Marcado HTML Resumen y EvaluaciónMarcado HTML Resumen y Evaluación
Marcado HTML Resumen y Evaluación
Maximiliano Martin
 

Mais de Maximiliano Martin (20)

MIOR Modelo de Interacción Orientada a Resultados
MIOR Modelo de Interacción Orientada a Resultados MIOR Modelo de Interacción Orientada a Resultados
MIOR Modelo de Interacción Orientada a Resultados
 
Metodología FOP
Metodología FOPMetodología FOP
Metodología FOP
 
Metodologia Diseño Centrado en el Usuario @IDAchile
Metodologia Diseño Centrado en el Usuario @IDAchileMetodologia Diseño Centrado en el Usuario @IDAchile
Metodologia Diseño Centrado en el Usuario @IDAchile
 
Accesibilidad adolescente Estado actual
Accesibilidad adolescente Estado actualAccesibilidad adolescente Estado actual
Accesibilidad adolescente Estado actual
 
IDA Responsive webprendedor 2012 - Capital.cl
IDA Responsive webprendedor 2012 - Capital.clIDA Responsive webprendedor 2012 - Capital.cl
IDA Responsive webprendedor 2012 - Capital.cl
 
Clase 09
Clase 09Clase 09
Clase 09
 
Evaluación, Diseño Front CSS
Evaluación, Diseño Front CSSEvaluación, Diseño Front CSS
Evaluación, Diseño Front CSS
 
Marcado HTML Resumen y Evaluación
Marcado HTML Resumen y EvaluaciónMarcado HTML Resumen y Evaluación
Marcado HTML Resumen y Evaluación
 
Div, Validadores,
Div, Validadores, Div, Validadores,
Div, Validadores,
 
Taller horno solar
Taller horno solarTaller horno solar
Taller horno solar
 
Hornos Solares
Hornos SolaresHornos Solares
Hornos Solares
 
Energía Solar y Robótica
Energía Solar y  RobóticaEnergía Solar y  Robótica
Energía Solar y Robótica
 
Eficiencia energética: propuestas de sustentabilidad
Eficiencia energética: propuestas de sustentabilidadEficiencia energética: propuestas de sustentabilidad
Eficiencia energética: propuestas de sustentabilidad
 
Explorando el mundo de la Energía Sola
Explorando el mundo de la Energía SolaExplorando el mundo de la Energía Sola
Explorando el mundo de la Energía Sola
 
HTML Contenedores y tipos de elementos
HTML Contenedores y tipos de elementosHTML Contenedores y tipos de elementos
HTML Contenedores y tipos de elementos
 
Estructura principal de HTML
Estructura principal de HTMLEstructura principal de HTML
Estructura principal de HTML
 
Energías Alternativas
Energías AlternativasEnergías Alternativas
Energías Alternativas
 
WordPress en servidor local
WordPress en servidor localWordPress en servidor local
WordPress en servidor local
 
HTML ¿qué es y para que sirve?
HTML ¿qué es y para que sirve?HTML ¿qué es y para que sirve?
HTML ¿qué es y para que sirve?
 
Qué es Sprites y por qué debería interesarme
Qué es Sprites y por qué debería interesarmeQué es Sprites y por qué debería interesarme
Qué es Sprites y por qué debería interesarme
 

Último

redes informaticas en una oficina administrativa
redes informaticas en una oficina administrativaredes informaticas en una oficina administrativa
redes informaticas en una oficina administrativa
nicho110
 

Último (12)

investigación de los Avances tecnológicos del siglo XXI
investigación de los Avances tecnológicos del siglo XXIinvestigación de los Avances tecnológicos del siglo XXI
investigación de los Avances tecnológicos del siglo XXI
 
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptxEL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
 
pruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNITpruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNIT
 
Avances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estosAvances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estos
 
redes informaticas en una oficina administrativa
redes informaticas en una oficina administrativaredes informaticas en una oficina administrativa
redes informaticas en una oficina administrativa
 
Avances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvanaAvances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvana
 
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptxPROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
 
EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptx
EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptxEVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptx
EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptx
 
How to use Redis with MuleSoft. A quick start presentation.
How to use Redis with MuleSoft. A quick start presentation.How to use Redis with MuleSoft. A quick start presentation.
How to use Redis with MuleSoft. A quick start presentation.
 
Innovaciones tecnologicas en el siglo 21
Innovaciones tecnologicas en el siglo 21Innovaciones tecnologicas en el siglo 21
Innovaciones tecnologicas en el siglo 21
 
Buenos_Aires_Meetup_Redis_20240430_.pptx
Buenos_Aires_Meetup_Redis_20240430_.pptxBuenos_Aires_Meetup_Redis_20240430_.pptx
Buenos_Aires_Meetup_Redis_20240430_.pptx
 
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
 

Metodología de Diseño Centrada en el Usuario

  • 1. (av) Ayer Viernes ®2008 Ayerviernes S.A. Metodología de Diseño Centrado en el Usuario Darcy Vergara - Pedro Arellano - Maximiliano Martin AyerViernes Marzo - 2008 Arquitectura de Inforación - Estudios de Usuarios - Accesibilidad
  • 2. (av) Ayer Viernes ®2008 Ayerviernes S.A.
  • 3.
  • 4. (av) Ayer Viernes ®2008 Ayerviernes S.A. Investigación aplicada al diseño No se trata de “ cientificar” el diseño sino establecer guías estratégicas, fundadas en la investigación de usuarios y en dinámicas colaborativas De manera de tener un encuadre metodológico que delimite los objetivos del proyecto y permita no salirse de este marco referencial. ¿Cómo funciona?
  • 5. (av) Ayer Viernes ®2008 Ayerviernes S.A. Identificar la necesidad de un DCU El diseño satisface las especificaciones de la organización y de los usuarios Entender y especificar el contexto de uso Especificar los requerimientos de los usuarios y de la organización Evaluar diseño a partir de los requerimientos Producir soluciones de diseño The interdependence of human-centered design activities Prototyping Social Action Esko Kurvinen
  • 6. (av) Ayer Viernes ®2008 Ayerviernes S.A. Arhippainen, Tähti, 2003 Entender la interacción...
  • 7. (av) Ayer Viernes ®2008 Ayerviernes S.A. ¿Cuál es el valor de integrar a personas (usuarios) dentro de los procesos de diseño?
  • 8. (av) Ayer Viernes ®2008 Ayerviernes S.A. El valor del codiseño con los usuarios en etapas tempranas del proyecto, radica en que ellos son los que introducen innovaciones, detectan fallos... en fin, los usan ¿Pero, cómo sacarles provecho? Stand By
  • 9. (av) Ayer Viernes ®2008 Ayerviernes S.A. ¿Cuantos usuarios testear?
  • 10. (av) Ayer Viernes ®2008 Ayerviernes S.A. ¿Cuantitativo o Cualitativo? ¿Cómo nos aproximamos a ellos?
  • 11. (av) Ayer Viernes ®2008 Ayerviernes S.A. Triangular las fuentes Integración metodología cuanti y cuali
  • 12.
  • 13. (av) Ayer Viernes ®2008 Ayerviernes S.A. ¿Pero, cómo sacarles provecho?
  • 14. (av) Ayer Viernes ®2008 Ayerviernes S.A. Por el contrario de lo que se pueda creer , no hay que escucharlos , sino que hay que observarlos ... Los focus groups, no son pruebas de usabilidad Los usuarios no son diseñadores ni los diseñadores no son usuarios
  • 15.
  • 16.
  • 17. (av) Ayer Viernes ®2008 Ayerviernes S.A. Pero... ¿qué hacer si no tengo laboratorio, ni usuarios? sólo casos extremos Agudizar el sentido común y tomar un genérico... ! no leo, hojeo Casi nunca tomo decisiones óptimas Me las arreglo como puedo Odio los banners
  • 18.
  • 19. (av) Ayer Viernes ®2008 Ayerviernes S.A.
  • 20. (av) Ayer Viernes ®2008 Ayerviernes S.A.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26. Arquitectura de la Información (av) Ayer Viernes ®2008 Ayerviernes S.A.
  • 27. Proceso vs Producto (av) Ayer Viernes ®2008 Ayerviernes S.A.
  • 28. ¿Arquitectura de la Información? Orden de la información Beneficio para los usuarios Encontrabilidad de los contenidos Calidad de los contenidos Convertir datos en contenidos digitales. (av) Ayer Viernes ®2008 Ayerviernes S.A.
  • 29. Pero... Conjugar muchas y diferentes visiones (av) Ayer Viernes ®2008 Ayerviernes S.A.
  • 30. Funcionalidad y contenido. Necesidades de la organización. Necesidades del público (usuarios). Sistemas de organización. Navegación. Rotulado. Búsqueda. ¿Cómo? (av) Ayer Viernes ®2008 Ayerviernes S.A.
  • 31. investigar la organización (cuáles son los objetivos de la organización) (av) Ayer Viernes ®2008 Ayerviernes S.A.
  • 32. investigación de usuarios empatía = modelos mentales (av) Ayer Viernes ®2008 Ayerviernes S.A.
  • 33. resultados de las investigaciones... técnicas índices de contenido card sorting definir jerarquías (av) Ayer Viernes ®2008 Ayerviernes S.A.
  • 34. índices de contenido card sorting definir jerarquías (av) Ayer Viernes ®2008 Ayerviernes S.A.
  • 35. índices de contenido card sorting definir jerarquías (av) Ayer Viernes ®2008 Ayerviernes S.A.
  • 36. índices de contenido card sorting definir jerarquías Capa superior - interfaz Capa intermedia - contenido - interacciones Capa inferior - base de datos (av) Ayer Viernes ®2008 Ayerviernes S.A.
  • 37. Capa superior - interfaz Capa intermedia - contenido - interacciones Capa inferior - base de datos Contenido fundamental Opciones necesarias Agrupación por tema por función por jerarquía Etiquetado o rotulaciones (av) Ayer Viernes ®2008 Ayerviernes S.A.
  • 38. Resultado... (av) Ayer Viernes ®2008 Ayerviernes S.A.
  • 39. (av) Ayer Viernes ®2008 Ayerviernes S.A.
  • 40. Capa superior - interfaz Capa intermedia - contenido - interacciones Capa inferior - base de datos (av) Ayer Viernes ®2008 Ayerviernes S.A.
  • 41. (av) Ayer Viernes ®2008 Ayerviernes S.A.
  • 42. Capa superior - interfaz Capa intermedia - contenido - interacciones Capa inferior - base de datos (av) Ayer Viernes ®2008 Ayerviernes S.A.
  • 43. recursos La biblia de la AI, Information Architecture for the World Wide Web Information Architecture Glossary (Whitepaper) de Kat Hagedorn. Information Architecture: Blueprints for the Web (Paperback) de Christina Wodtke. The Elements of User Experience: User-Centered Design for the Web de Jesse James Garrett . No me hagas pensar de Steve Krug. Designing Web Usability: The Practice of Simplicity de Jakob Nielsen. (av) Ayer Viernes ®2008 Ayerviernes S.A.
  • 44. (av) Ayer Viernes ®2008 Ayerviernes S.A.
  • 45. (av) Ayer Viernes Es para las personas
  • 46. (av) Ayer Viernes Foto de asferic Flick Principios de Accesibilidad - Directrices de Accesibilidad para el Contenido Web 1.0 - Para las personas (Usuarios) - Derechos Humanos (Declaración Universal Art. 27.1 1984) - Distintos niveles de Accesibilidad - Acceso Universal o Acceso para Todos - Desarrolladores (AIs, Psicologos, Periodistas, Diseñadores, Profesores de Castellano, Publicistas, etc.) - Capacidad de entregar Alternativas
  • 47.
  • 48. (av) Ayer Viernes ¿Qué es crear Web Accesible? - Implementar las 14 Pautas de accesibilidad , normativa que explica como hacer accesibles los contenidos - Revisar los puntos de verificación según el nivel de accesibilidad a cumplir - Concientizar a los desarrolladores
  • 49. (av) Ayer Viernes ¿Cuándo implementarla? En desarrollos completos siempre En desarrollos terminados caso por caso :) ;) Estrategia AI Contenidos Diseño Front
  • 50. (av) Ayer Viernes Desarrollando accesiblemente Estrategia AI Contenidos Diseño Front :) Definir el nivel A AA AAA Prioridad 1 = tiene Prioridad 2 = debe Prioridad 3 = puede
  • 51.
  • 52.
  • 53. (av) Ayer Viernes Validemos Automática - Varios - Sin imágenes - Sin CSS - Verificar HTML - Verificar CSS
  • 54. (av) Ayer Viernes Validemos Automática - Varios :( - Sin imágenes - Sin CSS - Verificar HTML - Verificar CSS
  • 55. (av) Ayer Viernes Validemos Automática - Varios :( - Sin imágenes - Sin CSS - Verificar HTML - Verificar CSS
  • 56. (av) Ayer Viernes Validemos Automática - Varios :( - Sin imágenes - Sin CSS - Verificar HTML - Verificar CSS
  • 57. (av) Ayer Viernes Validemos Automática - Varios :( - Sin imágenes :( - Sin CSS - Verificar HTML - Verificar CSS
  • 58. (av) Ayer Viernes Validemos Automática - Varios :( - Sin imágenes :( - Sin CSS :) - Verificar HTML - Verificar CSS
  • 59. (av) Ayer Viernes Validemos Automática - Varios :( - Sin imágenes :( - Sin CSS :) - Verificar HTML :( - Verificar CSS
  • 60. (av) Ayer Viernes Validemos Automática - Varios :( - Sin imágenes :( - Sin CSS :) - Verificar HTML :( - Verificar CSS :(
  • 61. (av) Ayer Viernes Validemos Manual Pauta 1 Proporcione alternativas equivalentes para el contenido visual y auditivo - Proporcione un contenido que, presentado al usuario, cumpla esencialmente la misma función o propósito que el contenido visual o auditivo. 1.1 Proporcione un texto equivalente para todo elemento no textual Por ejemplo, en HTML: 1.2 Proporcione vínculos redundantes en formato texto para cada zona activa de un mapa de imagen del servidor. [Prioridad 1] 1.3 Hasta que las aplicaciones de usuario puedan leer automáticamente el texto equivalente de la banda visual, proporcione una descripción auditiva de la información importante de la pista visual de una presentación multimedia [Prioridad 1] 1.4 Para toda presentación multimedia tempodependiente (Por ejemplo, una película o animación) sincronice alternativas equivalentes (Por ejemplo, subtítulos o descripciones de la banda visual) con la presentación. [Prioridad 1] 1.5 Hasta que las aplicaciones de usuario interpreten el texto equivalente para los vínculos de los mapas de imagen de cliente, proporcione vínculos de texto redundantes para cada zona activa del mapa de imagen de cliente. [Prioridad 3] - Ejemplos - Técnicas HTML - Técnicas CSS Verificar punto por punto ¿Aplica? Aplicar :) Ejemplo
  • 62. (av) Ayer Viernes Recursos Información oficial - W3C España http://www.w3c.es / - Introducción a la Accesibilidad http://www.w3c.es /Traducciones/es/WAI/intro/accessibility - SIDAR http://w ww.sidar.org/que/ge/cs.php - Accesibilidad e Internet www.inclusio ndigital.net/albergue/accesibilida d.pdf - http://www.discapnet.es/web_accesible/wcag10/WAI-WEBCO NTENT-19990505_es.html - http://usuarios.discapnet. es/disweb2000/PautaWAI/LPVWCAG10.htmTAW Extenciones d e FireFox - WebDeveloper - WAVE - Accesibility Validadores - HERA http://ww w.sidar.org/ - Examinator http://www.accesible.com.ar/examinator - Validador d e HTML http://validator.w3.org/ - V alidador de CSS http://jigsa w.w3.org/css-validator/ - TAW Test de Accesiblidad Web http://www.tawdis.net/
  • 63. (av) Ayer Viernes Desarrollado por personas
  • 64. (av) Ayer Viernes ®2008 Ayerviernes S.A. Muchas Gracias :) Darcy Vergara - Pedro Arellano - Maximiliano Martin AyerViernes Marzo - 2008 Ayer Viernes www.darcy.cl - pedroarellano.wordpress.com - www.maximili ano.cl www.ayerviernes.com