SlideShare una empresa de Scribd logo
1 de 26
usabilidad
Jon Ander Garcia Alberro
CICLO SUPERIOR DE GRÁFICA PUBLICITARIA
Usandizaga Diseño
MEDIOS INFORMÁTICOS II
definición
Jakob Nielsen definió la usabilidad como el atributo de calidad que
mide lo fáciles que son de usar las interfaces Web.
El neologismo usabilidad 1 2 (del inglés usability -facilidad de uso-)
se refiere a la facilidad con que las personas pueden utilizar una
herramienta particular o cualquier otro objeto fabricado por
humanos con el fin de alcanzar un objetivo concreto. La usabilidad
también puede referirse al estudio de los principios que hay tras la
eficacia percibida de un objeto.
http://es.wikipedia.org/wiki/Usabilidad
10 reglas Jakob Nielsen
1. Visibilidad del estado del sistema: el sistema siempre debería mantener informados a los usuarios de lo que
está ocurriendo, a través de retroalimentación apropiada dentro de un tiempo razonable.
2. Relación entre el sistema y el mundo real: el sistema debería hablar el lenguaje de los usuarios mediante
palabras, frases y conceptos que sean familiares al usuario, más que con términos relacionados con el sistema.
Seguir las convenciones del mundo real, haciendo que la información aparezca en un orden natural y lógico.
3. Control y libertad del usuario: hay ocasiones en que los usuarios elegirán las funciones del sistema por error y
necesitarán una “salida de emergencia” claramente marcada para dejar el estado no deseado al que
accedieron, sin tener que pasar por una serie de pasos. Se deben apoyar las funciones de deshacer y rehacer.
4. Consistencia y estándares: los usuarios no deberían cuestionarse si acciones, situaciones o palabras diferentes
significan en realidad la misma cosa; siga las convenciones establecidas.
5. Prevención de errores: mucho mejor que un buen diseño de mensajes de error es realizar un diseño cuidadoso
que prevenga la ocurrencia de problemas.
6. Reconocimiento antes que recuerdo: se deben hacer visibles los objetos, acciones y opciones, El usuario no
tendría que recordar la información que se le da en una parte del proceso, para seguir adelante. Las
instrucciones para el uso del sistema deben estar a la vista o ser fácilmente recuperables cuando sea necesario.
7. Flexibilidad y eficiencia de uso: la presencia de aceleradores, que no son vistos por los usuarios
novatos, puede ofrecer una interacción más rápida a los usuarios expertos que la que el sistema puede proveer
a los usuarios de todo tipo. Se debe permitir que los usuarios adapte el sistema para usos frecuentes.
8. Estética y diseño minimalista: los diálogos no deben contener información que es irrelevante o poco usada.
Cada unidad extra de información en un diálogo, compite con las unidades de información relevante y
disminuye su visibilidad relativa.
9. Ayudar a los usuarios a reconocer, diagnosticar y recuperarse de errores: los mensajes de error se deben
entregar en un lenguaje claro y simple, indicando en forma precisa el problema y sugerir una solución
constructiva al problema.
10.Ayuda y documentación: incluso en los casos en que el sistema pueda ser usado sin documentación, podría ser
necesario ofrecer ayuda y documentación. Dicha información debería ser fácil de buscar, estar enfocada en las
tareas del usuario, con una lista concreta de pasos a desarrollar y no ser demasiado extensa.
visibilidad del
estado del sistema
1
http://www.bubole.pl/
http://preloaders.net/
relación entre el
sistema y el mundo real
2
http://lockerz.com/404
control y libertad
de usuario
3
http://www.eatingtools.com/
consistencia y
estandares
4
http://vimeo.com/37848135
prevención de
errores
5
http://www.apple.com/es/
reconocimiento antes
que recuerdo
6
http://https://vimeo.com//
flexibilidad y
eficiencia de uso
7
estética y diseño
minimalista
8
http://redantler.com/
ayudar a los usuarios a
reconocer, diagnosticar y
recuperarse de errores
9
https://www.getdropbox.com/404
ayuda y
documentación
10
https://delicious.com/help/

