I just found an interesting idea about how to improve the effectiveness of banners. The thing is just to turn it interactive instead of being only a box with information. They named it “Nike+ Challenge Men vs. Women” and it works like this:

  • You put a banner against men on a website for women
  • You put a banner agains women on a website for men
  • Let them discuss on real time like in a chat mode

And this is the result (Youtube, 1min):

Other brands could work perfectly with this ad mode.

Vía ComputerLove.

Punchcut, a User Experience design company from San Francisco, has just launched a very illustrative video to make people know their thinkings about what´s the best approach to User Interface design:

1/ Design for immediate access
2/ Keep gestures smart and simple
3/ Leverage clear mental models
4/ Design for real hand sizes
5/ Touch feedback is key

So, here you are (Vimeo, 1:17min):


“Touch is merely on dimension that brings a human side to technology”.

These days, Seisdeagosto.com, the company I own, is working on an interesting project defining mobile User Interfaces wireframes. Inspiration coming from this kind of documents is always welcome. Thank you guys!

Una de las cosas que menos me gusta de la web es la publicidad, el cómo se inventan fórmulas para forzar a los usuarios para, de una manera u otra, intentar que veas sí o sí el contenido que quieren dar a conocer.

El caso más conocido es quizá el de los famosos Interstitials de elmundo.es (que a día de hoy son incluso más intrusivos que antes, puesto que te ocultan hábilmente la opción de cerrar la ventana emergente).

Hasta no hace mucho teníamos otro famoso ejemplo, el del test de la risa de Last.fm que tanto dio que hablar y que gracias a la presión de los usuarios, consiguieron eliminar.

Pero hay un formato que aún sigue campando a sus anchas por la red y que personalmente me parece la forma más ruin y trepa de intentar conseguir clicks por publicidad. Sin más preámbulos, algunos ejemplos:

Engañar a los usuarios con publicidad

Como se puede apreciar en la imagen superior, se trata de pseudo-ventanas con distintas opciones a elegir a través de radio-buttons, botones, checks… Más de uno habrá vivido la experiencia de intentar pinchar sobre el elemento en cuestión y ser redirigido a otra página de destino con la publicidad del trepa que intentando venderte algo.

Quizá más de uno se pregunte qué diferencia existe entre los ejemplos de la imagen y los que he mencionado al principio. La respuesta es bien sencilla:

Mientras que un Interstitial o el “Test de la risa” no puede evitarlo nadie, ni el mismísimo Berners-Lee, estos últimos juegan con el desconocimiento de los que menos experiencia tienen en la web. Me puedo imaginar perfectamente a una persona mayor leyendo atentamente el contenido de la publicidad y dirigir su cursor a las opciones mostradas con la esperanza de obtener más información… Me parece que hay pocas experiencias de uso peores que esta.

Creo que no hace falta decir que ya tenemos suficiente con los Nigerianos como para encima tener que aguantar este tipo de torpezas marketinianas. Con lo bien que lo hacen de los de Spotify…

La mayoría del tiempo los mortales trabajamos en oficinas. Aunque “oficialmente no deberías hacerlo” allí, en ese espacio semi-privado, es donde la mayoría de nosotros usamos la web: viendo fotos de nuestros amigos, leyendo el periódico, comentando en blogs, enviando emails, buscando coche, casa, vuelos, chateando…

Por esa razón, es muy importante la privacidad y, como parte de esa privacidad, que la interfaz que tienes frente a ti sea silenciosa, que no haga ruído ni moleste.

Seguro que lo has vivido en más de una ocasión: Entras en tu periódico favorito y de repente salta una música que no sabes de dónde diablos proviene. Procuras rápidamente cerrar la ventana problemática, pero el daño ya está hecho: la gente que trabaja a tu alrededor ya ha arqueado la ceja preguntándose qué diablos estarás viendo en esa pantalla que tienes frente a ti.

Si quieres que la gente te vuelva a usar tu interfaz procura que sea silenciosa, discreta, nadie tiene que saber qué estás viendo. Por esa razón controlar todo lo que puede afectar a ese silencio es importante:

Si pincho en un vídeo quizá es mejor que empiece en silencio y, voluntariamente ya considerará el usuario la opción de activar el volumen o no.

Si pincho en un banner la página de destino también debería ser silenciosa, forma parte de la experiencia (por supuesto, el propio banner tendría que comportarse igual). Probablemente controlar esa publicidad sea más dificil, pero siempre puedes generar una “política de publicidad” donde indiques claramente que los banners publicados en tu sitio deben tener un destino que no afecte a la privacidad de los usuarios, que no haga ruído.

No hay cosa más desagradable que tener este tipo de experiencias en una oficina (sobre todo si eres nuevo). Genera un temor innecesario y una experiencia negativa que se puede solucionar considerando pequeños detalles como este.

Nota: La foto (genial como siempre) es de Dani Castillo. Los músicos: finareta y bdelcoso, de idealista.

