El 3 de noviembre es el día mundial de la usabilidad.

Como coincide con el cuarto aniversario de Cadius (comunidad de profesionales dedicados a la usabilidad, la arquitectura de información y el diseño de interacción), han preparado un evento por todo lo alto, con proyecciones, charlas y muchas sorpresas.

Será en Madrid, en las oficinas de idealista.com (Plaza de las Cortes, 2. Metro Sol y Sevilla) a partir de las 8:30 de la tarde.

Si eres un diseñador o una empresa de diseño, olvídate de Flash y los pop-ups a pantalla completa para mostrar tus trabajos. A continuación comentaremos cuáles son las últimas tendencias en la creación de portafolios en Internet.

XHTML y CSS.

El tema de los estándares está de moda. Y si el código de tu página valida, quedarás como el que más sabe del mundillo. Además, CSS es más fácil de aprender que ActionScript (tecnología empleada masivamente en los portafolios antiguos) y, sin Flash, tu página cargará mucho más rápido.

Ejemplos:

• Netdiver (colección de portafolios de diseño)
• Fire on design
• Struktour

Minimalismo.

La página debe tener colores planos: 3 como mucho. Preferiblemente colores armónicos entre sí o un fondo blanco y el color corporativo para los encabezados o detalles gráficos.

Ejemplos:

• Electric Heat

Fotografías de tus obras, una debajo de otra.

Nada de secciones. El cliente quiere ver todo tu trabajo, así que qué mejor que dárselo en una sola página y no hacerle navegar de un sitio a otro. Añade tus nuevos trabajos como si fuera un blog: los más recientes están más arriba, para que la gente pueda ir viendo las novedades sin tener que bajar todo el scroll.

Sugerimos añadir en ese caso enlaces permanentes a las obras, para poder enlazar una en concreto.

Ejemplos:

• Just Design
• Midwest is Best
• Prmthn
• Form Conspiracy
• Shanin
• Happy Pets
• Pioneer 10
• More Better

Clasificar tu listado de obras con colores.

Esto puede reñir un poco con lo que hablábamos de utilizar sólo 3 colores, pero si lo que quieres es más vistosidad en tu página puedes recurrir a darle color o fondo a los elementos de tu listado de trabajos, aportando así una clasificación: por ejemplo, verde los trabajos de ilustración, azul los de animación, amarillo los posters… etc.

Ejemplos:

• Free the departament
• Actualización (29/10/04): By default

Fotografías sobre una superficie de madera.

Un requisito indispensable es que cuando fotografíes tus obras, lo hagas sobre una superficie de madera: una mesa o un suelo de parquet. Eso le dará a tus obras un toque moderno a la par que elegante.

En caso de que la obra sea muy grande, lo mejor es mostrarla sujetándola con las manos en modo de pinza y tapándote todo el cuerpo. Es importante que no muestres tu cara en este tipo de fotos.

Ejemplos:

Conclusiones

No olvides que quien entra en tu portafolio web es porque quiere conocer tu trabajo, posiblemente para contratarte, así que no se lo pongas difícil: hazlo bonito y accesible.

Actualización 2/2/2006: Podéis ver más portafolios de éste tipo en http://del.icio.us/missha/portafolio

Un tag muy apropiado para un diseñador de interacción: Felipe Memoria

Hablando de tags, también me gustan especialmente el de Grancomo: “Promoviendo el confort digital”.

Ayer por la mañana, último día de plazo, me decidí a realizar mi matrícula como estudiante de la UMA a través de su web.
¡Allá voy! Me esparaba una experiencia de usuario frustante. ¡Pero no esperaba que tánto!. A punto estuvo de causarme lesiones mentales irreversibles.

Empecé buscando durante más de 10 minutos dónde estaba la entrada como alumno al sistema. Una vez dentro, tras rellenar un críptico formulario repleto de códigos y preguntas que me hacían consultar la guía de matriculación una y otra vez, cruzo los dedos, le doy a enviar y ¡tachán!: “Error 500: Internal server error”. ¿y ahora qué? ¿Qué pasa con mi matrícula? ¿Ya no puedo estudiar este año?

Tuve que repetir el proceso, con miedo a que el sistema me matriculase dos veces o alguna burrada similar, y al final, frustrado y con los nervios crispados lo logré. ¡Por fin!.

Ahora sólo tenía que consultar la cuenta de email que me proporciona la UMA (y que nunca había usado) para saber si mi matrícula había sido aceptada. Otros 15 minutos buscando por su compleja estructura de navegación para llegar a un formulario en el que mi login es un número de 15 dígitos imposible de recordar.
Finalmete, mi matrícula estaba allí, ¡aceptada!, Vuelvo a ser universitario, un añito más.

Aún hoy temblaba un poco al levantarme, recordando los pinchazos que sentía en el pecho cada vez que la página principal redimensionaba la pantalla de mi flamante navegador automáticamente a 800×600, sientiendo aún la impotencia al manejar ese insufrible menú desplegable, rememorando la espera a que cargase la imagen de fondo de 96 KB, sin la cual no puede leerse el texto por falta de contraste, reviviendo la sensación de desorientación inmensa que me hacía tener que pasar hasta 15 minutos dando vueltas para encontrar algo…

Hoy voy a escribir a la nueva rectora pidiéndole que, si no hacen una web medianamente decente, al menos que pongan un aviso que diga “Cuidado: está página puede lesionar al usuario”.

En los años que llevo usando ordenadores Windows me había dado todo tipo de errores, muchos de ellos inexplicables. He visto errores fatales, errores inesperados, errores graves, errores generales, errores en tiempo de ejecución… pero hoy el TopStyle ha dado un “Error catastrófico”, por suerte, tras el tremendo susto el programa sigue funcionando bien. No sería para tanto…