clase 6 usabilidad
TRANSCRIPT
Arquitectura de la Información
Fuente:
Especialización en Periodismo Electrónico-Módulo Gestión de Proyectos Multimedia-Universidad Pontificia Bolivariana
Medellín-Colombia – 2008-Autores: Marta Lucía Gómez- Adolfo León Hoyos - Lida Ximena Tabares
LA USABILIDAD
Prof. Reinaldo Pérez León
Fuente:
Especialización en Periodismo Electrónico-Módulo Gestión de Proyectos Multimedia-Universidad Pontificia Bolivariana
Medellín-Colombia – 2008-Autores: Marta Lucía Gómez- Adolfo León Hoyos - Lida Ximena Tabares
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Es el nombre de un grupo de técnicas desarrolladas por los
profesionales de usabilidad para ayudar en la creación
de productos USABLES
Usabilidad - Conceptualización
Es el nombre corto para un proceso de creación de esos
productos, llamado DISEÑO CENTRADO EN EL USUARIO
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Es la capacidad de un producto o servicio de ser comprendido,
aprendido y usado por el usuario final, de forma natural, sin tener que
investigar, ya que está diseñado para que sus elementos estén
ubicados como el usuario las espera
USABILIDAD ES: NO HACER PENSAR AL USUARIO
Usabilidad - Conceptualización
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Es el grado de facilidad de uso de un software o producto web y la
forma como se acomoda a los usuarios
El producto debe ser eficiente, efectivo y que satisfaga las
necesidades específicas
Usability Professionals Association
Según la Asociación de Profesionales de Usabilidad (UPA)
Usabilidad - Conceptualización
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Usabilidad
Las normas de usabilidad datan de 1990 cuando fueron expuestas por
Jakob Nielsen y Rolf Molich en el libro “Evolución Heurística de
interfaces de usuario”.
Se aplica principalmente a los productos y servicios informáticos,
interfaces web y multimedias interactivos.
Rolf Molich
Jakob Nielsen
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Usabilidad
Se aplica a todo producto o servicio,
inclusive hoy se usa
para diseñar y administrar
comunidades virtuales
Debe ser considerada en todo el
desarrollo de un proyecto web,
para evitar errores en la interfaz
gráfica y lograr mejor la calidad del
producto reduciendo costos de
producción, mantenimiento y uso
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Usabilidad
Además se debe entender
que la USABILIDAD es solo
uno de cuatro factores:
Para buscar la usabilidad
se deben entender
conceptos como:
INTERFAZ
GRÁFICA ESTÁNDARES
WEB
ACCESIBILIDAD
FUNCIONALIDAD
VISUALIZACIÓN
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
INTERFAZ GRÁFICA
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Interfaz Gráfica
Es el conjunto de elementos gráficos (ventanas, menús, botones,
animaciones, opciones, imágenes etc.) que permiten la interacción del
usuario con la aplicación (en este caso un servicio web de información)
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Las interfaces gráficas son los elementos que nos permiten comunicarnos con
todos los elementos sin necesidad de aprender cómo navegar en él.
Una interfaz de usuario mal diseñada es un factor que frena el uso
de un servicio de información web.
Interfaz Gráfica
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Características básicas de una buena interfaz :
Evitar errores en la
configuración de las acciones Facilidad de comprensión,
aprendizaje y uso
Representación fija y permanente de
un determinado contexto de acción
(fondo)
El objeto de interés ha de ser de
fácil identificación
Diseño ergonómico mediante el
establecimiento de menús, barras de
acciones e iconos de fácil acceso
Las interacciones se deben basar en
acciones físicas sobre elementos visuales
(iconos, botones, imágenes, barras de
desplazamiento
Las deben ser rápidas y reversibles,
con efectos inmediatos
Existencia de herramientas
de Ayuda y Consulta
Es el conjunto de
conocimientos
científicos
aplicados para que
los productos y
ambientes se
adapten a las
capacidades y
limitaciones físicas
y mentales de la
persona.
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
ESTÁNDAR
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Estándar es usar las herramientas web correctamente:
Son guías para utilizar herramientas que brinden a los sitios la posibilidad
de ser fácilmente mantenidos, extendidos, rediseñados, usados
y comprendidos, debido a la estandarización.
Especificaciones que determinan la manera en que se construye
y funciona a una tecnología en particular.
El uso correcto de las tecnologías, guías y normas disponibles, produce a los
desarrolladores resultados rentables y mayor productividad y competitividad.
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Organizaciones reguladoras
Según la UPA, Usability Professionals’ Association, un estándar es un
conjunto de reglas normalizadas que permite que los elementos
hardware o software que lo utilicen, sean compatibles entre sí.
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Organizaciones reguladoras
Hay organizaciones como la ISO (Organización Internacional de
Estandarización) que han creado normas y guías (ISO 13407) para los
procesos de diseño centrado en el usuario.
También está la ANSI (Instituto Nacional Americano de Estándares)
y la W3C con estándares para los productos en Internet.
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
ACCESIBILIDAD, VISUALIZACIÓN
Y
FUNCIONALIDAD
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Accesibilidad
Es la cualidad que facilita el acceso a toda persona, tenga limitaciones o no
(físicas o técnicas) … Sin acceso no hay usabilidad, o sea que debemos pensar
en la accesibilidad como una condición previa.
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Accesibilidad
Es el acceso universal a la Web, independientemente del tipo de hardware,
software, infraestructura de red, idioma, cultura, localización geográfica y
capacidades de los usuarios.
Por ejemplo una web deja de ser accesible cuando para poder
visualizarla correctamente necesitamos un plugin especial,
un navegador o de un equipo específico.
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Visualización
Lo que ve el usuario también se relaciona con la usabilidad.
Comprende todos los recursos multimediales utilizados para la
comunicación, lo mismo que la utilización adecuada del lenguaje
Si estos recursos no son de calidad propia de la usabilidad, no serán
eficaces: eficientes+efectivos = EFICACES
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Funcionalidad
Si las herramientas no funcionan, no hay usabilidad. Y no hay nada que
decepcione más a un usuario que las fallas técnicas.
Un ícono que no abre, un hipervínculo que no funciona, la lentitud en la carga o
descarga, son desesperantes y terminan afectando negativamente la experiencia
del usuario.
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
OBJETIVOS DE LA
USABILIDAD
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Se refiere al esfuerzo que
requiere recordar un sistema
o producto después de que
se haya aprendido
Que sea fácil
de recordar
como
se usa
Que sea
efectivo
Se refiere a: satisfacer las
necesidades como debe ser
Que sea
eficiente
La forma en que un producto
ayuda a los usuarios a llevar
a cabo sus tareas.
Que sea
seguro
Se refiere a la protección de
condiciones peligrosas y de
situaciones indeseables
Que sea
útil
Se refiere a que el
producto proporciona las
funcionalidades correctas
Que se
pueda
aprender
facilmente
Se refiere al esfuerzo que
requiere aprender a usar un
producto (regla de los 10 min.)
OBJETIVOS
Objetivos
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
PÚBLICO O USUARIO
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Púbico o Usuario
El público o usuario final es quizás el factor más importante que se debe
considerar al iniciar un proyecto que cumpla estándares de usabilidad.
Desde lo comunicacional, siempre se habla de públicos primarios, secundarios y
hasta terciarios. Es decir producimos para el primario (usuario final), pero
también tenemos en cuenta otros públicos.
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Púbico o Usuario
Es necesario investigar varios públicos, además de los usuarios finales,
entre ellos:
Los Prescriptores
que recomendarán para que
utilicen el producto
Los certificadores u
homologadores
Los que avalarán el producto y le darán
credibilidad. Por ejemplo, una entidad certificadora de
calidad.
Los Financiadores:
aquellos que pueden pautar, patrocinar el producto.
El cliente:
La empresa o persona que produce o encarga
el producto
Púbico
o
Usuario
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
CONTEXTO
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Contexto
Para la creación de sitios web existe todo tipo de programas de fácil
manejo y hasta software en línea para usuarios inexpertos
pero, nada asegura el éxito si no cumple ciertas reglas básicas.
El problema de ser encontrado y visto (ubicuidad). Es un problema que tiene
dos partes: Buscabilidad (que sea encontrable) y Visibilidad (que se pueda ver).
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Contexto
VISIBILIDAD
predisposición que tiene un
producto para ser rastreado
en su totalidad por un
buscador
UBICUIDAD
Capacidad de estar presente
en varios lugares al mismo
tiempo
FIDELIDAD
Exactitud o conformidad con la
veracidad de los hechos
ESTÉTICA
relacionada con la esencia y
la percepción de la belleza
y la fealdad
CONTENIDO
Todo documento, imagen,
animación, sonido, video, etc.
que pueden ser transmitido y
ejecutado, a través de un
navegador, en la web.
Cinco claves para contextualizar los sitios web:
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Factores que determinan la usabilidad
Legibilidad: Debe ser fácil para el
usuario leer, ver o escuchar los
contenidos que aparecen en la
pantalla.
1
2
3
4
5
Control: Los usuarios deben sentir que
tienen el control sobre la aplicación, y no al
revés. Apagar la música de fondo o
cambiar cancelar una descarga.
Habilidades: Los usuarios deben sentir que
el sistema apoya, complementa y realza sus
habilidades y experiencias.
Privacidad: El sistema ayuda
a los usuarios a proteger su
información o la de sus clientes.
Protección del trabajo de los usuarios:
Los usuarios deben percibir que la información
que están produciendo es protegida por el
sistema
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Factores que determinan la usabilidad
Un sitio web debe
ajustarse a los usuarios. Éstos no deben sufrir
sobrecarga de información
Un sitio web debe ser consistente en todos los
pasos del proceso.
Interactividad: Qué tanto posibilita la interfaz la interacción
entre el usuario y el sistema
En ningún caso un sitio web puede venirse abajo o producir un
resultado inesperado.
El diseño debe ser simple pero
sin descuidar la estética.
Un sitio web no ha de tratar al usuario de manera hostil.
Reversibilidad. Se refiere a la posibilidad de que el usuario vuelva a la pantalla anterior.
Anticipación. El sistema debe
estar preparado para el próximo
paso del usuario.
Accesibilidad. Las páginas deben
ser accesibles sin importar la
tecnología empleada por el usuario
(navegadores, sistema operativo).
Uso de los colores. Deben ser acordes al tema y al usuario.
Navegabilidad. Los usuarios
deben desplazarse fácilmente por
la interfaz.
Eficiencia del usuario. La interfaz debe promover que el usuario sea
eficiente, alcanzar sus objetivos con un mínimo esfuerzo
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
En la lectura en Internet hay algunas diferencias que es
importante considerar:
Alfabetización. Personas que no leen bien, leen palabra por palabra
y evitan párrafos grandes
La edad influye: Los adolescentes tienen comportamientos definidos y la interactividad es definitiva para ellos.
Los escritos académicos y para los académicos y personas que
quieren investigar más.
Los usuarios no leen todo, especialmente cuando están
buscando algo. Escanean. Algunos pueden leer más, pero la mayoría no
lo hace.
Los dos primeros párrafos deben tener la información más importante y
especialmente el primero
Los subtítulos, viñetas deben contener palabras claves, que puedan leerse
rápidamente en el escaneo vertical. La tercera palabra de una línea se lee menos que las dos
primeras
Proponer el diseño de un SDI para
la producción editorial
Color. Los colores deben utilizarse con gran sentido estético. Hay que conocer
muy bien el comportamiento de los colores (estética, psicología, física del
color, pensar en los daltónicos).
Links textuales deben ir coloreados y subrayados. El azul se ha vuelto
estándar. Los usados deben cambiar de color.
Tamaño. Fuentes suficientemente grandes. No menos de 12 puntos.
Discutan cuando tengan la razón, no se duerman sin tener algo en
qué soñar… nunca piensen que ya lo saben todo… al contrario,
despierta todos los días pensando qué aprenderás… y sobre todo,
recuerda que jamás, jamás dejas de aprender…
USABILIDAD WEB D
ise
ño
y D
iag
ram
ac
ión
: R
ein
ald
o P
ére
z L
eó
n
Diseño, Diagramación y Montaje: Lic. Reinaldo Pérez León
www.tuenlaceweb.com.ve/presentaciones.html
E-mail: [email protected] - 0424-5461944
Prof. Reinaldo Pérez León
Cibergrafía • Dnx. (2008). Consejos prácticos para mejorar la experiencia de usuario de tu página web. En Centro para
Empresas y Profesionales de Microsoft España. Consultado junio 30, 2008 en http://www.microsoft.com/spain/empresas/guias/usabilidad/consejos_practicos.mspx .
• Manchón, Eduardo. (2008). Conferencia sobre usabilidad para comunidades virtuales. Foroitv 2008. Mayo
10-14. Madrid, España. En los siguientes vínculos de Youtube, por partes. Consultado junio 29, 2008 en: http://es.youtube.com/watch?v=4GHPI10aKnc http://es.youtube.com/watch?v=DW47GJu8B7s http://es.youtube.com/watch?v=58Ke8Ew6zkk&feature=related http://es.youtube.com/watch?v=CLD7S-pV7Kk&feature=related http://es.youtube.com/watch?v=CLD7S-pV7Kk y en http://es.youtube.com/user/foroitv y http://www.forodeinternet.com • Nosotras online. Sitio web de Nosotras de Productos Familia. S.A. de Colombia. Consultado en junio 26,
2008 en: http://www.nosotrasonline.com/pragma/documenta/NOL/secciones/NOL/HOME_CO/seccion_HTML.html
• Bancolombia. Sitio web de Grupo Bancolombia. Consultado en junio 26, 2008 en: http://www.grupobancolombia.com/home/index.asp
• Floría Cortés, A. (2000). Pero.. ¿qué es, realmente, la usabilidad? Consultado junio 26,2008 en:
http://www.sidar.org/recur/desdi/traduc/es/visitable/quees/usab.htm
• López Jaquero, V; Montero, F; Molina, J; González, P. (2006) Interfaces de Usuario Inteligentes: Pasado, Presente y Futuro. Consultado junio 26, 2008 en http://www.dsi.uclm.es/personal/VictorManuelLopez/mipagina/archivos/Interaccion2006.pdf
Cibergrafía
• Wikipedia. Usuario. Consulado en junio 28, 2008 En: http://es.wikipedia.org/wiki/Usuario
• Bos, Ber. (2003). What is a good standard? Un ensayo sobre principios para diseñadores de la W3C.
Consultado en junio 28 de, 2008 en: http://www.w3.org/People/Bos/DesignGuide/introduction
• UPA. Usability Professionals' Association. Usabilidad. Consultado en junio 28, 2008 en: http://www.usabilityprofessionals.org/usability_resources/about_usability/index.html
• Informe de Serviweb. Usabilidad y accesibilidad: Conceptos muy diferentes. Consultado junio 26, 2008 en: http://www.desarrolloweb.com/articulos/usabilidad-y-accesibilidad.html
• Londoño, Gloria. (2008). Factores esenciales en el diseño o planeación del contenido de un
producto multimedial-interactivo: Usabilidad, visualización, funcionalidad y accesibilidad. Especialización en Periodismo Electrónico Módulo Gestión de Proyectos Multimedia. Faculta de Comunicaciones. Universidad Pontificia Bolivariana, Medellín, Colombia.
• W3C. About the World Wide Web Consortium (W3C). Consultado en junio 29, 2008 en: http://www.w3.org/Consortium/
Cibergrafía • W3C. Web Accessibility Iniciative. WAI: Estrategias, guías, recursos para hacer la Web accessible a todos
las personas con limitaciones. Consultado en junio 29, 2008 en: http://www.w3.org/WAI/
• JL Orihuela y ML Santos. Guía para el Diseño y Evaluación de Proyectos de Comunicación Digital. Consultado junio 27, 2008 en: http://www.unav.es/digilab/guia/12usuarios.htm
• Ortega Santamaría, Sergio. (2007). Evolución del perfil del usario: Usuarios 2.0 en NSU No solo Usabilidad
Journal. No.6. 28 de mayo de 2007. Consultado junio 26, 2008 en: http://www.nosolousabilidad.com/articulos/usuario20.htm
• Londoño, Gloria. (2008). Gestión de proyectos hipermediales e interactivos. Unidad 2. Planeación. Especialización en Periodismo Electrónico Módulo Gestión de Proyectos Multimedia. Faculta de Comunicaciones. Universidad Pontificia Bolivariana, Medellín, Colombia. Consultado en junio 26, 2008 en: http://digicampus.upb.edu.co/moodle/course/view.php?id=368
• WebEstilo. La estructura. Consultada junio 27, 2008 en: http://www.webestilo.com/guia/estruct1.php3
• WebEstilo. Navegación. Consultado junio 27, 2008 en http://www.webestilo.com/guia/navega.php3
• Yusef Hassan & Francisco J. Martín Fernández & Ghzala Iazza. (2004). Diseño Web Centrado en el Usuario: Usabilidad y Arquitectura de la Información [on line]. "Hipertext.net", núm. 2. ISSN 1695-5498. Consultado junio 27, 2008 en: http://www.hipertext.net/web/pag206.htm#Prototipado
• Ministerio Secretaría General de Gobierno. Gobierno de Chile. (2004). Guía web del
Cibergrafía
• Baeza Yates Ricardo y Rivera Loaiza Cuauhtémoc. Ubicuidad y Usabilidad en la Web. Consultado el 30 de junio de 2008 en: http://www.dcc.uchile.cl/~rbaeza/inf/usabilidad.html
• Maeso Escudero, J; García Delgado, I. Principios ergonómicos aplicados a los sistemas lógicos y al diseño de interfaces “usables” y accesibles. Consultado junio 26, 2008 en http://io.us.es/cio2004/comunicaciones/867-873.pdf
• Abascal, J; Morrión, R. Tendencias en Interacción Persona Computador. Consultado junio 26, 2008 en: http://cabrillo.lsi.uned.es:8080/aepia/Uploads/16/85.pdf
• Martínez, J. Malentendidos Web. Consultado el 26 de junio de 2008 en: http://www.desarrolloweb.com/articulos/1931.php
• Nielsen Norman Group. Estudio de eyetracking. Consultado junio 30, 1008 en:
http://www.useit.com/eyetracking/
• Nielsen, Jacob. Sitio web de Jacob Nielsen. Permite ingresar a sus boletines sobre usabilidad Alertbox. Consultado junio 30, 2008 en: http://www.useit.com/
http://www.useit.com/alertbox/ http://www.useit.com/jakob/ • Microsoft. Uso de tabs para desarrolladores. Consultado junio 30, 2008 en: http://msdn.microsoft.com/en-
us/library/aa511493.aspx#guidelines
• desarrolloweb.com . Usabilidad en la Web. Consultado junio 27, 2008 en: http://www.desarrolloweb.com/manuales/5/
•