{"id":15239,"date":"2020-12-15T13:59:21","date_gmt":"2020-12-15T11:59:21","guid":{"rendered":"http:\/\/design-toolkit.recursos.uoc.edu\/?p=15239"},"modified":"2021-01-27T21:32:18","modified_gmt":"2021-01-27T19:32:18","slug":"metafora","status":"publish","type":"post","link":"http:\/\/design-toolkit-test.uoc.edu\/es\/metafora\/","title":{"rendered":"Met\u00e1fora"},"content":{"rendered":"<h2>\u00bfQu\u00e9 es?<\/h2>\n<p>Una <strong>met\u00e1fora<\/strong> consiste en el uso de una analog\u00eda que puede presentarse en diversos formatos como puede ser una imagen, un s\u00edmbolo o un texto, para referirse a un concepto que no es denotado de manera literal, sino en sentido figurado sobre la base de determinadas semejanzas entre el concepto y el elemento que se utiliza para representarlo. En dise\u00f1o, una met\u00e1fora se emplea para tratar de lograr que la interacci\u00f3n sea m\u00e1s simple e intuitiva.<\/p>\n<p>El uso de met\u00e1foras forma parte intr\u00ednseca del lenguaje humano y, por tanto, de nuestro pensamiento. Este concepto entra de lleno en el \u00e1mbito del dise\u00f1o cuando se emplea un elemento para referirse a una funci\u00f3n o un contenido. Las met\u00e1foras nos ayudan a explicar algo nuevo y desconocido para el usuario, en t\u00e9rminos con los que ya est\u00e1 familiarizado previamente. As\u00ed, a partir del uso de met\u00e1foras, se pretende proporcionar referencias familiares que permitan a las personas comprender f\u00e1cilmente el modelo conceptual subyacente y conocer qu\u00e9 hacer con un objeto o interfaz.<\/p>\n<p>La inclusi\u00f3n de una met\u00e1fora puede tener un gran impacto en la interacci\u00f3n del usuario. Una met\u00e1fora puede permitirle predecir m\u00e1s f\u00e1cilmente el resultado de sus acciones. Un ejemplo muy extendido es la denominada <strong>met\u00e1fora del escritorio<\/strong>, com\u00fanmente empleada en sistemas operativos como GNU\/Linux, Windows o MacOS.<\/p>\n<div id=\"attachment_11804\" style=\"width: 718px\" class=\"wp-caption alignnone\"><img aria-describedby=\"caption-attachment-11804\" loading=\"lazy\" class=\"my-image wp-image-11804 \" src=\"\/wp-content\/uploads\/2020\/12\/75590_27.jpg\" alt=\"\" width=\"708\" height=\"398\" \/><p id=\"caption-attachment-11804\" class=\"wp-caption-text\">Escritorio de Sistema Operativo Linux <br \/>Fuente: Wikimedia.<\/p><\/div>\n<p>Las met\u00e1foras se pueden emplear de tres formas:<\/p>\n<ol>\n<li>Con el prop\u00f3sito de proporcionar un marco conceptual a la tarea que el usuario est\u00e1 realizando (por ejemplo, navegar por la web).<\/li>\n<li>Como un modelo conceptual trasladado a una interfaz de usuario (por ejemplo, a modo de una tarjeta informativa cuando consultamos las propiedades de un fichero).<\/li>\n<li>Como una forma de visualizar una funci\u00f3n (por ejemplo, un icono de un carrito de compra en el que se van insertando los productos de nuestra compra en l\u00ednea).<\/li>\n<\/ol>\n<p>Sin embargo, se debe hacer especial hincapi\u00e9 en que las met\u00e1foras tambi\u00e9n pueden contravenir las expectativas de los usuarios sobre c\u00f3mo deber\u00edan ser las cosas. As\u00ed, se ha de tener en cuenta que la met\u00e1fora puede fallar. Algunos de los motivos est\u00e1n relacionados con una escalabilidad limitada (una met\u00e1fora que funciona bien para un proceso simple puede no funcionar bien cuando el proceso crece en tama\u00f1o o complejidad) o con la multiculturalidad (cuando se basa en asociaciones percibidas de manera diferente por el dise\u00f1ador y el usuario).<\/p>\n<p>Un ejemplo de aplicaci\u00f3n problem\u00e1tica es la met\u00e1fora basada en el buz\u00f3n del correo (empleada en algunos clientes de correo electr\u00f3nico) que se emplea com\u00fanmente en los Estados Unidos. Este buz\u00f3n es distinto del que suele usarse en Europa y otros continentes, y por tanto, es una met\u00e1fora que puede no tener sentido para un usuario no norteamericano, aportando m\u00e1s complejidad a la interfaz.<\/p>\n<div id=\"attachment_11802\" style=\"width: 310px\" class=\"wp-caption alignnone\"><img aria-describedby=\"caption-attachment-11802\" loading=\"lazy\" class=\"my-image wp-image-11802 size-medium\" src=\"\/wp-content\/uploads\/2020\/12\/75590_28-300x232-1.jpg\" alt=\"\" width=\"300\" height=\"232\" \/><p id=\"caption-attachment-11802\" class=\"wp-caption-text\">Dise\u00f1o de buz\u00f3n norteamericano <br \/>Fuente: Pixabay.<\/p><\/div>\n<h2>Aplicaci\u00f3n<\/h2>\n<p>En el \u00e1mbito del dise\u00f1o se hace un amplio uso de las met\u00e1foras, desde los iconos hasta los t\u00e9rminos utilizados. Un dise\u00f1o puede hacerse m\u00e1s intuitivo si se utilizan las met\u00e1foras correctas.<\/p>\n<p>Las met\u00e1foras no se utilizan solo a modo de iconos (ejemplo de la papelera de reciclaje), sino que muchos de los conceptos en un producto se basan tambi\u00e9n en met\u00e1foras (ejemplo del escritorio).<\/p>\n<p>Si un dise\u00f1o se basa en un concepto real y es f\u00e1cil de identificar, ser\u00e1 m\u00e1s comprensible para los usuarios, pero si se basa en un concepto demasiado abstracto, los usuarios tendr\u00e1n dificultades para comprenderlo. Como dise\u00f1adores puede resultar dif\u00edcil encontrar la met\u00e1fora adecuada, especialmente si se trata de aplicarla a un concepto que presenta cierta complejidad.<\/p>\n<p>En todo caso, el objetivo global a tener en cuenta consiste en reducir el esfuerzo cognitivo de los usuarios en su comprensi\u00f3n de la funci\u00f3n, el uso y el significado de un producto, desde una doble perspectiva: identificando claramente el producto y transmitiendo informaci\u00f3n acerca de c\u00f3mo se debe usar el producto. Las met\u00e1foras tambi\u00e9n se pueden utilizar con el prop\u00f3sito de crear experiencias positivas, tanto desde el punto de vista sensorial como emocional.<\/p>\n<p>Un error muy com\u00fan es tratar de dise\u00f1ar una met\u00e1fora que se comporte literalmente como la entidad con la que se compara. As\u00ed, algunos autores como Ted Nelson recomiendan una serie de principios de dise\u00f1o:<\/p>\n<ul>\n<li><strong>Romper las reglas<\/strong>: algunas met\u00e1foras han funcionado muy bien, incluso asumiendo contradicciones con el prop\u00f3sito de \u00abacomodar\u00bb la met\u00e1fora. En estos casos, hay que evaluar si realmente la met\u00e1fora responde a sus objetivos, o si aumenta la complejidad del uso del producto.<\/li>\n<li><strong>Dotar de flexibilidad a la met\u00e1fora<\/strong>: un argumento en contra de las met\u00e1foras es que, para ajustarse a la entidad con las que se compara, se dise\u00f1an de una manera demasiado restrictiva.<\/li>\n<li><strong>Asegurar la comprensi\u00f3n<\/strong>: los usuarios pueden ser \u00abeducados\u00bb en una comprensi\u00f3n del sistema basada en una met\u00e1fora concreta, lo que les limita para saber qu\u00e9 pueden hacer con el sistema m\u00e1s all\u00e1 de las acciones sugeridas por la met\u00e1fora.<\/li>\n<li><strong>Evitar puntos de partida err\u00f3neos<\/strong>: en ocasiones, los dise\u00f1adores tratan de crear un objeto virtual para que se parezca a un objeto f\u00edsico familiar, que de base no est\u00e1 bien dise\u00f1ado.<\/li>\n<li><strong>No autolimitarse a lo ya existente<\/strong>: saber que los usuarios est\u00e1n muy familiarizados con algunos tipos de met\u00e1foras \u00abcl\u00e1sicas\u00bb no debe impedir a los dise\u00f1adores crear nuevos modelos.<\/li>\n<\/ul>\n<h2>Ejemplos<\/h2>\n<p>A continuaci\u00f3n, se presentan ejemplos de met\u00e1foras que se incorporan tanto a productos f\u00edsicos como digitales.<\/p>\n<p><strong>Productos f\u00edsicos<\/strong><\/p>\n<p>Un ejemplo muy extendido es el de las c\u00e1maras de seguridad. La intenci\u00f3n de los dise\u00f1adores en el producto que se presenta en la siguiente figura fue aplicar la met\u00e1fora de un agente de proximidad que vela por la seguridad de los dem\u00e1s, incorporando elementos humanos (como una cara con dos ojos y una boca a modo de sensor o micr\u00f3fono) y que, adem\u00e1s, parezca \u00abamistoso\u00bb. Se evita la met\u00e1fora de un vigilante de seguridad, con el objetivo de disminuir la sensaci\u00f3n de supervisi\u00f3n y de estar siendo controlado por un \u00abgran hermano\u00bb.<\/p>\n<div id=\"attachment_11800\" style=\"width: 623px\" class=\"wp-caption alignnone\"><img aria-describedby=\"caption-attachment-11800\" loading=\"lazy\" class=\"my-image wp-image-11800 \" src=\"\/wp-content\/uploads\/2020\/12\/75590_29.jpg\" alt=\"\" width=\"613\" height=\"460\" \/><p id=\"caption-attachment-11800\" class=\"wp-caption-text\">C\u00e1mara de seguridad <br \/>Fuente: Wikimedia.<\/p><\/div>\n<p>En cambio, las estructuras de c\u00e1maras con forma de ara\u00f1a, por ejemplo, las que se encuentran en las prisiones, pretenden hacer entender al usuario que estar\u00e1 siendo vigilado continuamente sin que existan \u00e1ngulos muertos.<\/p>\n<div id=\"attachment_11798\" style=\"width: 598px\" class=\"wp-caption alignnone\"><img aria-describedby=\"caption-attachment-11798\" loading=\"lazy\" class=\"my-image wp-image-11798 \" src=\"\/wp-content\/uploads\/2020\/12\/75590_30.jpg\" alt=\"\" width=\"588\" height=\"392\" \/><p id=\"caption-attachment-11798\" class=\"wp-caption-text\">C\u00e1mara de seguridad de prisi\u00f3n <br \/>Fuente: Pexels.<\/p><\/div>\n<p>Otro ejemplo aparece en la met\u00e1fora que se aplica en el dise\u00f1o de los extintores. Los elefantes son ampliamente conocidos por rociar agua de manera h\u00e1bil a trav\u00e9s de su trompa. En caso de un incendio, la primera actuaci\u00f3n suele ser realizada por usuarios que no tienen experiencia en apagar un fuego. As\u00ed, un usuario que se enfrente a un inicio de incendio puede recordar c\u00f3mo expulsan el agua los elefantes y ser capaz de emplear un extintor de manera h\u00e1bil, aun sin haber empleado nunca ninguno antes. Esta asociaci\u00f3n se consigue mediante la forma de la manguera, que recuerda vagamente a la trompa de un elefante.<\/p>\n<div id=\"attachment_11796\" style=\"width: 210px\" class=\"wp-caption alignnone\"><img aria-describedby=\"caption-attachment-11796\" loading=\"lazy\" class=\"my-image wp-image-11796 size-full\" src=\"\/wp-content\/uploads\/2020\/12\/75590_31.jpg\" alt=\"\" width=\"200\" height=\"352\" \/><p id=\"caption-attachment-11796\" class=\"wp-caption-text\">Extintor <br \/>Fuente: Wikimedia.<\/p><\/div>\n<p><strong>Productos digitales<\/strong><\/p>\n<p>En el dise\u00f1o de productos digitales, el uso de met\u00e1foras no es menos corriente que en otros tipos de entornos. La met\u00e1fora m\u00e1s famosa es la conocida como la <strong>met\u00e1fora de escritorio<\/strong>. La met\u00e1fora del escritorio se emple\u00f3 en la transici\u00f3n de los sistemas operativos basados en l\u00edneas de comandos (por ejemplo, MS-DOS), hacia interfaces de manipulaci\u00f3n directa a trav\u00e9s de perif\u00e9ricos como el rat\u00f3n. Tanto la gran mayor\u00eda de los sistemas operativos antiguos (siguiente figura) como los actuales emplean esta met\u00e1fora. En ella, los elementos de la interfaz se articulan, se relacionan y se presentan de manera similar a la que lo har\u00edan en un escritorio f\u00edsico.<\/p>\n<div id=\"attachment_11794\" style=\"width: 310px\" class=\"wp-caption alignnone\"><img aria-describedby=\"caption-attachment-11794\" loading=\"lazy\" class=\"my-image wp-image-11794 size-medium\" src=\"\/wp-content\/uploads\/2020\/12\/75590_32-300x205-1.jpg\" alt=\"\" width=\"300\" height=\"205\" \/><p id=\"caption-attachment-11794\" class=\"wp-caption-text\">Escritorio de Apple II <br \/>Fuente: toastytech.com.<\/p><\/div>\n<p>A su vez, dentro de estos escritorios se incluyen otras met\u00e1foras coherentes, como las carpetas y los documentos en las que guardamos informaci\u00f3n, o la papelera donde se eliminan los elementos que no se desean conservar. Adem\u00e1s, se utiliza un estilo de interacci\u00f3n que imita la forma de actuar sobre dichos objetos en el mundo real (por ejemplo, arrastrando un documento para moverlo de una carpeta a otra).<\/p>\n<div id=\"attachment_11792\" style=\"width: 410px\" class=\"wp-caption alignnone\"><img aria-describedby=\"caption-attachment-11792\" loading=\"lazy\" class=\"my-image wp-image-11792\" src=\"\/wp-content\/uploads\/2020\/12\/75590_33.jpg\" alt=\"\" width=\"400\" height=\"86\" \/><p id=\"caption-attachment-11792\" class=\"wp-caption-text\">Papelera de reciclaje en escritorio Windows <br \/>Fuente: elaboraci\u00f3n propia.<\/p><\/div>\n<p>Otro ejemplo de una met\u00e1fora aplicada en entorno digital es el iBooks de Apple. iBooks utiliz\u00f3 un dise\u00f1o de estanter\u00eda de madera con un enfoque en 3D. La met\u00e1fora de la estanter\u00eda estaba destinada a ayudar a los usuarios a transferir su conocimiento previo sobre las estanter\u00edas (como un lugar para almacenar y organizar libros) al entorno digital. Los estantes y las texturas de madera son irrelevantes para la funcionalidad de la aplicaci\u00f3n, pero forman parte de la met\u00e1fora.<\/p>\n<div id=\"attachment_11790\" style=\"width: 810px\" class=\"wp-caption alignnone\"><img aria-describedby=\"caption-attachment-11790\" loading=\"lazy\" class=\"my-image wp-image-11790 size-full\" src=\"\/wp-content\/uploads\/2020\/12\/75590_34.jpg\" alt=\"\" width=\"800\" height=\"600\" \/><p id=\"caption-attachment-11790\" class=\"wp-caption-text\">Entorno iBooks en iPad <br \/>Fuente: Flickr.<\/p><\/div>\n<p>Continuando en el entorno de los ordenadores personales, debemos destacar el icono en forma de disco flexible empleado para guardar documentos en MS Word, tal y como muestra la siguiente figura. Actualmente, la funci\u00f3n de guardar suele representarse mediante un disco de 3,5 pulgadas cuyo origen es del siglo pasado. Esta met\u00e1fora funciona muy bien, aunque quiz\u00e1s se deba plantear un cambio a medida que avancemos hacia una tecnolog\u00eda m\u00e1s avanzada. El actual icono de guardar \u00aben disco\u00bb puede resultar obsoleto teniendo en cuenta los nuevos dispositivos de almacenamiento, como las memorias <em>flash<\/em> o el almacenamiento en la nube. Es posible que los nacidos en el siglo XXI ni siquiera hayan visto alguna vez un disco de 3,5 pulgadas, aunque ya est\u00e9n familiarizados con esta forma tan presente en diferentes aplicaciones.<\/p>\n<div id=\"attachment_11788\" style=\"width: 410px\" class=\"wp-caption alignnone\"><img aria-describedby=\"caption-attachment-11788\" loading=\"lazy\" class=\"my-image wp-image-11788\" src=\"\/wp-content\/uploads\/2020\/12\/75590_35.jpg\" alt=\"\" width=\"400\" height=\"161\" \/><p id=\"caption-attachment-11788\" class=\"wp-caption-text\">Entorno Microsoft Word <br \/>Fuente: elaboraci\u00f3n propia.<\/p><\/div>\n<h2>Referencias<\/h2>\n<p><strong>Carroll, J. K.; Mack, R. L.; Kellogg, W. A.<\/strong> (1988). \u00abInterface Metaphors and User Interface Design\u00bb. En: M. Helander (ed.). <em>Handbook of Human-Computer Interaction<\/em> (p\u00e1gs. 67-85). Elsevier Science.<\/p>\n<p><strong>Cooper, A.; Reimann, R.; Cronin, D.<\/strong> (2007). <em>About face 3: the essentials of interaction design<\/em>. John Wiley &amp; Sons.<\/p>\n<p><strong>Dourish, P.<\/strong> (2001). <em>Where the Action Is<\/em>. MIT Press.<\/p>\n<p><strong>Kaptelinin, V.; Czerwinski, M.<\/strong> (2007). <em>Beyond the desktop metaphor: designing integrated digital work environments<\/em> (vol. 1). MIT Press.<\/p>\n<p><strong>Nelson, T.<\/strong> (1990). \u00abThe right way to think about software design\u00bb. En: B. Laurel (ed.). <em>The Art of Human-Computer Design<\/em>. Reading, MA: Addison-Wesley.<\/p>\n<p><strong>Norman, D.<\/strong> (1988). <em>The Design of Everyday Things<\/em>. Nueva York: Basic Books.<\/p>\n<p><strong>Preece, J.; Rogers, Y.; Sharp, H.<\/strong> (2015). <em>Interaction design: beyond human-computer interaction<\/em>. John Wiley &amp; Sons.<\/p>\n<p><strong>Richards, S. M. y otros<\/strong> (1994). \u00abThe Use of Metaphors in Iconic Interface Design\u00bb. <em>Intelligent Tutoring Media<\/em> (vol. 5, <em>issue<\/em> 2).<\/p>\n<p><strong>Vaananen, K.; Schmidt, J.<\/strong> (1994, abril). \u00abUser Interface for Hypermedia: How to Find Good Metaphors?\u00bb. <em>Proceedings of CHI&#8217;94<\/em>. Boston.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u00bfQu\u00e9 es? Una met\u00e1fora consiste en el uso de una analog\u00eda que puede presentarse en diversos formatos como puede ser una imagen, un s\u00edmbolo o un texto, para referirse a un concepto que no es denotado de manera literal, sino en sentido figurado sobre la base de determinadas semejanzas entre el concepto y el elemento [&hellip;]<\/p>\n","protected":false},"author":4,"featured_media":18201,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[28,27],"tags":[],"_links":{"self":[{"href":"http:\/\/design-toolkit-test.uoc.edu\/es\/wp-json\/wp\/v2\/posts\/15239\/"}],"collection":[{"href":"http:\/\/design-toolkit-test.uoc.edu\/es\/wp-json\/wp\/v2\/posts\/"}],"about":[{"href":"http:\/\/design-toolkit-test.uoc.edu\/es\/wp-json\/wp\/v2\/types\/post\/"}],"author":[{"embeddable":true,"href":"http:\/\/design-toolkit-test.uoc.edu\/es\/wp-json\/wp\/v2\/users\/4\/"}],"replies":[{"embeddable":true,"href":"http:\/\/design-toolkit-test.uoc.edu\/es\/wp-json\/wp\/v2\/comments\/?post=15239"}],"version-history":[{"count":6,"href":"http:\/\/design-toolkit-test.uoc.edu\/es\/wp-json\/wp\/v2\/posts\/15239\/revisions\/"}],"predecessor-version":[{"id":17629,"href":"http:\/\/design-toolkit-test.uoc.edu\/es\/wp-json\/wp\/v2\/posts\/15239\/revisions\/17629\/"}],"wp:featuredmedia":[{"embeddable":true,"href":"http:\/\/design-toolkit-test.uoc.edu\/es\/wp-json\/wp\/v2\/media\/18201\/"}],"wp:attachment":[{"href":"http:\/\/design-toolkit-test.uoc.edu\/es\/wp-json\/wp\/v2\/media\/?parent=15239"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/design-toolkit-test.uoc.edu\/es\/wp-json\/wp\/v2\/categories\/?post=15239"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/design-toolkit-test.uoc.edu\/es\/wp-json\/wp\/v2\/tags\/?post=15239"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}