Saltar navegación
Contacto: (+34) 670 230 483

Usted está en: Inicio > Blog > Mashups de elementos de diseño

Mashups de elementos de diseño

Escrito por Sergio Sánchez Mancha el 25 Sep 2008

Un mashup (o remezcla) es una obra que contiene partes procedentes de creaciones anteriores para crear una nueva obra derivada. Por ejemplo, si hablamos en términos de diseño, una navaja suiza o un sacacorchos de palanca son mashups en toda regla.

En el diseño de interfaces digitales, la maleabilidad del medio permite crear con relativa facilidad combinaciones de elementos de diseño e implementarlos de forma ágil.

Nubes de etiquetas desplegables

Recientemente hemos descubierto un nuevo elemento de diseño que nos ha sorprendido bastante: las nubes de etiquetas (o tag clouds) desplegables. Se trata de nubes de etiquetas que despliegan un menú al pulsar sobre un ítem.

Algunos ejemplos:

Nube de etiquetas o tag cloud con subemnú

Tag cloud con menú desplegable

Ya comentamos en su día las bondades y desventajas del uso de nubes de etiquetas:

  • Son una buena herramienta para dar una idea de los contenidos de un sitio, siendo efectivas para mostrar "tendencias" en un tema.
  • Reflejan que detrás hay actividad mental y social
  • Tienen un efecto SEO positivo

No obstante no son buenas como elemento de navegación, más aún si los combinamos con otros elementos complejos para el usuario como los menús desplegables. En los ejemplos que hemos encontrado entendemos que es un mashup que aporta más notoriedad que valor.

Ruta de acceso con pestañas

Otro mashup de elementos de diseño que en cambio hemos visto implementado con éxito en muchos sitios web y aplicaciones es la ruta de acceso con pestañas o tabbed breadcrumb. Se trata de una ruta de acceso con aspecto de pestaña (o con aspecto pulsable) que permite desplegar un menú con el contenido de dicha sección.

Ruta de acceso con pestañas

Este elemento permite tener una visión global de la ubicación de un contenido a la vez que permite facilita la navegación a secciones previas.

Podemos ver algunos ejemplos de su implentación en páginas interiores de Yahoo Food y Yahoo TV, Apple utiliza algo similar en iTunes.

Ruta de acceso en iTunes

La ruta de acceso en Windows Vista tiene un comportamiento parecido:

Ruta de acceso en Windows Vista

La creación y la incorporación de un elemento novedoso de diseño puede ser a veces tentadora. No obstante antes de incorporarlo a una interfaz debemos valorar si se trata de un elemento que aporta valor al usuario o de un accesorio decorativo para denotar modernidad.



Comentarios (2)

TzekTzek dijo el 26 Sep 2008:

La tabbed breadcrumb está genial. Yo considero que efectivamente la metáfora de pestaña de folder es lo más efectivo para un menú y en combinación con las migajas, en cada "mirada" (cuando el usuario ve el menú), podría asegurar que no sólo re-identifica dónde está sino que también esta manera de presentar el menú le reconstruye mentalmente la estructura navegacional recorrida, "matando" así "dos pájaros de un tiro". Esto tiene que mejorar la capacidad de decisión y navegación en el usuario.

AndreasAndreas dijo el 11 Oct 2008:

Yo creo que muchos de los supuestos breadcrumbs no son migas de pan, sino señalética y rotulaje. En el caso de iTunes sí es un breadcrumb porque te dice por donde has pasado, pero en el caso de Windows creo que no te indica por dónde has pasado sino a qué secciones pertenece la ventana en la que estás.



Últimos tweets de Usolab

  • Ups, parece que ahora mismo no podemos mostrar nuestros tweets.

Proyectos propios

Bankimia

Bankimia es un comparador de productos financieros.

Actualmente ofrece información sobre hipotecas, depósitos bancarios, cuentas y préstamos de 42 bancos y cajas.