Más contenido relacionado

Similar a Web usabilidad

Brevísima introducción a la Usabilidad
Brevísima introducción a la UsabilidadBrevísima introducción a la Usabilidad
Brevísima introducción a la UsabilidadJon Eguiluz
 
Interfaces graficas de usuario
Interfaces graficas de usuarioInterfaces graficas de usuario
Interfaces graficas de usuarioosni2
 
Usabilidad: del Dicho al Hecho.
Usabilidad: del Dicho al Hecho.Usabilidad: del Dicho al Hecho.
Usabilidad: del Dicho al Hecho.Natalia Vivas
 
Taller UX: Evaluaciones heurísticas
Taller UX: Evaluaciones heurísticasTaller UX: Evaluaciones heurísticas
Taller UX: Evaluaciones heurísticasIxDA Mendoza
 
Diseño de interfaces de usuario
Diseño de interfaces de usuarioDiseño de interfaces de usuario
Diseño de interfaces de usuarioDiego Rosas
 
10 principios diseño_usabilidad_web
10 principios diseño_usabilidad_web10 principios diseño_usabilidad_web
10 principios diseño_usabilidad_webartomagna
 
Test práctico heurístico para la evaluación de interfaces
Test práctico heurístico para la evaluación de interfacesTest práctico heurístico para la evaluación de interfaces
Test práctico heurístico para la evaluación de interfacesSuu Bañares
 
Usabilidad
UsabilidadUsabilidad
UsabilidadCirilus
 
Calidad de software - usabilidad y accesibilidad
Calidad de software - usabilidad y accesibilidadCalidad de software - usabilidad y accesibilidad
Calidad de software - usabilidad y accesibilidadRodrigo Ronda
 
Documento usabilidad
Documento usabilidadDocumento usabilidad
Documento usabilidaddanamato
 

Similar a Web usabilidad (20)

Brevísima introducción a la Usabilidad
Brevísima introducción a la UsabilidadBrevísima introducción a la Usabilidad
Brevísima introducción a la Usabilidad
 
Interfaces graficas de usuario
Interfaces graficas de usuarioInterfaces graficas de usuario
Interfaces graficas de usuario
 
Principios heurísticos de Nielsen (Trabajo)
Principios heurísticos de Nielsen (Trabajo)Principios heurísticos de Nielsen (Trabajo)
Principios heurísticos de Nielsen (Trabajo)
 
Diseno de interfaces zyndi.pptx
Diseno de interfaces zyndi.pptxDiseno de interfaces zyndi.pptx
Diseno de interfaces zyndi.pptx
 
Usabilidad: del Dicho al Hecho.
Usabilidad: del Dicho al Hecho.Usabilidad: del Dicho al Hecho.
Usabilidad: del Dicho al Hecho.
 
Taller UX: Evaluaciones heurísticas
Taller UX: Evaluaciones heurísticasTaller UX: Evaluaciones heurísticas
Taller UX: Evaluaciones heurísticas
 
Heurística
HeurísticaHeurística
Heurística
 
Interfaces de usuario
Interfaces de usuarioInterfaces de usuario
Interfaces de usuario
 
Diseño de interfaces de usuario
Diseño de interfaces de usuarioDiseño de interfaces de usuario
Diseño de interfaces de usuario
 
10 principios diseño_usabilidad_web
10 principios diseño_usabilidad_web10 principios diseño_usabilidad_web
10 principios diseño_usabilidad_web
 
USABILIDAD.pptx
USABILIDAD.pptxUSABILIDAD.pptx
USABILIDAD.pptx
 
Usabilidad
UsabilidadUsabilidad
Usabilidad
 
Test práctico heurístico para la evaluación de interfaces
Test práctico heurístico para la evaluación de interfacesTest práctico heurístico para la evaluación de interfaces
Test práctico heurístico para la evaluación de interfaces
 
Usabilidad
UsabilidadUsabilidad
Usabilidad
 