Just to share a home-made video based on a digital hologram. The quality is not awesome but you can see how trough a piece o paper you can have “life” in your hands! (Youtube video, 1min):

If you´re curious about how this can be done, check this out: FLARToolkit.

You might also have your own experience.

Menu DVD

Everytime we decide to watch a DVD film we always face the same problem: What surprises will give us the film´s menu to set up language, subtitles, extras…?

It´s like a strange disease: None of these menus are the same, navigation between items are always different and the resources they use to tell you where you are inside the menu change from one DVD to another. Some of them choose themselves what “they think” you want you, some not…

Why the hell a sooo simple navigation scheme has to be sooo difficult to use? I´m afraid that this is because the main objective is to make these menus visual, trendy, cool. But visual, trendy or cool should be the film not the elements to put that film to work… I bet you that lot of elderly people cannot set the way they want a simple film.

“The menus themselves suffer badly from lack of standardization”. I think one of these days I´ll try to work on some guidelines for this silly stuff the right way.

Further reading: DVD Menu Design: The Failures of Web Design Recreated Yet Again

Larry Tesler

Larry Tesler is a computer scientist with a strong background in Interaction Design. He´s been working for several decades at Xerox PARC, Yahoo!, Amazon and Apple Computer.

In 1985, while working for the MacApp object-oriented framework at Apple,Tesler came up with an interesting law called Conservation of Complexity. According to this statement every application have an inherent amount of irreducible complexity. Beyond a given point, simplification can´t be improved.

An example to understand Tesler´s law was given by Dan Shaffer in his book “Designing for Interaction“:

“For an e-mail message, two elements are required: your e-mail address and the address of the person to whom you are sending the mail. If either of these items is missing, the e-mail can´t be sent, and your e-mail client will tell you so. It´s a necessary complexity. But some of that burden has likely been shifted to your e-mail client. You don´t typically have to enter your e-mail address every time you send e-mail; the e-mail program handles that task for you (…). The complesity isn´t gone, thought – instead, some of it has been shifted to the software.”

But I think this complexity is just inherent to a period of time. Innovation technology is strong enough to overcome those complex situations we human are sometimes faced to. Complexity, when talking about technology, is just a question of time.

Bullet point

Bullet points, those little dots placed next to a sentence, are a powerful tool to communicate in digital environments.

Users unconsciously appreciate content organized in small slots of information. Bullet points (when used properly) give readers the joy of reading more efficiently.

From the side of the editor, writing content with bullet points force the writer to reduce the amount of information to be shown, forcing to re-think what is critical and what is less important.

Readers, on the other side, will pay more attention to content organized with this typographical resource. Our eyes are more willing to watch at this little dots than to the rest of the “straight” content. They seem to have the more important information.

Bullet points can be an important tool when launching a new product and explaining what is all about. Good examples of a well applied use of bullet points can be seen in FriendFeed´s homepage. Three “thumbnail bullets” explain what the service is about:
FriendFeed bullet points

Tumblr is less explicit, and the hole service is explained using a block of text:
Tumblr´s home page

A different approach, using bullet points, could be this one:
Tumblr suggestion

No more than seven items:
According to George A. Miller´s “Magic 7″ article (1956), number “seven” is almost universally accepted as the human capacity limit for a wide range of issues. This “law” also applies to the use of bullets: more than seven items reduce the power of communication in digital screens.

No less than three:
If you only have two bullets, maybe the right approach would be (again) to reduce those two lines into one single line. While two bullets are meaningful, three bullets are the perfect number.

Airport vehicles: Form follows function

I love watching the activity of these working “Lemmings” when I am waiting for a flight connection at the airport. They just don´t stop working!

And, the more I see of them, the more I think they perfectly fit to this famous statement: “Form follows function“, one of the main principles of Bauhaus´s Design School.

They´re ugly, they look uncomfortable, they don´t leave any space for personal customization and, depending on the country you´re, they look a bit different, adapted to the local context they work with.

But, on the other side, their output is brilliant. They´re machines focused 100% on the activity. All the beautiful stuff has been forgotten. What remains is just for improving the outcome. They´re perfect for the work they´ve been designed for. To me they´re the best example of “just what you need and nothing else”.

Sometimes I like to think that one of these days digital products will be like these airport vehicles…

Touchscreen stencils for gestual interfaces

A few days ago Dan Saffer published his last book: Designing Gestural Interfaces. A friend of Dan, Rachel Glaves, from Adaptive Path, helped him drawing some of the most common gestures for gestual interaction: Tapping, sliding, pointing, dragging, pinching, and spreading.

These drawings are now available for everybody. You can get the stencils for Omnigraffe (.zip), Illustrator CS3 (.zip) and Photoshop (.zip).

The interesting making-of can be seen in the following picture:

Touchscreen stencils for gestual interfaces

Full screen on Flickr. Enjoy them!!