![\"\"](\"https:\/\/alistapart.com\/wp-content\/uploads\/2012\/07\/2ButtonsA.png?w=960\")
<\/figure>\n\n\n\nAqu\u00ed, la est\u00e9tica comunica funci\u00f3n. El ejemplo de la derecha se parece a un bot\u00f3n f\u00edsico. Los bordes en relieve y el relleno degradado despejan cualquier duda sobre su funci\u00f3n. En este caso, esas son caracter\u00edsticas de lo que en ingl\u00e9s se conoce como \u201caffordance<\/a>\u201d<\/em>, aspectos del dise\u00f1o que ayudan al usuario a descubrir c\u00f3mo podr\u00eda interactuar con un objeto. Traduciendo: si se ve como un bot\u00f3n, debe de ser un bot\u00f3n.<\/p>\n\n\n\n De la misma manera, hay una raz\u00f3n por la que las buenas pantallas de confirmaci\u00f3n tienen una marca de verificaci\u00f3n y tienden a incluir alg\u00fan tono de verde: el verde es bueno. El rojo es malo. El amarillo es para pensar. Cuando dise\u00f1amos, debemos considerar c\u00f3mo nuestro cerebro interpreta el significado de colores, sombras y rellenos. Rara vez nos damos cuenta de estas decisiones est\u00e9ticas, excepto cuando alguien las usa mal:<\/p>\n\n\n\n En este ejemplo, el lenguaje visual entra en conflicto con la intenci\u00f3n del mensaje.<\/p>\n\n\n\n De lo que estamos hablando aqu\u00ed es c\u00f3mo nuestro cerebro interpreta el significado de cosas como color, sombra, relleno y otros elementos naturales. Simplemente toma un trozo de papel y observa c\u00f3mo la sombra cambia a medida que acercas la hoja a ti. Es este tipo de acontecimientos naturales que nuestro cerebro observa cada d\u00eda en el mundo real. Cuando usamos estos aspectos en una pantalla, van cargados con las mismas propiedades que en el mundo real.<\/p>\n\n\n\n Pero la est\u00e9tica es m\u00e1s que s\u00f3lo comunicar funci\u00f3n, y el estilo es m\u00e1s que sencillamente disfrutar.<\/p>\n\n\n\n Cuando hablamos de \u201csentimientos\u201d, estamos hablando de sensaciones y emociones \u2014no del tipo de sensaciones y emociones como en \u201cme siento bien con tu marca\u201d, sino sobre las formas en c\u00f3mo influyen en la usabilidad percibida y real. Volvamos a ver el ejemplo del bot\u00f3n, con un peque\u00f1o cambio:<\/p>\n\n\n\n Hablando cognitivamente, ambos son obviamente botones. Ning\u00fan bot\u00f3n est\u00e1 \u201cmal\u201d como en el ejemplo anterior. Sin embargo, investigaciones sobre atenci\u00f3n, persuasi\u00f3n, elecci\u00f3n, felicidad, aprendizaje y otros temas similares sugieren que el bot\u00f3n m\u00e1s atractivo es posiblemente el que va a ser usados m\u00e1s veces, por la mayor\u00eda de las personas. Para tener una idea de donde viene esta idea, piensa en este comentario del neurobi\u00f3logo Antonio Damasio sobre las emociones:<\/p>\n\n\n\n \u201c\u2026emoci\u00f3n no es un lujo: es una expresi\u00f3n de mecanismos b\u00e1sicos de regulaci\u00f3n de la vida desarrollados en evoluci\u00f3n, y es indispensable para la supervivencia. Juega un papel fundamental en virtualmente todos los aspectos del aprendizaje, razonamiento y creatividad. De alguna forma sorprendente, puede tener un rol en la construcci\u00f3n de consciencia.\u201d [1<\/a>]<\/p><\/blockquote>\n\n\n\n En muchas conversaciones de dise\u00f1o, existe la creencia de que las aplicaciones se disfrutan porque las hacemos f\u00e1ciles de usar y eficientes (interesantemente, se diga o no, estas conversaciones valoran el papel que la est\u00e9tica juega en la cognici\u00f3n). Sin embargo, cuando hablamos sobre c\u00f3mo las emociones influyen en las interacciones, lo que m\u00e1s se acerca a la verdad es decir que las cosas que se disfrutan ser\u00e1n f\u00e1ciles de usar y eficientes. D\u00e9jame explicarte.<\/p>\n\n\n\n La personalidad del producto influye en nuestras percepciones. Piensa qu\u00e9 tan r\u00e1pido nos creamos expectativas acerca de alguien simplemente bas\u00e1ndonos en c\u00f3mo se viste o presenta. Esto es algo que la industria del autom\u00f3vil ha sabido por a\u00f1os, gastando dinero en crear productos que expresan una personalidad espec\u00edfica con la que la gente se podr\u00eda identificar. \u00bfPor qu\u00e9 un Dodge Ram parece m\u00e1s duradero? \u00bfQu\u00e9 hace que un Mini Cooper se vea en\u00e9rgico y divertido? A\u00fan cuando seguramente hay funciones de desempe\u00f1o para respaldar estos reclamos mentales, tambi\u00e9n podemos ver esos atributos expresados en la forma del coche.<\/p>\n\n\n\n De la misma manera, las decisiones de dise\u00f1o de UI que hacemos afectan la personalidad percibida de nuestras aplicaciones. En el ejemplo de debajo, \u00bfcu\u00e1l ventana es m\u00e1s amigable? \u00bfCu\u00e1l se ve m\u00e1s profesional?<\/p>\n\n\n\n Los productos tienen personalidad. \u00bfPor qu\u00e9 nos deber\u00eda importar? Piensa en esto:<\/p>\n\n\n\n \u2026y as\u00ed sucesivamente.<\/p>\n\n\n\n Tomando decisiones intencionales y conscientes acerca de la personalidad de tu producto, puedes moldear respuestas positivas o negativas. Dale un vistazo a Sony y c\u00f3mo aplicaron este conocimiento en el Sony AIBO<\/a>. Pensemos por qu\u00e9 hicieron que este robot se parezca a un cachorro.<\/p>\n\n\n\n En este caso, tienes un dispositivo rob\u00f3tico que no es perfecto. No entender\u00e1 la mayor\u00eda de las cosas que le digas. Podr\u00eda \u2014o no\u2014 seguir las instrucciones que s\u00ed entienda. Y no hace mucho en realidad.<\/p>\n\n\n\n Si este robot fuera un mayordomo adulto que respondiera a la mitad de nuestros pedidos e hiciera con frecuencia algo diferente a lo que le ordenamos, lo considerar\u00edamos roto e in\u00fatil. Pero como cachorro, sus comportamientos nos parecen \u201ctiernos\u201d. Los cachorros no son conocidos por seguir instrucciones. Y cuando el robot cachorro realmente lo consigue, estamos maravillados. \u201cMira, \u00a1dio la vuelta!\u201d. Qu\u00e9 manera m\u00e1s genial de entrar al mercado de los robots.<\/p>\n\n\n\n Piensa: \u00bfqu\u00e9 clase de personalidad est\u00e1s creando con tu aplicaci\u00f3n? \u00bfY qu\u00e9 expectativas acarrea esta personalidad con ella?<\/p>\n\n\n\n De acuerdo a un estudio de 2002<\/a>, la \u201capariencia del dise\u00f1o visual general de un sitio, incluyendo estructura, tipograf\u00eda, tama\u00f1o de fuentes y esquema de colores\u201d es el factor principal que usamos para evaluar la credibilidad de un sitio web.<\/p>\n\n\n\n Tiene sentido. Piensa en c\u00f3mo nuestra apariencia personal (nuestra est\u00e9tica personal) afecta c\u00f3mo la gente nos percibe; o c\u00f3mo el dise\u00f1o del paquete de un producto influye en nuestra percepci\u00f3n del producto dentro de \u00e9l.<\/p>\n\n\n\n Debajo hay una estaci\u00f3n de servicio cerca de mi casa. Comp\u00e1rala con la que se muestra a la derecha.<\/p>\n\n\n\n He dejado de cargar combustible en la gasolinera de la izquierda, a\u00fan cuando est\u00e1 m\u00e1s cerca de donde vivo. \u00bfPor qu\u00e9? Este tipo de mantenimiento (o falta de \u00e9l) me quita las ganas de confiarles la informaci\u00f3n de mi tarjeta de cr\u00e9dito. Claramente, la apariencia afecta a la confianza.<\/p>\n\n\n\n Entonces, \u00bfc\u00f3mo creamos confianza en las interfaces de nuestras aplicaciones, adem\u00e1s de proveyendo lo b\u00e1sico, como informaci\u00f3n confiable y a tiempo? Prestando atenci\u00f3n al dise\u00f1o visual, por ejemplo. La atenci\u00f3n a los detalles de dise\u00f1o significa que el mismo cuidado y atenci\u00f3n se ha puesto tambi\u00e9n en otras (no tan visibles) partes del producto \u2014lo que quiere decir que es un producto confiable.<\/p>\n\n\n\n He visto muchos dise\u00f1os ser destrozados durante la fase de desarrollo. Cosas como fuentes inconsistentes, separaciones extra\u00f1as, line-heights<\/em>, e im\u00e1genes sobre-comprimidas se ve\u00edan por doquier en el producto final. Mientras es posible que esto nunca aparezca en un test funcional, \u00bfc\u00f3mo estos detalles poco cuidados de la UI afectan la percepci\u00f3n de tu producto?<\/p>\n\n\n\n \u00bfPor qu\u00e9 nos deber\u00eda realmente importar la percepci\u00f3n? Piensa en estos hallazgos de las investigaciones<\/a> presentadas en CHI 2007:<\/p>\n\n\n\n \u201c\u2026los usuarios juzgan la relevancia de resultados de b\u00fasqueda id\u00e9nticos de diferentes buscadores bas\u00e1ndose en la marca. (\u2026) Participantes en el estudio indicaron que los resultados de Google y Yahoo fueron superiores a resultados id\u00e9nticos<\/strong> encontrados a trav\u00e9s de Windows Live o un buscador gen\u00e9rico\u201d.<\/p><\/blockquote>\n\n\n\n \u00bfQu\u00e9 es una marca sino percepciones? En este estudio, resultados funcionalmente id\u00e9nticos fueron percibidos como mejores debido a atributos de marca tales como confianza, personalidad y percepci\u00f3n. \u00bfQu\u00e9 tiene esto de racional?<\/p>\n\n\n\n Qu\u00e9date pensando en eso.<\/p>\n\n\n\n De acuerdo, entonces tal vez las percepciones son importantes en el dise\u00f1o de producto. \u00bfPero que hay de cuestiones \u201creales\u201d de usabilidad como tiempos m\u00e1s bajos para completar una tarea o menores dificultades? \u00bfRealmente los productos atractivos funcionan mejor? Esta idea fue probada en un estudio<\/a> llevado a cabo en 1995 (y nuevamente en 1997). Donald Normal lo describe en detalle en su libro Emotional Design<\/a>.<\/p>\n\n\n\n Investigadores en Jap\u00f3n prepararon dos cajeros autom\u00e1ticos \u201cid\u00e9nticos en utilidad, n\u00famero de botones y la manera en c\u00f3mo funcionaban\u201d. La \u00fanica diferencia era que los botones y pantallas de una de las m\u00e1quinas estaban ordenados de una forma m\u00e1s atractiva que en la otra. Tanto en Jap\u00f3n como en Israel (donde se repiti\u00f3 el estudio) los investigadores observaron que las personas encontraron menores dificultades con la m\u00e1quina m\u00e1s atractiva. La m\u00e1quina atractiva realmente funcion\u00f3<\/em> mejor.<\/p>\n\n\n\n Entonces ahora nos quedamos con esta pregunta: \u00bfporqu\u00e9 el cajero m\u00e1s atractivo, pero m\u00e1s all\u00e1 de eso id\u00e9ntico, funcion\u00f3 mejor?<\/p>\n\n\n\n Norman da una explicaci\u00f3n, citando a la biolog\u00eda evolucionaria y lo que sabemos acerca de c\u00f3mo funcionan nuestros cerebros. B\u00e1sicamente, cuando estamos relajados, nuestros cerebros son m\u00e1s flexibles y m\u00e1s propensos a encontrar soluciones alternativas a problemas dif\u00edciles. Por el contrario, cuando estamos frustrados y tensos, nuestros cerebros adoptan una especie de visi\u00f3n de t\u00fanel d\u00f3nde s\u00f3lo vemos el problema enfrente de nosotros. \u00bfCu\u00e1ntas veces, en un momento de frustraci\u00f3n, has intentado hacer la misma cosa una y otra vez, esperando que de alguna manera funcionara a la en\u00e9sima vez?<\/p>\n\n\n\n Otra explicaci\u00f3n: queremos que las cosas que encontramos placenteras tengan \u00e9xito. Somos m\u00e1s tolerantes a los problemas de las cosas que encontramos atractivas.<\/p>\n\n\n\n Estudios recientes sobre las emociones est\u00e1n encontrando que en realidad no se puede separar cognici\u00f3n de impacto. Estudios diferentes en econom\u00eda y neurociencia prueban que:<\/p>\n\n\n\n \u201clos sentimientos, que est\u00e1n inexplicablemente conectados con actitudes, expectativas y motivaciones, juegan un papel muy importante en la cognici\u00f3n de la interacci\u00f3n del producto\u2026la percepci\u00f3n de que sentimientos y cognici\u00f3n son sistemas de procesamiento de informaci\u00f3n separada es imperfecta\u201d. [2<\/a>]<\/p><\/blockquote>\n\n\n\n En otras palabras, c\u00f3mo \u201cpensamos\u201d no puede separarse de c\u00f3mo nos \u201csentimos\u201d.<\/p>\n\n\n\n Esto plantea algunas preguntas interesantes \u2014especialmente en el \u00e1rea de toma de decisiones. En resumen, nuestras decisiones racionales no son tan racionales. De estudios sobre elecci\u00f3n a las primeras impresiones, la neurociencia est\u00e1 explorando c\u00f3mo funciona nuestro cerebro \u2014y da un poco de miedo. No estamos \u2014ni cerca\u2014 tan a cargo de tomar nuestras decisiones como nos gustar\u00eda creer.<\/p>\n\n\n\n Piensa qu\u00e9 est\u00e1s haciendo con tus interfaces para hablarle a las emociones de las personas. El dise\u00f1o industrial de productos, la fabricaci\u00f3n de coches y otras industrias m\u00e1s maduras lo entienden \u2014con herramientas como el modelo de Kano que han sido usadas por d\u00e9cadas. Pero el desarrollo de interfaces de usuario est\u00e1 a\u00fan desarroll\u00e1ndose y poni\u00e9ndose al d\u00eda con lo que otras disciplinas ya saben: la forma m\u00e1s directa de influir en una decisi\u00f3n o percepci\u00f3n es a trav\u00e9s de las emociones.<\/p>\n\n\n\n Cuando pensamos en el dise\u00f1o y desarrollo de aplicaciones, \u00bfqu\u00e9 piensas del dise\u00f1o visual? \u00bfEs piel que a\u00f1ade algo de valor, una capa sobre la funcionalidad principal? \u00bfO esta belleza es algo m\u00e1s?<\/p>\n\n\n\n A principios de los a\u00f1os 1900, \u201cla forma sigue a la funci\u00f3n\u201d se convirti\u00f3 en el mantra de la arquitectura moderna. Frank Lloyd Wright<\/a> cambi\u00f3 esta frase a \u201cforma y funci\u00f3n deber\u00edan ser una sola, unidas espiritualmente\u201d usando la naturaleza como el mejor ejemplo de esta integraci\u00f3n.<\/p>\n\n\n\n Mientras m\u00e1s aprendemos sobre las personas, y c\u00f3mo nuestro cerebro procesa informaci\u00f3n, m\u00e1s aprendemos lo cierta que es esa frase: forma y funci\u00f3n no son \u00edtems separados. Si creemos que el estilo existe de alguna manera independiente de la funcionalidad, que podemos tratar est\u00e9tica y funci\u00f3n como dos piezas separadas, entonces estamos ignorando la evidencia de que la belleza es mucho m\u00e1s que decoraci\u00f3n. Nuestros cerebros no podr\u00edan estar m\u00e1s de acuerdo.<\/p>\n\n\n\n Estudios demuestran que las cosas atractivas funcionan mejor. Lo que pensamos no puede separarse de lo que sentimos. La pr\u00f3xima vez que un jefe, cliente o compa\u00f1ero de trabajo se burle de la noci\u00f3n de que la belleza es un aspecto importante del dise\u00f1o de interfaz, gu\u00edalos aqu\u00ed.<\/p>\n","protected":false},"author":601,"featured_media":78,"comment_status":"open","ping_status":"closed","template":"","categories":[5,17],"tags":[],"coauthors":[15],"class_list":["post-76","article","type-article","status-publish","has-post-thumbnail","hentry","category-diseno","category-diseno-grafico"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/alistapart.com\/es\/wp-json\/wp\/v2\/article\/76","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/alistapart.com\/es\/wp-json\/wp\/v2\/article"}],"about":[{"href":"https:\/\/alistapart.com\/es\/wp-json\/wp\/v2\/types\/article"}],"author":[{"embeddable":true,"href":"https:\/\/alistapart.com\/es\/wp-json\/wp\/v2\/users\/601"}],"replies":[{"embeddable":true,"href":"https:\/\/alistapart.com\/es\/wp-json\/wp\/v2\/comments?post=76"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/alistapart.com\/es\/wp-json\/wp\/v2\/media\/78"}],"wp:attachment":[{"href":"https:\/\/alistapart.com\/es\/wp-json\/wp\/v2\/media?parent=76"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/alistapart.com\/es\/wp-json\/wp\/v2\/categories?post=76"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/alistapart.com\/es\/wp-json\/wp\/v2\/tags?post=76"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/alistapart.com\/es\/wp-json\/wp\/v2\/coauthors?post=76"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}![\"\"](\"https:\/\/alistapart.com\/wp-content\/uploads\/2012\/07\/Bad-Visual-Language.gif?w=960\")
<\/figure>\n\n\n\nEst\u00e9tica y sentimientos<\/h2>\n\n\n\n
![\"\"](\"https:\/\/alistapart.com\/wp-content\/uploads\/2012\/07\/2ButtonsB.png?w=960\")
<\/figure>\n\n\n\nMe recuerdas de\u2026<\/h2>\n\n\n\n
![\"\"](\"https:\/\/alistapart.com\/wp-content\/uploads\/2012\/07\/2-UIs.jpg?w=960\")
<\/figure>\n\n\n\n\u00bfPuedes confiar en m\u00ed con esto?<\/h2>\n\n\n\n
![\"\"](\"https:\/\/alistapart.com\/wp-content\/uploads\/2012\/07\/gas-stations.jpg?w=960\")
Junta todo y\u2026<\/h2>\n\n\n\n
Las cosas atractivas funcionan mejor<\/h2>\n\n\n\n
Uniendo las piezas<\/h2>\n\n\n\n
![\"\"](\"https:\/\/alistapart.com\/es\/wp-content\/uploads\/sites\/3\/2020\/04\/mito-realidad.png?fit=960%2C338\")
<\/figure>\n\n\n\nEntonces, \u00bfes importante el \u201cdise\u00f1o bonito\u201d?<\/h2>\n\n\n\n
* Traducido al espa\u00f1ol por Javier Cuello<\/a>.<\/em><\/h5>\n","protected":false},"excerpt":{"rendered":"