1. Título del Documento: Documento de análisis de diseño.
ORGANIZACIÓN PATROCINANTE: FMAT-UADY
PROYECTO: Desarrollo de la aplicación web “¡Súbelos al
techo!” para mejorar el servicio de autobuses urbanos en la
ciudad de Mérida, Yucatán.
Revision: 2
Fecha: 30/11/2011
Documento de análisis del
diseño
Desarrollo de la aplicación para dispositivos
móviles “AppCarr” para ayudar a los usuarios a
encontrar un lugar de estacionamientoen la
Facultad de Matemáticas de la UADY.
Versión 1.0
Elaborado por:
Eduardo B. Canché Vázquez
Elías Armando Canché Canché
Alejandro Sumárraga Ugalde
Carlos Araujo Piña
i
2.
3. Título del Documento: Documento de análisis de diseño.
ORGANIZACIÓN PATROCINANTE: FMAT-UADY
PROYECTO: Desarrollo de la aplicación web “¡Súbelos al
techo!” para mejorar el servicio de autobuses urbanos en la
ciudad de Mérida, Yucatán.
Revision: 2
Fecha: 30/11/2011
Contenido
Documento de análisis del diseño Desarrollo de la aplicación para dispositivos
móviles “AppCarr” para ayudar a los usuarios a encontrar un lugar de
estacionamiento en la Facultad de Matemáticas de la UADY. .............................. i
Introducción .................................................................................................................. 2
Análisis de la interfaz de usuario................................................................................. 2
1
4. Introducción
Se ha seleccionado un escenario de los presentados en el Documento de avance del proyecto para poder
desarrollar el análisis preliminar del diseño de la interfaz de usuario, así como también proporcionar
aproximaciones del tiempo que le tomaría a la persona asociada llevar a cabo su objetivo en la
aplicación web. El análisis se realizó a través de la herramienta software CogTool y los operadores KLM
descritos más adelante.
http://cogtool.hcii.cs.cmu.edu/forum/cogtool-fitts-law-and-classical-klm
Análisis de la interfaz de usuario
Elección del
escenario
De los dos escenariosficticios que se proporcionaron en el Documento de avance
del proyectose eligió el siguiente por simplicidad para llevar a cabo las pruebas de
diseño y estimaciones de tiempo.
“Julio González se entera de una aplicación para poder encontrar un lugar de
estacionamiento de acuerdo a su horario; llamado AppCarr, al él le suena muy
interesante, la instala en su teléfono, coloca un acceso directo en su ventana
principal y se registra. Hoy lunes, Julio despierta tarde y se apresura para poder
llegar a tiempo a la facultad de matemáticas y así poder estacionar su automóvil
en un lugar adecuado. Julio llega a la facultad y quiere encontrar un lugar de
estacionamiento que no esté tan lejos del edificio donde tiene su primera clase, él
recuerda que tiene instalada la aplicación AppCarr en su Iphone, entonces toma su
celular, lo desbloquea y ejecuta la aplicación. Como ya se había registrado, entra
con su cuenta y se dirige a la opción de mostrar lugares de estacionamiento de
acuerdo a su horario. La aplicación le muestra el mapa del estacionamiento,
señalando los lugares vacíos de acuerdo a su horario. Julio fácilmente encuentra un
lugar adecuado, en pocos minutos y a su puede asistir a tiempo a si primera clase.”
Listado de pasos
Se proporciona la siguiente lista de pasos que Julio tendrá que seguir para poder
llevar a cabo lo que él quiere hacer dentro de la aplicación.
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
Visualizar el menú principal.
Tocar el icono de AppCarr para ejecutar la aplicación.
Esperar a que se abra la aplicación.
Visualizar la interfaz principal de la aplicación.
Seleccionar el cuadro de texto donde se ingresa su correo.
Teclear su correo.
Visualizar la interfaz principal de la aplicación.
Seleccionar el cuadro de texto donde se ingresa su contraseña.
Teclear su contraseña.
Visualizar la interfaz principal de la aplicación.
Tocar la opción de “iniciar sesión”.
Esperar a que cargue la interfaz de la aplicación.
Visualizar el menú de la aplicación.
Seleccionar la opción de “Ver mapa conforme a preferencias”.
2
5. Título del Documento: Documento de análisis de diseño.
ORGANIZACIÓN PATROCINANTE: FMAT-UADY
PROYECTO: Desarrollo de la aplicación web “¡Súbelos al
techo!” para mejorar el servicio de autobuses urbanos en la
ciudad de Mérida, Yucatán.
Revision: 2
Fecha: 30/11/2011
15. Esperar a que cargue el mapa de la aplicación.
16. Visualizar los lugares vacíos.
17. Salir del mapa.
Asignación de
operadores KLM
De la lista de pasos anterior que Julio debe seguir para llegar a su objetivo,se hizo
una asignación de operadores según la metodología KLM (Keystroke-levelmodel)en
base a lo siguiente:
1. Se enlistan los movimientos de selección en pantalla (Sistema táctil),
keystrokes (golpes en la pantalla), tiempos de respuesta del sistema y se
definen algunas heurísticas para estimar el tiempo de “operadores
mentales”.
2. Predice el tiempo de ejecución de una tarea en un diseño y tarea
específico.
3. Básicamente se crea la lista de la secuencia de acciones de keystroke que
el usuario debe realiza para completar cierta tarea y sumar el tiempo
requerido por cada una de estas acciones.
Por cada acción física o mental del usuario se hace una estimación del tiempo que
le llevaría completar la tarea satisfactoriamente. Los operadores se encierran entre
paréntesis y negritas. En breve explicaremos cada uno de ellos y les asignaremos
algunos tiempos.
K– Teclear letra por letra.Promedio 0.680 segundos.
BB – Tocar un botón.
Promedio0.29 segundos
M– Preparación mental o visualización. Promedio 1.2 segundos.
R– Respuesta del sistema.
2 segundos.
1. Visualizar el menú principal. (M)
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
Tocar el icono de AppCarr para ejecutar la aplicación. (BB)
Esperar a que se abra la aplicación. (R)
Visualizar la interfaz principal de la aplicación. (M)
Seleccionar el cuadro de texto donde se ingresa su correo.(BB)
Teclear su correo. (K)
Visualizar la interfaz principal de la aplicación.(M)
Seleccionar el cuadro de texto donde se ingresa su contraseña.(BB)
Teclear su contraseña. (K)
Visualizar la interfaz principal de la aplicación.(M)
Tocar la opción de “iniciar sesión”.(BB)
Esperar a que cargue la interfaz de la aplicación. (R)
Visualizar el menú de la aplicación. (M)
Seleccionar la opción de “Ver mapa de acuerdo a preferencias”.(BB)
Esperar a que cargue el mapa de la aplicación(R)
Visualizar los lugares vacíos. (M)
Salir del mapa.(BB)
3
6. Entonces el tiempo estimado que le llevaría a Mariel poder cumplir con su objetivo
se presenta como la suma de todos los tiempos de cada uno de los operadores.
3K+3M+6BB+3R.
Pero como K se refiere a cada carácter que el usuario introduce en la
computadora entonces tomaremos un aproximado, la longitud delcorreo es de
aproximadamente 20 caracteres, la longitud de la contraseña es de
aproximadamente 10 caracteres y así3K = (20+10) K.
Así solo sustituimos los valores de cada operador con los tiempos asignados para
cada operador. Quedaría de la siguiente manera:
2K+7M+6BB+3R = (20+10)K+7M+6BB+3R= 30K+7M+6BB+3R.
30(.680)+7(1.2)+6(.29)+3(2)
20.4+8.4+1.74+6=36.54 Segundos
Es decir, en total, a Julio le llevaría en promedio 36.54 segundos
aproximadamente, completar el objetivo del escenario descrito.
KLM con la
herramienta
CogTool
Ahora, siguiendo con el mismo escenario y el objetivo de Julio,implementaremos el
KML utilizando la herramienta “Coog-Tool”. Esta herramienta software simula la
interfaz del usuario y además obtiene tiempos estimados relativos a las acciones
(pasos) del escenario.Se obtuvieron los siguientes resultados:
Desde que el usuario abrela aplicación y va al menú principal de “AppCarr” hasta
que sale del mapa, el programa generó la siguiente salida:
4
7. Título del Documento: Documento de análisis de diseño.
ORGANIZACIÓN PATROCINANTE: FMAT-UADY
PROYECTO: Desarrollo de la aplicación web “¡Súbelos al
techo!” para mejorar el servicio de autobuses urbanos en la
ciudad de Mérida, Yucatán.
Revision: 2
Fecha: 30/11/2011
En total el tiempo estimado que le llevará a Mariel realizar lo que quiere es de
aproximadamente 38.9 segundos (de acuerdo a la herramienta CogTool),en el caso
de que Julio estuviera registrado.
5