La Usabilidad. Modelo de Proceso de la Ingeniería de
la Usabilidad
Toni Granollers Jesús Lorés GRIHO - Universitat de Lleida
http://www.udl.es http://www.griho.net http://glu.griho.net
Usabilidad
Contenido
l
Usabilidad
l
¿qué es la Usabilidad?
l
¿qué es un sistema Usable?
l
Importancia de la Usabilidad
l
Beneficios
l
Modelo de Proceso para la Ingeniería de la Usabilidad
l
Explicación del método
l
Ejemplo: web del Centre Excursionista de Lleida
http://www.lleida.org/cel
Usabilidad
Definiciones (¿qué es?)
l
Definición coloquial: facilidad de uso, ya sea de una página web, una aplicación informática o
cualquier otro sistema que interactúe con un usuario
l
Definiciones formales:
l
La medida en la que un producto se puede usar por determinados usuarios para conseguir objetivos
específicos con efectividad, eficiencia y satisfacción en un contexto de uso especificado [ISO 9241-11]
l
desarrollo de sistemas fáciles de usar y de aprender [Jenny Preece]
CALIDAD
Usabilidad
Un sistema usable es...
... aquel que es :
l
Funcionalmente correcto (efectividad)
l
Eficiente de usar (eficiencia)
l
Fácil de aprender
l
Fácil de recordar
l
Tolerante a los errores
l
Subjetivamente agradable
(satisfacción)
Usabilidad
l
Los diseñadores y programadores de
aplicaciones NO PODEMOS DECIDIR POR LOS USUARIOS !!!
DISEÑO
CENTRADO en el
USUARIO
Usabilidad
¿Por qué es importante para sitios web?
l
La WEB se está convirtiendo en un elemento clave en el desarrollo de las empresas
l
Las instituciones ofrecen información y servicios a través de la WEB
l
La usabilidad es un factor estratégico
fundamental para conseguir una máximo aprovechamiento de estos recursos
l
Un sitio más fácil de usar=más páginas
vistas
Usabilidad
¿Por qué es importante para sitios web?
l
los usuarios
l
van fácilmente de un sitio a otro
l
solo tardan 1 ó 2 min. para conocer el funcionamiento
l
experimentan la usabilidad de un sitio antes que se hayan comprometido a usarlo y, sobretodo, antes de que hayan pagado nada por ello
l
Es tan fácil ir a cualquier otra parte, que la
competencia de todo el mundo está a un solo
clic [J. Nielsen 2000]
Usabilidad
Beneficios
l
Desarrollo:
l Reducción de costes de producción, mantenimiento y soporte
l
Uso interno:
l Reducción costes de uso
l Sistemas fáciles de usar: mayor productividad y reducen el esfuerzo
l Sistemas difíciles de usar: disminuyen la salud, bienestar y motivación y pueden incrementar el absentismo
l
Ventas:
l Incremento: un producto mas usable permite un mejor marketing
l Producto de mejor calidad à aplicaciones más competitivas.
l Menor soporte al cliente
Usabilidad
Ingeniería de la usabilidad
l
Metodología que proporciona la manera de proceder organizadamente para
incluir la usabilidad en el desarrollo de aplicaciones interactivas
“Usability Engineering: scenario-based development of HCI” [Rosson & Carroll, 2002]
“designing web sites that work USABILITY FOR THE WEB” [T. Brink et. al., 2002]
“The Usability Engineering Lifecycle” [D. Mayhew, 1999]
“Usability Engineering”
[J. Nielsen, 1994]
Usabilidad
Ingeniería de la usabilidad
l
Es importante utilizar la Ingeniería de Software
l
Utilizar un modelo de proceso para sistemas interactivos
l
Es importante considerar en el proceso la usabilidad desde un principio
l
Debe realizarse un Diseño Centrado el
Usuario
Modelo de Proceso
l
Estrategia de desarrollo
[Pressman,97]
l
Es un conjunto de actividades y resultados asociados que producen un producto de software
[Sommerville, 96]
Ingeniería del Software
Análisis de Requisitos
Objetivos
Ingeniería de la usabilidad. Modelo de Proceso
1ª fase: Identificar las necesidades del cliente, las características del
producto para cumplir estas necesidades y una estimación y planificación preliminar de los recursos que se necesitan para hacer el producto
2ª fase:
l Identificar los requisitos hardware y software necesarios para
implementar el producto
especificado en el documento
l Identificar y obtener los recursos (horas desarrollo, software,
hardware y planificación) necesarios para construir y probar el sistema.
l Planificación detallada
Contrato con el cliente
Análisis de Requisitos
l
Resultados
l
Especificación del sistema firmado
l
Planificación y presupuesto preliminar revisados
l
Planificación y presupuesto de la fase II revisados por el jefe (responsable) de
desarrollo del proyecto
Ingeniería de la usabilidad. Modelo de Proceso
1ª fase: Especificación del
producto y planificación
preliminar
Análisis de Requisitos
l Entregables
l Prototipo/s (opcional)
l Especificaciones de requerimientos funcionales del software. (SRD)
l Plan de desarrollo del software. (SPD)
l Planificación y costes de los desarrolladores
l Plan de documentación
l Plan de test del sistema
l Resultados
l Documento de especificaciones del software firmado
l Plan de desarrollo del producto firmado
Ingeniería de la usabilidad. Modelo de Proceso
2ª fase: Planificación detallada y especificación de la
ingeniería
Análisis de Requisitos
l
Objetivos de la Aplicación
l
Análisis Etnográfico
l
Análisis de los Implicados (stakeholders)
l
Perfil de Usuario
l
Análisis Contextual de Tareas
l
Actores, Roles y Organización
l
Listas de Tareas
l
Objetos
l
Plataforma
l
Perfil del Entorno
l
Objetivos de la Usabilidad
Ingeniería de la usabilidad. Modelo de
Proceso
Arquitectura de la Información
Peter Morville's Iceberg Diagram
Usuarios
Arquitectos de la
Información
Análisis de Requisitos
l
WEB:
l Audiencia
l Análisis
l Escenarios
l Análisis de la diversidad
l Redes Sociales
l Necesidades del usuario
l Metas y objetivos
§ Motivación
§ ¿para qué?
§ ¿a quién va dirigido?
l Objetivos de usabilidad
l Análisis de la competencia
l Exploración
l Medida del éxito
l Contenidos de la A.I.
l Contexto de la A.I.
Ingeniería de la usabilidad. Modelo de
Proceso
Diseño
l
FUNCIONAL
l
INTERFAZ
l
BASES DATOS
Ingeniería de la usabilidad. Modelo de Proceso
l
Entregables
l
Documento de diseño del software
l
Resultados
l
Documento de diseño del
software, aprobación del jefe
de proyecto
Diseño
l
Análisis de Tareas.
l
Modelo Conceptual.
l
Definir Estilo.
l Estándares Generales.
l Metáforas.
l Colores.
l Estándares Particulares.
l
Diseño Detallado.
Ingeniería de la usabilidad. Modelo de
Proceso
Diseño
l WEB:
l Arquitectura de la Información
l Análisis y planificación de los contenidos
l Organización de las páginas
l Indicaciones de orientación
l Diseño de la navegación
l “Home Page”
l Contenidos y funcionalidades
l Color
l Tipografía
l Iconos
l Formularios
l Navegación
l Multimedia
Ingeniería de la usabilidad. Modelo de
Proceso
Arquitectura de la Información Desarrollo práctico
1.
Revisa el estado anterior
2.
Evalúa tu contenido
3.
Crea y evalúa el núcleo de tu estructura
4.
Añade atajos, enlaces redundantes y páginas de soporte
5.
Desarrolla y evalúa la barra de navegación y las señales de orientación
6.
Crea las especificaciones finales (detalladas) del diseño
7.
Crea la arquitectura y verifica su implementación
Arquitectura de la Información
Modelos organización de contenidos
Jerárquica: Más común y bien entendida Navegación rápida
Fácil expansión
Lineal: Buena para procesos concretos, historias, listas ordenadas
Matriz: Apropiada para mapas
NO debe reemplazar otras topologías
Malla completa: Navegación rápida
Solo factible para sitios pequeños o secciones de un sitio mayor
Arquitectura de la Información
Modelos organización de contenidos
Arbitraria: Apropiada cuando la estructura no está bien entendida
Buena cuando no hay una centralización
Híbrida: La más común en la práctica
Necesita hacerla muy clara para no confundir a los usuarios
Arquitectura de la Información
Diseño Web
l
Los usuarios no son adivinos:
l
Utilizar estándares
l
enlaces subrayados en azul
l
pestañas y botones
l
Informar al usuario acerca de dónde está
l
Ofrecer guías (1,2 y 3, “te recomendamos ...”)
l
Ofrecer enlaces de contenido
Prototipado
l
Maquetas.
l
Escenarios.
l
Prototipos de Papel.
l
Story Boards.
l
Simuladores.
l
Herramientas de Diagramación.
l
Vídeos.
l
Prototipos software.
Ingeniería de la usabilidad. Modelo de
Proceso
Evaluación (1/2)
l
Inspección:
l Heurística.
l Recorrido Usabilidad Plural.
l Recorrido Cognitivo.
l Estándares.
l
Indagación:
l Observación de Campo.
l Focus Group.
l Entrevistas.
l Logging.
l Estudio de Campo.
l Cuestionarios.
Ingeniería de la usabilidad. Modelo de
Proceso
Evaluación (2/2)
l
Test:
l Medida de las Prestaciones.
l Test Remoto.
l Thinking Aloud.
l Interacción Constructiva.
l Test Retrospectivo.
l Método del Conductor.
Ingeniería de la usabilidad. Modelo de
Proceso
Implementación
Ingeniería de la usabilidad. Modelo de Proceso
l
Codificación
l
Test unitario
l
Integración
l
Test de integración
Implementación
Ingeniería de la usabilidad. Modelo de Proceso
l Entregables
l Producto de software
l Tests unitarios
l Resultados de los tests unitarios
l Test de integración para funcionalidades
l Resultados del test de integración para funcionalidades
l Casos de test a nivel de sistema
l Resultados
l Producto de software
l Tests unitarios y resultados
l Test de integración para funcionalidades y resultados
l Documentación del producto
l Descripción de los casos de test a nivel de sistema
Implementación
l
WEB:
l Escribir para la web
l El texto se ha de redactar de tal manera que soporte las tareas y los objetivos del usuario y se adapta a la audiencia prevista
l HTML, CSS, JSP, ASP, PHP
l Colores de los vínculos
l Posible problema de inconsistencia
l MARCOS à NO
l rompen el modelo unificado de la web
Ingeniería de la usabilidad. Modelo de
Proceso
Arquitectura de la Información
Escribir para la Web
Los usuarios en la Web NO
leen, escanean
l
Conclusiones al principio
l
El titular corto y preciso
l
Tras el titula un breve sumario
l
Si el artículo es largo crear bloques
l
Incluir información sobre el
autor/a, cuando y las fuentes de información.
l
Es recomendable incluir enlaces dentro del texto Omisión de
palabras
innecesarias
Lanzamiento
Ingeniería de la usabilidad. Modelo de Proceso
l
Test de Sistema
l objetivo: Realiza una batería de pruebas completa del
sistema para tener información fiable de que el software cumple los requerimientos de
prestaciones y funcionales pedidos
l
Despliegue
l objetivo: Comprobar que el producto final refleja
perfectamente el producto base
Lanzamiento
Ingeniería de la usabilidad. Modelo de Proceso
l
Test de Sistema
l Entregables
l Resultados del test del sistema
l Informe del test del sistema
l Documento de diseño del software actualizado
l Producto
l Resultados
l Esta fase se cumple cuando el producto de software ha
pasado todos los casos de test del sistema y el documento de diseño de software es
actualizado
Lanzamiento
Ingeniería de la usabilidad. Modelo de Proceso
l
Despliegue
l
Entregables
l
La salida de esta fase es el producto preparado para entregar al cliente
l
Resultados
l
La fase está completada al
entregar el producto
Lanzamiento
l
WEB:
l Pre-lanzamiento:
l Registro del dominio
l Test de tareas
l Test de código
l Test de carga
l Test de sistema
l Lanzamiento:
l Promoción del sitio
§ Control visitas
§ Alta buscadores
§ Enlaces en sitios afines
l Post-lanzamiento:
l NO es MANTENIMIENTO
l Analizar el uso real de la web
Ingeniería de la usabilidad. Modelo de
Proceso
Actividades de Protección
q
Se han realizado varias iteraciones al Modelo de Proceso, recogiendo cada vez con más certeza las necesidades de losusuarios realizando varias propuestas de diseño (se han preparado prototipos y todos han sido convenientemente evaluados).
q
Se han realizado numerosas modificaciones buscando la máxima aproximación al modelo mental de sus usuariosq
Prototipos realizados:Ø Prototipos software Ø Prototipos de papel
Ø Escenificación de l’arquitectura de la información
Web del Centre Excursionista de Lleida
q
Análisis de RequisitosqDiferentes niveles de información (socio/no socio) qSin portada inicial, la primera ya tiene información útil qContenido dinámico
qReferencia a la web del Centenario
qQue se convierta en punto de referencia del excursionismo en general
qAgilidad de consulta (noticias breves con ventanas de ampliación)
qIdioma Catalán, pero dejarlo preparado para una futura internacionalización
Web del Centre Excursionista de Lleida
Web del C.E.L. - Prototipos
Web del C.E.L. - Prototipos
Web del C.E.L. - Prototipos
Web del C.E.L. - Prototipos
Web del C.E.L. - Prototipos
q
Evaluaciones realizadas:Ø Focus Group (grupo de discusión dirigido)
Ø Thinking Aloud con implicados (pensar en voz alta) Ø Thinking Aloud con expertos informáticos
Ø Entrevistas
Ø Recorridos cognitivos Ø Realización de tareas
q
Antes de su lanzamiento definitivo se procederá con una Evaluación Heurística de todo el sitio webWeb del Centre Excursionista de Lleida
Web del Centre Excursionista de Lleida
Arquitectura de la Información
Web del Centre Excursionista de Lleida
Arquitectura de la Información
Web del Centre Excursionista de Lleida
Arquitectura de la Información
Análisi
Requeriments Disseny Implem. Llançam. Prototips Avaluació
Requeriments Funcionals
Anàlisi Implicats Anàlisi Tasques Codificació Prototip S/W Focus Group
Objectius Aplicació Definir Estil (Portal)
Actors, Rols
(Socis, no socis) Redefinir Estil Prototip S/W Thinking Aloud
Perfil usuari (sense portada, Codificació (estil Windows) (implicats)
nivells usuari)
Analitzar Plataforma Llenguatge Programació
Objectius Usabilitat Redefinir estil (pestanyes)
Disseny detallat Prototip S/W
Codificació (pestanyes)
Thinking Aloud (expert informàtic)
Objectius Usabilitat Focus Group
Requeriments Funcionals Mètode Conductor
(estructura, continguts) Redefinir Estil
( metàfores) Prototip paper Entrevista
Disseny detallat
Focus Group Recorregut cognitiu Redefinir Estil
(colors, botons) Arquitectura
Informació Entrevista
Codificació
Prototip S/W
Requeriments Recorregut Cognitiu
(possibles extensions)
Codificació
1a. Versió Final
Presentació en
societat al CEL Realització Tasques
Correccions Usabilitat
Possibles Extensions Codificació Versió Final
Llançament
Web del Centre Excursionista de Lleida
Gestión de la
Configuración Esfuerzo
De
Usabilidad
q
Servidor temporal para probar la tecnología dinámica implementadaq
Contacto permanente por correo-e con el administrador web delCentre para informar de las pruebas realizadas y de los problemas que han ido surgiendo
q
Modificación dinámica de los contenidos del sitio web con casos reales para aproximar al máximo las pruebas con el uso final de la interfazWeb del Centre Excursionista de Lleida
Enlaces
l
Jakob Nielsen
l
http://www.useit.com
l
Cadius
l
http://www.cadius.org
l
Sitio de Eduardo Manchon
l
http://www.ainda.info
l
AIPO (Asociación Interacción Persona-Ordenador)
l
http://www.aipo.es
Bibliografía
l
Lorés,J. Introducción a la Interacción Persona- Ordenador. AIPO (2002)
l
Brinck, Tom (2002). Usability for the Web. Morgan- Kaufman.
l
Lynch, Patrick; Horton, Sarah (2000). Principios básicos de diseño para la creación de sitio WEB.
Gustavo Gili
l
Powell,, Thomas (1998). Web Site Engineering.
Prentice Hall.
l
