I. Diseño de Interfaz de Usuario
-
Upload
viviana-villarreal-cruz -
Category
Documents
-
view
230 -
download
0
Transcript of I. Diseño de Interfaz de Usuario
-
8/3/2019 I. Diseo de Interfaz de Usuario
1/81
425
10011 0010 1010 1101 0001 0100 1011
USABILIDAD
Ingeniera de Software II
-
8/3/2019 I. Diseo de Interfaz de Usuario
2/81
5
425
1
0011 0010 1010 1101 0001 0100 1011Qu es la usabilidad?La usabilidad es la cualidad de un sistema respecto a:
Su facilidad de uso: mltiples formas
de intercambiar informacin entre elusuario y el sistema
Facilidad de aprendizaje:para nuevosusuarios que garantizan interaccin
efectiva y mximas prestaciones
-
8/3/2019 I. Diseo de Interfaz de Usuario
3/81
425
1
0011 0010 1010 1101 0001 0100 1011Qu es la usabilidad?La satisfaccin del usuario:
incluyendo el soporte al
usuario para garantizar lasmetas (robustez)
Rossony Carroll, 2002, Usability Engineering
-
8/3/2019 I. Diseo de Interfaz de Usuario
4/81
425
1
0011 0010 1010 1101 0001 0100 1011
OBJETIVOS DE LA
USABILIDADQue sea efectivo un sistema debe hacer lo que
se supone que hace.
-
8/3/2019 I. Diseo de Interfaz de Usuario
5/81
425
1
0011 0010 1010 1101 0001 0100 1011
OBJETIVOS DE LA
USABILIDADQue sea eficiente
Se refiere a la forma en queun sistema ayuda a los
usuarios a llevar a cabo sus
tareas. qu productividad
tienen los usuarios?
-
8/3/2019 I. Diseo de Interfaz de Usuario
6/81
425
1
0011 0010 1010 1101 0001 0100 1011
OBJETIVOS DE LA
USABILIDADQue sea seguro
Se refiere a que el usuarioest protegido de condiciones
peligrosas y de situaciones
indeseables.
-
8/3/2019 I. Diseo de Interfaz de Usuario
7/81
425
1
0011 0010 1010 1101 0001 0100 1011
OBJETIVOS DE LA
USABILIDADQue sea til
Se refiere a que el sistemaproporciona el tipo de
funcionalidades correctas, de
manera que el usuario puede
hacer lo que necesita y lo
que quiere hacer.
-
8/3/2019 I. Diseo de Interfaz de Usuario
8/81
425
1
0011 0010 1010 1101 0001 0100 1011
OBJETIVOS DE LA
USABILIDADQue se pueda aprenderfcilmente
Se refiere al esfuerzo que
requiere aprender a usar un
sistema (regla de los 10
minutos).
-
8/3/2019 I. Diseo de Interfaz de Usuario
9/81
425
1
0011 0010 1010 1101 0001 0100 1011
OBJETIVOS DE LA
USABILIDADQue sea fcil de recordar comose usa
Se refiere al esfuerzo que
requiere recordar un sistema
despus de que se haya
aprendido como se usa y no se
haya utilizado durante un
tiempo.
-
8/3/2019 I. Diseo de Interfaz de Usuario
10/81
425
10011 0010 1010 1101 0001 0100 1011
PRINCIPIOS DE
DISEO
-
8/3/2019 I. Diseo de Interfaz de Usuario
11/81
425
1
0011 0010 1010 1101 0001 0100 1011
PRINCIPIOSD
ED
ISEO
Visibilidad
Todos los controles tienen que ser claramente visibles, con una buena
representacin sobre sus efectos
-
8/3/2019 I. Diseo de Interfaz de Usuario
12/81
425
1
0011 0010 1010 1101 0001 0100 1011
PRINCIPIOSD
ED
ISEO
Restricciones
El tipo de interaccin que seproduce en cada momento puede
restringirse (fsicas, lgicas y
culturales).
-
8/3/2019 I. Diseo de Interfaz de Usuario
13/81
425
1
0011 0010 1010 1101 0001 0100 1011
PRINCIPIOSD
ED
ISEO
Coincidencia (mapping)
Los controles tienen que relacionarse con susefectos en el mundo.
-
8/3/2019 I. Diseo de Interfaz de Usuario
14/81
425
1
0011 0010 1010 1101 0001 0100 1011
PRINCIPIOSD
ED
ISEO
Uso (affordance)
Atributo que tienen los objetos que permitensaber como funcionan.
-
8/3/2019 I. Diseo de Interfaz de Usuario
15/81
425
10011 0010 1010 1101 0001 0100 1011
PRINCIPIOS DE
USABILIDAD
-
8/3/2019 I. Diseo de Interfaz de Usuario
16/81
425
1
0011 0010 1010 1101 0001 0100 1011
PRINCIPIOSD
EU
SA
BIL
IDADVisibilidad del estado del sistema
Siempre mantiene al usuario informado sobreque se est haciendo proporcionando unfeedback apropiado en un tiempo razonable.
feedback: ida y vuelta, retroalimentacin
-
8/3/2019 I. Diseo de Interfaz de Usuario
17/81
-
8/3/2019 I. Diseo de Interfaz de Usuario
18/81
425
1
0011 0010 1010 1101 0001 0100 1011
PRINCIPIOSD
EU
SA
BIL
IDADControl del usuario y libertad
Se debe proporcionar a los usuariosmecanismos de escape cuando se llegan asituaciones no deseadas.
-
8/3/2019 I. Diseo de Interfaz de Usuario
19/81
425
1
0011 0010 1010 1101 0001 0100 1011
PRINCIPIOSD
EU
SA
BIL
IDADConsistencia y estandarizacin
Evitar que diferentes palabras, acciones ysituaciones tengan el mismo significado.
-
8/3/2019 I. Diseo de Interfaz de Usuario
20/81
425
1
0011 0010 1010 1101 0001 0100 1011
PRINCIPIOSD
EU
SA
BIL
IDADAyudar a los usuarios a reconocer, diagnosticar y
recuperar la situacin cuando se produce un error
Usar un lenguaje sencillo para describir la
naturaleza del error y sugerir la forma de resolverlo
-
8/3/2019 I. Diseo de Interfaz de Usuario
21/81
425
1
0011 0010 1010 1101 0001 0100 1011
PRINCIPIOSD
EU
SA
BIL
IDADFlexibilidad y eficiencia en el uso
Proporcionar aceleradores que sean invisibles alos novatos
-
8/3/2019 I. Diseo de Interfaz de Usuario
22/81
425
1
0011 0010 1010 1101 0001 0100 1011
PRINCIPIOSD
EU
SA
BIL
IDADAyuda y documentacin
Proporcionar informacin que sepueda alcanzar fcilmente y que
proporcione ayuda siguiendo unos
pasos concretos.
-
8/3/2019 I. Diseo de Interfaz de Usuario
23/81
425
10011 0010 1010 1101 0001 0100 1011
ESTANDARES IURE
Y FACTO
-
8/3/2019 I. Diseo de Interfaz de Usuario
24/81
425
1
0011 0010 1010 1101 0001 0100 1011
Estndares
Los estndares pueden ser:
Locales Nacionales
Internacionales
Un estndar es un requisito, regla o recomendacin basada enprincipios probados y en la prctica. Representa un acuerdo de ungrupo de profesionales oficialmente autorizados a nivel local,nacional o internacional
-
8/3/2019 I. Diseo de Interfaz de Usuario
25/81
425
1
0011 0010 1010 1101 0001 0100 1011
Estndares
El objetivo de los estndares es hacer las cosas ms fciles,
definiendo caractersticas de objetos y sistemas que se utilizan
cotidianamente
Ejemplos: teclado de telfono, teclado QWERTY
Toda la industria funciona con estndares
Ejemplo: Construccin
Tambin la industria informtica
Estndares de pantallas, teclados, conectores, incluso mobiliario Ejemplo: la inclinacin del teclado debe estar entre 0 y 25 grados
-
8/3/2019 I. Diseo de Interfaz de Usuario
26/81
425
1
0011 0010 1010 1101 0001 0100 1011
Estndares de la interfaz
Objetivo: conseguir un software ms fcil y seguro,
estableciendo unos requisitos mnimos de fabricacin,
eliminando inconsistencias y variaciones innecesarias en las
interfaces
-
8/3/2019 I. Diseo de Interfaz de Usuario
27/81
425
1
0011 0010 1010 1101 0001 0100 1011
Beneficios
Una terminologa comn Permite a los diseadores discutir los mismos conceptos y hacer
valoraciones comparativas
El mantenimiento y la evolucin Todos los programas tienen la misma estructura y el mismo estilo
Una identidad comn Lo que hace que todos los sistemas sean fciles de reconocer
Reduccin en la formacin Los conocimientos son ms fciles de transmitir de un sistema a otro
Salud y seguridad Si los sistemas han pasado controles de estndares es difcil que tengan
comportamientos inesperados
-
8/3/2019 I. Diseo de Interfaz de Usuario
28/81
425
1
0011 0010 1010 1101 0001 0100 1011
Clasificacin
Tipos de estndares
Estndares de iure
Estndares de facto
-
8/3/2019 I. Diseo de Interfaz de Usuario
29/81
425
1
0011 0010 1010 1101 0001 0100 1011
Estndares de iure
Son generados porcomits con estatus legal y gozan del
apoyo de un gobierno o institucin para producir estndares
Para hacer un estndarde iure se ha de seguir un proceso
complejo:
Documento preliminar pblico
Enmiendas
Aprobacin (tras cierto tiempo, a veces ao)
Ejemplo: Ansi
C
-
8/3/2019 I. Diseo de Interfaz de Usuario
30/81
425
1
0011 0010 1010 1101 0001 0100 1011
Estndares de iure
Comits
En Informtica tienen estatus legal para definir estndares de iure:
ISO Asociacin Internacional para Estndares
IEC Comisin Electrotcnica Internacional
A NSI Instituto Nacional Americano para Estndares
IEEE Instituto de Ingenieros Elctricos y Electrnicos Americano
CEN Comit Europeo para la Estandarizacin
W3C Consorcio para la World Wide Web
-
8/3/2019 I. Diseo de Interfaz de Usuario
31/81
425
1
0011 0010 1010 1101 0001 0100 1011
Estndares de facto
Son estndares que nacen a partir de productos de la industriaque tienen un gran xito en el mercado o desarrollos hechos
por grupos de investigacin en la Universidad que tienen una
gran difusin Son aceptados como tales por su uso generalizado
Su definicin se encuentra en manuales, libros o artculos
Ejemplos:
Sistema X-Windows
Lenguaje C
Normas CUA
-
8/3/2019 I. Diseo de Interfaz de Usuario
32/81
425
1
0011 0010 1010 1101 0001 0100 1011
Estndares de iure
Los estndares de la interfaz son relativamente recientes
Algunos de los ms importantes son:
ISO/IEC 9126: Evaluacin de productos software: caractersticas de
calidad y directrices para su uso ISO 9241: requisitos ergonmicos para trabajar con terminales de
presentacin visual (VDT)
ISO/IEC 10741: interaccin de dilogos
ISO/IEC 11581: smbolos y funciones de los iconos
ISO 11064: diseo ergonmico de centros de control
ISO 13406: requisitos ergonmicos para trabajar con presentacionesvisuales basadas en paneles planos
ISO 13407: procesos de diseo centrados en la persona para sistemasinteractivos
-
8/3/2019 I. Diseo de Interfaz de Usuario
33/81
425
1
0011 0010 1010 1101 0001 0100 1011
Estndares de iure en IPO
Algunos aspectos cubiertos por la ISO 9241 (requisitosergonmicos para trabajar con terminales de presentacinvisual): R
equisitos de la presentacin visual Requisitos de teclado
Diseo de estaciones de trabajo y requisitos de las posturas
Requisitos para la visualizacin con reflejos
Requisitos para colores visualizados
Requisitos para dispositivos de entrada no-teclado
Principios de dilogos
Presentacin de informacin
Dilogos de mens
Dilogos de manipulacin directa
Dilogos para completar formularios
-
8/3/2019 I. Diseo de Interfaz de Usuario
34/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo
Para asegurar la consistencia de las diferentes partes de unsistema o de una familia de sistemas es fundamental para losdesarrolladores basar sus diseos en un conjunto de principios
y directrices Por este motivo es tan importante para las organizaciones que
desarrollansoftware disponer de una gua que puedan seguirsus desarrolladores
Estas guas se denominan guas de estilo y varan mucho en
sus objetivos
-
8/3/2019 I. Diseo de Interfaz de Usuario
35/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo
Pueden ser de dos tipos: Guas de estilo comerciales
Guas de estilo corporativas
Ventaja: aseguran una mejor usabilidad mediante laconsistencia que imponen
En el lenguaje industrial se hace referencia a las guas de estilocomo el look and feel
-
8/3/2019 I. Diseo de Interfaz de Usuario
36/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo
Guas de estilo comerciales
Son producidas por fabricantes de software y hardware, y sonen general estndares de facto
Apple
Motif OS/2
Windows
Open Look
CDE, Common Desktop Environment
Java
Swing
Contienen directrices que se concretan a muy bajo nivel
CUA
-
8/3/2019 I. Diseo de Interfaz de Usuario
37/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo
Apple (1985)
-
8/3/2019 I. Diseo de Interfaz de Usuario
38/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo
Apple (1985)
-
8/3/2019 I. Diseo de Interfaz de Usuario
39/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo
Apple (1985)
-
8/3/2019 I. Diseo de Interfaz de Usuario
40/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo
Apple (1985)
-
8/3/2019 I. Diseo de Interfaz de Usuario
41/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo
CUA (Common User Access)
Publicadas en 1987 porIBM y Microsoft
Se adoptaron universalmente por la fuerza de IBM (estndar
de facto son las industrias de microsoft e IBM)
Windows, OS/2 y Motif son los estndares ms importantes
que siguen esta norma
-
8/3/2019 I. Diseo de Interfaz de Usuario
42/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo
Motif
OSF (Open Software Foundation)
-
8/3/2019 I. Diseo de Interfaz de Usuario
43/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo
OpenLook
SUN Microsystems y AT&T
-
8/3/2019 I. Diseo de Interfaz de Usuario
44/81
-
8/3/2019 I. Diseo de Interfaz de Usuario
45/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo
Microsoft
-
8/3/2019 I. Diseo de Interfaz de Usuario
46/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo
Java Look and Feel
Java permite la ejecucin de un mismo programa en distintasplataformas utilizando la interfaz grfica correspondiente,gracias al AWT (Abstract Window Toolkit)
Con la aparicin del conjunto de componentes Swing, parte
de las JFC (Java Foundation Classes), se dispone de unaapariencia grfica propia, denominadaMetal
Adems deMetalexisten otras apariencias: Motiflook and feel
Windows look and feel
MacOs look and feel
-
8/3/2019 I. Diseo de Interfaz de Usuario
47/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo
Java Swing
Java Look andFeel
Windows Look andFeel
Motif Look andFeel
MacOS Look andFeel
-
8/3/2019 I. Diseo de Interfaz de Usuario
48/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo
Java Swing
-
8/3/2019 I. Diseo de Interfaz de Usuario
49/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo
Java Swing
-
8/3/2019 I. Diseo de Interfaz de Usuario
50/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo
CUA
Estndarde facto desarrollado porIBM y Microsoft
Define los componentes de la interfaz que deben mantenerse
entre aplicaciones
Objetivos:
Usabilidad y consistencia de la aplicacin
Consistencia entre aplicaciones
-
8/3/2019 I. Diseo de Interfaz de Usuario
51/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo CUA
Sistemas de ventanas
Motif
Windows
OS/2
-
8/3/2019 I. Diseo de Interfaz de Usuario
52/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo CUA
Principios bsicos de diseo
Los usuarios tienen el control del dilogo
Los usuarios tienen que desarrollar un modelo conceptual de lainterfaz
Uso de metforas
Metfora de la sobremesa: los usuarios ven carpetas ydocumentos, no programas y archivos. El sistemaestablece la asociacin datos-programas
Sistema dirigido por el usuario
Consistencia
Hacer la interfaz transparente
-
8/3/2019 I. Diseo de Interfaz de Usuario
53/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo CUA
Modelo grfico
Las aplicaciones comparten la pantalla
Cada una tiene asignada una parte o ventana
Ventana activa: aquella con la que el usuario interacciona
Niveles del modelo grfico:
Presentacin
Acciones
Interaccin
-
8/3/2019 I. Diseo de Interfaz de Usuario
54/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo CUA
Presentacin
Representa el aspecto visual de la interfaz
Las aplicaciones tienen dos tipos de elementos que hay quepresentar:
Objetos
Cualquier cosa que el usuario pueda manipular
Son el centro de atencin del usuario
Acciones
Permiten al usuario crear o manipular objetos
Se realizan mediante combinaciones de mens y cajas de
dilogo
-
8/3/2019 I. Diseo de Interfaz de Usuario
55/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo CUA
Acciones
Mens
Mens desplegables
Mens en cascada (no ms de dos niveles)
-
8/3/2019 I. Diseo de Interfaz de Usuario
56/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo CUA
Acciones
Cajas de dilogo
Presentan/recogen informacin
Ventana mvil de tamao fijo
Aparece durante el procesamientode una accin del usuario, cuando serequiere informacin para completarla
Se utiliza una elipsis (...) tras el nombre del botn oelemento de men que abre la caja
No usan mens. Usan botones para llamar a lasacciones
Botones: confirmar, cancelar, ayuda
-
8/3/2019 I. Diseo de Interfaz de Usuario
57/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo CUA
Acciones
Tipos de cajas de dilogo
No modal(son como filtros)
Permite a los usuarios continuar con su trabajo sincompletar el dilogo
Modal ()
Requiere que los usuarios completen la caja de dilogoantes de continuar
-
8/3/2019 I. Diseo de Interfaz de Usuario
58/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo CUA
Acciones
Caja de mensajes
Es un tipo especial de caja de dilogo que se utilizaexclusivamente para mostrar mensajes a los usuarios
-
8/3/2019 I. Diseo de Interfaz de Usuario
59/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo CUA
Interaccin
Es el nivel a travs del cual los usuarios interaccionan con loscomponentes de la interfaz
Consta de:
Seleccin de objeto
Los usuarios apuntan a un objeto que desean manipular ylo seleccionan de manera visible
Ejecucin de la accin
Se selecciona una opcin de men y si es preciso secompleta con una caja de dilogo
La ejecucin de la accin debe ser visualizada
-
8/3/2019 I. Diseo de Interfaz de Usuario
60/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo CUA
Interaccin
Seleccin de objeto Ejecucin de accin
-
8/3/2019 I. Diseo de Interfaz de Usuario
61/81
-
8/3/2019 I. Diseo de Interfaz de Usuario
62/81
-
8/3/2019 I. Diseo de Interfaz de Usuario
63/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo CUA
Interaccin
nfasis
Trata de realzar la importancia de algunos elementosde interaccin para que el usuario cuando interaccionapueda saber:
Foco de la entrada
Opciones disponibles
Opciones no disponibles
Estado actual de las opciones
-
8/3/2019 I. Diseo de Interfaz de Usuario
64/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo CUA
Interaccin
Tipos de nfasis:
nfasis de cursor
nfasis de seleccin
nfasis de no
disponible nfasis del estado
actual
-
8/3/2019 I. Diseo de Interfaz de Usuario
65/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo CUA
Interaccin
Seleccin
Seleccin con el ratn
Clic, Doble-clic, Mayus+clic, Ctrl+clic, Arrastrar yseleccionar
Seleccin con el teclado
Tabulacin, flechas, Mayus y Ctrl (seleccin), Alt (mens)
-
8/3/2019 I. Diseo de Interfaz de Usuario
66/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo CUA
Interaccin
Acciones comunes
La consistencia en acciones comunes es importantepara reforzar el modelo conceptual del usuario
Existen acciones que son comunes a la mayora de lasaplicaciones, y que CUA define:
Abrir fichero
Imprimir
Tipo de letra
-
8/3/2019 I. Diseo de Interfaz de Usuario
67/81
-
8/3/2019 I. Diseo de Interfaz de Usuario
68/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo CUA
Componentes
Caja de grupo (group box)
Campo de texto (text box)
Caja de lista (list box)
Caja de combinacin (combo box)
-
8/3/2019 I. Diseo de Interfaz de Usuario
69/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo CUA
Componentes
Indicador de progreso
Cambio del puntero
Ventana de progreso de la accin
Control de desplazamiento
-
8/3/2019 I. Diseo de Interfaz de Usuario
70/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo CUA
Ayuda
Permite resolver las dudas de los usuarios
Interaccin
Tecla F1
Seleccionando el botn de ayuda
Seleccionando el men de ayuda
Tipos de ayuda
Ayuda contextual(es como un link)
Tutorial
Glosario
-
8/3/2019 I. Diseo de Interfaz de Usuario
71/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo
Guas de estilo para la Web
Disear para la Web es diferente de disear interfaces deusuario tradicionales
Algunos principios son aplicables pero la Web tiene susparticularidades
Una caracterstica importante de la Web es la falta deinterfaces de usuario comunes. La prioridad es conseguir unainterfaz atractiva, diferente de las otras
Para afrontar este problema varias empresas y organismos hanpublicado sus guas de estilo Web
Apple IBM
Sun
W3C
Yale Center for Advanced Instructional Media
National CancerInstitute (NIC)
-
8/3/2019 I. Diseo de Interfaz de Usuario
72/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo para la Web
Apple, Sun
Apple www.geo.tu-freiberg.de/docs/apple/web_design/intro.html
Sun sut1.sut.ac.th/StyleGuide/Printing_Version.html
-
8/3/2019 I. Diseo de Interfaz de Usuario
73/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo para la Web
IBM
http://www-3.ibm.com/ibm/easy/eou_ext.nsf/publish/572
G d til l W b
-
8/3/2019 I. Diseo de Interfaz de Usuario
74/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo para la Web
W3C
El W3C alberga la Iniciativa de Accesibilidad Web (WAI),patrocinada por varias organizaciones
Las guas juegan un papel importante para crear sitios webaccesibles
WAI ofrece tres guas diferentes: Web Content Accessibility Guidelines (WCAG)
Authoring Tool Accessibility Guidelines (ATAG)
User Agent Accessibility Guidelines (UAAG)
www.w3.org/WAI/Resources/#
gl
G d til l W b
-
8/3/2019 I. Diseo de Interfaz de Usuario
75/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo para la Web
W3C
Web Content Accessibility Guidelines (WCAG) Principios de diseo para hacer los sitios web accesibles. Estudian
escenarios que pueden ocasionar problemas a usuarios discapacitados
Authoring Tool Accessibility Guidelines (ATAG)
Asisten a los desarrolladores de herramientas de creacin decontenidos web para que estos sean accesibles
User Agent Accessibility Guidelines (UAAG) Explican las caractersticas de las interfaces que benefician a las
personas con discapacidades (navegacin por teclado, opciones deconfiguracin, documentacin, comunicacin por voz)
G d til l W b
-
8/3/2019 I. Diseo de Interfaz de Usuario
76/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo para la Web
Yale
info.med.yale.edu/caim/manual
Es una de las ms reconocidas
Cubre todos los elementos bsicos implicadosen la creacin de un sitio web
Se centra en la interfaz y en los principios dediseo grfico subyacentes al diseo de un sitioweb
Guas de estilo para la Web
-
8/3/2019 I. Diseo de Interfaz de Usuario
77/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo para la Web
National CancerInstitute
http://usability.gov/guidelines/
Disponibles en PDF
-
8/3/2019 I. Diseo de Interfaz de Usuario
78/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo
Guas de estilo corporativas
Ayudan a las empresas a dar un mismo estilo a todos sus
productos
Si una organizacin desea desarrollar su propio estilo
corporativo, primero ha de escoger una gua de estilocomercial
Esta gua se aumenta con unas caractersticas propias que
produzcan una imagen coherente de la organizacin
d il
-
8/3/2019 I. Diseo de Interfaz de Usuario
79/81
425
1
0011 0010 1010 1101 0001 0100 1011
Guas de estilo
Guas de estilo corporativas
Gua de
estilo
del
producto
Gua de
estilo
del
producto
Gua de
estilo
del
producto
Guas de estilo de la suite de productos
Guas de estilo corporativas
Guas de diseo de las plataformas (Windows, OS/2, UNIX)
Estndares internacionales (ISO, DIN)
-
8/3/2019 I. Diseo de Interfaz de Usuario
80/81
425
1
0011 0010 1010 1101 0001 0100 1011
Conclusiones
Los estndares y guas proporcionan una base sobre la cualrealizar el diseo y desarrollo
Sin embargo, el uso de guas no garantiza que la interfaz seausable
Es mejor seguir las guas que no hacerlo. Puede que podamoshacer un diseo mejor sin guas, pero son muchas ms lasventajas que aportan que las desventajas
Es conveniente dar facilidades a los diseadores y
programadores: Proporcionar ejemplos en la documentacin
Incorporar las guas a las herramientas
Dar formacin y entrenamiento
-
8/3/2019 I. Diseo de Interfaz de Usuario
81/81
421
0011 0010 1010 1101 0001 0100 1011
Conclusiones
Los estndares y las guas de estilo facilitan el diseo deinterfaces
Tambin facilitan el aprendizaje y reducen los errores alpermitir al usuario aprovechar el conocimiento adquirido enotros productos