Also available in English

Inf@Vis!

La revista digital de InfoVis.net

Menús Pastel
por Juan C. Dürsteler [mensaje nº 124]

Los menús-pastel (pie-menus) muestran cierta superioridad sobre los ubicuos menús lineales a los que estamos tan acostumbrados. ¿Por qué no han proliferado más y sólo se muestran en algunas aplicaciones?

Menú pastel. Instantánea de un menú ficticio extraído de las interesantes demos de Don Hopkins en su página Pie Menu Central por cortesía del autor.
En este caso se ha pulsado sobre uno de los menus (NorthWest) lo que daría lugar a la aparición de un submenu.

Los usuarios de ordenador estamos muy acostumbrados a la noción de menú que asociamos fuertemente a las barras de menú, los menús desplegables o los “pop-up” menús y los diálogos de las interfaces de usuario con que lidiamos cada día. 

La mayoría de ellos son ejemplos de menús lineales, en los que las opciones están dispuestas en línea, típicamente en horizontal o vertical, esto es, las opciones están una debajo de otra o una al lado de otra.

A diferencia de los menús lineales, en el menú-pastel las opciones se disponen circularmente como si fueran las porciones de un pastel, de ahí su nombre. 

Éste es un tipo de menú poco habitual aunque en absoluto nuevo. Ya en 1988 Callahan* y otros investigadores comparaban los menús pastel contra los menús lineales sobre 33 sujetos, encontrando que los primeros eran en promedio un 15% más rápidos en cuanto a su localización por parte del usuario. Sin embargo los menús lineales solo eran peores en cuanto a rapidez y errores en el 50% de las opciones más alejadas del punto inicial del cursor.

¿Por qué, entonces, no les hemos visto el pelo más que en algunas aplicaciones como videojuegos o prototipos de programas avanzados como DENIM? (véase el número 122 de la revista).

Hace dos semanas, durante un curso en Estocolmo para jóvenes profesionales del diseño digital, enseñé algunos menús-pastel y pregunté si creían que un menú lineal podía ser más o menos efectivo que un menú-pastel. La respuesta fue unánime y casi inmediata. Todos se decantaban por el menú lineal. Mi propia reacción cuando escribí el artículo sobre DENIM fue la misma; tan acostumbrados estamos al paradigma “oficial”.

Ejemplos de Menú Pastel mostrando las diversas posibilidades, en especial se pueden combinar menús pastel circulares con menús lineales. Instantáneas de las demos de Don Hopkins en su página Pie Menu Central. por cortesía del autor. 

Jason Hong, tiene una página sobre este tipo de menús, desde la que se pueden descargar programas en Java con su código fuente correspondiente. Según él las ventajas principales son tres:

  • A diferencia de los menús lineales, todas las opciones del menú están a la misma distancia del centro. Ello hace que prácticamente caigan todas dentro de nuestra visión foveal evitando que las perdamos de vista

  • El área de atención para seleccionar una opción del menú es mayor que en los menús lineales. De hecho puedes extender la porción del pastel hasta el final de la pantalla-

  • Los seres humanos tienden a recordar mejor en que ángulo estaba una opción que su posición en una lista lineal.

Uno de los problemas de los menús-pastel es que al pulsar una opción, si ésta tiene sub-opciones, el nuevo pastel que surge ocluye parcialmente al anterior, lo que no ocurre con los menús lineales. Una solución a este problema consiste en hacer los menús semi-transparentes que eliminan la oclusión.

PiemenuHong.gif (4292 bytes) PiemenuTransp.gif (12740 bytes)
Menus pastel en la implementación de Jason Hong. Instantáneas de las demos que se pueden hallar en su página. Nótese el problema de la oclusión de unos menús por otros, solucionada mediante transparencia. Imágenes por cortesía del autor.

Don Hopkins, uno de los pioneros de este tema, mantiene “Pie Menu Central” donde se puede encontrar numerosa información y enlaces a otras páginas. Entre sus trabajos incluyendo menús-pastel se cuentan, entre otros SimCity y los Sims  , un conocido juego de simulación que hace uso de estos menús para controlar la vida de los personajes. Desde sus sitio se pueden bajar incluso plug-ins ActiveX o código JavaScript para añadir menús-pastel a tu sitio web. También se pueden ver múltiples aplicaciones de dichos menús, en conjunción con XML, DHTML, JavaScript y ActiveX. Vale mucho la pena ver las diferentes demos que se encuentran en esa página.

Y volvemos a la pregunta, ¿si son más eficientes, como el juego “Fasteroids” nos permite comprobar, por qué no se han impuesto en vez de los menús lineales?. 

Le hemos formulado la pregunta a Don Hopkins. Su interesante respuesta merece un artículo entero. La semana que viene lo tendremos.


Jack Callahan, Don Hopkins, Mark Weiser and Ben Shneiderman. “An empirical comparison of pie menus versus linear menus” Proc CHI’88 Human Factors in Computer Systems. Chapter of ACM (March 1982), 190-196

Enlaces de este artículo:

http://catalog.com/hopkins/piemenus/index.html   Pie Menu Central
http://www.infovis.net/printMag.php?num=122&lang=1   Numero 122 titulado DENIM, del lçapiz a la web
http://www.cs.berkeley.edu/~jasonh/download/software/piemenu/   Página de Jason Hong
http://thesims.ea.com/   Página de los Sims
http://www.piemenu.com/JavaScriptPieMenus.html   Pie menus en Javascript
http://www.piemenu.com/fasteroids.html   El juego "Fasteroids"
© Copyright InfoVis.net 2000-2018