Archive for the ‘ Usabilidad ’ Category

animacion de precarga

Como parte de la usabilidad de usuario es muy importante dar “feedback” al usuario todo el tiempo, La precarga y carga de contenido es tiene que ser declarada para que el usuario sepa que algo esta pasando. Es por esto que dejo tres sitios con generadores de precargas, son sitios que nos dejan elegir la animacion, elegir el color y luego nos generara un gif animado que podremos usar en nuestro projecto.

Preloader.net: como ventaja tiene varias tipo de animaciones divididas por secciones, la seccion 3d vale la pena.

http://preloaders.net/en/

LoadInfo.net : solo en 2d pero de muy buena calidad, en general es que yo personalmente uso para mi proyectos.

http://loadinfo.net/

ajaxload.info : tiene un espacio en mi lista porque si bien es el mas simple de todos, fue el primero que he utilizado.

http://ajaxload.info/

Un post corto sólo para nombrar éste plugin que he estado usando que ayuda a mejorar la usabilidad de los menues desplegables. Por ejemplo mejorar esos menues horribles de listados de paises, con ésta utilidad podemos agregar filtros para buscar dentro del desplegable o hacer subgrupos.
Pueden bajarlo de:
http://harvesthq.github.com/chosen/

formularios en pasos

Muchas veces los formularios de resgitro pueden ser intimidantes con la cantidad de campos que no piden, y como desarolladores y fanacticos de la usabilidad siempre intentamos brindar una mejor experiencia de usuario. Y para evitar esa apabullante sensación a nuestro usuario lo que podemos hacer es un formularios por pasos donde primero le pidamos dos cosas y si estan bien sigamos con otras tres, todas distribuidas coherentemente tipo: datos de usuario email, usuario y contraseña; luego datos de contacto, direccion y telefonos, y luego extras.
Para con HTML y Javascript he econtrado un plugin de JQuery muy bueno llamado stepy pueden bajarlo y ver una demo en: http://www.wbotelhos.com/stepy/

Mapa de calor en perfil de Facebook

Me pareció muy interesante este video creado a pocas cuadras de mi casa más específicamente por la National College of Ireland en el que miden 38 personas mirando un perfil de facebook y luego aplicando un mapa de calor sobre la imagen para comprender los resultados. Siempre es interesante saber que es lo que ven nuestros publico objetivo, ya sea en nuestros sitios web, newsletters, resultado organicos de google o perfiles de facebook.

Si quieren hacer un experimento similar pueden usar Clickheat, una librería en PHP que les permite generar estos mapas de sus página propias ya que corre en su servidor. Es una versión más básica que la mostrada en el video, tampoco lo he probado pero pueden bajarlo desde: http://sourceforge.net/project/showfiles.php?group_id=181196 y contarnos como les fue en su experiencia.

A ver que les parece:

wireframes y prototipado

El wireframe o prototipado de un nuevo proyecto puede ser un arduo trabajo.Sinceramente mucha veces da vagancía hacerlo y creemos que tenemos en claro que es lo que estamos haciendo por lo que no necesitamos de este tipo de ayuda, pero si llegamos a pensar así estamos muy lejos de la  verdad. El prototipado tiene dos grandes ventajas: primero nos ayuda a entender que es lo que tenemos que hacer y preveer errores de usabilidad, de diseño, etc. Segundo nos facilita a la hora de presupuestar y mostrar al cliente como es la estructura y como va a funcionar el sitio o aplicación.

El prototitado puede ser algo sumamente tedioso de hacer y recuerdo épocas donde la realizábamos usando word o incluso illustrator, realizando cada uno de los módulos y flechas manualmente. Pero hay mucha maneras más eficaces de realizar prototipado una de ellas es la aplicación online y gratuita gliffy.

Pruebenlo en http://www.gliffy.com/