Esta presentación fue elaborada con motivo de un trabajo escolar. Los datos fueron sacados de internet utilizando Google.

1. Análisis de Usabilidad
Universidad Autónoma de Sinaloa
Facultad de Informática Mazatlán
Lic. en Ing. en Sistemas de Información
Prof. José Alfonso Aguilar Calderón
Tópicos Avanzados de Ingeniería de Software II
Lobatos Fernández JA, Luque Inda R, Rosas Ramírez JC
Mazatlán, Sinaloa, viernes 27 de febrero del 2014

2. Contenido
 1. Introducción
 1.1 Nombre del sitio Web
 1.2 Descripción del sitio
 1.3 Objetivo de la página
 1.4 Descripción de la prueba a realizar
 1.5 Objetivo del test
 2. 10 Heurísticas de Usabilidad
 2.1 Visibilidad del estatus del sistema
 2.2 Consistencia entre el sistema y el mundo real
 2.3 El usuario es libre y tiene el control
 2.4 Consistencia y estándares
 2.5 Prevención de errores
 2.6 Mejor Reconocer que Memorizar
 2.7 Flexibilidad Eficiencia y Uso
 2.8 Diseño Estético y Minimalista
 2.9 Ayuda al usuario a reconocer, diagnosticar y recuperarse de los errores
 2.10 Ayuda y Documentación
 3. Anexos.
2

3. 1. Introducción
3

4. Video
4
 https://www.youtube.com/watch?v=NBUIVViX3yU

5. 1.1 Nombre del sitio Web
5
www.ebay.com

6. 1.2 Descripción del sitio
6
 Se trata de un sitio web tipo “C2C” (Customer to
Customer). En el diversos usuarios registrados
fungen como vendedores y ofertan sus productos
hacia diversos usuarios registrados que fungen
como compradores.
 En este sitio se tiene acceso rápido a las
características de los productos, diferentes formas
de pago, esta traducido en 2 idiomas, se busca
establecer un mercado amplio con clientes en todo
el mundo, y realizar entregas ágiles por paquetería.

7. 1.3 Objetivo de la página
7
 El sitio web tiene como objetivo principal que sus
usuarios puedan vender sus productos a otros
usuarios a través de internet. Para esto se diseñó de
libre acceso y registro para todo público. Y busca el
reconocimiento en la calidad y entrega de sus
productos.

8. 1.4 Descripción de la prueba a realizar
8
 Se llevarán a cabo dos pruebas.
 Primera prueba. Basada en las “10 Usability
Heuristics for User Interface Design” (10 Heurísticas
de Usabilidad para el Diseño de Interfaces de
Usuario) de reconocido autor Jakob Nielsen.
Entiéndase por “Heurística”: reglas, pautas o
lineamientos. Por lo tanto esta prueba se refiere a
10 bases teóricas en la que se apoyan las actuales
“buenas prácticas” en el diseño de interfaces de
usuario de toda la World Wide Web, de forma que
consigamos un sitio web “usable”.

9. 1.4 Descripción de la prueba a realizar
9
 Segunda prueba. Se trata del archivo excel:
“ExpertReviewCheckpoints-ebay.xls”, el cual
contiene una gran cantidad de rubros a manera de
“Checkpoints” divididos en hojas de Excel por
categorías y que se van evaluando
cuantitativamente con un simple: +1, 0 o -1, cada
uno de los aspectos de una página web usable.
 Dentro del mismo archivo en las primeras hojas de
Excel se tiene las sumatorias automáticas que nos
darán ese valor cuantitativo final de usabilidad que
estamos buscando. Este archivo correspondiente a
esta prueba se entrega aparte de este reporte
técnico, aquí en este documento se hace referencia
a él como: anexo.

10. 1.5 Objetivo del test
10
 Se trata de obtener una medida cualitativa y
cuantitativa del sitio web: www.ebay.com .
 La medida cualitativa se obtendrá a través de la
primera prueba.
 La medida cuantitativa se obtendrá a través de la
segunda prueba.

11. 2. 10 Heurísticas
de
Usabilidad
11

12. 2.1 Visibilidad del estatus del sistema
12
 El usuario no sabe lo que sucede cuando interactúa
con el sitio o aplicación Web.
 SI LO CUMPLE. El usuario tiene claramente definido
el objetivo de la página, observando la información
proporcionada. La estructura es simple y logra que
los navegantes del sitio se relacionen con la pagina,
todo esto se logra por la excelente organización de
la información de los productos ofrecidos.

13. 2.1 Visibilidad del estatus del sistema
13

14. 2.1 Visibilidad del estatus del sistema
14
 Debe de proporcionar al usuario un feedback constante.
Ésa es la función que cumplen, por ejemplo:
 Las barras de proceso que nos indican cómo avanza la subida
de un archivo.
 Los mensajes que nos confirman que “el formulario se ha
