i

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.

Fecha: 30/11/2011

Revision: 2

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

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.

Fecha: 30/11/2011

Revision: 2

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

2

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. Visualizar el menú principal. 2. Tocar el icono de AppCarr para ejecutar la aplicación. 3. Esperar a que se abra la aplicación. 4. Visualizar la interfaz principal de la aplicación. 5. Seleccionar el cuadro de texto donde se ingresa su correo. 6. Teclear su correo. 7. Visualizar la interfaz principal de la aplicación. 8. Seleccionar el cuadro de texto donde se ingresa su contraseña. 9. Teclear su contraseña. 10. Visualizar la interfaz principal de la aplicación. 11. Tocar la opción de “iniciar sesión”. 12. Esperar a que cargue la interfaz de la aplicación. 13. Visualizar el menú de la aplicación. 14. Seleccionar la opción de “Ver mapa conforme a preferencias”.

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.

Fecha: 30/11/2011

Revision: 2

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. Tocar el icono de AppCarr para ejecutar la aplicación. (BB) 3. Esperar a que se abra la aplicación. (R) 4. Visualizar la interfaz principal de la aplicación. (M) 5. Seleccionar el cuadro de texto donde se ingresa su correo.(BB) 6. Teclear su correo. (K) 7. Visualizar la interfaz principal de la aplicación.(M) 8. Seleccionar el cuadro de texto donde se ingresa su contraseña.(BB) 9. Teclear su contraseña. (K) 10. Visualizar la interfaz principal de la aplicación.(M) 11. Tocar la opción de “iniciar sesión”.(BB) 12. Esperar a que cargue la interfaz de la aplicación. (R) 13. Visualizar el menú de la aplicación. (M) 14. Seleccionar la opción de “Ver mapa de acuerdo a preferencias”.(BB) 15. Esperar a que cargue el mapa de la aplicación(R) 16. Visualizar los lugares vacíos. (M) 17. Salir del mapa.(BB)

4

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:

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.

Fecha: 30/11/2011

Revision: 2

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.