Entries Tagged 'Prototipado' ↓
April 19th, 2010 — Documentación, Idea, Prototipado, Usabiliad

He estado pensando cómo podría diseñar la interfaz de forma que:
- fuera fácil de usar
- muestre suficiente información como para saber el estado de las listas
teniendo en cuenta que en esta vista se deberá de poder:
- crear nuevas listas
- editar las listas
- eliminar listas
- compartir una lista
- buscar sobre las listas
- ver información sobre ellas
A la hora de ponerme con esta vista, tengo claro que habrá un listado con las distintas listas y que al lado de ella se indicará si está o no completa. Para eso son los circulos que hay junto a cada lista. Este será de color X cuando esté completa y de color Y cuando no (no se qué color usar para cada caso por eso pongo X e Y).
También tengo claro que la edición tiene que ser “inline”, es decir, al hacer doble click sobre el título de la lista, esta podrá editarse. Hasta aquí todo claro, pero ¿cómo proporciono la posibilidad de borrar y compartir una o varias entradas?, se me ocurre que permitiendo seleccionar varias listas y teniendo un botón/icono que lance la acción de borrar/compartir (en la imagen de arriba se contempla esta idea).
Ahora me pregunto, ¿realmente va a merecer la pena hacer borrados y comparticiones simultáneas de grupos de listas cuando a lo sumo se van a tener 10 en pantalla (en cada página)? ¿Tan incómodo puede ser hacerlo una a una?
Con estas dudas en la cabeza he planteado un prototipo en el que no se puedan realizar acciones a grupos de listas de forma que todas las listas tengan un icono para cada acción. Esto iconos aparecerían cuando se pasara el ratón por encima del título de la lista.
De esta forma se podría añadir la opción de indicar a qué categoría pertenece una lista, añadiendo un campo más, debajo del campo para indicar el título de la nueva lista.
Finalmente, me quedo con el segundo prototipo porque lo veo más limpio.
April 10th, 2010 — Documentación, Idea, Prototipado
Pués eso, el nuevo prototipo para el formulario de registro:

Formulario de registro
Un formulario con los datos básicos para poder registar usuario y poder enviarles correos.
April 10th, 2010 — Documentación, Idea, Prototipado
He estado dándole algunas vueltas al prototipo de la página de inicio y lo he dejado así:

Página de inicio
La página de inicio quiero que sea clara, que te diga para qué sirve la aplicación y cómo comenzar a usarla. Para ello
se me ha ocurrido mostrar varios casos de uso a través de historietas usando el formato de tiras cómicas. Se que puede ser un poco complicado, porque puede llegar a confundir al usuario si no lo hago bien, pero creo que puede ser una forma divertida de mostrar su uso, así que lo voy a intentar.
A continuación de las historietas quiero indicar los distintos pasos que hay que seguir para que un usuario pueda usar la aplicación usando un formato de lista de tareas(el que use la aplicación para mostrar una lista). Este listado indicará los siguientes pasos
- Registrarse en la aplicación
- Activar la cuenta para usar la aplicación
- Iniciar sesión en la aplicación
- Crear una lista
- Añadir entradas a la lista
En la página habrá un enlace para acceder al formulario de registro y otro para iniciar sesión. Este último desplegará el formulario de login (como el que se usa en twitter).

Página de inicio con login
¿Qué dudas/inseguridades tengo?
Pués algunas como por ejemplo:
- Los espacios: No se si la disposición de los componentes de la vista son los mejores para una aplicación. ¿Es mejor aprovechar el ancho completo de la pantalla o por el contrario definir unos márgenes?
- ¿Habrá suficiente información en esta página como para que el usuario comprenda su uso? Hay que tener en cuenta que esta aplicación no está pensada para usuarios expertos/avanzados, esta aplicación tiene que poder ser usada por todos.