enviado correctamente”.
 Una animación que nos indica que algo está siendo procesado
sin incidencias
 SI APLICA. SI LO CUMPLE. El envío de respuestas o
mensajes de alerta, están organizadas y aplicadas con
buen formato y presentación.


15. 2.1 Visibilidad del estatus del sistema
15


16. 2.1 Visibilidad del estatus del sistema
16
 Cabe mencionar que algunas de las validación no se
codificaron correctamente, como la validación del
correo electrónico.

17. 2.2 Consistencia entre el sistema y el
mundo real
17
 El sistema tiene que “hablar” al usuario en su mismo
lenguaje. Y esto no se refiere sólo al texto, sino
también a elementos como:
 Las imágenes.
 El orden en que se hacen las cosas.
 La forma en que se presenta la información.
 Consigue que la relación entre el hombre y la máquina
sea natural.
 SI LO CUMPLE. La información del lenguaje web es
natural, logra una asociación de productos-cliente,
nitidez en las imágenes de los artículos y crea una
familiarización eficaz.

18. 2.2 Consistencia entre el sistema y el
mundo real
18

19. 2.2 Consistencia entre el sistema y el
mundo real
19
 Internet no es otra realidad, es parte de la vida de
las personas, y eso significa que el usuario rechaza,
consciente o inconscientemente, interactuar bajo
unos códigos de comunicación y de conducta
distintos a los suyos.
 SI APLICA. SI LO CUMPLE. El usuario fácilmente
reconoce los patrones de información de los
productos y método de compra, observado los
detalles del articulo a comprar y ubicandolos en su
respectiva sección. Localiza de una manera ágil la
secciones de oferta, total de productos comprados y
el tipo de envío que se le puede ofrecer.

20. 2.2 Consistencia entre el sistema y el
mundo real
20

21. 2.3 El usuario es libre y tiene el control
21
 No fuerces al usuario a seguir un camino
determinado, ya sea por un mal diseño o incluso de
forma deliberada, porque a ti te interese. Evita a
toda costa los “callejones sin salida”.
 SI LO CUMPLE. Al usuario no se le forza a nada en
ningún momento.
 No obstante cabe señalar que: al visitante del sitio
se le da la bienvenida sin conocer realmente sus
datos, con esta acción mada un mensaje de falta de
seguridad y por lo tanto inseguridad para lo
usuarios.

22. 2.3 El usuario es libre y tiene el control
22

23. 2.3 El usuario es libre y tiene el control
23
 El usuario tiene que poder navegar libremente,
encontrar con facilidad “salidas” y “rutas
alternativas”, y tener todas las facilidades que
necesite para “hacer” y “deshacer”.
 SI LO CUMPLE.

24. 2.3 El usuario es libre y tiene el control
24

25. 2.4 Consistencia y estándares
25
 Tu sitio web debe seguir un estándar consistente en
todas sus páginas.
 Es decir, no puedes hacer por ejemplo que el menú funcione
de manera diferente en distintas partes de tu web, ni cambiarlo
de ubicación porque te parece que “queda mejor”.
 No puedes usar distintos diseños para la misma cosa en
distintos apartados (forma, color), ni una terminología variable.
 Si en tu tienda online el carrito se llama “cesta” y tiene un icono
verde en la home, no puede llamarse “carro” y tener un icono
rojo en la ficha de producto; tampoco puede estar unas veces
en una esquina y otras en otra. Sé consistente en las
decisiones que tomes.
 Es muy frecuente encontrar errores de este tipo en Internet,
especialmente en webs veteranas que han ido sufriendo
modificaciones con el paso del tiempo.
 NO LO CUMPLE. El menú si cambia en las páginas
posteriores.

26. 2.4 Consistencia y estándares
26
 Página principal.

27. 2.4 Consistencia y estándares
27
 Página posterior.

28. 2.4 Consistencia y estándares
28

29. 2.5 Prevención de errores
29

30. 2.6 Mejor Reconocer que Memorizar
30
 El usuario debe tener siempre toda la información a mano, y
no verse obligado a usar su memoria para seguir el hilo de la
interacción. Pónselo fácil para que no tenga que estar
memorizando cómo volver a la página anterior o cómo
encontrar aquel producto que ya ha visto y le interesaba:
 Si el usuario tiene que “recordar” cómo se hace algo en tu web en
lugar de “saberlo” intuitivamente, tienes un problema.
 Si el usuario tiene que recordar decisiones que ha tomado
previamente porque no le muestras esa información cuando la
necesita (por ejemplo en un proceso de compra), su experiencia
de uso se empobrece considerablemente, y tendrás muchos más
abandonos en la web.
 SI CUMPLE. El usuario puede localizar las acciones
anteriores que ha hecho y tener un acceso directo. Un
ejemplo es al cerrar la página y volverla a abrir, el carrito de
compras recuerda lo que se había seleccionado, incluso sin
haberse logueado antes o después.

