Archive for the ‘ Teoria/Diseño ’ Category

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/

La rueda de la experiencia de usuario

Con eduardo siempre que empezamos un proyecto nuevo no detenemos un momento a pensar en la usabilidad del mismo. Este es un modelo que intenta explicar que es la experiencia del usuario.

El modelo debe ser explicado desde el centro hacia afuera

1. EL valor que queremos alcanzar
2. Para clientes y proveedores, una experiencia de usuario positiva se traduce en una situación donde todos ganan.
3. Tambien queremos alcanzar “valor” mediante una experiencia de usuario positiva.
4. La experiencia de usuario tiene una serie de fases. no tenemos que enfocar en: positividad, encontrabilidad, accesibilidad, deseabilidad, usabilidad, credibilidad y utilidad.
5. Varios factores contribuyen a las fases de la experiencia de usuario. Aca hay 30 por ejemplo.
6. Para alcanzar todo ésto trabajamos en sentido contrario, empezamos por la estrategia SEO y tomando decisiones en cada uno de lo factores.

Les recomiendo bajar la bajar versión en pdf imprimirla y tenerla en la pared cerca de su monitores cuando comiencen un nuevo proyecto.

post original: http://userexperienceproject.blogspot.com/2007/04/user-experience-wheel.html

diseño de app para iPhone

Cada tanto me toca diseñar como se va ver la intefaz pantalla por pantalla de aplicaciones para iPhone. A mi manera de ver hay dos formas: una es usando algún programa para hacer sketchs, lo cual es muy útil para empezar a idear la funcionalidad y navegación, además haciendo un sketch cuando es presentado al cliente éste puede entender como va a funcionar su aplicación pero se da cuenta que es un prototipo y no espera que ese sea el resultado final. Como segunda opción podemos usar una plantilla de photoshop con iconos y gráficos de cada recurso del iPhone, por lo que el resultado es (o debería ser) idéntico al desarrollo final. Como consecuencia no podemos tomarnos a la ligera, ya que el diseño es tan cercano a una aplicación real que el cliente al ver la capturas va a pensar que es algo ya terminado, por lo que no podemos omitir espacios de textos, logos, funciones, botones o cosas que sabemos que en van a estar en el desarrollo final  ya que el cliente no va a aprobar el prototipo hasta que se vea al 100%. Sea como sea acá dejo un par de utilidades que me han ayudado en distintos trabajos:

Stencils:

http://graffletopia.com/stencils/437

Plantillas para Photoshop:

http://www.smashingmagazine.com/2008/11/26/iphone-psd-vector-kit/

http://www.teehanlax.com/blog/2010/06/14/iphone-gui-psd-v4/

la misma versión que la anterior pero para retina: http://www.teehanlax.com/blog/2010/08/12/iphone-4-gui-psd-retina-display/

Y otra aplicación muy util para cuando se esta diseñando para ambos dispocitivos (retina y normal) : http://getreviewapp.com/

Hay varias más , pero éstas son las que estoy usando por el momento. Pueden buscar en google otras, o para iPad o incluso Android.

Espero que les sea útil.

Google I/O día uno.

Google I/O es la conferencia anual en la que google presenta sus productos, sus ideas y tendencias.
La estrella del día uno fue wl app store de google y HTML5. Varias compañías fueron pasando y mostrandos sus soluciones en html5 y como ven el futuro de la web.