Interfaces are about visual design, about information design and about interaction design.
Una esclarecedora definición de Andrei Herasimchuk, en una interesantísima discusión sobre interfaces flash en Interaction Design Discussion List
Un buen uso de iconos en la web en la página del genial gestor de estadísticas Clicktracks. 5 imágenes más para mi colección de detalles web :)
Como su nombre sugiere, la interacción multimodal es aquella que auna varios tipos de interacciones hombre-máquina para conseguir una interacción más natural entre las personas y los ordenadores.
La interacción actual que estamos obligados a tener con las máquinas que nos rodéan deja mucho que desear. Aunque a veces es cierto que nos facilitan las cosas, otras nos la complican bastante, aunque no nos demos cuenta: creo que es mucho más fácil escribir una carta a mano que encender el ordenador, esperar a que cargue Windows, abrir Word, coger el ratón, poner el puntero al principio del documento, hacer click y empezar a escribir. De hecho, para anotaciones breves, sigo utilizando mi moleskine.
Los humanos estamos acostumbrados a interaccionar con humanos. Ese es un campo que se nos da bien. Llevamos milenios haciéndolo. Así que es normal que para que la interacción persona-ordenador mejore, el camino es que tienda a parecerse a la interacción humano-humano.
La voz, los gestos, el tacto y los movimientos es lo que normalmente usamos para interactuar entre nosotros, y son los campos en los que está avanzando el diseño de interacción. La interacción multimodal recoge y define todos estos avances.
Un ejemplo real de interacción multimodal sería el sistema de navegación a bordo de un vehículo, con base de datos y GPS y una interfaz gráfica (mapas), táctil (botones on/off) y de voz (tanto de entrada como de salida de datos). En general, los dispositivos móviles son los que más están trabajando por conseguir ofrecer interfaces multimodales.
En cuanto a la web, la W3C tiene un grupo de trabajo dedicado a la interacción multimodal, cuyo trabajo consiste en crear estándares para:
¿Suena bien, verdad? Pues si te interesa el tema estás de suerte, porque el 11 de noviembre la W3C celebra en Madrid un seminario sobre el tema: ¿te apuntas?
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.
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:
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:
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:
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:
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:
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
Bueno, añadiendo otro post corto a la lista…
El 11 de noviembre (jueves) se celebrará una fiesta para celebrar el lanzamiento de la versión 1.0 de Firefox. Aún no está decidido el lugar, pero, con suerte, nos escapamos a cualquier rincón de España donde se celebre. Podéis apuntaros en la página de Mozilla, que cubre el evento a nivel mundial.
Aunque estoy pensando que entre tedeso, lima y domestika, a lo mejor hay gente como para montar una party malagueña…
Una divertida comparativa entre el revolucionario iPod y la tradicional cinta de audio.
Modernidad frente a frikismo… ufff, me cuesta decidir.
Los autores de la página del colectivo y fancine mundofase comprenden que el fondo que han puesto puede causar molestias a los ojos de algunos de sus visitantes, así que ofrecen una versión “eye safe”, con un color de fondo liso y suave.
Bueno, es un acercamiento a la accesibilidad web…
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”.
Siempre que navego, como diseñadora web no puedo evitar fijarme en los pequeños detalles que hacen grande a una web.
Normalmente hago una captura de pantalla, recorto la parte que me ha llamado la atención y la guardo en una carpeta llamada “detalles web”.
A partir de ahora continuaré mi colección online e iré poniendo aquí las capturas de pantalla.
Empezaremos por los iconos de atomiq, un blog que descubrí en los feeds de furilo (que uso a diario porque están mucho mejor organizados que los mios).
Iconos para dos tipos de meta-información de un post: fecha de publicación y categoría.
Genial el diseño de las presentaciones de Douglas Bowman en el Web Essentials 2004.
El contenido, como siempre, excelente (especialmente la segunda presentación).
blogold era un blog sobre desarrollo y estándares web, diseño gráfico, usabilidad, new media y ciberespacio.