31. 2.6 Mejor Reconocer que Memorizar
31

32. 2.7 Flexibilidad Eficiencia y Uso
32
 Algunos usuarios ya conocen tu web y realizan siempre las
mismas acciones. ¿Tienes “aceleradores” que les permitan
realizar de forma más rápida y directa esas acciones
frecuentes?
 Un buen interfaz de usuario tiene la flexibilidad necesaria para
comportarse “a la medida” de usuarios novatos y usuarios
expertos.
 Ejemplos: 1) un “atajo” en la home a la página que más visitan tus
usuarios, saltando pasos intermedios, 2) mostrar los últimos
artículos por los que se ha interesado el usuario en su última
visita, o en la visita en curso, ya que probablemente querrá volver
a consultarlos.
 SI CUMPLE. Un ejemplo claro esta en los productos vistos
recientemente, en dado caso que por error hayas cerrado la
página o por equis motivo hayas tenido la necesidad de salir,
la pagina te da la facilidad de acceso a dichos productos para
que no repitas los pasos para encontrarlos. El problema esta
en que dicho ejemplo no aparece en la página de inicio, sino
que tienes que acceder a la categoría de “lo que sigues” para
visualizar tus mas recientes actividades.

33. 2.7 Flexibilidad Eficiencia y Uso
33

34. 2.8 Diseño Estético y Minimalista
34
 El diálogo que el interfaz mantiene con el usuario no
debe contener información irrelevante o de rara
utilidad. Dice Nielsen que:
 “Cada unidad extra de información en un diálogo compite
con las unidades relevantes de información y reduce la
visibilidad relativa de éstas.”
 Dicho de otra manera, cada palabra de más está
oscureciendo las palabras que son realmente
importantes.
 SI CUMPLE. El diseño es muy estético y a pesar de
manejar millones de productos lo presenta todo de
forma minimalista.

35. 2.8 Diseño Estético y Minimalista
35

36. 2.9 Ayuda al usuario a reconocer,
diagnosticar y recuperarse de los errores
36
 Los mensajes de error tienen que estar escritos en
un lenguaje que el usuario pueda entender -desde
luego no con tecnicismos- y deben siempre sugerir
una solución o un camino de salida.
 Por ejemplo, un ERROR 404 (página no encontrada), que
es el más frecuente en cualquier web, debería ser
sustituido por una pantalla amistosa donde se dijera algo
como: “Vaya, la página que buscas no está aquí. Puede
que esté en otro sitio, o que simplemente no exista. Por
favor, utiliza este buscador [buscador] o haz clic en el
enlace para volver a la página principal [enlace]”.
 SI LO CUMPLE. Los mensajes de error son
amigables.

37. 2.9 Ayuda al usuario a reconocer,
diagnosticar y recuperarse de los errores
37

38. 2.9 Ayuda al usuario a reconocer,
diagnosticar y recuperarse de los errores
38

39. 2.10 Ayuda y Documentación
39
 Es preferible que el sistema pueda usarse de manera
intuitiva sin tener que acudir a “unas instrucciones”. No
obstante, el usuario necesitará en ocasiones ayuda y
documentación.
 Es preciso que esta información sea fácil de encontrar, y sobre
todo que esté orientada a las tareas concretas que realiza el
usuario, antes que a cuestiones teóricas o demasiado
genéricas.
 Un buen ejemplo es la lista de preguntas frecuentes
(normalmente abreviado en inglés como FAQ), que puedes
encontrar en la “ayuda” de plataformas sociales como Twitter o
Youtube.
 La idea es evitar que el usuario tenga que leer contenidos de
ayuda que no le interesan antes de llegar al texto que
realmente va a resolver su problema.
 SI CUMPLE.

40. 2.10 Ayuda y Documentación
40

41. 3. Anexos
41

42. Anexos
42

43. Anexos
43

44. Anexos
44

45. Conclusiones
45
Heurística Cumple
1. Visibilidad estatus SI
2. Consistencia sistema y mundo real SI
3. Usuario libre y tiene control SI
4. Consistencia y estándares NO
5. Prevención de errores NO
6. Mejor reconocer que memorizar SI
7. Flexibilidad eficacia y uso SI
8. Diseño estético y minimalista SI
9. Ayuda con errores SI
10. Ayuda y Documentación SI

46. Conclusiones
46
 La calificación general es de 74%.
 La usabilidad de ebay es aceptable, pero
comparado con las otras páginas ya expuesta no es
la que tiene más Usabilidad.
 En general comprar en Ebay, es una buena
experiencia de usuario.

47. Conclusiones
47
 Calificación Heúristicas: 8
 Calificación Excel: 7.4
 Calificación oficial, según el criterio (estándar)
Lobatos-Luque-Rosas:
7.7