Cuando y como tenemos que usar los diálogos modales, ha sido siempre una pregunta que los expertos en usabilidad se han formulado y en general el sentimiento era que mejor evitarlos o no abusar de ellos.

Ahora bien, no siempre es malo usarlos como vamos a ver ya que existen casos en que un dialogo modal es la solución perfecta a un problema concreto y como consecuencia de esto, se han extendido a lo largo de la web (y lo que no es la Web) los Lightbox.

¿Qué son los Lightbox?

El Ligthbox, es una técnica que nos muestra un dialogo modal y nos permite centrar la atención en el propio dialogo ya que la característica más representativa es que oscurecen el resto de pantalla pudiendo así centrar la atención del usuario en el susodicho dialogo traduciéndose esto en centrar la atención del usuario en una tarea concreta.

¿Por qué usar un Lightbox?

Como vamos a ver ahora hay varias razones para usar los Lightbox y seguramente con el tiempo, esto pasara a ser un patrón de diseño de Iteración.

Según la propia definición un patrón de diseño es una solución global a un problema concreto dentro de un contexto.

Que quiero decir con esto, pues que si aplicamos un Lightbox para solucionar un problema para el cual no se pensó o lo aplicamos en un contexto inadecuado, nos vamos a encontrar con un anti patrón, por lo tanto, los Lightbox tenemos que usarlos pero cuando sea pertinente, así que no abusemos de ellos por favor.

Las característas que definen al Lightbox son:

• Centra la atención del usuario en él, siendo prácticamente imposible que nos pase inadvertido ya que se oscurece toda la pantalla quedando resaltado el dialogo que estamos mostrando. Esto le obliga al usuario a centrar la atención en el punto que ha quedado resaltado (y como ya he dicho antes), traduciéndose esto a centrar la atención en una tarea concreta.
• Dialogo modal que no nos permite realizar ninguna acción ajena a su funcionalidad llevada al extremo ya que todo queda inactivo exceptuando el susodicho dialogo.
• Le indica al usuario que la aplicación está trabajando y no esta caída o colgada, es decir, al centrar el usuario la atención en el Lightbox se da cuenta que tiene que hacer algo, lo que no ocurre si pretendemos solucionar un problema con otro tipo de técnica (quien no se acuerda del típico formulario en la parte superior – inferior de la página y que el usuario no ve).

¿Dónde usar los Lightbox?

Al final la propia naturaleza del Lightbox nos va a decir donde usarlos ya que lo que nos aporta es muy concreto, eso sí, donde actualmente predominan es:

• Galerías de imágenes.
• Controles de Envío de correos.
• Mensajes de advertencia.

Aun así el sitio más óptimo donde usarlo va a ser aquel en los que nos encontremos con:

• El usuario tiene que centrar la atención en un sitio concreto, por lo tanto en una tarea concreta.
• Es imprescindible que esta tarea se realice.

Por Lightbox, también se conoce (o quizá le ha dado el nombre) a la librería de Javascript que te permite mostrar una imagen con esta técnica. Aparte de Lightbox existen infinidad de librerías que hacen esta u otras cosas como por ejemplo Shadowbox.

Lightbox en Windows Vista

Lightbox en WordPress

Por último, decir que seguramente esta la técnica de diseño de interacción del año como indica Jacob Nielsen que hace una breve referencia a ellos en su Alertbox de Agosto de 2008.

Mientras he escrito este post estaba escuchando el Kick de White Rose Movement, así que aqui os dejo con ellos y yo mis druguitos, me largo que me voy de viaje.