Gui
GuiGui
Gui
 
Gui
GuiGui
Gui
 
Gui
GuiGui
Gui
 
Calidad de software - usabilidad y accesibilidad
Calidad de software - usabilidad y accesibilidadCalidad de software - usabilidad y accesibilidad
Calidad de software - usabilidad y accesibilidad
 
Documento usabilidad
Documento usabilidadDocumento usabilidad
Documento usabilidad
 
Usabilidad
UsabilidadUsabilidad
Usabilidad
 

Último

Medición IRI Diseño de Pavimentos Maestria en Vias Terrestres
Medición IRI Diseño de Pavimentos Maestria en Vias TerrestresMedición IRI Diseño de Pavimentos Maestria en Vias Terrestres
Medición IRI Diseño de Pavimentos Maestria en Vias TerrestresKengYoshiIngaOchoa1
 
Arquitectura antigua. Salazar Alejandra.pdf
Arquitectura antigua. Salazar Alejandra.pdfArquitectura antigua. Salazar Alejandra.pdf
Arquitectura antigua. Salazar Alejandra.pdfsalazar1611ale
 
La arquitectura griega y su legado en la historia
La arquitectura griega y su legado en la historiaLa arquitectura griega y su legado en la historia
La arquitectura griega y su legado en la historiaCamilaIsabelaRodrigu
 
Anatomia.pfd29382819292829191929292929292929
Anatomia.pfd29382819292829191929292929292929Anatomia.pfd29382819292829191929292929292929
Anatomia.pfd29382819292829191929292929292929FiorellaLaura2
 
Revista_de_Bioarquitectura_y_Construccio.pdf
Revista_de_Bioarquitectura_y_Construccio.pdfRevista_de_Bioarquitectura_y_Construccio.pdf
Revista_de_Bioarquitectura_y_Construccio.pdfANGELEMMANUELALBAAPA
 
LANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDA
LANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDALANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDA
LANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDAdiawaraplast
 
El cómic es algo serio: investigación sobre la realidad latinoamericana de la...
El cómic es algo serio: investigación sobre la realidad latinoamericana de la...El cómic es algo serio: investigación sobre la realidad latinoamericana de la...
El cómic es algo serio: investigación sobre la realidad latinoamericana de la...mariaclaramb
 
Diagramas de flujo metalurgico en mineria.pptx
Diagramas de flujo metalurgico en mineria.pptxDiagramas de flujo metalurgico en mineria.pptx
Diagramas de flujo metalurgico en mineria.pptxHarryArmandoLazaroBa
 
Que es la arquitectura griega? Hecho por Andrea varela, arquitectura iv.pdf
Que es la arquitectura griega? Hecho por Andrea varela, arquitectura iv.pdfQue es la arquitectura griega? Hecho por Andrea varela, arquitectura iv.pdf
Que es la arquitectura griega? Hecho por Andrea varela, arquitectura iv.pdfandrea Varela
 
Triptico de Sistemas anticaídas Arnes.pdf
Triptico de Sistemas anticaídas Arnes.pdfTriptico de Sistemas anticaídas Arnes.pdf
Triptico de Sistemas anticaídas Arnes.pdfMariaGabrielaSandova2
 
La Modernidad y Arquitectura Moderna - Rosibel Velásquez
La Modernidad y Arquitectura Moderna - Rosibel VelásquezLa Modernidad y Arquitectura Moderna - Rosibel Velásquez
La Modernidad y Arquitectura Moderna - Rosibel VelásquezRosibelVictoriaVelas
 
Portafolio de Diseño Gráfico por Giorgio B Huizinga
Portafolio de Diseño Gráfico por Giorgio B HuizingaPortafolio de Diseño Gráfico por Giorgio B Huizinga
Portafolio de Diseño Gráfico por Giorgio B Huizingagbhuizinga2000
 
Manual de Normas APA 7ma edición (1).pdf
Manual de Normas APA 7ma edición (1).pdfManual de Normas APA 7ma edición (1).pdf
Manual de Normas APA 7ma edición (1).pdfsteevensnodamartel
 
