{"id":303,"date":"2022-06-22T21:41:34","date_gmt":"2022-06-22T21:41:34","guid":{"rendered":"https:\/\/multimedia.uned.ac.cr\/pem\/wp\/sonar-multimedia\/?p=303"},"modified":"2022-06-22T22:09:05","modified_gmt":"2022-06-22T22:09:05","slug":"uso-accesible-del-color-mediante-adobe-color","status":"publish","type":"post","link":"https:\/\/multimedia.uned.ac.cr\/pem\/wp\/sonar-multimedia\/?p=303","title":{"rendered":"Uso accesible del color mediante Adobe Color"},"content":{"rendered":"\n

El color es uno de los elementos b\u00e1sicos a la hora de realizar una composici\u00f3n gr\u00e1fica ya que contribuye a la transmisi\u00f3n de sensaciones, percepciones y sentimientos en la interpretaci\u00f3n de un mensaje. As\u00ed lo comentan Velasco, Laureano, Mora y Herrera (2010), quienes afirman que: <\/p>\n\n\n\n

[…]el color es un elemento clave en el dise\u00f1o gr\u00e1fico, es el elemento m\u00e1s visible en un servicio o producto. Antes de iniciar la lectura de un texto o comprender una imagen, el color ya empieza a transmitirnos su mensaje. (Secci\u00f3n Psicolog\u00eda del color, p\u00e1rr. 1)<\/p><\/blockquote>\n\n\n\n

Por tal raz\u00f3n, su adecuado uso para elaborar la interfaz gr\u00e1fica de un multimedia educativo es importante y todo un reto si se toma en consideraci\u00f3n la accesibilidad; este es el caso del material did\u00e1ctico en producci\u00f3n \u201cQu\u00edmica de remediaci\u00f3n de aguas\u201d, en el que se emple\u00f3 la aplicaci\u00f3n web Adobe Color<\/a>, desarrollada por la compa\u00f1\u00eda Adobe Inc, para validar la selecci\u00f3n de los colores a trav\u00e9s de las Pautas de Accesibilidad de Contenido Web<\/em> (WCAG por sus siglas en ingl\u00e9s) que emplea esta herramienta.<\/p>\n\n\n\n

\"Imagen
Interfaz principal del multimedia educativo Qu\u00edmica de remediaci\u00f3n de aguas.<\/figcaption><\/figure>\n\n\n\n
\"Interfaz
Interfaz secundaria del multimedia educativo Qu\u00edmica de remediaci\u00f3n de aguas.<\/figcaption><\/figure>\n\n\n\n
\"Imagen
Ilustraciones de las tem\u00e1ticas del multimedia educativo Qu\u00edmica de remediaci\u00f3n de aguas.<\/figcaption><\/figure>\n\n\n\n

La accesibilidad es un tema amplio al cual se le presta atenci\u00f3n en las diferentes etapas de producci\u00f3n del multimedia educativo y, por ende, en la selecci\u00f3n adecuada de los colores dado que, comprende diferentes aspectos que contribuyen a mejorar la comprensi\u00f3n, la percepci\u00f3n, la interactividad y la navegaci\u00f3n del material.<\/p>\n\n\n\n

En este multimedia educativo se elaboraron dos paletas de color, una principal para las interfaces y los estilos del contenido textual, y una secundaria m\u00e1s orientada a contribuir a identificar cada uno de sus apartados. Con respecto a la propuesta, estos se escogieron con base en la tem\u00e1tica del agua en su entorno natural y modificaci\u00f3n por parte del ser humano, la intenci\u00f3n fue generar un ambiente congruente con el tema central de la qu\u00edmica y la remediaci\u00f3n de aguas.<\/p>\n\n\n\n

\"Imagen
Paleta de color principal de las interfaces del multimedia educativo Qu\u00edmica de remediaci\u00f3n de aguas.<\/figcaption><\/figure>\n\n\n\n
\"Imagen
Paleta de color secundaria para los apartados del multimedia educativo.<\/figcaption><\/figure>\n\n\n\n

Como parte de la verificaci\u00f3n del uso del color se utiliz\u00f3 la opci\u00f3n \u201cComprobador de contraste\u201d donde se valid\u00f3 que las combinaciones crom\u00e1ticas seleccionadas para los contenidos textuales en la interfaz fueran visualmente accesibles mediante una correcta proporci\u00f3n de color entre el fondo y el texto para facilitar la lectura de parte del usuario. <\/p>\n\n\n\n

A continuaci\u00f3n, se aprecian algunas de las validaciones realizadas con los colores:<\/p>\n\n\n\n

\"Imagen<\/figure>\n\n\n\n
\"Imagen<\/figure>\n\n\n\n
\"Imagen<\/figure>\n\n\n\n

Tambi\u00e9n se utiliz\u00f3 la opci\u00f3n \u201cTemas seguros para dalt\u00f3nicos\u201d con la que se cre\u00f3 una paleta de color segura para las variantes de deuteranop\u00eda, la protanop\u00eda y la tritanop\u00eda, que le permite al usuario tener una experiencia visual m\u00e1s inclusiva, ya que evita los conflictos de color al proponerle colores distintos en algunos casos, pero aptos para su adecuada percepci\u00f3n.<\/p>\n\n\n\n

A continuaci\u00f3n, se aprecia la validaci\u00f3n de las paletas de color seleccionadas:<\/p>\n\n\n\n

\"Imagen<\/figure>\n\n\n\n
\"Imagen<\/figure>\n\n\n\n

Tal y como se puede apreciar en las diferentes im\u00e1genes, las verificaciones de color fueron positivas, en los casos de contraste se obtuvo un nivel aceptable de doble A y en las paletas de color, total certeza de que son seguras para usuarios que presentan daltonismo.<\/p>\n\n\n\n

Retomando la herramienta Adobe Color<\/a>, esta fue de gran utilidad como parte de la investigaci\u00f3n constante y experiencia de uso de nuevas herramientas que contribuyen al \u00e1rea del dise\u00f1o, donde el uso de colores accesibles trasciende m\u00e1s all\u00e1 de percepciones personales o valor est\u00e9tico, pues hoy en d\u00eda es posible utilizarlos con un criterio t\u00e9cnico m\u00e1s fundamentado para justificar su selecci\u00f3n.<\/p>\n\n\n\n

Asimismo, esta aplicaci\u00f3n web se seleccion\u00f3 por su facilidad de uso y las nuevas opciones de accesibilidad que ofrece, las cuales se integran con las distintas aplicaciones que dispone la suite Adobe Creative Cloud (Adobe CC), no obstante, vale la pena mencionar que para quienes no cuentan con una licencia la herramienta ofrece estas posibilidades de manera gratuita, aunque con ciertas limitantes.<\/p>\n\n\n\n

Dentro de las posibilidades m\u00e1s vers\u00e1tiles que ofrece Adobe Color<\/a>, para aquellos usuarios con licencia de paga y debidamente autenticados en la aplicaci\u00f3n web, es crear, guardar, explorar y compartir con otros usuarios paletas de color, que pueden ser utilizadas posteriormente en otras aplicaciones de Adobe CC como Photoshop, Ilustrador, Fresco, entre otras; lo que sin duda alguna, brinda nuevas posibilidades y escenarios en cuanto a la gesti\u00f3n del uso del color en los diferentes proyectos de dise\u00f1o que se trabajen de manera individual o colaborativa.<\/p>\n\n\n\n

Por otro lado, la herramienta tambi\u00e9n permite generar colores a trav\u00e9s de la aplicaci\u00f3n de reglas de armon\u00eda de color como An\u00e1logos, Monocrom\u00e1ticos, Complementarios, entre otros; y a partir de un modo de color en espec\u00edfico determinar los valores de otro modo, por ejemplo, determinar los valores CMYK a partir de los valores RGB o viceversa.<\/p>\n\n\n\n

Otra opci\u00f3n interesante es que permite capturar los colores o gradientes de color a partir de una imagen para luego generar paletas de color que se pueden guardar y compartir.<\/p>\n\n\n\n

Finalmente, en los apartados \u201cExplorar\u201d y \u201cTendencias\u201d ofrece opciones de b\u00fasqueda y elecci\u00f3n del color a partir de diferentes filtros y categor\u00edas, pero con un enfoque de uso m\u00e1s colaborativo y social, en las que se puede guardar paletas de color en una biblioteca personal para utilizarlos en diferentes aplicaciones de Adobe CC, valorar las diferentes armon\u00edas publicadas, descargar las paletas en formato de imagen JPEG o compartir las mismas mediante la red social Twitter.<\/p>\n\n\n\n

Lo invito a que conozca y explore Adobe Color<\/a> para que experimente con la teor\u00eda del color en sus diferentes proyectos y, adem\u00e1s, le saque el m\u00e1ximo provecho a las nuevas herramientas de accesibilidad que ofrece para utilizar el mismo de manera inclusiva.<\/p>\n\n\n\n

Para m\u00e1s informaci\u00f3n sobre Adobe Color puede visitar el sitio web oficial de la aplicaci\u00f3n web: https:\/\/color.adobe.com\/es\/create\/color-wheel<\/a><\/p>\n\n\n\n

Referencias<\/h2>\n\n\n\n

Velasco Santos, Perla, Laureano Cruces, Ana Lilia, Mora Torres, Marta y Herrera Bautista, Miguel \u00c1ngel. (octubre, 2010). Dise\u00f1o de agentes pedag\u00f3gicos a partir de los estilos de aprendizaje; una perspectiva a trav\u00e9s del color.  Ponencia presentada en el IV Congreso Mundial de Estilos de Aprendizaje. Recuperado de http:\/\/kali.azc.uam.mx\/clc\/02_publicaciones\/material\/Dise%C3%B1o_de_AvataresPerspColor_10.pdf<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"

Experiencia en el uso de la aplicaci\u00f3n web Adobe Color para la gesti\u00f3n del color de manera accesible en el dise\u00f1o de la interfaz gr\u00e1fica del multimedia educativo \u201cQu\u00edmica de remediaci\u00f3n de aguas\u201d<\/p>\n","protected":false},"author":15,"featured_media":305,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":""},"categories":[1],"tags":[30,25],"ppma_author":[42],"class_list":["post-303","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-diseno_grafico","tag-experiencias","tag-textual"],"authors":[{"term_id":42,"user_id":15,"is_guest":0,"slug":"jdelgadov","display_name":"Juan Diego Delgado Vargas","avatar_url":"https:\/\/secure.gravatar.com\/avatar\/9b66f4009b09aa2c6519e5fd59c0f549a528c80231e4d6432f3c47acd6670ce9?s=96&d=mm&r=g","0":null,"1":"","2":"","3":"","4":"","5":"","6":"","7":"","8":""}],"_links":{"self":[{"href":"https:\/\/multimedia.uned.ac.cr\/pem\/wp\/sonar-multimedia\/index.php?rest_route=\/wp\/v2\/posts\/303","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/multimedia.uned.ac.cr\/pem\/wp\/sonar-multimedia\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/multimedia.uned.ac.cr\/pem\/wp\/sonar-multimedia\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/multimedia.uned.ac.cr\/pem\/wp\/sonar-multimedia\/index.php?rest_route=\/wp\/v2\/users\/15"}],"replies":[{"embeddable":true,"href":"https:\/\/multimedia.uned.ac.cr\/pem\/wp\/sonar-multimedia\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=303"}],"version-history":[{"count":10,"href":"https:\/\/multimedia.uned.ac.cr\/pem\/wp\/sonar-multimedia\/index.php?rest_route=\/wp\/v2\/posts\/303\/revisions"}],"predecessor-version":[{"id":441,"href":"https:\/\/multimedia.uned.ac.cr\/pem\/wp\/sonar-multimedia\/index.php?rest_route=\/wp\/v2\/posts\/303\/revisions\/441"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/multimedia.uned.ac.cr\/pem\/wp\/sonar-multimedia\/index.php?rest_route=\/wp\/v2\/media\/305"}],"wp:attachment":[{"href":"https:\/\/multimedia.uned.ac.cr\/pem\/wp\/sonar-multimedia\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=303"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/multimedia.uned.ac.cr\/pem\/wp\/sonar-multimedia\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=303"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/multimedia.uned.ac.cr\/pem\/wp\/sonar-multimedia\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=303"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/multimedia.uned.ac.cr\/pem\/wp\/sonar-multimedia\/index.php?rest_route=%2Fwp%2Fv2%2Fppma_author&post=303"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}