Danielarora Martinez 31061614 ARQUITECTURA GRIEGA.pptx
Danielarora Martinez 31061614 ARQUITECTURA GRIEGA.pptxDanielarora Martinez 31061614 ARQUITECTURA GRIEGA.pptx
Danielarora Martinez 31061614 ARQUITECTURA GRIEGA.pptxaurorialfonzo6
 
MARIA ZABALA HISTORIA DE LA ARQUITECTURA II, ARQUITECTURA RENACENTISTA.pdf
MARIA ZABALA HISTORIA DE LA ARQUITECTURA II, ARQUITECTURA RENACENTISTA.pdfMARIA ZABALA HISTORIA DE LA ARQUITECTURA II, ARQUITECTURA RENACENTISTA.pdf
MARIA ZABALA HISTORIA DE LA ARQUITECTURA II, ARQUITECTURA RENACENTISTA.pdfitssmalexa
 
Andada_Pullally_Alicahue_2021_(Comprimido)_-_Nicolás_Dragaš.pdf
Andada_Pullally_Alicahue_2021_(Comprimido)_-_Nicolás_Dragaš.pdfAndada_Pullally_Alicahue_2021_(Comprimido)_-_Nicolás_Dragaš.pdf
Andada_Pullally_Alicahue_2021_(Comprimido)_-_Nicolás_Dragaš.pdfalguien92
 
PRESENTACION DE LA ARQUITECTURA GRIEGA (EDAD ANTIGUA)
PRESENTACION DE LA ARQUITECTURA GRIEGA (EDAD ANTIGUA)PRESENTACION DE LA ARQUITECTURA GRIEGA (EDAD ANTIGUA)
PRESENTACION DE LA ARQUITECTURA GRIEGA (EDAD ANTIGUA)lemg25102006
 
Clase 8. Caracteristicas de la población.pptx
Clase 8. Caracteristicas de la población.pptxClase 8. Caracteristicas de la población.pptx
Clase 8. Caracteristicas de la población.pptxVanessaPobletePoblet
 
Plano de diseño de una Planta de tratamiento de aguas PTAP
Plano de diseño de una Planta de tratamiento de aguas  PTAPPlano de diseño de una Planta de tratamiento de aguas  PTAP
Plano de diseño de una Planta de tratamiento de aguas PTAPjuanrincon129309
 
Croquis de Hospital general (Ficticio) con señalizaciones de seguridad
Croquis de Hospital general (Ficticio) con señalizaciones de seguridadCroquis de Hospital general (Ficticio) con señalizaciones de seguridad
Croquis de Hospital general (Ficticio) con señalizaciones de seguridadratc070603hmcmrha7
 

Último (20)

Medición IRI Diseño de Pavimentos Maestria en Vias Terrestres
Medición IRI Diseño de Pavimentos Maestria en Vias TerrestresMedición IRI Diseño de Pavimentos Maestria en Vias Terrestres
Medición IRI Diseño de Pavimentos Maestria en Vias Terrestres
 
Arquitectura antigua. Salazar Alejandra.pdf
Arquitectura antigua. Salazar Alejandra.pdfArquitectura antigua. Salazar Alejandra.pdf
Arquitectura antigua. Salazar Alejandra.pdf
 
La arquitectura griega y su legado en la historia
La arquitectura griega y su legado en la historiaLa arquitectura griega y su legado en la historia
La arquitectura griega y su legado en la historia
 
Anatomia.pfd29382819292829191929292929292929
Anatomia.pfd29382819292829191929292929292929Anatomia.pfd29382819292829191929292929292929
Anatomia.pfd29382819292829191929292929292929
 
Revista_de_Bioarquitectura_y_Construccio.pdf
Revista_de_Bioarquitectura_y_Construccio.pdfRevista_de_Bioarquitectura_y_Construccio.pdf
Revista_de_Bioarquitectura_y_Construccio.pdf
 
LANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDA
LANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDALANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDA
LANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDA
 
El cómic es algo serio: investigación sobre la realidad latinoamericana de la...
El cómic es algo serio: investigación sobre la realidad latinoamericana de la...El cómic es algo serio: investigación sobre la realidad latinoamericana de la...
El cómic es algo serio: investigación sobre la realidad latinoamericana de la...
 
Diagramas de flujo metalurgico en mineria.pptx
Diagramas de flujo metalurgico en mineria.pptxDiagramas de flujo metalurgico en mineria.pptx
Diagramas de flujo metalurgico en mineria.pptx
 
Que es la arquitectura griega? Hecho por Andrea varela, arquitectura iv.pdf
Que es la arquitectura griega? Hecho por Andrea varela, arquitectura iv.pdfQue es la arquitectura griega? Hecho por Andrea varela, arquitectura iv.pdf
Que es la arquitectura griega? Hecho por Andrea varela, arquitectura iv.pdf
 
Triptico de Sistemas anticaídas Arnes.pdf
Triptico de Sistemas anticaídas Arnes.pdfTriptico de Sistemas anticaídas Arnes.pdf
Triptico de Sistemas anticaídas Arnes.pdf
 
La Modernidad y Arquitectura Moderna - Rosibel Velásquez
La Modernidad y Arquitectura Moderna - Rosibel VelásquezLa Modernidad y Arquitectura Moderna - Rosibel Velásquez
La Modernidad y Arquitectura Moderna - Rosibel Velásquez
 
Portafolio de Diseño Gráfico por Giorgio B Huizinga
Portafolio de Diseño Gráfico por Giorgio B HuizingaPortafolio de Diseño Gráfico por Giorgio B Huizinga
Portafolio de Diseño Gráfico por Giorgio B Huizinga
 
Manual de Normas APA 7ma edición (1).pdf
Manual de Normas APA 7ma edición (1).pdfManual de Normas APA 7ma edición (1).pdf
Manual de Normas APA 7ma edición (1).pdf
 
Danielarora Martinez 31061614 ARQUITECTURA GRIEGA.pptx
Danielarora Martinez 31061614 ARQUITECTURA GRIEGA.pptxDanielarora Martinez 31061614 ARQUITECTURA GRIEGA.pptx
Danielarora Martinez 31061614 ARQUITECTURA GRIEGA.pptx
 
MARIA ZABALA HISTORIA DE LA ARQUITECTURA II, ARQUITECTURA RENACENTISTA.pdf
MARIA ZABALA HISTORIA DE LA ARQUITECTURA II, ARQUITECTURA RENACENTISTA.pdfMARIA ZABALA HISTORIA DE LA ARQUITECTURA II, ARQUITECTURA RENACENTISTA.pdf
MARIA ZABALA HISTORIA DE LA ARQUITECTURA II, ARQUITECTURA RENACENTISTA.pdf
 
Andada_Pullally_Alicahue_2021_(Comprimido)_-_Nicolás_Dragaš.pdf
Andada_Pullally_Alicahue_2021_(Comprimido)_-_Nicolás_Dragaš.pdfAndada_Pullally_Alicahue_2021_(Comprimido)_-_Nicolás_Dragaš.pdf
Andada_Pullally_Alicahue_2021_(Comprimido)_-_Nicolás_Dragaš.pdf
 
PRESENTACION DE LA ARQUITECTURA GRIEGA (EDAD ANTIGUA)
PRESENTACION DE LA ARQUITECTURA GRIEGA (EDAD ANTIGUA)PRESENTACION DE LA ARQUITECTURA GRIEGA (EDAD ANTIGUA)
PRESENTACION DE LA ARQUITECTURA GRIEGA (EDAD ANTIGUA)
 
Clase 8. Caracteristicas de la población.pptx
Clase 8. Caracteristicas de la población.pptxClase 8. Caracteristicas de la población.pptx
Clase 8. Caracteristicas de la población.pptx
 
Plano de diseño de una Planta de tratamiento de aguas PTAP
Plano de diseño de una Planta de tratamiento de aguas  PTAPPlano de diseño de una Planta de tratamiento de aguas  PTAP
Plano de diseño de una Planta de tratamiento de aguas PTAP
 
Croquis de Hospital general (Ficticio) con señalizaciones de seguridad
Croquis de Hospital general (Ficticio) con señalizaciones de seguridadCroquis de Hospital general (Ficticio) con señalizaciones de seguridad
Croquis de Hospital general (Ficticio) con señalizaciones de seguridad
 

Web usabilidad

  • 1. usabilidad Jon Ander Garcia Alberro CICLO SUPERIOR DE GRÁFICA PUBLICITARIA Usandizaga Diseño MEDIOS INFORMÁTICOS II
  • 3. Jakob Nielsen definió la usabilidad como el atributo de calidad que mide lo fáciles que son de usar las interfaces Web. El neologismo usabilidad 1 2 (del inglés usability -facilidad de uso-) se refiere a la facilidad con que las personas pueden utilizar una herramienta particular o cualquier otro objeto fabricado por humanos con el fin de alcanzar un objetivo concreto. La usabilidad también puede referirse al estudio de los principios que hay tras la eficacia percibida de un objeto. http://es.wikipedia.org/wiki/Usabilidad
  • 4. 10 reglas Jakob Nielsen
  • 5. 1. Visibilidad del estado del sistema: el sistema siempre debería mantener informados a los usuarios de lo que está ocurriendo, a través de retroalimentación apropiada dentro de un tiempo razonable. 2. Relación entre el sistema y el mundo real: el sistema debería hablar el lenguaje de los usuarios mediante palabras, frases y conceptos que sean familiares al usuario, más que con términos relacionados con el sistema. Seguir las convenciones del mundo real, haciendo que la información aparezca en un orden natural y lógico. 3. Control y libertad del usuario: hay ocasiones en que los usuarios elegirán las funciones del sistema por error y necesitarán una “salida de emergencia” claramente marcada para dejar el estado no deseado al que accedieron, sin tener que pasar por una serie de pasos. Se deben apoyar las funciones de deshacer y rehacer. 4. Consistencia y estándares: los usuarios no deberían cuestionarse si acciones, situaciones o palabras diferentes significan en realidad la misma cosa; siga las convenciones establecidas. 5. Prevención de errores: mucho mejor que un buen diseño de mensajes de error es realizar un diseño cuidadoso que prevenga la ocurrencia de problemas. 6. Reconocimiento antes que recuerdo: se deben hacer visibles los objetos, acciones y opciones, El usuario no tendría que recordar la información que se le da en una parte del proceso, para seguir adelante. Las instrucciones para el uso del sistema deben estar a la vista o ser fácilmente recuperables cuando sea necesario. 7. Flexibilidad y eficiencia de uso: la presencia de aceleradores, que no son vistos por los usuarios novatos, puede ofrecer una interacción más rápida a los usuarios expertos que la que el sistema puede proveer a los usuarios de todo tipo. Se debe permitir que los usuarios adapte el sistema para usos frecuentes. 8. Estética y diseño minimalista: los diálogos no deben contener información que es irrelevante o poco usada. Cada unidad extra de información en un diálogo, compite con las unidades de información relevante y disminuye su visibilidad relativa. 9. Ayudar a los usuarios a reconocer, diagnosticar y recuperarse de errores: los mensajes de error se deben entregar en un lenguaje claro y simple, indicando en forma precisa el problema y sugerir una solución constructiva al problema. 10.Ayuda y documentación: incluso en los casos en que el sistema pueda ser usado sin documentación, podría ser necesario ofrecer ayuda y documentación. Dicha información debería ser fácil de buscar, estar enfocada en las tareas del usuario, con una lista concreta de pasos a desarrollar y no ser demasiado extensa.
  • 9. relación entre el sistema y el mundo real 2
  • 20.
  • 23. ayudar a los usuarios a reconocer, diagnosticar y recuperarse de errores 9