el diseño universal en la interfaz gráfica de multimedia ... · el diseño universal en la...

20
Los contenidos de este artículo están bajo una licencia Creative Commons El diseño universal en la interfaz gráfica de multimedia educativo Universal design in the graphic interface of educational multimedia Volumen 17, Número 3 Setiembre-Diciembre pp. 1-19 Este número se publica el 1° de setiembre de 2017 DOI: https://doi.org/10.15517/aie.v17i3.30207 Juan Diego Delgado Vargas Revista indizada en REDALYC, SCIELO Revista distribuida en las bases de datos: LATINDEX, DOAJ, REDIB, IRESIE, CLASE, DIALNET, SHERPA/ROMEO, QUALIS-CAPES, MIAR Revista registrada en los directorios: ULRICH’S, REDIE, RINACE, OEI, MAESTROTECA, PREAL, CLACSO

Upload: hanhi

Post on 21-Sep-2018

232 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: El diseño universal en la interfaz gráfica de multimedia ... · El diseño universal en la interfaz gráfica de multimedia educativo ... aporte de otras metodologías como el diseño

Los contenidos de este artiacuteculo estaacuten bajo una licencia Creative Commons

El disentildeo universal en la interfaz graacutefica de multimedia educativo Universal design in the graphic interface of educational multimedia

Volumen 17 Nuacutemero 3 Setiembre-Diciembre

pp 1-19

Este nuacutemero se publica el 1deg de setiembre de 2017 DOI httpsdoiorg1015517aiev17i330207

Juan Diego Delgado Vargas

Revista indizada en REDALYC SCIELO

Revista distribuida en las bases de datos

LATINDEX DOAJ REDIB IRESIE CLASE DIALNET SHERPAROMEO QUALIS-CAPES MIAR

Revista registrada en los directorios

ULRICHrsquoS REDIE RINACE OEI MAESTROTECA PREAL CLACSO

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

1

El disentildeo universal en la interfaz graacutefica de multimedia educativo Universal design in the graphic interface of educational multimedia

Juan Diego Delgado Vargas1

Resumen El presente ensayo expone la aplicacioacuten del disentildeo universal en la interfaz graacutefica del multimedia educativo elaborado bajo el concepto de Laboratorio virtual proyecto de investigacioacuten que forma parte del Acuerdo de Mejoramiento Institucional (AMI) de la Universidad Estatal a Distancia (UNED) de Costa Rica Para ello se presentan referentes teoacutericos para su fundamentacioacuten los cuales contribuyen con una reflexioacuten acerca de la temaacutetica a partir de la experiencia del Programa de Produccioacuten Electroacutenica Multimedial (PEM) en esta aacuterea como parte de una revisioacuten de sus procesos productivos y oferta de este tipo de materiales El disentildeo de la interfaz graacutefica implica por ende valorar la necesidad del disentildeo universal aplicado a la elaboracioacuten de materiales didaacutecticos con especial eacutenfasis en aquellos con salida digital ya que por su naturaleza involucran la elaboracioacuten de entornos graacuteficos que deben ser accesibles por lo tanto la UNED debe considerar a traveacutes de la Direccioacuten de Produccioacuten de Materiales Didaacutecticos (DPMD) y sus diferentes instancias propuestas como esta que evidencian el esfuerzo y compromiso por incorporar nuevas metodologiacuteas de disentildeo que contribuyan al mejoramiento de la accesibilidad y la inclusioacuten de sus materiales orientados a educacioacuten a distancia Palabras clave ensentildeanza multimedia meacutetodo de ensentildeanza formacioacuten material didaacutectico Abstract The current essay has the main goal of presenting Universal Design applied to the graphical user interface of the educational multimedia resources developed under the concept of Virtual Laboratory research project of Acuerdo de Mejoramiento Institucional (AMI) of Universidad Estatal a Distancia (UNED) of Costa Rica For this purpose different theories and concepts are introduced along with reflexions about the contributions and experiences by Programa de Produccioacuten Electroacutenica Multimedial (PEM) in this field as part of a review of their productive processes and deliver instructional resources in distance education The design of the graphic interface implies assessing the need for Universal Design applied to the creation of teaching materials with especial emphasis on those with digital output since by their nature they involve the development of graphical environment that must be accessible therefore UNED must consider through the Direccioacuten de Produccioacuten de Materiales Didaacutecticos (DPMD) and their different instances proposals such as this that shows the hard work and commitment by incorporating new design methodologies that contribute to the improvement of accessibility and the inclusion of their resources in distance education oriented materials Key words multimedia teaching teaching method training teaching material

1 Productor y disentildeador graacutefico en multimedia educativo en el Programa de Produccioacuten Electroacutenica Multimedial (PEM) de la Universidad Estatal a Distancia (UNED) de Costa Rica Direccioacuten electroacutenica jdelgadovunedaccr

Ensayo recibido 19 de octubre 2016 Enviado a correccioacuten 9 de mayo 2017 Aprobado 14 de agosto 2017

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

2

1 Introduccioacuten

Este ensayo presenta un recorrido teoacuterico por el disentildeo universal aplicado en la

elaboracioacuten de la interfaz graacutefica del multimedia educativo producido bajo el concepto de

laboratorio virtual cuyo proyecto de investigacioacuten es parte de las acciones desarrolladas en

la iniciativa 8 y sub-iniciativa 4 del Acuerdo de Mejoramiento Institucional (AMI) de la

Universidad Estatal a Distancia (UNED) de Costa Rica desarrollado a traveacutes del Plan de

Mejoramiento Institucional (PMI) que se originoacute en el marco de las negociaciones del Fondo

Especial para el Financiamiento de la Educacioacuten Superior Estatal (FEES) en el antildeo 2012

El Programa de Produccioacuten Electroacutenica Multimedial (PEM) de la Direccioacuten de

Produccioacuten de Materiales Didaacutecticos (DPMD) es el encargado de elaborar dichos materiales

dirigidos a estudiantes del sistema de educacioacuten superior a distancia que utilizan las TIC

como apoyo en sus procesos de ensentildeanza-aprendizaje Para ello se exponen referentes

teoacutericos se definen conceptos importantes y por uacuteltimo se valoran los aportes del programa

en este campo

Es importante considerar que la produccioacuten de esos materiales didaacutecticos es un

proceso interdisciplinario y colaborativo en el que los profesionales involucrados aportan

desde sus aacutereas de experticia con base en los objetivos educativos y el puacuteblico meta

Ademaacutes el componente del disentildeo graacutefico es uno de los elementos mediadores del

proceso de comunicacioacuten entre el contenido y el estudiante al cual se le ha dedicado estudio

e investigacioacuten Esto se evidencia en el disentildeo de interfaces graacuteficas en las cuales la

metaacutefora pedagoacutegica continuacutea siendo predominante sin embargo su evolucioacuten producto de

las nuevas tecnologiacuteas y sus posibilidades en variados medios obligan a considerar el

aporte de otras metodologiacuteas como el disentildeo universal y el adaptativo en la produccioacuten de

multimedia educativo

2 Disentildeo Universal

En el antildeo 1974 durante la reunioacuten de un grupo de expertos sobre el disentildeo libre de

barreras celebrada en la ciudad de Nueva York Estados Unidos surgioacute el tema de adaptar

el medio fiacutesico a las personas con alguacuten tipo de discapacidad con el propoacutesito de darles

acceso en igualdad de condiciones a la sociedad Este acceso se hariacutea con el menor

nuacutemero de obstaacuteculos posible mediante la eliminacioacuten de barreras concepto comuacutenmente

relacionado con la construccioacuten de espacios fiacutesicos de faacutecil acceso como por ejemplo

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

3

rampas y ascensores pero hoy en diacutea es aplicable a aacutereas profesionales diferentes a la

arquitectura y el paisajismo

Con el tiempo se fue haciendo evidente que este tipo de construcciones eran una

ayuda teacutecnica que le permitiacutea a las personas con necesidades especiales insertarse de

mejor manera en la dinaacutemica social les brindaba la posibilidad de desempentildear funciones en

su vida cotidiana y en algunos casos maacutes bien potenciaba sus capacidades y desempentildeo al

relacionar los teacuterminos de flexibilidad y accesibilidad Gracias a esta relacioacuten la accesibilidad

hoy se mira de forma diferente y maacutes amplia pues aquello accesible para las personas con

alguacuten tipo de discapacidad es tambieacuten funcional para todos los demaacutes

Despueacutes de dicha reunioacuten surge el paradigma del disentildeo universal corriente teoacuterica

que tiene sus oriacutegenes en el funcionalismo escandinavo de los antildeos 50 y en el disentildeo

ergonoacutemico de los antildeos 60 asiacute como en la poliacutetica social sueca de finales de los antildeos 70

donde nacioacute el concepto de una sociedad para todos con lo cual se poniacuteaespecial eacutenfasis en

el teacutermino de accesibilidad (Observatorio de la Accesibilidad sf)

Ronald L Mace arquitecto y fundador del Centro para el Disentildeo Universal

mencionado por Bibiana Misischia en su artiacuteculo Supresioacuten de barreras en la universidad lo

define como ldquola creacioacuten de productos y entornos disentildeados de modo que sean utilizables

por todas las personas en la mayor medida posible sin necesidad de adaptaciones o

disentildeos especializadosrdquo (2013 paacuterr1) Este teacutermino fue aprobado oficialmente en el antildeo

2006 por la Convencioacuten de Naciones Unidas sobre los Derechos de las Personas con

Discapacidad en el artiacuteculo nuacutemero 2

En otras palabras el disentildeo universal busca la creacioacuten de entornos y productos con

un proceso planificado de elaboracioacuten para que sean utilizados por la mayor cantidad de

personas sin distincioacuten alguna (en edad y capacidades) mediante una serie de principios

que permiten guiar y evaluar el disentildeo asiacute como educar a los disentildeadores sobre las

caracteriacutesticas que deben tener para que sean maacutes accesibles al valorar la diversidad y la

inclusioacuten

Este proceso se aplica en diferentes aacutereas como la arquitectura el paisajismo la

ingenieriacutea la comunicacioacuten y el disentildeo industrial Estas tres uacuteltimas al interactuar con otras

disciplinas del disentildeo (graacutefico web software y de ergonomiacutea) permiten la creacioacuten de la

interfaz graacutefica

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

4

21 Principios del disentildeo universal

El Centro para el Disentildeo Universal (1997 citado por la Fundacioacuten SIDAR 2007)

traduce los principios a considerar en este tema de la siguiente manera

1) Uso equiparable Es uacutetil y vendible a personas con diversas capacidades

2) Uso flexible Se acomoda a un amplio rango de preferencias y habilidades

individuales

3) Simple e intuitivo Su uso es faacutecil de entender atiende a la experiencia

conocimientos habilidades linguumliacutesticas o grado de concentracioacuten actual del usuario

4) Informacioacuten perceptible Comunica de manera eficaz la informacioacuten necesaria para el

usuario y pone atencioacuten a las condiciones ambientales o a las capacidades sensoriales

del usuario

5) Con tolerancia al error Minimiza los riesgos y las consecuencias adversas de

acciones involuntarias o accidentales

6) Que exija poco esfuerzo fiacutesico Puede ser usado eficaz y confortablemente y con un

miacutenimo de fatiga

7) Tamantildeo y espacio para el acceso y uso Proporciona un tamantildeo y espacio

apropiados para el acceso alcance manipulacioacuten y uso y contempla el tamantildeo del

cuerpo la postura o la movilidad del usuario

Con base en lo anterior es importante mencionar que el proceso de disentildeo a traveacutes

de estas pautas evidencia un sentimiento de responsabilidad en cuanto a la inclusioacuten de la

mayor diversidad de usuarios posible Ademaacutes es necesario considerar una etapa de

investigacioacuten de usuarios para conocer y considerar sus caracteriacutesticas como necesidades

ya que de ellos depende el impacto que puede tener lo que se disentildee

En el aacutembito de la educacioacuten el disentildeo universal actualmente tiene una gran influencia

en las poliacuteticas y metodologiacuteas educativas de diferentes paiacuteses donde se integra de manera

formal en los procesos de educacioacuten inclusiva y en la UNED de Costa Rica esto no ha

pasado desapercibido En los uacuteltimos antildeos se han venido desarrollando diferentes iniciativas

para promover su uso y principales enfoques como por ejemplo el disentildeo universal en

educacioacuten desarrollado por el DO-IT Center (Discapacidades Oportunidades Interconexioacuten

de redes y Tecnologiacutea por sus siglas en ingleacutes) de la Universidad de Washington en los

Estados Unidos

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

5

Sheryl Burgstahler directora y fundadora del DO-IT Center define este enfoque como

ldquohellipun marco filosoacutefico para disentildear un rango general de productos y ambientes educativosrdquo

(2007 paacuterr 2) De este modo no solo se centra en el disentildeo de los curriacuteculos sino que por

su concepcioacuten maacutes amplia tambieacuten analiza otros factores como por ejemplo software

educativo y sitios web entre otros recursos que se pueden considerar materiales didaacutecticos

con componente tecnoloacutegico

3 Disentildeo graacutefico

Paul Rand disentildeador graacutefico y profesor en la Universidad de Yale define el disentildeo

graacutefico en su libro Design Form and Chaos como

entender el significado del disentildeo no es soacutelo entender el papel que desempentildean la

forma y el contenido sino descubrir que el disentildeo es tambieacuten un comentario una

opinioacuten un punto de vista y una responsabilidad social Disentildear es mucho maacutes que

simplemente ensamblar ordenar incluso editar es antildeadir valor y significado iluminar

simplificar aclarar modificar teatralizar persuadir y quizaacute incluso entretener (2007

p 6)

Lo anterior apoya el hecho de que el disentildeo graacutefico es algo maacutes que un simple

conjunto de imaacutegenes y texto con eacutenfasis en la composicioacuten y la esteacutetica es un elemento

visual comunicativo interpretado en un mensaje por medio de diferentes elementos tangibles

(imaacutegenes formas colores) y otros intangibles (sensaciones percepciones y sentimientos)

Algunos de los elementos que influyen en la forma en que se transmite un mensaje y

que deben tomarse en consideracioacuten al trabajar en disentildeo graacutefico son los siguientes

El color las primeras evidencias de su uso datan desde la eacutepoca de la prehistoria cuando

se realizaron las primeras manifestaciones de arte mediante el color rojo desprendido de las

tierras arcillosas En la actualidad Morton (2010) menciona que los estudios realizados por el

Institute of Color Research evidencian que

[hellip] las personas realizan juicios subconscientes de un ambiente de un producto o una

persona dentro de los 90 segundos de visualizacioacuten inicial y que entre el 62 y el 90 por

ciento de ese juicio se basa solo en el color (paacuterr 4)

Podriacutea decirse que el color es uno de los elementos clave en una composicioacuten graacutefica

ya que contribuye a transmitir sensaciones percepciones y sentimientos en la interpretacioacuten

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

6

de un mensaje Asiacute lo referencian Velasco Laureano Mora y Herrera (2010) quienes

afirman que

[hellip] el color es un elemento clave en el disentildeo graacutefico es el elemento maacutes 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 (Seccioacuten Psicologiacutea del color paacuterr 1)

La tipografiacutea con la invencioacuten de la imprenta en la eacutepoca del Renacimiento la tipografiacutea

toma relevancia de la mano de figuras importantes en su historia como Stanley Morison

(1929) citado por Gutieacuterrez (2012) quien definioacute la tipografiacutea como

[hellip] el arte de disponer correctamente el material de imprimir de acuerdo con un

propoacutesito especiacutefico el de colocar las letras repartir el espacio y organizar los tipos

con vistas a prestar al lector la maacutexima ayuda para la comprensioacuten del texto escrito

verbalmente (paacuterr 1)

Puede considerarse entonces la tipografiacutea como una expresioacuten graacutefica de la voz que

contribuye a transmitir el mensaje por ello es importante cuando se utiliza pensar en el

puacuteblico al que va dirigido ya que este debe tener la capacidad de leerlo y comprenderlo sin

ninguacuten tipo de obstaacuteculo o niveles de dificultad posibles

La imagen seguacuten el diccionario de la Real Academia Espantildeola la palabra imagen

proviene del latiacuten imago que significa figura representacioacuten semejanza y apariencia de algo

Fornasari de Menegazzo va maacutes allaacute de lo simple y la define como ldquotoda representacioacuten

visual que mantiene una relacioacuten de semejanza con el objetivo de ser representadordquo (1994

p 21)

Una imagen es entonces un elemento meramente visual que se utiliza para

representar objetos sujetos o situaciones ficticias o reales que evocan expresiones y

sentimientos para transmitir un mensaje Es un elemento comunicacional de la graacutefica visual

La composicioacuten se entiende como la organizacioacuten de varios elementos graacuteficos dentro

del espacio visual que combinados tienen la capacidad de aportar un significado a la

transmisioacuten de un mensaje Es decir la composicioacuten distribuye los diferentes elementos en

una composicioacuten graacutefica (color tipografiacutea imagen) de forma equilibrada que da sentido a la

transmisioacuten de un mensaje Al respecto Gillian (1980) en su libro Fundamentos del disentildeo

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

7

manifiesta que ldquola composicioacuten significa tambieacuten organizacioacuten estructural y que esta

constituye el fundamento de las relaciones visualesrdquo (p19)

La composicioacuten es por lo tanto importante ya que mediante propiedades como orden

balance unidad y relacioacuten entre los elementos graacuteficos en su conjunto permite transmitir el

mensaje de forma concreta facilitando su comprensioacuten por parte del puacuteblico al cual se

orientoacute

4 Metaacutefora pedagoacutegica

Luis Fernando Diacuteaz productor acadeacutemico de la UNED de Costa Rica la define como

(hellip) un elemento comunicativo usualmente graacutefico a veces animado que trasmite en

forma sucinta y reiterada el mensaje educativo central del multimedio o del objeto

especiacutefico Provee unidad graacutefica (y refuerza la unidad pedagoacutegica) en el disentildeo de

todo el material y no solo en pantallas aisladas o en hiperviacutenculos (2011 paacuterr 6)

Es decir estaacute metodologiacutea permite fortalecer y favorecer mediante la reiteracioacuten del

mensaje y los contenidos educativos el aprendizaje que de forma simultaacutenea se comunica

mediante otras formas semaacutenticas y por lo tanto debe ser un proceso planificado desde el

disentildeo mismo

En los multimedia educativos su concrecioacuten se origina dentro de una etapa creativa

propia del proceso de produccioacuten caracterizada por la elaboracioacuten de una propuesta

pedagoacutegica que ademaacutes de mediar los contenidos es representada graacuteficamente para

favorecer el nexo motivacional y de intereacutes por explorar los contenidos e interartuar con

estos a traveacutes de la interfaz En la elaboracioacuten de la interfaz graacutefica este concepto orienta el

disentildeo de los elementos que la conforman como por ejemplo la interfaz principal

secundarias recursos multimedia y de navegacioacuten tales comomenuacutes botones e iacuteconos

Diacuteaz (2011) destaca 7 aspectos pedagoacutegicos que dan valor a la metaacutefora en la

produccioacuten de materiales didaacutecticos

1) Trasmite en forma sucinta y reiterada el mensaje educativo central

2) Fortalece el aprendizaje por cuanto reitera con otros recursos el mensaje textual Parte

de su valor formativo consiste en que refuerza mediante la repeticioacuten el mensaje y los

contenidos al aprendizaje y a la internalizacioacuten de los conocimientos los valores y las

conductas que simultaacuteneamente se comunican mediante otros lenguajes

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

8

3) Facilita la construccioacuten y la presentacioacuten de iacutendices menuacutes y botoneras para la

navegacioacuten dentro del multimedia Formas simplificadas de la metaacutefora (hojas laacutepices

de color flechas) permiten a los lectores distinguir textos vinculados con el mensaje

principal pero que obedecen a finalidades distintas del dominio de contenidos por

aprender Esta economiacutea de representacioacuten resulta en un ahorro de energiacutea en las

actividades educativas particularmente en la auto-instruccioacuten

4) En ese mismo sentido propicia la construccioacuten de familias de iconos aplicables incluso

a los materiales impresos con la intencioacuten de facilitar el desplazamiento del estudiante

por el texto a traveacutes de instrucciones tanto graacuteficas como verbales

5) Favorece la identificacioacuten de los usuarios porque mueve sus emociones y sus

sentimientos crea empatiacutea y complicidad lo que favorece la exploracioacuten y el uso de los

materiales por el estudiantado

6) Modera la frialdad impliacutecita en la comunicacioacuten viacutea maacutequinas y medios electroacutenicos sin

dejar de atender a la veracidad y la verosimilitud Igual efecto provoca en los

voluminosos textos tradicionales impresos en blanco y negro

7) Es un recurso de calidad Una buena metaacutefora permea y orienta toda la produccioacuten se

reproduce y se enriquece a siacute misma y concentra la atencioacuten de los usuarios En este

rol se espera de ella un efecto multiplicador sobre el aprendizaje

5 Interfaz graacutefica

Ben Shneiderman catedraacutetico en Informaacutetica de la Universidad de Maryland en

Estados Unidos define la interfaz como ldquola membrana de comunicacioacuten entre los usuarios y

el sistema por la que los disentildeadores y desarrolladores de herramientas informaacuteticas pueden

hacer que la tecnologiacutea sea inteligible y sensible a las necesidades de los usuariosrdquo (1998

p 4)

En este caso en particular la interfaz graacutefica se puede considerar un mediador visual

que facilita la comunicacioacuten fluida y clara entre un sistema y el usuario para facilitar su

comprensioacuten y uso Esta por lo general se manifiesta en un entorno graacutefico compuesto

principalmente de imaacutegenes y objetos para representar la informacioacuten y las acciones

disponibles para ejecutar

Shneiderman (1998 mencionado por Mantildeas 2011 pp 27-34) enlista 8 reglas de oro

del disentildeo de interfaces

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

9

1) Esforzarse para conseguir consistencia exigir secuencias de acciones consistentes

utilizar terminologiacutea coherente en los mensajes menuacutes y pantallas de ayuda emplear

de forma consistente el color la composicioacuten las mayuacutesculas las fuentes y otros

elementos similares Las excepciones como la necesaria confirmacioacuten de la orden de

borrado o no mostrar los caracteres de las contrasentildeas deberiacutean ser comprensibles y

limitadas en nuacutemero

2) Atender la usabilidad universal reconocer las necesidades de los diversos usuarios

asiacute como las diferencias entre ellos (principiante o experto edades discapacidades y

diversidad tecnoloacutegica) para facilitar la transformacioacuten del contenido

3) Ofrecer realimentacioacuten informativa incluir para cada accioacuten del sistema una

realimentacioacuten por parte del sistema

4) Disentildear diaacutelogos para conducir a la finalizacioacuten crear sistemas claros de

conduccioacuten hasta el final del proceso de las secuencias de accioacuten del usuario

5) Prevenir errores disentildear el sistema de forma que los usuarios no puedan cometer

errores serios

6) Permitir deshacer acciones de forma faacutecil tener la posibilidad de remediar acciones

erroacuteneas por lo tanto construir un sistema reversible Este sistema suaviza la

ansiedad que se puede producir en el usuario

7) Dar soporte al control interno ofrecer a los operadores experimentados la sensacioacuten

de controlar la interfaz y que esta responde a sus acciones Las acciones

sorprendentes por parte de la interfaz las secuencias de entrada de datos tediosas la

incapacidad o dificultad para obtener la informacioacuten necesaria y la incapacidad para

producir acciones deseadas crean ansiedad e insatisfaccioacuten

8) Reducir la carga de la memoria a corto plazo disentildear sistemas de visualizacioacuten

simples que la frecuencia de movimiento de ventana se reduzca y que se asigne

suficiente tiempo de entrenamiento para coacutedigos y secuencias de acciones

Como consecuencia un buen disentildeo de interfaz graacutefica no solo se centra en la parte

visual su esteacutetica y la composicioacuten sino tambieacuten en el desarrollo de su interaccioacuten a traveacutes

de las reglas anteriormente mencionadas Ambos aspectos se complementan ya que en

gran medida determinan la buena experiencia de uso por parte del usuario

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

10

6 Disentildeo adaptativo

Sin duda alguna el siglo XXI se ha caracterizado por el uso cada vez maacutes frecuente y

cotidiano de dispositivos moacuteviles como tabletas teleacutefonos inteligentes y computadoras

portaacutetiles entre otros Seguacuten las Directrices para las poliacuteticas de aprendizaje moacutevil de la

Unesco (Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura)

Hay en el mundo maacutes de 3200 millones de usuarios registrados con teleacutefonos moacuteviles

lo que hace de estos dispositivos la modalidad de TIC maacutes utilizada en la Tierra En los

paiacuteses desarrollados 4 de cada 5 personas poseen y utilizan un teleacutefono moacutevil y

aunque la tasa es significativamente maacutes baja que en los paiacuteses en desarrollo (2 de

cada 5) es en estos paiacuteses donde se registra el crecimiento maacutes raacutepido en cuanto a

iacutendice de penetracioacuten en el mercado (2013 p 7)

En el contexto educativo este fenoacutemeno no ha pasado desapercibido los y las

estudiantes de diferentes modelos educativos en el mundo utilizan estos dispositivos con

diferentes objetivos como gestioacuten administrativa comunicacioacuten y en procesos de

ensentildeanza-aprendizaje Seguacuten las Directrices para las poliacuteticas de aprendizaje moacutevil de la

Unesco se cree al respecto que

[hellip] las tecnologiacuteas moacuteviles pueden ampliar y enriquecer las oportunidades educativas

en distintos contextos Hay cada vez maacutes datos que indican que los omnipresentes

dispositivos moacuteviles en particular los teleacutefonos moacuteviles y maacutes recientemente las

tabletas son utilizados por educandos y docentes de todo el mundo para acceder a

informacioacuten simplificar la administracioacuten y facilitar el aprendizaje de una forma nueva e

innovadora (2013 p5)

En el caso particular de la UNED de Costa Rica seguacuten un estudio realizado en el antildeo

2014 por Salazar Berrocal Salas y Valerio en el que se consideroacute la respuesta de 877

estudiantes y 211 tutores representativos de las instancias acadeacutemicas de la universidad el

90 afirmoacute poseer un teleacutefono moacutevil de los cuales 633 son teleacutefonos inteligentes un 30

son tabletas y un 42 son reproductores de audio y video

A partir de dicha informacioacuten se generoacute una reflexioacuten respecto a la forma en que los

usuarios (especialmente estudiantes) pueden utilizar los materiales didaacutecticos ademaacutes de un

anaacutelisis en cuanto a la presentacioacuten de contenidos y reestructuracioacuten del proceso de

produccioacuten de quienes los llevan a cabo y es asiacute como el disentildeo adaptativo surge como una

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

11

posible respuesta a la necesidad de que dichos materiales esteacuten disponibles para

dispositivos moacuteviles con el propoacutesito de que estos no queden fuera del contexto actual

El disentildeador Manuel Rubio en su artiacuteculo iquestQueacute es Disentildeo Adaptativo lo define como

ldquo[hellip] una teacutecnica de disentildeo y desarrollo web que mediante el uso de estructuras e imaacutegenes

fluidas asiacute como de media-queries en las hojas de estilo CSS se consigue adaptar el sitio

web al dispositivo del usuariordquo (2013 paacuterr 1) Esta adaptacioacuten implica que la interfaz graacutefica

asiacute como los contenidos educativos desarrollados para un material didaacutectico de la

Universidad se ajustan seguacuten la resolucioacuten de la pantalla sin importar el tipo de dispositivo

desde el que se accede pero en ninguacuten caso (a menos que asiacute se contemple) significa el

sacrificio de contenido para cumplir tal propoacutesito Asiacute tanto la informacioacuten escrita apoyada de

imaacutegenes videos animaciones actividades entre otros recursos son adaptados

7 Eleccioacuten de disentildeo adaptativo

El disentildeo adaptativo es una metodologiacutea de disentildeo que permite una mayor

universalizacioacuten de los contenidos de un material en especiacutefico pero la eleccioacuten de este tipo

de disentildeo no debe recaer simplemente en la versatilidad de produccioacuten sino que su

implementacioacuten debe cumplir criterios de produccioacuten para que sea efectivo de lo contrario

seriacutea mejor optar por otro tipo de soluciones

Se debe procurar que la adaptacioacuten de los materiales sea tal que el usuario no tenga

problemas en determinar el cambio maacutexime cuando se trabaja en coordinacioacuten con otras

estrategias didaacutecticas Si bien es cierto el desarrollo de disentildeo adaptativo ahorra tiempo si

se le compara con la produccioacuten de una versioacuten seguacuten dispositivo se debe contemplar el

hecho de que la programacioacuten necesaria para elaborar un material de este tipo es compleja y

debe estar muy bien planificada

Aunque en la actualidad se habla de una mayor penetracioacuten de las tecnologiacuteas moacuteviles

en el mundo antes de implementarlo con un propoacutesito didaacutectico se debe revisar el nivel de

utilizacioacuten potencial que los usuarios del material hacen de sus dispositivos moacuteviles de

manera que se pueda valorar a futuro la idoneidad de la puesta en marcha de la

implementacioacuten de este tipo de disentildeo

8 Aportes y experiencias del PEM en la produccioacuten de multimedia educativo

El PEM ha desarrollado multimedias educativos desde su creacioacuten en el antildeo 2000 La

consigna de produccioacuten acadeacutemica es buscar e implementar en ellos la mejor combinacioacuten

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

12

posible de mediacioacuten de contenidos y uso de las TIC en beneficio del estudiantado a partir

de criterios pedagoacutegicos y de disentildeo En este mismo espiacuteritu de observar y analizar los

cambios que se dan a nivel educativo con respecto a las diferentes posibilidades

tecnoloacutegicas es que el PEM comenzoacute su incursioacuten en el uso del disentildeo adaptativo en la

produccioacuten de multimedia educativo a partir del uso de herramientas y disposiciones

conceptuales para obtener materiales didaacutecticos maacutes inclusivos

Cabe aclarar que el puacuteblico meta del PEM son los y las estudiantes de las diferentes

carreras impartidas en la Universidad usuarios que bien podriacutean presentar alguna condicioacuten

o necesidad especial de aprendizaje que obliga al programa a pensar en las distintas

posibilidades de acceso y uso de sus multimedias educativos

En lo referente a la implementacioacuten de los conceptos anteriormente definidos en la

produccioacuten de multimedia educativo cabe sentildealar que su uso depende del cumplimiento de

criterios de seleccioacuten entre ellos la pertinencia pedagoacutegica con respecto a los contenidos o

bien el uso de los dispositivos moacuteviles por parte del estudiantado

Hoy maacutes que nunca la portabilidad y el uso de variados dispositivos plantea

interrogantes importantes en cuanto a produccioacuten y disentildeo que se tratan de responder desde

la investigacioacuten experimentacioacuten implementacioacuten y posterior evaluacioacuten de la propuesta

Como ejemplo de lo anterior y en el marco de la incursioacuten de los diferentes conceptos

expuestos en este ensayo en el PEM se han elaborado dos materiales que marcaron el

inicio de la implementacioacuten de las metodologiacuteas abordadas

En el antildeo 2013 se produjo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica En

esta primera experiencia se presentoacute un multimedia educativo que sirve de apoyo al libro

Meacutetodos Numeacutericos para la Ensentildeanza publicado por la Editorial de la Universidad Estatal a

Distancia (EUNED) de Costa Rica y que se utiliza en el curso Meacutetodos Numeacutericos que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia El material

ofrece a la persona estudiante la solucioacuten de ejemplos por medio de software libre y gratuito

para la resolucioacuten de problemas y ejercicios en temas relacionados con la Teoriacutea del error

Meacutetodos de aproximacioacuten para soluciones de ecuaciones no lineales Aproximacioacuten

polinomial para valores de funciones y Aproximaciones en derivacioacuten e integracioacuten utilizando

diversas teacutecnicas y meacutetodos

La metaacutefora pedagoacutegica desarrollada se elaboroacute bajo el concepto de un mapa de

estrategia que propone cuatro escenarios que representan las aacutereas temaacuteticas mencionadas

La propuesta se seleccionoacute porque mantiene una estrecha relacioacuten con las aacutereas del

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

13

conocimiento expuestas y porque presenta similitud con los mapas estrateacutegicos utilizados

comuacutenmente en videojuegos de estrategia que son de gran aceptacioacuten y reconocimiento por

parte del puacuteblico meta del material A continuacioacuten se muestra la propuesta graacutefica de la

portada y los moacutedulos de contenido del material

Figura 1 Portada del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

14

Figura 2 Moacutedulos de contenido del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por esta razoacuten los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos del material estaacuten

concebidos de forma modular independientes y adaptables dispuestos en un plano

cartograacutefico que de igual manera se adapta seguacuten la resolucioacuten de pantalla del dispositivo

desde el que se accede

El disentildeo graacutefico del multimedia educativo se disentildeoacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual de esta justificada pedagoacutegicamente y

elaborada a partir de la composicioacuten equilibrada y agradable de imaacutegenes mapa de bits e

ilustraciones vectoriales inspiradas como se mencionoacute anteriormente en los videojuegos de

estrategia que utilizan isomeacutetricos para ambientar sus escenarios Este material cuenta con

algunos aportes del disentildeo universal aplicados en un contexto educativo como uso

equiparable flexible intuitivo y simple Se consideran ademaacutes aspectos importantes de

accesibilidad e inclusioacuten como la posibilidad de ampliar disminuir y restablecer el tamantildeo del

texto en el contenido

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

15

Esta primera experiencia sirvioacute como base para el establecimiento de ciertos criterios

de produccioacuten en este tipo de materiales didaacutecticos como contemplar la adaptabilidad del

material desde el inicio de la produccioacuten considerar en el disentildeo de la metaacutefora pedagoacutegica

aspectos que implica el disentildeo adaptativo la simplicidad en el disentildeo graacutefico que se debe

utilizar en la elaboracioacuten de la interfaz graacutefica y los diferentes recursos audiovisuales entre

otros

Con la intensioacuten de continuar la produccioacuten de multimedia educativo bajo las

metodologiacuteas desarrolladas y adoptadas en el PEM a partir de experiencias previas en el

antildeo 2015 se produjo Geometriacutea Eucliacutedea Esta segunda experiencia presenta un material

didaacutectico utilizado en los cursos de Geometriacutea Eucliacutedea y Construcciones geomeacutetricas que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia Fue producido

bajo el concepto de laboratorio virtual y se compone de cuatro laboratorios que le permiten al

estudiantado y futuro docente de la Universidad aprender a realizar construcciones

geomeacutetricas a partir de la teacutecnica de Regla y compaacutes Portasegmentos Doblado de papel y

Software matemaacutetico

La metaacutefora pedagoacutegica se elaboroacute en torno a un vivero se tomoacute en consideracioacuten el

trasfondo histoacuterico y teoacuterico de la geometriacutea su clara percepcioacuten en la naturaleza desde la

antiguumledad asiacute como la manifestacioacuten cotidiana de elementos geomeacutetricos que rodean al

ser humano por ejemplo los puntos los planos las liacuteneas rectas curvas entre otros A

continuacioacuten se muestra la propuesta graacutefica de la portada y los laboratorios virtuales del

material

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

16

Figura 3 Portada del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

Figura 4 Laboratorios virtuales del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por este motivo los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos multimedia estaacuten

concebidos de forma modular independientes escalables y adaptables presentados en

varios estantes de exhibicioacuten de plantas

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

17

El disentildeo graacutefico del multimedia educativo se elaboroacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual justificada pedagoacutegicamente y disentildeada

a partir de una composicioacuten equilibrada y agradable de ilustraciones vectoriales inspiradas

como se mencionoacute anteriormente en ambientes cotidianos de un vivero con el objetivo de

reforzar la temaacutetica general del material con el contexto en que se presentan los contenidos

De igual manera este recurso cuenta con algunos aportes del disentildeo universal como

su uso equiparable flexible informacioacuten perceptible y tolerancia al error aplicados en el

aacutembito educativo y que tambieacuten consideran aspectos importantes de accesibilidad e

inclusioacuten

Estos dos ejemplos de multimedia educativo producidos en el PEM aunados a

esfuerzos de investigacioacuten y capacitacioacuten a nivel interno del programa son los primeros

pasos hacia el desarrollo de nuevos materiales didaacutecticos maacutes accesibles e inclusivos como

el reciente desarrollo de los laboratorios virtuales para el aprendizaje que tienen como fin

seguir poniendo a disposicioacuten del estudiantado materiales de calidad que apoyen sus

procesos de aprendizaje a distancia y en congruencia con las nuevas posibilidades

tecnoloacutegicas especialmente de formato y medios de reproduccioacuten

9 Conclusiones

A partir de las experiencias generadas desde el PEM asiacute como de valoraciones

recibidas de otras instancias acadeacutemicas de la Universidad con las que se ha trabajado en

conjunto se presentan algunos factores a considerar a la hora de emprender una produccioacuten

de multimedia educativo que contemple algunos de los principios de disentildeo desarrollados

con anterioridad

El disentildeo adaptativo demanda una mayor reflexioacuten a la hora de planificar y concretar la

propuesta graacutefica y la disposicioacuten de contenidos porque se deben contemplar nuevos

escenarios y posibilidades en la visualizacioacuten de los multimedia educativos en tabletas y en

teleacutefonos inteligentes Eso no implica el sacrificio total o parcial de la graacutefica y los contenidos

dado que dichos elementos se vinculan entre siacute independientemente de la resolucioacuten de

pantalla del dispositivo Por lo anterior en los uacuteltimos 5 antildeos el programa ha estado

revisando perioacutedicamente los procesos de produccioacuten y flujos de trabajo con el propoacutesito de

responder a las necesidades actuales de contenidos maacutes accesibles e inclusivos

El disentildeo de la interfaz graacutefica debe conceptualizarse en una uacutenica propuesta simple

concreta escalable y adaptable para hacer maacutes eficiente su proceso de elaboracioacuten Este

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

18

cambio de paradigma obligoacute a replantear el flujo de trabajo en disentildeo ya que se pasoacute de

elaborar varias versiones de una interfaz seguacuten la resolucioacuten de pantalla del dispositivo a

concentrar los esfuerzos en una uacutenica propuesta centrada en los elementos y acciones maacutes

importantes de navegacioacuten lo cual contribuyoacute a mejorar tanto la experiencia como la

usabilidad del material pues todos sus elementos graacuteficos y de contenido se adaptan

El disentildeo universal aplicado en la interfaz converge con el disentildeo adaptativo en la

concrecioacuten de propuestas que evidencien accesibilidad e inclusioacuten en armoniacutea con la graacutefica

ya que los materiales estaacuten orientados a los y las estudiantes y de ellos depende el impacto

que puede tener lo que se disentildee Por lo anterior el disentildeo graacutefico es valorado desde una

perspectiva pedagoacutegica que permite generar empatiacutea y motivacioacuten para explorar los

contenidos Bajo esa premisa el PEM estaacute en constante investigacioacuten de nuevas

metodologiacuteas que contribuyan a mejorar la mediacioacuten de los contenidos asiacute como la

experiencia visual de la interfaz graacutefica de los materiales que desarrolla

Los multimedia educativos se deben producir en funcioacuten de las necesidades y

capacidades del estudiantado por lo tanto es necesario un mayor anaacutelisis del puacuteblico meta

con especial eacutenfasis en acceso y tipo de dispositivos asiacute como la forma en que los utilizan

para acceder a los materiales esto permitiraacute seleccionar los medios y elementos graacuteficos

que realmente contribuyan a la mediacioacuten de los contenidos

Es necesario ademaacutes mejorar los procesos de evaluacioacuten de los multimedia

educativos con el propoacutesito de saber si las metodologiacuteas de disentildeo y produccioacuten utilizadas

actualmente mejoran la accesibilidad e inclusioacuten de los materiales disponibles para el

estudiantado como apoyo en sus procesos de aprendizaje a distancia

Referencias

Burgstahler Sheryl (2007) Universal Design in Education Principles and Applications Recuperado de httpwwwwashingtonedudoitBrochuresAcademicsud_eduhtml

Diacuteaz Luis Fernando (2011) Principios sobre la metaacutefora pedagoacutegica Recuperado de

httpwwwluisfernandodiazcomp=105 Fornasari de Menegazzo Lilia (1994) Didaacutectica de la imagen Zaragoza Editorial Latina Fundacioacuten SIDAR (2007) Principios del disentildeo universal Recuperado de

httpwwwsidarorgrecurdesdiusabledudtphp Gilliam Scott Robert (1980) Fundamentos del disentildeo Buenos Aires Editorial U Leru

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

19

Gutieacuterrez Favio (2012) Principios fundamentales de la tipografiacutea Recuperado de httpwwwfaviogutierrezcomcategorytipografia

Mantildeas Moiseacutes (2011) Interfases Reglasteoacutericas Recuperado de

httppersonalesupvesmoimacarmasterdownloadinterfacespdf Misischia Bibiana (3 de setiembre de 2013) Supresioacuten de barreras en la universidad

Paacutegina12 Recuperado de httpwwwpagina12comardiariouniversidad10-228134-2013-09-03html

Morton Jill (2010) Why color matters Recuperado de

httpwwwcolorcomcomresearchwhy-color-matters Observatorio de la Accesibilidad (sf) Breve historia Recuperado de

httpwwwobservatoriodelaaccesibilidadesaccesibilidadbreve-historia Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura - Unesco

(2013) Directrices para las Poliacuteticas de Aprendizaje Moacutevil Recuperado de httpunesdocunescoorgimages0021002196219662Spdf

Rand Paul (2007) Design form and chaos Massachusetts Rockport Publishers Inc Real Academia Espantildeola (2001) Imagen En Diccionario de la lengua espantildeola (22ordf ed)

Recuperado de httpdleraeesid=KzwDY4y Rubio Manuel (1 de setiembre de 2013) iquestQueacute es Disentildeo Adaptativo Recuperado de

httpsmagazinejoomlaorgesediciones-anterioressept-2013item1514-que-es-diseno-adaptativo

Salazar Bejarano Ana Gabriela Berrocal Carvajal Viviana Salas Campos lleana y Valerio

Aacutelvarez Cinthya (2014) Propuesta para el desarrollo de una aplicacioacuten para la gestioacuten administrativa en la UNED Costa Rica Revista Innovaciones Educativas 16(21) 1-11

Shneiderman Ben (1998) Designing the user interface Strategies for effective human-

computer interaction Massachusetts Addison-Wesley Pub Co Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfa) Geometriacutea Euclidea Recuperado de httprepositoriounedaccrmultimediasgeometria_euclideaindexhtml

Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb) Meacutetodos numeacutericos para la ensentildeanza Recuperado de httprepositoriounedaccrmultimediasmetodos_numericos_ensenanza

Velasco Santos Perla Laureano Cruces Ana Lilia Mora Torres Marta y Herrera Bautista

Miguel Aacutengel (octubre 2010) Disentildeo de agentes pedagoacutegicos a partir de los estilos de aprendizaje una perspectiva a traveacutes del color Ponencia presentada en el IV Congreso Mundial de Estilos de Aprendizaje Recuperado de httpkaliazcuammxclc02_publicacionesmaterialDiseC3B1o_de_AvataresPerspColor_10pdf

Page 2: El diseño universal en la interfaz gráfica de multimedia ... · El diseño universal en la interfaz gráfica de multimedia educativo ... aporte de otras metodologías como el diseño

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

1

El disentildeo universal en la interfaz graacutefica de multimedia educativo Universal design in the graphic interface of educational multimedia

Juan Diego Delgado Vargas1

Resumen El presente ensayo expone la aplicacioacuten del disentildeo universal en la interfaz graacutefica del multimedia educativo elaborado bajo el concepto de Laboratorio virtual proyecto de investigacioacuten que forma parte del Acuerdo de Mejoramiento Institucional (AMI) de la Universidad Estatal a Distancia (UNED) de Costa Rica Para ello se presentan referentes teoacutericos para su fundamentacioacuten los cuales contribuyen con una reflexioacuten acerca de la temaacutetica a partir de la experiencia del Programa de Produccioacuten Electroacutenica Multimedial (PEM) en esta aacuterea como parte de una revisioacuten de sus procesos productivos y oferta de este tipo de materiales El disentildeo de la interfaz graacutefica implica por ende valorar la necesidad del disentildeo universal aplicado a la elaboracioacuten de materiales didaacutecticos con especial eacutenfasis en aquellos con salida digital ya que por su naturaleza involucran la elaboracioacuten de entornos graacuteficos que deben ser accesibles por lo tanto la UNED debe considerar a traveacutes de la Direccioacuten de Produccioacuten de Materiales Didaacutecticos (DPMD) y sus diferentes instancias propuestas como esta que evidencian el esfuerzo y compromiso por incorporar nuevas metodologiacuteas de disentildeo que contribuyan al mejoramiento de la accesibilidad y la inclusioacuten de sus materiales orientados a educacioacuten a distancia Palabras clave ensentildeanza multimedia meacutetodo de ensentildeanza formacioacuten material didaacutectico Abstract The current essay has the main goal of presenting Universal Design applied to the graphical user interface of the educational multimedia resources developed under the concept of Virtual Laboratory research project of Acuerdo de Mejoramiento Institucional (AMI) of Universidad Estatal a Distancia (UNED) of Costa Rica For this purpose different theories and concepts are introduced along with reflexions about the contributions and experiences by Programa de Produccioacuten Electroacutenica Multimedial (PEM) in this field as part of a review of their productive processes and deliver instructional resources in distance education The design of the graphic interface implies assessing the need for Universal Design applied to the creation of teaching materials with especial emphasis on those with digital output since by their nature they involve the development of graphical environment that must be accessible therefore UNED must consider through the Direccioacuten de Produccioacuten de Materiales Didaacutecticos (DPMD) and their different instances proposals such as this that shows the hard work and commitment by incorporating new design methodologies that contribute to the improvement of accessibility and the inclusion of their resources in distance education oriented materials Key words multimedia teaching teaching method training teaching material

1 Productor y disentildeador graacutefico en multimedia educativo en el Programa de Produccioacuten Electroacutenica Multimedial (PEM) de la Universidad Estatal a Distancia (UNED) de Costa Rica Direccioacuten electroacutenica jdelgadovunedaccr

Ensayo recibido 19 de octubre 2016 Enviado a correccioacuten 9 de mayo 2017 Aprobado 14 de agosto 2017

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

2

1 Introduccioacuten

Este ensayo presenta un recorrido teoacuterico por el disentildeo universal aplicado en la

elaboracioacuten de la interfaz graacutefica del multimedia educativo producido bajo el concepto de

laboratorio virtual cuyo proyecto de investigacioacuten es parte de las acciones desarrolladas en

la iniciativa 8 y sub-iniciativa 4 del Acuerdo de Mejoramiento Institucional (AMI) de la

Universidad Estatal a Distancia (UNED) de Costa Rica desarrollado a traveacutes del Plan de

Mejoramiento Institucional (PMI) que se originoacute en el marco de las negociaciones del Fondo

Especial para el Financiamiento de la Educacioacuten Superior Estatal (FEES) en el antildeo 2012

El Programa de Produccioacuten Electroacutenica Multimedial (PEM) de la Direccioacuten de

Produccioacuten de Materiales Didaacutecticos (DPMD) es el encargado de elaborar dichos materiales

dirigidos a estudiantes del sistema de educacioacuten superior a distancia que utilizan las TIC

como apoyo en sus procesos de ensentildeanza-aprendizaje Para ello se exponen referentes

teoacutericos se definen conceptos importantes y por uacuteltimo se valoran los aportes del programa

en este campo

Es importante considerar que la produccioacuten de esos materiales didaacutecticos es un

proceso interdisciplinario y colaborativo en el que los profesionales involucrados aportan

desde sus aacutereas de experticia con base en los objetivos educativos y el puacuteblico meta

Ademaacutes el componente del disentildeo graacutefico es uno de los elementos mediadores del

proceso de comunicacioacuten entre el contenido y el estudiante al cual se le ha dedicado estudio

e investigacioacuten Esto se evidencia en el disentildeo de interfaces graacuteficas en las cuales la

metaacutefora pedagoacutegica continuacutea siendo predominante sin embargo su evolucioacuten producto de

las nuevas tecnologiacuteas y sus posibilidades en variados medios obligan a considerar el

aporte de otras metodologiacuteas como el disentildeo universal y el adaptativo en la produccioacuten de

multimedia educativo

2 Disentildeo Universal

En el antildeo 1974 durante la reunioacuten de un grupo de expertos sobre el disentildeo libre de

barreras celebrada en la ciudad de Nueva York Estados Unidos surgioacute el tema de adaptar

el medio fiacutesico a las personas con alguacuten tipo de discapacidad con el propoacutesito de darles

acceso en igualdad de condiciones a la sociedad Este acceso se hariacutea con el menor

nuacutemero de obstaacuteculos posible mediante la eliminacioacuten de barreras concepto comuacutenmente

relacionado con la construccioacuten de espacios fiacutesicos de faacutecil acceso como por ejemplo

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

3

rampas y ascensores pero hoy en diacutea es aplicable a aacutereas profesionales diferentes a la

arquitectura y el paisajismo

Con el tiempo se fue haciendo evidente que este tipo de construcciones eran una

ayuda teacutecnica que le permitiacutea a las personas con necesidades especiales insertarse de

mejor manera en la dinaacutemica social les brindaba la posibilidad de desempentildear funciones en

su vida cotidiana y en algunos casos maacutes bien potenciaba sus capacidades y desempentildeo al

relacionar los teacuterminos de flexibilidad y accesibilidad Gracias a esta relacioacuten la accesibilidad

hoy se mira de forma diferente y maacutes amplia pues aquello accesible para las personas con

alguacuten tipo de discapacidad es tambieacuten funcional para todos los demaacutes

Despueacutes de dicha reunioacuten surge el paradigma del disentildeo universal corriente teoacuterica

que tiene sus oriacutegenes en el funcionalismo escandinavo de los antildeos 50 y en el disentildeo

ergonoacutemico de los antildeos 60 asiacute como en la poliacutetica social sueca de finales de los antildeos 70

donde nacioacute el concepto de una sociedad para todos con lo cual se poniacuteaespecial eacutenfasis en

el teacutermino de accesibilidad (Observatorio de la Accesibilidad sf)

Ronald L Mace arquitecto y fundador del Centro para el Disentildeo Universal

mencionado por Bibiana Misischia en su artiacuteculo Supresioacuten de barreras en la universidad lo

define como ldquola creacioacuten de productos y entornos disentildeados de modo que sean utilizables

por todas las personas en la mayor medida posible sin necesidad de adaptaciones o

disentildeos especializadosrdquo (2013 paacuterr1) Este teacutermino fue aprobado oficialmente en el antildeo

2006 por la Convencioacuten de Naciones Unidas sobre los Derechos de las Personas con

Discapacidad en el artiacuteculo nuacutemero 2

En otras palabras el disentildeo universal busca la creacioacuten de entornos y productos con

un proceso planificado de elaboracioacuten para que sean utilizados por la mayor cantidad de

personas sin distincioacuten alguna (en edad y capacidades) mediante una serie de principios

que permiten guiar y evaluar el disentildeo asiacute como educar a los disentildeadores sobre las

caracteriacutesticas que deben tener para que sean maacutes accesibles al valorar la diversidad y la

inclusioacuten

Este proceso se aplica en diferentes aacutereas como la arquitectura el paisajismo la

ingenieriacutea la comunicacioacuten y el disentildeo industrial Estas tres uacuteltimas al interactuar con otras

disciplinas del disentildeo (graacutefico web software y de ergonomiacutea) permiten la creacioacuten de la

interfaz graacutefica

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

4

21 Principios del disentildeo universal

El Centro para el Disentildeo Universal (1997 citado por la Fundacioacuten SIDAR 2007)

traduce los principios a considerar en este tema de la siguiente manera

1) Uso equiparable Es uacutetil y vendible a personas con diversas capacidades

2) Uso flexible Se acomoda a un amplio rango de preferencias y habilidades

individuales

3) Simple e intuitivo Su uso es faacutecil de entender atiende a la experiencia

conocimientos habilidades linguumliacutesticas o grado de concentracioacuten actual del usuario

4) Informacioacuten perceptible Comunica de manera eficaz la informacioacuten necesaria para el

usuario y pone atencioacuten a las condiciones ambientales o a las capacidades sensoriales

del usuario

5) Con tolerancia al error Minimiza los riesgos y las consecuencias adversas de

acciones involuntarias o accidentales

6) Que exija poco esfuerzo fiacutesico Puede ser usado eficaz y confortablemente y con un

miacutenimo de fatiga

7) Tamantildeo y espacio para el acceso y uso Proporciona un tamantildeo y espacio

apropiados para el acceso alcance manipulacioacuten y uso y contempla el tamantildeo del

cuerpo la postura o la movilidad del usuario

Con base en lo anterior es importante mencionar que el proceso de disentildeo a traveacutes

de estas pautas evidencia un sentimiento de responsabilidad en cuanto a la inclusioacuten de la

mayor diversidad de usuarios posible Ademaacutes es necesario considerar una etapa de

investigacioacuten de usuarios para conocer y considerar sus caracteriacutesticas como necesidades

ya que de ellos depende el impacto que puede tener lo que se disentildee

En el aacutembito de la educacioacuten el disentildeo universal actualmente tiene una gran influencia

en las poliacuteticas y metodologiacuteas educativas de diferentes paiacuteses donde se integra de manera

formal en los procesos de educacioacuten inclusiva y en la UNED de Costa Rica esto no ha

pasado desapercibido En los uacuteltimos antildeos se han venido desarrollando diferentes iniciativas

para promover su uso y principales enfoques como por ejemplo el disentildeo universal en

educacioacuten desarrollado por el DO-IT Center (Discapacidades Oportunidades Interconexioacuten

de redes y Tecnologiacutea por sus siglas en ingleacutes) de la Universidad de Washington en los

Estados Unidos

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

5

Sheryl Burgstahler directora y fundadora del DO-IT Center define este enfoque como

ldquohellipun marco filosoacutefico para disentildear un rango general de productos y ambientes educativosrdquo

(2007 paacuterr 2) De este modo no solo se centra en el disentildeo de los curriacuteculos sino que por

su concepcioacuten maacutes amplia tambieacuten analiza otros factores como por ejemplo software

educativo y sitios web entre otros recursos que se pueden considerar materiales didaacutecticos

con componente tecnoloacutegico

3 Disentildeo graacutefico

Paul Rand disentildeador graacutefico y profesor en la Universidad de Yale define el disentildeo

graacutefico en su libro Design Form and Chaos como

entender el significado del disentildeo no es soacutelo entender el papel que desempentildean la

forma y el contenido sino descubrir que el disentildeo es tambieacuten un comentario una

opinioacuten un punto de vista y una responsabilidad social Disentildear es mucho maacutes que

simplemente ensamblar ordenar incluso editar es antildeadir valor y significado iluminar

simplificar aclarar modificar teatralizar persuadir y quizaacute incluso entretener (2007

p 6)

Lo anterior apoya el hecho de que el disentildeo graacutefico es algo maacutes que un simple

conjunto de imaacutegenes y texto con eacutenfasis en la composicioacuten y la esteacutetica es un elemento

visual comunicativo interpretado en un mensaje por medio de diferentes elementos tangibles

(imaacutegenes formas colores) y otros intangibles (sensaciones percepciones y sentimientos)

Algunos de los elementos que influyen en la forma en que se transmite un mensaje y

que deben tomarse en consideracioacuten al trabajar en disentildeo graacutefico son los siguientes

El color las primeras evidencias de su uso datan desde la eacutepoca de la prehistoria cuando

se realizaron las primeras manifestaciones de arte mediante el color rojo desprendido de las

tierras arcillosas En la actualidad Morton (2010) menciona que los estudios realizados por el

Institute of Color Research evidencian que

[hellip] las personas realizan juicios subconscientes de un ambiente de un producto o una

persona dentro de los 90 segundos de visualizacioacuten inicial y que entre el 62 y el 90 por

ciento de ese juicio se basa solo en el color (paacuterr 4)

Podriacutea decirse que el color es uno de los elementos clave en una composicioacuten graacutefica

ya que contribuye a transmitir sensaciones percepciones y sentimientos en la interpretacioacuten

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

6

de un mensaje Asiacute lo referencian Velasco Laureano Mora y Herrera (2010) quienes

afirman que

[hellip] el color es un elemento clave en el disentildeo graacutefico es el elemento maacutes 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 (Seccioacuten Psicologiacutea del color paacuterr 1)

La tipografiacutea con la invencioacuten de la imprenta en la eacutepoca del Renacimiento la tipografiacutea

toma relevancia de la mano de figuras importantes en su historia como Stanley Morison

(1929) citado por Gutieacuterrez (2012) quien definioacute la tipografiacutea como

[hellip] el arte de disponer correctamente el material de imprimir de acuerdo con un

propoacutesito especiacutefico el de colocar las letras repartir el espacio y organizar los tipos

con vistas a prestar al lector la maacutexima ayuda para la comprensioacuten del texto escrito

verbalmente (paacuterr 1)

Puede considerarse entonces la tipografiacutea como una expresioacuten graacutefica de la voz que

contribuye a transmitir el mensaje por ello es importante cuando se utiliza pensar en el

puacuteblico al que va dirigido ya que este debe tener la capacidad de leerlo y comprenderlo sin

ninguacuten tipo de obstaacuteculo o niveles de dificultad posibles

La imagen seguacuten el diccionario de la Real Academia Espantildeola la palabra imagen

proviene del latiacuten imago que significa figura representacioacuten semejanza y apariencia de algo

Fornasari de Menegazzo va maacutes allaacute de lo simple y la define como ldquotoda representacioacuten

visual que mantiene una relacioacuten de semejanza con el objetivo de ser representadordquo (1994

p 21)

Una imagen es entonces un elemento meramente visual que se utiliza para

representar objetos sujetos o situaciones ficticias o reales que evocan expresiones y

sentimientos para transmitir un mensaje Es un elemento comunicacional de la graacutefica visual

La composicioacuten se entiende como la organizacioacuten de varios elementos graacuteficos dentro

del espacio visual que combinados tienen la capacidad de aportar un significado a la

transmisioacuten de un mensaje Es decir la composicioacuten distribuye los diferentes elementos en

una composicioacuten graacutefica (color tipografiacutea imagen) de forma equilibrada que da sentido a la

transmisioacuten de un mensaje Al respecto Gillian (1980) en su libro Fundamentos del disentildeo

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

7

manifiesta que ldquola composicioacuten significa tambieacuten organizacioacuten estructural y que esta

constituye el fundamento de las relaciones visualesrdquo (p19)

La composicioacuten es por lo tanto importante ya que mediante propiedades como orden

balance unidad y relacioacuten entre los elementos graacuteficos en su conjunto permite transmitir el

mensaje de forma concreta facilitando su comprensioacuten por parte del puacuteblico al cual se

orientoacute

4 Metaacutefora pedagoacutegica

Luis Fernando Diacuteaz productor acadeacutemico de la UNED de Costa Rica la define como

(hellip) un elemento comunicativo usualmente graacutefico a veces animado que trasmite en

forma sucinta y reiterada el mensaje educativo central del multimedio o del objeto

especiacutefico Provee unidad graacutefica (y refuerza la unidad pedagoacutegica) en el disentildeo de

todo el material y no solo en pantallas aisladas o en hiperviacutenculos (2011 paacuterr 6)

Es decir estaacute metodologiacutea permite fortalecer y favorecer mediante la reiteracioacuten del

mensaje y los contenidos educativos el aprendizaje que de forma simultaacutenea se comunica

mediante otras formas semaacutenticas y por lo tanto debe ser un proceso planificado desde el

disentildeo mismo

En los multimedia educativos su concrecioacuten se origina dentro de una etapa creativa

propia del proceso de produccioacuten caracterizada por la elaboracioacuten de una propuesta

pedagoacutegica que ademaacutes de mediar los contenidos es representada graacuteficamente para

favorecer el nexo motivacional y de intereacutes por explorar los contenidos e interartuar con

estos a traveacutes de la interfaz En la elaboracioacuten de la interfaz graacutefica este concepto orienta el

disentildeo de los elementos que la conforman como por ejemplo la interfaz principal

secundarias recursos multimedia y de navegacioacuten tales comomenuacutes botones e iacuteconos

Diacuteaz (2011) destaca 7 aspectos pedagoacutegicos que dan valor a la metaacutefora en la

produccioacuten de materiales didaacutecticos

1) Trasmite en forma sucinta y reiterada el mensaje educativo central

2) Fortalece el aprendizaje por cuanto reitera con otros recursos el mensaje textual Parte

de su valor formativo consiste en que refuerza mediante la repeticioacuten el mensaje y los

contenidos al aprendizaje y a la internalizacioacuten de los conocimientos los valores y las

conductas que simultaacuteneamente se comunican mediante otros lenguajes

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

8

3) Facilita la construccioacuten y la presentacioacuten de iacutendices menuacutes y botoneras para la

navegacioacuten dentro del multimedia Formas simplificadas de la metaacutefora (hojas laacutepices

de color flechas) permiten a los lectores distinguir textos vinculados con el mensaje

principal pero que obedecen a finalidades distintas del dominio de contenidos por

aprender Esta economiacutea de representacioacuten resulta en un ahorro de energiacutea en las

actividades educativas particularmente en la auto-instruccioacuten

4) En ese mismo sentido propicia la construccioacuten de familias de iconos aplicables incluso

a los materiales impresos con la intencioacuten de facilitar el desplazamiento del estudiante

por el texto a traveacutes de instrucciones tanto graacuteficas como verbales

5) Favorece la identificacioacuten de los usuarios porque mueve sus emociones y sus

sentimientos crea empatiacutea y complicidad lo que favorece la exploracioacuten y el uso de los

materiales por el estudiantado

6) Modera la frialdad impliacutecita en la comunicacioacuten viacutea maacutequinas y medios electroacutenicos sin

dejar de atender a la veracidad y la verosimilitud Igual efecto provoca en los

voluminosos textos tradicionales impresos en blanco y negro

7) Es un recurso de calidad Una buena metaacutefora permea y orienta toda la produccioacuten se

reproduce y se enriquece a siacute misma y concentra la atencioacuten de los usuarios En este

rol se espera de ella un efecto multiplicador sobre el aprendizaje

5 Interfaz graacutefica

Ben Shneiderman catedraacutetico en Informaacutetica de la Universidad de Maryland en

Estados Unidos define la interfaz como ldquola membrana de comunicacioacuten entre los usuarios y

el sistema por la que los disentildeadores y desarrolladores de herramientas informaacuteticas pueden

hacer que la tecnologiacutea sea inteligible y sensible a las necesidades de los usuariosrdquo (1998

p 4)

En este caso en particular la interfaz graacutefica se puede considerar un mediador visual

que facilita la comunicacioacuten fluida y clara entre un sistema y el usuario para facilitar su

comprensioacuten y uso Esta por lo general se manifiesta en un entorno graacutefico compuesto

principalmente de imaacutegenes y objetos para representar la informacioacuten y las acciones

disponibles para ejecutar

Shneiderman (1998 mencionado por Mantildeas 2011 pp 27-34) enlista 8 reglas de oro

del disentildeo de interfaces

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

9

1) Esforzarse para conseguir consistencia exigir secuencias de acciones consistentes

utilizar terminologiacutea coherente en los mensajes menuacutes y pantallas de ayuda emplear

de forma consistente el color la composicioacuten las mayuacutesculas las fuentes y otros

elementos similares Las excepciones como la necesaria confirmacioacuten de la orden de

borrado o no mostrar los caracteres de las contrasentildeas deberiacutean ser comprensibles y

limitadas en nuacutemero

2) Atender la usabilidad universal reconocer las necesidades de los diversos usuarios

asiacute como las diferencias entre ellos (principiante o experto edades discapacidades y

diversidad tecnoloacutegica) para facilitar la transformacioacuten del contenido

3) Ofrecer realimentacioacuten informativa incluir para cada accioacuten del sistema una

realimentacioacuten por parte del sistema

4) Disentildear diaacutelogos para conducir a la finalizacioacuten crear sistemas claros de

conduccioacuten hasta el final del proceso de las secuencias de accioacuten del usuario

5) Prevenir errores disentildear el sistema de forma que los usuarios no puedan cometer

errores serios

6) Permitir deshacer acciones de forma faacutecil tener la posibilidad de remediar acciones

erroacuteneas por lo tanto construir un sistema reversible Este sistema suaviza la

ansiedad que se puede producir en el usuario

7) Dar soporte al control interno ofrecer a los operadores experimentados la sensacioacuten

de controlar la interfaz y que esta responde a sus acciones Las acciones

sorprendentes por parte de la interfaz las secuencias de entrada de datos tediosas la

incapacidad o dificultad para obtener la informacioacuten necesaria y la incapacidad para

producir acciones deseadas crean ansiedad e insatisfaccioacuten

8) Reducir la carga de la memoria a corto plazo disentildear sistemas de visualizacioacuten

simples que la frecuencia de movimiento de ventana se reduzca y que se asigne

suficiente tiempo de entrenamiento para coacutedigos y secuencias de acciones

Como consecuencia un buen disentildeo de interfaz graacutefica no solo se centra en la parte

visual su esteacutetica y la composicioacuten sino tambieacuten en el desarrollo de su interaccioacuten a traveacutes

de las reglas anteriormente mencionadas Ambos aspectos se complementan ya que en

gran medida determinan la buena experiencia de uso por parte del usuario

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

10

6 Disentildeo adaptativo

Sin duda alguna el siglo XXI se ha caracterizado por el uso cada vez maacutes frecuente y

cotidiano de dispositivos moacuteviles como tabletas teleacutefonos inteligentes y computadoras

portaacutetiles entre otros Seguacuten las Directrices para las poliacuteticas de aprendizaje moacutevil de la

Unesco (Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura)

Hay en el mundo maacutes de 3200 millones de usuarios registrados con teleacutefonos moacuteviles

lo que hace de estos dispositivos la modalidad de TIC maacutes utilizada en la Tierra En los

paiacuteses desarrollados 4 de cada 5 personas poseen y utilizan un teleacutefono moacutevil y

aunque la tasa es significativamente maacutes baja que en los paiacuteses en desarrollo (2 de

cada 5) es en estos paiacuteses donde se registra el crecimiento maacutes raacutepido en cuanto a

iacutendice de penetracioacuten en el mercado (2013 p 7)

En el contexto educativo este fenoacutemeno no ha pasado desapercibido los y las

estudiantes de diferentes modelos educativos en el mundo utilizan estos dispositivos con

diferentes objetivos como gestioacuten administrativa comunicacioacuten y en procesos de

ensentildeanza-aprendizaje Seguacuten las Directrices para las poliacuteticas de aprendizaje moacutevil de la

Unesco se cree al respecto que

[hellip] las tecnologiacuteas moacuteviles pueden ampliar y enriquecer las oportunidades educativas

en distintos contextos Hay cada vez maacutes datos que indican que los omnipresentes

dispositivos moacuteviles en particular los teleacutefonos moacuteviles y maacutes recientemente las

tabletas son utilizados por educandos y docentes de todo el mundo para acceder a

informacioacuten simplificar la administracioacuten y facilitar el aprendizaje de una forma nueva e

innovadora (2013 p5)

En el caso particular de la UNED de Costa Rica seguacuten un estudio realizado en el antildeo

2014 por Salazar Berrocal Salas y Valerio en el que se consideroacute la respuesta de 877

estudiantes y 211 tutores representativos de las instancias acadeacutemicas de la universidad el

90 afirmoacute poseer un teleacutefono moacutevil de los cuales 633 son teleacutefonos inteligentes un 30

son tabletas y un 42 son reproductores de audio y video

A partir de dicha informacioacuten se generoacute una reflexioacuten respecto a la forma en que los

usuarios (especialmente estudiantes) pueden utilizar los materiales didaacutecticos ademaacutes de un

anaacutelisis en cuanto a la presentacioacuten de contenidos y reestructuracioacuten del proceso de

produccioacuten de quienes los llevan a cabo y es asiacute como el disentildeo adaptativo surge como una

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

11

posible respuesta a la necesidad de que dichos materiales esteacuten disponibles para

dispositivos moacuteviles con el propoacutesito de que estos no queden fuera del contexto actual

El disentildeador Manuel Rubio en su artiacuteculo iquestQueacute es Disentildeo Adaptativo lo define como

ldquo[hellip] una teacutecnica de disentildeo y desarrollo web que mediante el uso de estructuras e imaacutegenes

fluidas asiacute como de media-queries en las hojas de estilo CSS se consigue adaptar el sitio

web al dispositivo del usuariordquo (2013 paacuterr 1) Esta adaptacioacuten implica que la interfaz graacutefica

asiacute como los contenidos educativos desarrollados para un material didaacutectico de la

Universidad se ajustan seguacuten la resolucioacuten de la pantalla sin importar el tipo de dispositivo

desde el que se accede pero en ninguacuten caso (a menos que asiacute se contemple) significa el

sacrificio de contenido para cumplir tal propoacutesito Asiacute tanto la informacioacuten escrita apoyada de

imaacutegenes videos animaciones actividades entre otros recursos son adaptados

7 Eleccioacuten de disentildeo adaptativo

El disentildeo adaptativo es una metodologiacutea de disentildeo que permite una mayor

universalizacioacuten de los contenidos de un material en especiacutefico pero la eleccioacuten de este tipo

de disentildeo no debe recaer simplemente en la versatilidad de produccioacuten sino que su

implementacioacuten debe cumplir criterios de produccioacuten para que sea efectivo de lo contrario

seriacutea mejor optar por otro tipo de soluciones

Se debe procurar que la adaptacioacuten de los materiales sea tal que el usuario no tenga

problemas en determinar el cambio maacutexime cuando se trabaja en coordinacioacuten con otras

estrategias didaacutecticas Si bien es cierto el desarrollo de disentildeo adaptativo ahorra tiempo si

se le compara con la produccioacuten de una versioacuten seguacuten dispositivo se debe contemplar el

hecho de que la programacioacuten necesaria para elaborar un material de este tipo es compleja y

debe estar muy bien planificada

Aunque en la actualidad se habla de una mayor penetracioacuten de las tecnologiacuteas moacuteviles

en el mundo antes de implementarlo con un propoacutesito didaacutectico se debe revisar el nivel de

utilizacioacuten potencial que los usuarios del material hacen de sus dispositivos moacuteviles de

manera que se pueda valorar a futuro la idoneidad de la puesta en marcha de la

implementacioacuten de este tipo de disentildeo

8 Aportes y experiencias del PEM en la produccioacuten de multimedia educativo

El PEM ha desarrollado multimedias educativos desde su creacioacuten en el antildeo 2000 La

consigna de produccioacuten acadeacutemica es buscar e implementar en ellos la mejor combinacioacuten

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

12

posible de mediacioacuten de contenidos y uso de las TIC en beneficio del estudiantado a partir

de criterios pedagoacutegicos y de disentildeo En este mismo espiacuteritu de observar y analizar los

cambios que se dan a nivel educativo con respecto a las diferentes posibilidades

tecnoloacutegicas es que el PEM comenzoacute su incursioacuten en el uso del disentildeo adaptativo en la

produccioacuten de multimedia educativo a partir del uso de herramientas y disposiciones

conceptuales para obtener materiales didaacutecticos maacutes inclusivos

Cabe aclarar que el puacuteblico meta del PEM son los y las estudiantes de las diferentes

carreras impartidas en la Universidad usuarios que bien podriacutean presentar alguna condicioacuten

o necesidad especial de aprendizaje que obliga al programa a pensar en las distintas

posibilidades de acceso y uso de sus multimedias educativos

En lo referente a la implementacioacuten de los conceptos anteriormente definidos en la

produccioacuten de multimedia educativo cabe sentildealar que su uso depende del cumplimiento de

criterios de seleccioacuten entre ellos la pertinencia pedagoacutegica con respecto a los contenidos o

bien el uso de los dispositivos moacuteviles por parte del estudiantado

Hoy maacutes que nunca la portabilidad y el uso de variados dispositivos plantea

interrogantes importantes en cuanto a produccioacuten y disentildeo que se tratan de responder desde

la investigacioacuten experimentacioacuten implementacioacuten y posterior evaluacioacuten de la propuesta

Como ejemplo de lo anterior y en el marco de la incursioacuten de los diferentes conceptos

expuestos en este ensayo en el PEM se han elaborado dos materiales que marcaron el

inicio de la implementacioacuten de las metodologiacuteas abordadas

En el antildeo 2013 se produjo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica En

esta primera experiencia se presentoacute un multimedia educativo que sirve de apoyo al libro

Meacutetodos Numeacutericos para la Ensentildeanza publicado por la Editorial de la Universidad Estatal a

Distancia (EUNED) de Costa Rica y que se utiliza en el curso Meacutetodos Numeacutericos que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia El material

ofrece a la persona estudiante la solucioacuten de ejemplos por medio de software libre y gratuito

para la resolucioacuten de problemas y ejercicios en temas relacionados con la Teoriacutea del error

Meacutetodos de aproximacioacuten para soluciones de ecuaciones no lineales Aproximacioacuten

polinomial para valores de funciones y Aproximaciones en derivacioacuten e integracioacuten utilizando

diversas teacutecnicas y meacutetodos

La metaacutefora pedagoacutegica desarrollada se elaboroacute bajo el concepto de un mapa de

estrategia que propone cuatro escenarios que representan las aacutereas temaacuteticas mencionadas

La propuesta se seleccionoacute porque mantiene una estrecha relacioacuten con las aacutereas del

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

13

conocimiento expuestas y porque presenta similitud con los mapas estrateacutegicos utilizados

comuacutenmente en videojuegos de estrategia que son de gran aceptacioacuten y reconocimiento por

parte del puacuteblico meta del material A continuacioacuten se muestra la propuesta graacutefica de la

portada y los moacutedulos de contenido del material

Figura 1 Portada del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

14

Figura 2 Moacutedulos de contenido del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por esta razoacuten los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos del material estaacuten

concebidos de forma modular independientes y adaptables dispuestos en un plano

cartograacutefico que de igual manera se adapta seguacuten la resolucioacuten de pantalla del dispositivo

desde el que se accede

El disentildeo graacutefico del multimedia educativo se disentildeoacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual de esta justificada pedagoacutegicamente y

elaborada a partir de la composicioacuten equilibrada y agradable de imaacutegenes mapa de bits e

ilustraciones vectoriales inspiradas como se mencionoacute anteriormente en los videojuegos de

estrategia que utilizan isomeacutetricos para ambientar sus escenarios Este material cuenta con

algunos aportes del disentildeo universal aplicados en un contexto educativo como uso

equiparable flexible intuitivo y simple Se consideran ademaacutes aspectos importantes de

accesibilidad e inclusioacuten como la posibilidad de ampliar disminuir y restablecer el tamantildeo del

texto en el contenido

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

15

Esta primera experiencia sirvioacute como base para el establecimiento de ciertos criterios

de produccioacuten en este tipo de materiales didaacutecticos como contemplar la adaptabilidad del

material desde el inicio de la produccioacuten considerar en el disentildeo de la metaacutefora pedagoacutegica

aspectos que implica el disentildeo adaptativo la simplicidad en el disentildeo graacutefico que se debe

utilizar en la elaboracioacuten de la interfaz graacutefica y los diferentes recursos audiovisuales entre

otros

Con la intensioacuten de continuar la produccioacuten de multimedia educativo bajo las

metodologiacuteas desarrolladas y adoptadas en el PEM a partir de experiencias previas en el

antildeo 2015 se produjo Geometriacutea Eucliacutedea Esta segunda experiencia presenta un material

didaacutectico utilizado en los cursos de Geometriacutea Eucliacutedea y Construcciones geomeacutetricas que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia Fue producido

bajo el concepto de laboratorio virtual y se compone de cuatro laboratorios que le permiten al

estudiantado y futuro docente de la Universidad aprender a realizar construcciones

geomeacutetricas a partir de la teacutecnica de Regla y compaacutes Portasegmentos Doblado de papel y

Software matemaacutetico

La metaacutefora pedagoacutegica se elaboroacute en torno a un vivero se tomoacute en consideracioacuten el

trasfondo histoacuterico y teoacuterico de la geometriacutea su clara percepcioacuten en la naturaleza desde la

antiguumledad asiacute como la manifestacioacuten cotidiana de elementos geomeacutetricos que rodean al

ser humano por ejemplo los puntos los planos las liacuteneas rectas curvas entre otros A

continuacioacuten se muestra la propuesta graacutefica de la portada y los laboratorios virtuales del

material

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

16

Figura 3 Portada del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

Figura 4 Laboratorios virtuales del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por este motivo los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos multimedia estaacuten

concebidos de forma modular independientes escalables y adaptables presentados en

varios estantes de exhibicioacuten de plantas

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

17

El disentildeo graacutefico del multimedia educativo se elaboroacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual justificada pedagoacutegicamente y disentildeada

a partir de una composicioacuten equilibrada y agradable de ilustraciones vectoriales inspiradas

como se mencionoacute anteriormente en ambientes cotidianos de un vivero con el objetivo de

reforzar la temaacutetica general del material con el contexto en que se presentan los contenidos

De igual manera este recurso cuenta con algunos aportes del disentildeo universal como

su uso equiparable flexible informacioacuten perceptible y tolerancia al error aplicados en el

aacutembito educativo y que tambieacuten consideran aspectos importantes de accesibilidad e

inclusioacuten

Estos dos ejemplos de multimedia educativo producidos en el PEM aunados a

esfuerzos de investigacioacuten y capacitacioacuten a nivel interno del programa son los primeros

pasos hacia el desarrollo de nuevos materiales didaacutecticos maacutes accesibles e inclusivos como

el reciente desarrollo de los laboratorios virtuales para el aprendizaje que tienen como fin

seguir poniendo a disposicioacuten del estudiantado materiales de calidad que apoyen sus

procesos de aprendizaje a distancia y en congruencia con las nuevas posibilidades

tecnoloacutegicas especialmente de formato y medios de reproduccioacuten

9 Conclusiones

A partir de las experiencias generadas desde el PEM asiacute como de valoraciones

recibidas de otras instancias acadeacutemicas de la Universidad con las que se ha trabajado en

conjunto se presentan algunos factores a considerar a la hora de emprender una produccioacuten

de multimedia educativo que contemple algunos de los principios de disentildeo desarrollados

con anterioridad

El disentildeo adaptativo demanda una mayor reflexioacuten a la hora de planificar y concretar la

propuesta graacutefica y la disposicioacuten de contenidos porque se deben contemplar nuevos

escenarios y posibilidades en la visualizacioacuten de los multimedia educativos en tabletas y en

teleacutefonos inteligentes Eso no implica el sacrificio total o parcial de la graacutefica y los contenidos

dado que dichos elementos se vinculan entre siacute independientemente de la resolucioacuten de

pantalla del dispositivo Por lo anterior en los uacuteltimos 5 antildeos el programa ha estado

revisando perioacutedicamente los procesos de produccioacuten y flujos de trabajo con el propoacutesito de

responder a las necesidades actuales de contenidos maacutes accesibles e inclusivos

El disentildeo de la interfaz graacutefica debe conceptualizarse en una uacutenica propuesta simple

concreta escalable y adaptable para hacer maacutes eficiente su proceso de elaboracioacuten Este

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

18

cambio de paradigma obligoacute a replantear el flujo de trabajo en disentildeo ya que se pasoacute de

elaborar varias versiones de una interfaz seguacuten la resolucioacuten de pantalla del dispositivo a

concentrar los esfuerzos en una uacutenica propuesta centrada en los elementos y acciones maacutes

importantes de navegacioacuten lo cual contribuyoacute a mejorar tanto la experiencia como la

usabilidad del material pues todos sus elementos graacuteficos y de contenido se adaptan

El disentildeo universal aplicado en la interfaz converge con el disentildeo adaptativo en la

concrecioacuten de propuestas que evidencien accesibilidad e inclusioacuten en armoniacutea con la graacutefica

ya que los materiales estaacuten orientados a los y las estudiantes y de ellos depende el impacto

que puede tener lo que se disentildee Por lo anterior el disentildeo graacutefico es valorado desde una

perspectiva pedagoacutegica que permite generar empatiacutea y motivacioacuten para explorar los

contenidos Bajo esa premisa el PEM estaacute en constante investigacioacuten de nuevas

metodologiacuteas que contribuyan a mejorar la mediacioacuten de los contenidos asiacute como la

experiencia visual de la interfaz graacutefica de los materiales que desarrolla

Los multimedia educativos se deben producir en funcioacuten de las necesidades y

capacidades del estudiantado por lo tanto es necesario un mayor anaacutelisis del puacuteblico meta

con especial eacutenfasis en acceso y tipo de dispositivos asiacute como la forma en que los utilizan

para acceder a los materiales esto permitiraacute seleccionar los medios y elementos graacuteficos

que realmente contribuyan a la mediacioacuten de los contenidos

Es necesario ademaacutes mejorar los procesos de evaluacioacuten de los multimedia

educativos con el propoacutesito de saber si las metodologiacuteas de disentildeo y produccioacuten utilizadas

actualmente mejoran la accesibilidad e inclusioacuten de los materiales disponibles para el

estudiantado como apoyo en sus procesos de aprendizaje a distancia

Referencias

Burgstahler Sheryl (2007) Universal Design in Education Principles and Applications Recuperado de httpwwwwashingtonedudoitBrochuresAcademicsud_eduhtml

Diacuteaz Luis Fernando (2011) Principios sobre la metaacutefora pedagoacutegica Recuperado de

httpwwwluisfernandodiazcomp=105 Fornasari de Menegazzo Lilia (1994) Didaacutectica de la imagen Zaragoza Editorial Latina Fundacioacuten SIDAR (2007) Principios del disentildeo universal Recuperado de

httpwwwsidarorgrecurdesdiusabledudtphp Gilliam Scott Robert (1980) Fundamentos del disentildeo Buenos Aires Editorial U Leru

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

19

Gutieacuterrez Favio (2012) Principios fundamentales de la tipografiacutea Recuperado de httpwwwfaviogutierrezcomcategorytipografia

Mantildeas Moiseacutes (2011) Interfases Reglasteoacutericas Recuperado de

httppersonalesupvesmoimacarmasterdownloadinterfacespdf Misischia Bibiana (3 de setiembre de 2013) Supresioacuten de barreras en la universidad

Paacutegina12 Recuperado de httpwwwpagina12comardiariouniversidad10-228134-2013-09-03html

Morton Jill (2010) Why color matters Recuperado de

httpwwwcolorcomcomresearchwhy-color-matters Observatorio de la Accesibilidad (sf) Breve historia Recuperado de

httpwwwobservatoriodelaaccesibilidadesaccesibilidadbreve-historia Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura - Unesco

(2013) Directrices para las Poliacuteticas de Aprendizaje Moacutevil Recuperado de httpunesdocunescoorgimages0021002196219662Spdf

Rand Paul (2007) Design form and chaos Massachusetts Rockport Publishers Inc Real Academia Espantildeola (2001) Imagen En Diccionario de la lengua espantildeola (22ordf ed)

Recuperado de httpdleraeesid=KzwDY4y Rubio Manuel (1 de setiembre de 2013) iquestQueacute es Disentildeo Adaptativo Recuperado de

httpsmagazinejoomlaorgesediciones-anterioressept-2013item1514-que-es-diseno-adaptativo

Salazar Bejarano Ana Gabriela Berrocal Carvajal Viviana Salas Campos lleana y Valerio

Aacutelvarez Cinthya (2014) Propuesta para el desarrollo de una aplicacioacuten para la gestioacuten administrativa en la UNED Costa Rica Revista Innovaciones Educativas 16(21) 1-11

Shneiderman Ben (1998) Designing the user interface Strategies for effective human-

computer interaction Massachusetts Addison-Wesley Pub Co Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfa) Geometriacutea Euclidea Recuperado de httprepositoriounedaccrmultimediasgeometria_euclideaindexhtml

Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb) Meacutetodos numeacutericos para la ensentildeanza Recuperado de httprepositoriounedaccrmultimediasmetodos_numericos_ensenanza

Velasco Santos Perla Laureano Cruces Ana Lilia Mora Torres Marta y Herrera Bautista

Miguel Aacutengel (octubre 2010) Disentildeo de agentes pedagoacutegicos a partir de los estilos de aprendizaje una perspectiva a traveacutes del color Ponencia presentada en el IV Congreso Mundial de Estilos de Aprendizaje Recuperado de httpkaliazcuammxclc02_publicacionesmaterialDiseC3B1o_de_AvataresPerspColor_10pdf

Page 3: El diseño universal en la interfaz gráfica de multimedia ... · El diseño universal en la interfaz gráfica de multimedia educativo ... aporte de otras metodologías como el diseño

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

2

1 Introduccioacuten

Este ensayo presenta un recorrido teoacuterico por el disentildeo universal aplicado en la

elaboracioacuten de la interfaz graacutefica del multimedia educativo producido bajo el concepto de

laboratorio virtual cuyo proyecto de investigacioacuten es parte de las acciones desarrolladas en

la iniciativa 8 y sub-iniciativa 4 del Acuerdo de Mejoramiento Institucional (AMI) de la

Universidad Estatal a Distancia (UNED) de Costa Rica desarrollado a traveacutes del Plan de

Mejoramiento Institucional (PMI) que se originoacute en el marco de las negociaciones del Fondo

Especial para el Financiamiento de la Educacioacuten Superior Estatal (FEES) en el antildeo 2012

El Programa de Produccioacuten Electroacutenica Multimedial (PEM) de la Direccioacuten de

Produccioacuten de Materiales Didaacutecticos (DPMD) es el encargado de elaborar dichos materiales

dirigidos a estudiantes del sistema de educacioacuten superior a distancia que utilizan las TIC

como apoyo en sus procesos de ensentildeanza-aprendizaje Para ello se exponen referentes

teoacutericos se definen conceptos importantes y por uacuteltimo se valoran los aportes del programa

en este campo

Es importante considerar que la produccioacuten de esos materiales didaacutecticos es un

proceso interdisciplinario y colaborativo en el que los profesionales involucrados aportan

desde sus aacutereas de experticia con base en los objetivos educativos y el puacuteblico meta

Ademaacutes el componente del disentildeo graacutefico es uno de los elementos mediadores del

proceso de comunicacioacuten entre el contenido y el estudiante al cual se le ha dedicado estudio

e investigacioacuten Esto se evidencia en el disentildeo de interfaces graacuteficas en las cuales la

metaacutefora pedagoacutegica continuacutea siendo predominante sin embargo su evolucioacuten producto de

las nuevas tecnologiacuteas y sus posibilidades en variados medios obligan a considerar el

aporte de otras metodologiacuteas como el disentildeo universal y el adaptativo en la produccioacuten de

multimedia educativo

2 Disentildeo Universal

En el antildeo 1974 durante la reunioacuten de un grupo de expertos sobre el disentildeo libre de

barreras celebrada en la ciudad de Nueva York Estados Unidos surgioacute el tema de adaptar

el medio fiacutesico a las personas con alguacuten tipo de discapacidad con el propoacutesito de darles

acceso en igualdad de condiciones a la sociedad Este acceso se hariacutea con el menor

nuacutemero de obstaacuteculos posible mediante la eliminacioacuten de barreras concepto comuacutenmente

relacionado con la construccioacuten de espacios fiacutesicos de faacutecil acceso como por ejemplo

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

3

rampas y ascensores pero hoy en diacutea es aplicable a aacutereas profesionales diferentes a la

arquitectura y el paisajismo

Con el tiempo se fue haciendo evidente que este tipo de construcciones eran una

ayuda teacutecnica que le permitiacutea a las personas con necesidades especiales insertarse de

mejor manera en la dinaacutemica social les brindaba la posibilidad de desempentildear funciones en

su vida cotidiana y en algunos casos maacutes bien potenciaba sus capacidades y desempentildeo al

relacionar los teacuterminos de flexibilidad y accesibilidad Gracias a esta relacioacuten la accesibilidad

hoy se mira de forma diferente y maacutes amplia pues aquello accesible para las personas con

alguacuten tipo de discapacidad es tambieacuten funcional para todos los demaacutes

Despueacutes de dicha reunioacuten surge el paradigma del disentildeo universal corriente teoacuterica

que tiene sus oriacutegenes en el funcionalismo escandinavo de los antildeos 50 y en el disentildeo

ergonoacutemico de los antildeos 60 asiacute como en la poliacutetica social sueca de finales de los antildeos 70

donde nacioacute el concepto de una sociedad para todos con lo cual se poniacuteaespecial eacutenfasis en

el teacutermino de accesibilidad (Observatorio de la Accesibilidad sf)

Ronald L Mace arquitecto y fundador del Centro para el Disentildeo Universal

mencionado por Bibiana Misischia en su artiacuteculo Supresioacuten de barreras en la universidad lo

define como ldquola creacioacuten de productos y entornos disentildeados de modo que sean utilizables

por todas las personas en la mayor medida posible sin necesidad de adaptaciones o

disentildeos especializadosrdquo (2013 paacuterr1) Este teacutermino fue aprobado oficialmente en el antildeo

2006 por la Convencioacuten de Naciones Unidas sobre los Derechos de las Personas con

Discapacidad en el artiacuteculo nuacutemero 2

En otras palabras el disentildeo universal busca la creacioacuten de entornos y productos con

un proceso planificado de elaboracioacuten para que sean utilizados por la mayor cantidad de

personas sin distincioacuten alguna (en edad y capacidades) mediante una serie de principios

que permiten guiar y evaluar el disentildeo asiacute como educar a los disentildeadores sobre las

caracteriacutesticas que deben tener para que sean maacutes accesibles al valorar la diversidad y la

inclusioacuten

Este proceso se aplica en diferentes aacutereas como la arquitectura el paisajismo la

ingenieriacutea la comunicacioacuten y el disentildeo industrial Estas tres uacuteltimas al interactuar con otras

disciplinas del disentildeo (graacutefico web software y de ergonomiacutea) permiten la creacioacuten de la

interfaz graacutefica

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

4

21 Principios del disentildeo universal

El Centro para el Disentildeo Universal (1997 citado por la Fundacioacuten SIDAR 2007)

traduce los principios a considerar en este tema de la siguiente manera

1) Uso equiparable Es uacutetil y vendible a personas con diversas capacidades

2) Uso flexible Se acomoda a un amplio rango de preferencias y habilidades

individuales

3) Simple e intuitivo Su uso es faacutecil de entender atiende a la experiencia

conocimientos habilidades linguumliacutesticas o grado de concentracioacuten actual del usuario

4) Informacioacuten perceptible Comunica de manera eficaz la informacioacuten necesaria para el

usuario y pone atencioacuten a las condiciones ambientales o a las capacidades sensoriales

del usuario

5) Con tolerancia al error Minimiza los riesgos y las consecuencias adversas de

acciones involuntarias o accidentales

6) Que exija poco esfuerzo fiacutesico Puede ser usado eficaz y confortablemente y con un

miacutenimo de fatiga

7) Tamantildeo y espacio para el acceso y uso Proporciona un tamantildeo y espacio

apropiados para el acceso alcance manipulacioacuten y uso y contempla el tamantildeo del

cuerpo la postura o la movilidad del usuario

Con base en lo anterior es importante mencionar que el proceso de disentildeo a traveacutes

de estas pautas evidencia un sentimiento de responsabilidad en cuanto a la inclusioacuten de la

mayor diversidad de usuarios posible Ademaacutes es necesario considerar una etapa de

investigacioacuten de usuarios para conocer y considerar sus caracteriacutesticas como necesidades

ya que de ellos depende el impacto que puede tener lo que se disentildee

En el aacutembito de la educacioacuten el disentildeo universal actualmente tiene una gran influencia

en las poliacuteticas y metodologiacuteas educativas de diferentes paiacuteses donde se integra de manera

formal en los procesos de educacioacuten inclusiva y en la UNED de Costa Rica esto no ha

pasado desapercibido En los uacuteltimos antildeos se han venido desarrollando diferentes iniciativas

para promover su uso y principales enfoques como por ejemplo el disentildeo universal en

educacioacuten desarrollado por el DO-IT Center (Discapacidades Oportunidades Interconexioacuten

de redes y Tecnologiacutea por sus siglas en ingleacutes) de la Universidad de Washington en los

Estados Unidos

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

5

Sheryl Burgstahler directora y fundadora del DO-IT Center define este enfoque como

ldquohellipun marco filosoacutefico para disentildear un rango general de productos y ambientes educativosrdquo

(2007 paacuterr 2) De este modo no solo se centra en el disentildeo de los curriacuteculos sino que por

su concepcioacuten maacutes amplia tambieacuten analiza otros factores como por ejemplo software

educativo y sitios web entre otros recursos que se pueden considerar materiales didaacutecticos

con componente tecnoloacutegico

3 Disentildeo graacutefico

Paul Rand disentildeador graacutefico y profesor en la Universidad de Yale define el disentildeo

graacutefico en su libro Design Form and Chaos como

entender el significado del disentildeo no es soacutelo entender el papel que desempentildean la

forma y el contenido sino descubrir que el disentildeo es tambieacuten un comentario una

opinioacuten un punto de vista y una responsabilidad social Disentildear es mucho maacutes que

simplemente ensamblar ordenar incluso editar es antildeadir valor y significado iluminar

simplificar aclarar modificar teatralizar persuadir y quizaacute incluso entretener (2007

p 6)

Lo anterior apoya el hecho de que el disentildeo graacutefico es algo maacutes que un simple

conjunto de imaacutegenes y texto con eacutenfasis en la composicioacuten y la esteacutetica es un elemento

visual comunicativo interpretado en un mensaje por medio de diferentes elementos tangibles

(imaacutegenes formas colores) y otros intangibles (sensaciones percepciones y sentimientos)

Algunos de los elementos que influyen en la forma en que se transmite un mensaje y

que deben tomarse en consideracioacuten al trabajar en disentildeo graacutefico son los siguientes

El color las primeras evidencias de su uso datan desde la eacutepoca de la prehistoria cuando

se realizaron las primeras manifestaciones de arte mediante el color rojo desprendido de las

tierras arcillosas En la actualidad Morton (2010) menciona que los estudios realizados por el

Institute of Color Research evidencian que

[hellip] las personas realizan juicios subconscientes de un ambiente de un producto o una

persona dentro de los 90 segundos de visualizacioacuten inicial y que entre el 62 y el 90 por

ciento de ese juicio se basa solo en el color (paacuterr 4)

Podriacutea decirse que el color es uno de los elementos clave en una composicioacuten graacutefica

ya que contribuye a transmitir sensaciones percepciones y sentimientos en la interpretacioacuten

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

6

de un mensaje Asiacute lo referencian Velasco Laureano Mora y Herrera (2010) quienes

afirman que

[hellip] el color es un elemento clave en el disentildeo graacutefico es el elemento maacutes 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 (Seccioacuten Psicologiacutea del color paacuterr 1)

La tipografiacutea con la invencioacuten de la imprenta en la eacutepoca del Renacimiento la tipografiacutea

toma relevancia de la mano de figuras importantes en su historia como Stanley Morison

(1929) citado por Gutieacuterrez (2012) quien definioacute la tipografiacutea como

[hellip] el arte de disponer correctamente el material de imprimir de acuerdo con un

propoacutesito especiacutefico el de colocar las letras repartir el espacio y organizar los tipos

con vistas a prestar al lector la maacutexima ayuda para la comprensioacuten del texto escrito

verbalmente (paacuterr 1)

Puede considerarse entonces la tipografiacutea como una expresioacuten graacutefica de la voz que

contribuye a transmitir el mensaje por ello es importante cuando se utiliza pensar en el

puacuteblico al que va dirigido ya que este debe tener la capacidad de leerlo y comprenderlo sin

ninguacuten tipo de obstaacuteculo o niveles de dificultad posibles

La imagen seguacuten el diccionario de la Real Academia Espantildeola la palabra imagen

proviene del latiacuten imago que significa figura representacioacuten semejanza y apariencia de algo

Fornasari de Menegazzo va maacutes allaacute de lo simple y la define como ldquotoda representacioacuten

visual que mantiene una relacioacuten de semejanza con el objetivo de ser representadordquo (1994

p 21)

Una imagen es entonces un elemento meramente visual que se utiliza para

representar objetos sujetos o situaciones ficticias o reales que evocan expresiones y

sentimientos para transmitir un mensaje Es un elemento comunicacional de la graacutefica visual

La composicioacuten se entiende como la organizacioacuten de varios elementos graacuteficos dentro

del espacio visual que combinados tienen la capacidad de aportar un significado a la

transmisioacuten de un mensaje Es decir la composicioacuten distribuye los diferentes elementos en

una composicioacuten graacutefica (color tipografiacutea imagen) de forma equilibrada que da sentido a la

transmisioacuten de un mensaje Al respecto Gillian (1980) en su libro Fundamentos del disentildeo

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

7

manifiesta que ldquola composicioacuten significa tambieacuten organizacioacuten estructural y que esta

constituye el fundamento de las relaciones visualesrdquo (p19)

La composicioacuten es por lo tanto importante ya que mediante propiedades como orden

balance unidad y relacioacuten entre los elementos graacuteficos en su conjunto permite transmitir el

mensaje de forma concreta facilitando su comprensioacuten por parte del puacuteblico al cual se

orientoacute

4 Metaacutefora pedagoacutegica

Luis Fernando Diacuteaz productor acadeacutemico de la UNED de Costa Rica la define como

(hellip) un elemento comunicativo usualmente graacutefico a veces animado que trasmite en

forma sucinta y reiterada el mensaje educativo central del multimedio o del objeto

especiacutefico Provee unidad graacutefica (y refuerza la unidad pedagoacutegica) en el disentildeo de

todo el material y no solo en pantallas aisladas o en hiperviacutenculos (2011 paacuterr 6)

Es decir estaacute metodologiacutea permite fortalecer y favorecer mediante la reiteracioacuten del

mensaje y los contenidos educativos el aprendizaje que de forma simultaacutenea se comunica

mediante otras formas semaacutenticas y por lo tanto debe ser un proceso planificado desde el

disentildeo mismo

En los multimedia educativos su concrecioacuten se origina dentro de una etapa creativa

propia del proceso de produccioacuten caracterizada por la elaboracioacuten de una propuesta

pedagoacutegica que ademaacutes de mediar los contenidos es representada graacuteficamente para

favorecer el nexo motivacional y de intereacutes por explorar los contenidos e interartuar con

estos a traveacutes de la interfaz En la elaboracioacuten de la interfaz graacutefica este concepto orienta el

disentildeo de los elementos que la conforman como por ejemplo la interfaz principal

secundarias recursos multimedia y de navegacioacuten tales comomenuacutes botones e iacuteconos

Diacuteaz (2011) destaca 7 aspectos pedagoacutegicos que dan valor a la metaacutefora en la

produccioacuten de materiales didaacutecticos

1) Trasmite en forma sucinta y reiterada el mensaje educativo central

2) Fortalece el aprendizaje por cuanto reitera con otros recursos el mensaje textual Parte

de su valor formativo consiste en que refuerza mediante la repeticioacuten el mensaje y los

contenidos al aprendizaje y a la internalizacioacuten de los conocimientos los valores y las

conductas que simultaacuteneamente se comunican mediante otros lenguajes

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

8

3) Facilita la construccioacuten y la presentacioacuten de iacutendices menuacutes y botoneras para la

navegacioacuten dentro del multimedia Formas simplificadas de la metaacutefora (hojas laacutepices

de color flechas) permiten a los lectores distinguir textos vinculados con el mensaje

principal pero que obedecen a finalidades distintas del dominio de contenidos por

aprender Esta economiacutea de representacioacuten resulta en un ahorro de energiacutea en las

actividades educativas particularmente en la auto-instruccioacuten

4) En ese mismo sentido propicia la construccioacuten de familias de iconos aplicables incluso

a los materiales impresos con la intencioacuten de facilitar el desplazamiento del estudiante

por el texto a traveacutes de instrucciones tanto graacuteficas como verbales

5) Favorece la identificacioacuten de los usuarios porque mueve sus emociones y sus

sentimientos crea empatiacutea y complicidad lo que favorece la exploracioacuten y el uso de los

materiales por el estudiantado

6) Modera la frialdad impliacutecita en la comunicacioacuten viacutea maacutequinas y medios electroacutenicos sin

dejar de atender a la veracidad y la verosimilitud Igual efecto provoca en los

voluminosos textos tradicionales impresos en blanco y negro

7) Es un recurso de calidad Una buena metaacutefora permea y orienta toda la produccioacuten se

reproduce y se enriquece a siacute misma y concentra la atencioacuten de los usuarios En este

rol se espera de ella un efecto multiplicador sobre el aprendizaje

5 Interfaz graacutefica

Ben Shneiderman catedraacutetico en Informaacutetica de la Universidad de Maryland en

Estados Unidos define la interfaz como ldquola membrana de comunicacioacuten entre los usuarios y

el sistema por la que los disentildeadores y desarrolladores de herramientas informaacuteticas pueden

hacer que la tecnologiacutea sea inteligible y sensible a las necesidades de los usuariosrdquo (1998

p 4)

En este caso en particular la interfaz graacutefica se puede considerar un mediador visual

que facilita la comunicacioacuten fluida y clara entre un sistema y el usuario para facilitar su

comprensioacuten y uso Esta por lo general se manifiesta en un entorno graacutefico compuesto

principalmente de imaacutegenes y objetos para representar la informacioacuten y las acciones

disponibles para ejecutar

Shneiderman (1998 mencionado por Mantildeas 2011 pp 27-34) enlista 8 reglas de oro

del disentildeo de interfaces

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

9

1) Esforzarse para conseguir consistencia exigir secuencias de acciones consistentes

utilizar terminologiacutea coherente en los mensajes menuacutes y pantallas de ayuda emplear

de forma consistente el color la composicioacuten las mayuacutesculas las fuentes y otros

elementos similares Las excepciones como la necesaria confirmacioacuten de la orden de

borrado o no mostrar los caracteres de las contrasentildeas deberiacutean ser comprensibles y

limitadas en nuacutemero

2) Atender la usabilidad universal reconocer las necesidades de los diversos usuarios

asiacute como las diferencias entre ellos (principiante o experto edades discapacidades y

diversidad tecnoloacutegica) para facilitar la transformacioacuten del contenido

3) Ofrecer realimentacioacuten informativa incluir para cada accioacuten del sistema una

realimentacioacuten por parte del sistema

4) Disentildear diaacutelogos para conducir a la finalizacioacuten crear sistemas claros de

conduccioacuten hasta el final del proceso de las secuencias de accioacuten del usuario

5) Prevenir errores disentildear el sistema de forma que los usuarios no puedan cometer

errores serios

6) Permitir deshacer acciones de forma faacutecil tener la posibilidad de remediar acciones

erroacuteneas por lo tanto construir un sistema reversible Este sistema suaviza la

ansiedad que se puede producir en el usuario

7) Dar soporte al control interno ofrecer a los operadores experimentados la sensacioacuten

de controlar la interfaz y que esta responde a sus acciones Las acciones

sorprendentes por parte de la interfaz las secuencias de entrada de datos tediosas la

incapacidad o dificultad para obtener la informacioacuten necesaria y la incapacidad para

producir acciones deseadas crean ansiedad e insatisfaccioacuten

8) Reducir la carga de la memoria a corto plazo disentildear sistemas de visualizacioacuten

simples que la frecuencia de movimiento de ventana se reduzca y que se asigne

suficiente tiempo de entrenamiento para coacutedigos y secuencias de acciones

Como consecuencia un buen disentildeo de interfaz graacutefica no solo se centra en la parte

visual su esteacutetica y la composicioacuten sino tambieacuten en el desarrollo de su interaccioacuten a traveacutes

de las reglas anteriormente mencionadas Ambos aspectos se complementan ya que en

gran medida determinan la buena experiencia de uso por parte del usuario

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

10

6 Disentildeo adaptativo

Sin duda alguna el siglo XXI se ha caracterizado por el uso cada vez maacutes frecuente y

cotidiano de dispositivos moacuteviles como tabletas teleacutefonos inteligentes y computadoras

portaacutetiles entre otros Seguacuten las Directrices para las poliacuteticas de aprendizaje moacutevil de la

Unesco (Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura)

Hay en el mundo maacutes de 3200 millones de usuarios registrados con teleacutefonos moacuteviles

lo que hace de estos dispositivos la modalidad de TIC maacutes utilizada en la Tierra En los

paiacuteses desarrollados 4 de cada 5 personas poseen y utilizan un teleacutefono moacutevil y

aunque la tasa es significativamente maacutes baja que en los paiacuteses en desarrollo (2 de

cada 5) es en estos paiacuteses donde se registra el crecimiento maacutes raacutepido en cuanto a

iacutendice de penetracioacuten en el mercado (2013 p 7)

En el contexto educativo este fenoacutemeno no ha pasado desapercibido los y las

estudiantes de diferentes modelos educativos en el mundo utilizan estos dispositivos con

diferentes objetivos como gestioacuten administrativa comunicacioacuten y en procesos de

ensentildeanza-aprendizaje Seguacuten las Directrices para las poliacuteticas de aprendizaje moacutevil de la

Unesco se cree al respecto que

[hellip] las tecnologiacuteas moacuteviles pueden ampliar y enriquecer las oportunidades educativas

en distintos contextos Hay cada vez maacutes datos que indican que los omnipresentes

dispositivos moacuteviles en particular los teleacutefonos moacuteviles y maacutes recientemente las

tabletas son utilizados por educandos y docentes de todo el mundo para acceder a

informacioacuten simplificar la administracioacuten y facilitar el aprendizaje de una forma nueva e

innovadora (2013 p5)

En el caso particular de la UNED de Costa Rica seguacuten un estudio realizado en el antildeo

2014 por Salazar Berrocal Salas y Valerio en el que se consideroacute la respuesta de 877

estudiantes y 211 tutores representativos de las instancias acadeacutemicas de la universidad el

90 afirmoacute poseer un teleacutefono moacutevil de los cuales 633 son teleacutefonos inteligentes un 30

son tabletas y un 42 son reproductores de audio y video

A partir de dicha informacioacuten se generoacute una reflexioacuten respecto a la forma en que los

usuarios (especialmente estudiantes) pueden utilizar los materiales didaacutecticos ademaacutes de un

anaacutelisis en cuanto a la presentacioacuten de contenidos y reestructuracioacuten del proceso de

produccioacuten de quienes los llevan a cabo y es asiacute como el disentildeo adaptativo surge como una

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

11

posible respuesta a la necesidad de que dichos materiales esteacuten disponibles para

dispositivos moacuteviles con el propoacutesito de que estos no queden fuera del contexto actual

El disentildeador Manuel Rubio en su artiacuteculo iquestQueacute es Disentildeo Adaptativo lo define como

ldquo[hellip] una teacutecnica de disentildeo y desarrollo web que mediante el uso de estructuras e imaacutegenes

fluidas asiacute como de media-queries en las hojas de estilo CSS se consigue adaptar el sitio

web al dispositivo del usuariordquo (2013 paacuterr 1) Esta adaptacioacuten implica que la interfaz graacutefica

asiacute como los contenidos educativos desarrollados para un material didaacutectico de la

Universidad se ajustan seguacuten la resolucioacuten de la pantalla sin importar el tipo de dispositivo

desde el que se accede pero en ninguacuten caso (a menos que asiacute se contemple) significa el

sacrificio de contenido para cumplir tal propoacutesito Asiacute tanto la informacioacuten escrita apoyada de

imaacutegenes videos animaciones actividades entre otros recursos son adaptados

7 Eleccioacuten de disentildeo adaptativo

El disentildeo adaptativo es una metodologiacutea de disentildeo que permite una mayor

universalizacioacuten de los contenidos de un material en especiacutefico pero la eleccioacuten de este tipo

de disentildeo no debe recaer simplemente en la versatilidad de produccioacuten sino que su

implementacioacuten debe cumplir criterios de produccioacuten para que sea efectivo de lo contrario

seriacutea mejor optar por otro tipo de soluciones

Se debe procurar que la adaptacioacuten de los materiales sea tal que el usuario no tenga

problemas en determinar el cambio maacutexime cuando se trabaja en coordinacioacuten con otras

estrategias didaacutecticas Si bien es cierto el desarrollo de disentildeo adaptativo ahorra tiempo si

se le compara con la produccioacuten de una versioacuten seguacuten dispositivo se debe contemplar el

hecho de que la programacioacuten necesaria para elaborar un material de este tipo es compleja y

debe estar muy bien planificada

Aunque en la actualidad se habla de una mayor penetracioacuten de las tecnologiacuteas moacuteviles

en el mundo antes de implementarlo con un propoacutesito didaacutectico se debe revisar el nivel de

utilizacioacuten potencial que los usuarios del material hacen de sus dispositivos moacuteviles de

manera que se pueda valorar a futuro la idoneidad de la puesta en marcha de la

implementacioacuten de este tipo de disentildeo

8 Aportes y experiencias del PEM en la produccioacuten de multimedia educativo

El PEM ha desarrollado multimedias educativos desde su creacioacuten en el antildeo 2000 La

consigna de produccioacuten acadeacutemica es buscar e implementar en ellos la mejor combinacioacuten

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

12

posible de mediacioacuten de contenidos y uso de las TIC en beneficio del estudiantado a partir

de criterios pedagoacutegicos y de disentildeo En este mismo espiacuteritu de observar y analizar los

cambios que se dan a nivel educativo con respecto a las diferentes posibilidades

tecnoloacutegicas es que el PEM comenzoacute su incursioacuten en el uso del disentildeo adaptativo en la

produccioacuten de multimedia educativo a partir del uso de herramientas y disposiciones

conceptuales para obtener materiales didaacutecticos maacutes inclusivos

Cabe aclarar que el puacuteblico meta del PEM son los y las estudiantes de las diferentes

carreras impartidas en la Universidad usuarios que bien podriacutean presentar alguna condicioacuten

o necesidad especial de aprendizaje que obliga al programa a pensar en las distintas

posibilidades de acceso y uso de sus multimedias educativos

En lo referente a la implementacioacuten de los conceptos anteriormente definidos en la

produccioacuten de multimedia educativo cabe sentildealar que su uso depende del cumplimiento de

criterios de seleccioacuten entre ellos la pertinencia pedagoacutegica con respecto a los contenidos o

bien el uso de los dispositivos moacuteviles por parte del estudiantado

Hoy maacutes que nunca la portabilidad y el uso de variados dispositivos plantea

interrogantes importantes en cuanto a produccioacuten y disentildeo que se tratan de responder desde

la investigacioacuten experimentacioacuten implementacioacuten y posterior evaluacioacuten de la propuesta

Como ejemplo de lo anterior y en el marco de la incursioacuten de los diferentes conceptos

expuestos en este ensayo en el PEM se han elaborado dos materiales que marcaron el

inicio de la implementacioacuten de las metodologiacuteas abordadas

En el antildeo 2013 se produjo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica En

esta primera experiencia se presentoacute un multimedia educativo que sirve de apoyo al libro

Meacutetodos Numeacutericos para la Ensentildeanza publicado por la Editorial de la Universidad Estatal a

Distancia (EUNED) de Costa Rica y que se utiliza en el curso Meacutetodos Numeacutericos que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia El material

ofrece a la persona estudiante la solucioacuten de ejemplos por medio de software libre y gratuito

para la resolucioacuten de problemas y ejercicios en temas relacionados con la Teoriacutea del error

Meacutetodos de aproximacioacuten para soluciones de ecuaciones no lineales Aproximacioacuten

polinomial para valores de funciones y Aproximaciones en derivacioacuten e integracioacuten utilizando

diversas teacutecnicas y meacutetodos

La metaacutefora pedagoacutegica desarrollada se elaboroacute bajo el concepto de un mapa de

estrategia que propone cuatro escenarios que representan las aacutereas temaacuteticas mencionadas

La propuesta se seleccionoacute porque mantiene una estrecha relacioacuten con las aacutereas del

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

13

conocimiento expuestas y porque presenta similitud con los mapas estrateacutegicos utilizados

comuacutenmente en videojuegos de estrategia que son de gran aceptacioacuten y reconocimiento por

parte del puacuteblico meta del material A continuacioacuten se muestra la propuesta graacutefica de la

portada y los moacutedulos de contenido del material

Figura 1 Portada del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

14

Figura 2 Moacutedulos de contenido del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por esta razoacuten los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos del material estaacuten

concebidos de forma modular independientes y adaptables dispuestos en un plano

cartograacutefico que de igual manera se adapta seguacuten la resolucioacuten de pantalla del dispositivo

desde el que se accede

El disentildeo graacutefico del multimedia educativo se disentildeoacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual de esta justificada pedagoacutegicamente y

elaborada a partir de la composicioacuten equilibrada y agradable de imaacutegenes mapa de bits e

ilustraciones vectoriales inspiradas como se mencionoacute anteriormente en los videojuegos de

estrategia que utilizan isomeacutetricos para ambientar sus escenarios Este material cuenta con

algunos aportes del disentildeo universal aplicados en un contexto educativo como uso

equiparable flexible intuitivo y simple Se consideran ademaacutes aspectos importantes de

accesibilidad e inclusioacuten como la posibilidad de ampliar disminuir y restablecer el tamantildeo del

texto en el contenido

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

15

Esta primera experiencia sirvioacute como base para el establecimiento de ciertos criterios

de produccioacuten en este tipo de materiales didaacutecticos como contemplar la adaptabilidad del

material desde el inicio de la produccioacuten considerar en el disentildeo de la metaacutefora pedagoacutegica

aspectos que implica el disentildeo adaptativo la simplicidad en el disentildeo graacutefico que se debe

utilizar en la elaboracioacuten de la interfaz graacutefica y los diferentes recursos audiovisuales entre

otros

Con la intensioacuten de continuar la produccioacuten de multimedia educativo bajo las

metodologiacuteas desarrolladas y adoptadas en el PEM a partir de experiencias previas en el

antildeo 2015 se produjo Geometriacutea Eucliacutedea Esta segunda experiencia presenta un material

didaacutectico utilizado en los cursos de Geometriacutea Eucliacutedea y Construcciones geomeacutetricas que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia Fue producido

bajo el concepto de laboratorio virtual y se compone de cuatro laboratorios que le permiten al

estudiantado y futuro docente de la Universidad aprender a realizar construcciones

geomeacutetricas a partir de la teacutecnica de Regla y compaacutes Portasegmentos Doblado de papel y

Software matemaacutetico

La metaacutefora pedagoacutegica se elaboroacute en torno a un vivero se tomoacute en consideracioacuten el

trasfondo histoacuterico y teoacuterico de la geometriacutea su clara percepcioacuten en la naturaleza desde la

antiguumledad asiacute como la manifestacioacuten cotidiana de elementos geomeacutetricos que rodean al

ser humano por ejemplo los puntos los planos las liacuteneas rectas curvas entre otros A

continuacioacuten se muestra la propuesta graacutefica de la portada y los laboratorios virtuales del

material

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

16

Figura 3 Portada del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

Figura 4 Laboratorios virtuales del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por este motivo los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos multimedia estaacuten

concebidos de forma modular independientes escalables y adaptables presentados en

varios estantes de exhibicioacuten de plantas

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

17

El disentildeo graacutefico del multimedia educativo se elaboroacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual justificada pedagoacutegicamente y disentildeada

a partir de una composicioacuten equilibrada y agradable de ilustraciones vectoriales inspiradas

como se mencionoacute anteriormente en ambientes cotidianos de un vivero con el objetivo de

reforzar la temaacutetica general del material con el contexto en que se presentan los contenidos

De igual manera este recurso cuenta con algunos aportes del disentildeo universal como

su uso equiparable flexible informacioacuten perceptible y tolerancia al error aplicados en el

aacutembito educativo y que tambieacuten consideran aspectos importantes de accesibilidad e

inclusioacuten

Estos dos ejemplos de multimedia educativo producidos en el PEM aunados a

esfuerzos de investigacioacuten y capacitacioacuten a nivel interno del programa son los primeros

pasos hacia el desarrollo de nuevos materiales didaacutecticos maacutes accesibles e inclusivos como

el reciente desarrollo de los laboratorios virtuales para el aprendizaje que tienen como fin

seguir poniendo a disposicioacuten del estudiantado materiales de calidad que apoyen sus

procesos de aprendizaje a distancia y en congruencia con las nuevas posibilidades

tecnoloacutegicas especialmente de formato y medios de reproduccioacuten

9 Conclusiones

A partir de las experiencias generadas desde el PEM asiacute como de valoraciones

recibidas de otras instancias acadeacutemicas de la Universidad con las que se ha trabajado en

conjunto se presentan algunos factores a considerar a la hora de emprender una produccioacuten

de multimedia educativo que contemple algunos de los principios de disentildeo desarrollados

con anterioridad

El disentildeo adaptativo demanda una mayor reflexioacuten a la hora de planificar y concretar la

propuesta graacutefica y la disposicioacuten de contenidos porque se deben contemplar nuevos

escenarios y posibilidades en la visualizacioacuten de los multimedia educativos en tabletas y en

teleacutefonos inteligentes Eso no implica el sacrificio total o parcial de la graacutefica y los contenidos

dado que dichos elementos se vinculan entre siacute independientemente de la resolucioacuten de

pantalla del dispositivo Por lo anterior en los uacuteltimos 5 antildeos el programa ha estado

revisando perioacutedicamente los procesos de produccioacuten y flujos de trabajo con el propoacutesito de

responder a las necesidades actuales de contenidos maacutes accesibles e inclusivos

El disentildeo de la interfaz graacutefica debe conceptualizarse en una uacutenica propuesta simple

concreta escalable y adaptable para hacer maacutes eficiente su proceso de elaboracioacuten Este

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

18

cambio de paradigma obligoacute a replantear el flujo de trabajo en disentildeo ya que se pasoacute de

elaborar varias versiones de una interfaz seguacuten la resolucioacuten de pantalla del dispositivo a

concentrar los esfuerzos en una uacutenica propuesta centrada en los elementos y acciones maacutes

importantes de navegacioacuten lo cual contribuyoacute a mejorar tanto la experiencia como la

usabilidad del material pues todos sus elementos graacuteficos y de contenido se adaptan

El disentildeo universal aplicado en la interfaz converge con el disentildeo adaptativo en la

concrecioacuten de propuestas que evidencien accesibilidad e inclusioacuten en armoniacutea con la graacutefica

ya que los materiales estaacuten orientados a los y las estudiantes y de ellos depende el impacto

que puede tener lo que se disentildee Por lo anterior el disentildeo graacutefico es valorado desde una

perspectiva pedagoacutegica que permite generar empatiacutea y motivacioacuten para explorar los

contenidos Bajo esa premisa el PEM estaacute en constante investigacioacuten de nuevas

metodologiacuteas que contribuyan a mejorar la mediacioacuten de los contenidos asiacute como la

experiencia visual de la interfaz graacutefica de los materiales que desarrolla

Los multimedia educativos se deben producir en funcioacuten de las necesidades y

capacidades del estudiantado por lo tanto es necesario un mayor anaacutelisis del puacuteblico meta

con especial eacutenfasis en acceso y tipo de dispositivos asiacute como la forma en que los utilizan

para acceder a los materiales esto permitiraacute seleccionar los medios y elementos graacuteficos

que realmente contribuyan a la mediacioacuten de los contenidos

Es necesario ademaacutes mejorar los procesos de evaluacioacuten de los multimedia

educativos con el propoacutesito de saber si las metodologiacuteas de disentildeo y produccioacuten utilizadas

actualmente mejoran la accesibilidad e inclusioacuten de los materiales disponibles para el

estudiantado como apoyo en sus procesos de aprendizaje a distancia

Referencias

Burgstahler Sheryl (2007) Universal Design in Education Principles and Applications Recuperado de httpwwwwashingtonedudoitBrochuresAcademicsud_eduhtml

Diacuteaz Luis Fernando (2011) Principios sobre la metaacutefora pedagoacutegica Recuperado de

httpwwwluisfernandodiazcomp=105 Fornasari de Menegazzo Lilia (1994) Didaacutectica de la imagen Zaragoza Editorial Latina Fundacioacuten SIDAR (2007) Principios del disentildeo universal Recuperado de

httpwwwsidarorgrecurdesdiusabledudtphp Gilliam Scott Robert (1980) Fundamentos del disentildeo Buenos Aires Editorial U Leru

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

19

Gutieacuterrez Favio (2012) Principios fundamentales de la tipografiacutea Recuperado de httpwwwfaviogutierrezcomcategorytipografia

Mantildeas Moiseacutes (2011) Interfases Reglasteoacutericas Recuperado de

httppersonalesupvesmoimacarmasterdownloadinterfacespdf Misischia Bibiana (3 de setiembre de 2013) Supresioacuten de barreras en la universidad

Paacutegina12 Recuperado de httpwwwpagina12comardiariouniversidad10-228134-2013-09-03html

Morton Jill (2010) Why color matters Recuperado de

httpwwwcolorcomcomresearchwhy-color-matters Observatorio de la Accesibilidad (sf) Breve historia Recuperado de

httpwwwobservatoriodelaaccesibilidadesaccesibilidadbreve-historia Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura - Unesco

(2013) Directrices para las Poliacuteticas de Aprendizaje Moacutevil Recuperado de httpunesdocunescoorgimages0021002196219662Spdf

Rand Paul (2007) Design form and chaos Massachusetts Rockport Publishers Inc Real Academia Espantildeola (2001) Imagen En Diccionario de la lengua espantildeola (22ordf ed)

Recuperado de httpdleraeesid=KzwDY4y Rubio Manuel (1 de setiembre de 2013) iquestQueacute es Disentildeo Adaptativo Recuperado de

httpsmagazinejoomlaorgesediciones-anterioressept-2013item1514-que-es-diseno-adaptativo

Salazar Bejarano Ana Gabriela Berrocal Carvajal Viviana Salas Campos lleana y Valerio

Aacutelvarez Cinthya (2014) Propuesta para el desarrollo de una aplicacioacuten para la gestioacuten administrativa en la UNED Costa Rica Revista Innovaciones Educativas 16(21) 1-11

Shneiderman Ben (1998) Designing the user interface Strategies for effective human-

computer interaction Massachusetts Addison-Wesley Pub Co Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfa) Geometriacutea Euclidea Recuperado de httprepositoriounedaccrmultimediasgeometria_euclideaindexhtml

Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb) Meacutetodos numeacutericos para la ensentildeanza Recuperado de httprepositoriounedaccrmultimediasmetodos_numericos_ensenanza

Velasco Santos Perla Laureano Cruces Ana Lilia Mora Torres Marta y Herrera Bautista

Miguel Aacutengel (octubre 2010) Disentildeo de agentes pedagoacutegicos a partir de los estilos de aprendizaje una perspectiva a traveacutes del color Ponencia presentada en el IV Congreso Mundial de Estilos de Aprendizaje Recuperado de httpkaliazcuammxclc02_publicacionesmaterialDiseC3B1o_de_AvataresPerspColor_10pdf

Page 4: El diseño universal en la interfaz gráfica de multimedia ... · El diseño universal en la interfaz gráfica de multimedia educativo ... aporte de otras metodologías como el diseño

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

3

rampas y ascensores pero hoy en diacutea es aplicable a aacutereas profesionales diferentes a la

arquitectura y el paisajismo

Con el tiempo se fue haciendo evidente que este tipo de construcciones eran una

ayuda teacutecnica que le permitiacutea a las personas con necesidades especiales insertarse de

mejor manera en la dinaacutemica social les brindaba la posibilidad de desempentildear funciones en

su vida cotidiana y en algunos casos maacutes bien potenciaba sus capacidades y desempentildeo al

relacionar los teacuterminos de flexibilidad y accesibilidad Gracias a esta relacioacuten la accesibilidad

hoy se mira de forma diferente y maacutes amplia pues aquello accesible para las personas con

alguacuten tipo de discapacidad es tambieacuten funcional para todos los demaacutes

Despueacutes de dicha reunioacuten surge el paradigma del disentildeo universal corriente teoacuterica

que tiene sus oriacutegenes en el funcionalismo escandinavo de los antildeos 50 y en el disentildeo

ergonoacutemico de los antildeos 60 asiacute como en la poliacutetica social sueca de finales de los antildeos 70

donde nacioacute el concepto de una sociedad para todos con lo cual se poniacuteaespecial eacutenfasis en

el teacutermino de accesibilidad (Observatorio de la Accesibilidad sf)

Ronald L Mace arquitecto y fundador del Centro para el Disentildeo Universal

mencionado por Bibiana Misischia en su artiacuteculo Supresioacuten de barreras en la universidad lo

define como ldquola creacioacuten de productos y entornos disentildeados de modo que sean utilizables

por todas las personas en la mayor medida posible sin necesidad de adaptaciones o

disentildeos especializadosrdquo (2013 paacuterr1) Este teacutermino fue aprobado oficialmente en el antildeo

2006 por la Convencioacuten de Naciones Unidas sobre los Derechos de las Personas con

Discapacidad en el artiacuteculo nuacutemero 2

En otras palabras el disentildeo universal busca la creacioacuten de entornos y productos con

un proceso planificado de elaboracioacuten para que sean utilizados por la mayor cantidad de

personas sin distincioacuten alguna (en edad y capacidades) mediante una serie de principios

que permiten guiar y evaluar el disentildeo asiacute como educar a los disentildeadores sobre las

caracteriacutesticas que deben tener para que sean maacutes accesibles al valorar la diversidad y la

inclusioacuten

Este proceso se aplica en diferentes aacutereas como la arquitectura el paisajismo la

ingenieriacutea la comunicacioacuten y el disentildeo industrial Estas tres uacuteltimas al interactuar con otras

disciplinas del disentildeo (graacutefico web software y de ergonomiacutea) permiten la creacioacuten de la

interfaz graacutefica

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

4

21 Principios del disentildeo universal

El Centro para el Disentildeo Universal (1997 citado por la Fundacioacuten SIDAR 2007)

traduce los principios a considerar en este tema de la siguiente manera

1) Uso equiparable Es uacutetil y vendible a personas con diversas capacidades

2) Uso flexible Se acomoda a un amplio rango de preferencias y habilidades

individuales

3) Simple e intuitivo Su uso es faacutecil de entender atiende a la experiencia

conocimientos habilidades linguumliacutesticas o grado de concentracioacuten actual del usuario

4) Informacioacuten perceptible Comunica de manera eficaz la informacioacuten necesaria para el

usuario y pone atencioacuten a las condiciones ambientales o a las capacidades sensoriales

del usuario

5) Con tolerancia al error Minimiza los riesgos y las consecuencias adversas de

acciones involuntarias o accidentales

6) Que exija poco esfuerzo fiacutesico Puede ser usado eficaz y confortablemente y con un

miacutenimo de fatiga

7) Tamantildeo y espacio para el acceso y uso Proporciona un tamantildeo y espacio

apropiados para el acceso alcance manipulacioacuten y uso y contempla el tamantildeo del

cuerpo la postura o la movilidad del usuario

Con base en lo anterior es importante mencionar que el proceso de disentildeo a traveacutes

de estas pautas evidencia un sentimiento de responsabilidad en cuanto a la inclusioacuten de la

mayor diversidad de usuarios posible Ademaacutes es necesario considerar una etapa de

investigacioacuten de usuarios para conocer y considerar sus caracteriacutesticas como necesidades

ya que de ellos depende el impacto que puede tener lo que se disentildee

En el aacutembito de la educacioacuten el disentildeo universal actualmente tiene una gran influencia

en las poliacuteticas y metodologiacuteas educativas de diferentes paiacuteses donde se integra de manera

formal en los procesos de educacioacuten inclusiva y en la UNED de Costa Rica esto no ha

pasado desapercibido En los uacuteltimos antildeos se han venido desarrollando diferentes iniciativas

para promover su uso y principales enfoques como por ejemplo el disentildeo universal en

educacioacuten desarrollado por el DO-IT Center (Discapacidades Oportunidades Interconexioacuten

de redes y Tecnologiacutea por sus siglas en ingleacutes) de la Universidad de Washington en los

Estados Unidos

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

5

Sheryl Burgstahler directora y fundadora del DO-IT Center define este enfoque como

ldquohellipun marco filosoacutefico para disentildear un rango general de productos y ambientes educativosrdquo

(2007 paacuterr 2) De este modo no solo se centra en el disentildeo de los curriacuteculos sino que por

su concepcioacuten maacutes amplia tambieacuten analiza otros factores como por ejemplo software

educativo y sitios web entre otros recursos que se pueden considerar materiales didaacutecticos

con componente tecnoloacutegico

3 Disentildeo graacutefico

Paul Rand disentildeador graacutefico y profesor en la Universidad de Yale define el disentildeo

graacutefico en su libro Design Form and Chaos como

entender el significado del disentildeo no es soacutelo entender el papel que desempentildean la

forma y el contenido sino descubrir que el disentildeo es tambieacuten un comentario una

opinioacuten un punto de vista y una responsabilidad social Disentildear es mucho maacutes que

simplemente ensamblar ordenar incluso editar es antildeadir valor y significado iluminar

simplificar aclarar modificar teatralizar persuadir y quizaacute incluso entretener (2007

p 6)

Lo anterior apoya el hecho de que el disentildeo graacutefico es algo maacutes que un simple

conjunto de imaacutegenes y texto con eacutenfasis en la composicioacuten y la esteacutetica es un elemento

visual comunicativo interpretado en un mensaje por medio de diferentes elementos tangibles

(imaacutegenes formas colores) y otros intangibles (sensaciones percepciones y sentimientos)

Algunos de los elementos que influyen en la forma en que se transmite un mensaje y

que deben tomarse en consideracioacuten al trabajar en disentildeo graacutefico son los siguientes

El color las primeras evidencias de su uso datan desde la eacutepoca de la prehistoria cuando

se realizaron las primeras manifestaciones de arte mediante el color rojo desprendido de las

tierras arcillosas En la actualidad Morton (2010) menciona que los estudios realizados por el

Institute of Color Research evidencian que

[hellip] las personas realizan juicios subconscientes de un ambiente de un producto o una

persona dentro de los 90 segundos de visualizacioacuten inicial y que entre el 62 y el 90 por

ciento de ese juicio se basa solo en el color (paacuterr 4)

Podriacutea decirse que el color es uno de los elementos clave en una composicioacuten graacutefica

ya que contribuye a transmitir sensaciones percepciones y sentimientos en la interpretacioacuten

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

6

de un mensaje Asiacute lo referencian Velasco Laureano Mora y Herrera (2010) quienes

afirman que

[hellip] el color es un elemento clave en el disentildeo graacutefico es el elemento maacutes 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 (Seccioacuten Psicologiacutea del color paacuterr 1)

La tipografiacutea con la invencioacuten de la imprenta en la eacutepoca del Renacimiento la tipografiacutea

toma relevancia de la mano de figuras importantes en su historia como Stanley Morison

(1929) citado por Gutieacuterrez (2012) quien definioacute la tipografiacutea como

[hellip] el arte de disponer correctamente el material de imprimir de acuerdo con un

propoacutesito especiacutefico el de colocar las letras repartir el espacio y organizar los tipos

con vistas a prestar al lector la maacutexima ayuda para la comprensioacuten del texto escrito

verbalmente (paacuterr 1)

Puede considerarse entonces la tipografiacutea como una expresioacuten graacutefica de la voz que

contribuye a transmitir el mensaje por ello es importante cuando se utiliza pensar en el

puacuteblico al que va dirigido ya que este debe tener la capacidad de leerlo y comprenderlo sin

ninguacuten tipo de obstaacuteculo o niveles de dificultad posibles

La imagen seguacuten el diccionario de la Real Academia Espantildeola la palabra imagen

proviene del latiacuten imago que significa figura representacioacuten semejanza y apariencia de algo

Fornasari de Menegazzo va maacutes allaacute de lo simple y la define como ldquotoda representacioacuten

visual que mantiene una relacioacuten de semejanza con el objetivo de ser representadordquo (1994

p 21)

Una imagen es entonces un elemento meramente visual que se utiliza para

representar objetos sujetos o situaciones ficticias o reales que evocan expresiones y

sentimientos para transmitir un mensaje Es un elemento comunicacional de la graacutefica visual

La composicioacuten se entiende como la organizacioacuten de varios elementos graacuteficos dentro

del espacio visual que combinados tienen la capacidad de aportar un significado a la

transmisioacuten de un mensaje Es decir la composicioacuten distribuye los diferentes elementos en

una composicioacuten graacutefica (color tipografiacutea imagen) de forma equilibrada que da sentido a la

transmisioacuten de un mensaje Al respecto Gillian (1980) en su libro Fundamentos del disentildeo

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

7

manifiesta que ldquola composicioacuten significa tambieacuten organizacioacuten estructural y que esta

constituye el fundamento de las relaciones visualesrdquo (p19)

La composicioacuten es por lo tanto importante ya que mediante propiedades como orden

balance unidad y relacioacuten entre los elementos graacuteficos en su conjunto permite transmitir el

mensaje de forma concreta facilitando su comprensioacuten por parte del puacuteblico al cual se

orientoacute

4 Metaacutefora pedagoacutegica

Luis Fernando Diacuteaz productor acadeacutemico de la UNED de Costa Rica la define como

(hellip) un elemento comunicativo usualmente graacutefico a veces animado que trasmite en

forma sucinta y reiterada el mensaje educativo central del multimedio o del objeto

especiacutefico Provee unidad graacutefica (y refuerza la unidad pedagoacutegica) en el disentildeo de

todo el material y no solo en pantallas aisladas o en hiperviacutenculos (2011 paacuterr 6)

Es decir estaacute metodologiacutea permite fortalecer y favorecer mediante la reiteracioacuten del

mensaje y los contenidos educativos el aprendizaje que de forma simultaacutenea se comunica

mediante otras formas semaacutenticas y por lo tanto debe ser un proceso planificado desde el

disentildeo mismo

En los multimedia educativos su concrecioacuten se origina dentro de una etapa creativa

propia del proceso de produccioacuten caracterizada por la elaboracioacuten de una propuesta

pedagoacutegica que ademaacutes de mediar los contenidos es representada graacuteficamente para

favorecer el nexo motivacional y de intereacutes por explorar los contenidos e interartuar con

estos a traveacutes de la interfaz En la elaboracioacuten de la interfaz graacutefica este concepto orienta el

disentildeo de los elementos que la conforman como por ejemplo la interfaz principal

secundarias recursos multimedia y de navegacioacuten tales comomenuacutes botones e iacuteconos

Diacuteaz (2011) destaca 7 aspectos pedagoacutegicos que dan valor a la metaacutefora en la

produccioacuten de materiales didaacutecticos

1) Trasmite en forma sucinta y reiterada el mensaje educativo central

2) Fortalece el aprendizaje por cuanto reitera con otros recursos el mensaje textual Parte

de su valor formativo consiste en que refuerza mediante la repeticioacuten el mensaje y los

contenidos al aprendizaje y a la internalizacioacuten de los conocimientos los valores y las

conductas que simultaacuteneamente se comunican mediante otros lenguajes

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

8

3) Facilita la construccioacuten y la presentacioacuten de iacutendices menuacutes y botoneras para la

navegacioacuten dentro del multimedia Formas simplificadas de la metaacutefora (hojas laacutepices

de color flechas) permiten a los lectores distinguir textos vinculados con el mensaje

principal pero que obedecen a finalidades distintas del dominio de contenidos por

aprender Esta economiacutea de representacioacuten resulta en un ahorro de energiacutea en las

actividades educativas particularmente en la auto-instruccioacuten

4) En ese mismo sentido propicia la construccioacuten de familias de iconos aplicables incluso

a los materiales impresos con la intencioacuten de facilitar el desplazamiento del estudiante

por el texto a traveacutes de instrucciones tanto graacuteficas como verbales

5) Favorece la identificacioacuten de los usuarios porque mueve sus emociones y sus

sentimientos crea empatiacutea y complicidad lo que favorece la exploracioacuten y el uso de los

materiales por el estudiantado

6) Modera la frialdad impliacutecita en la comunicacioacuten viacutea maacutequinas y medios electroacutenicos sin

dejar de atender a la veracidad y la verosimilitud Igual efecto provoca en los

voluminosos textos tradicionales impresos en blanco y negro

7) Es un recurso de calidad Una buena metaacutefora permea y orienta toda la produccioacuten se

reproduce y se enriquece a siacute misma y concentra la atencioacuten de los usuarios En este

rol se espera de ella un efecto multiplicador sobre el aprendizaje

5 Interfaz graacutefica

Ben Shneiderman catedraacutetico en Informaacutetica de la Universidad de Maryland en

Estados Unidos define la interfaz como ldquola membrana de comunicacioacuten entre los usuarios y

el sistema por la que los disentildeadores y desarrolladores de herramientas informaacuteticas pueden

hacer que la tecnologiacutea sea inteligible y sensible a las necesidades de los usuariosrdquo (1998

p 4)

En este caso en particular la interfaz graacutefica se puede considerar un mediador visual

que facilita la comunicacioacuten fluida y clara entre un sistema y el usuario para facilitar su

comprensioacuten y uso Esta por lo general se manifiesta en un entorno graacutefico compuesto

principalmente de imaacutegenes y objetos para representar la informacioacuten y las acciones

disponibles para ejecutar

Shneiderman (1998 mencionado por Mantildeas 2011 pp 27-34) enlista 8 reglas de oro

del disentildeo de interfaces

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

9

1) Esforzarse para conseguir consistencia exigir secuencias de acciones consistentes

utilizar terminologiacutea coherente en los mensajes menuacutes y pantallas de ayuda emplear

de forma consistente el color la composicioacuten las mayuacutesculas las fuentes y otros

elementos similares Las excepciones como la necesaria confirmacioacuten de la orden de

borrado o no mostrar los caracteres de las contrasentildeas deberiacutean ser comprensibles y

limitadas en nuacutemero

2) Atender la usabilidad universal reconocer las necesidades de los diversos usuarios

asiacute como las diferencias entre ellos (principiante o experto edades discapacidades y

diversidad tecnoloacutegica) para facilitar la transformacioacuten del contenido

3) Ofrecer realimentacioacuten informativa incluir para cada accioacuten del sistema una

realimentacioacuten por parte del sistema

4) Disentildear diaacutelogos para conducir a la finalizacioacuten crear sistemas claros de

conduccioacuten hasta el final del proceso de las secuencias de accioacuten del usuario

5) Prevenir errores disentildear el sistema de forma que los usuarios no puedan cometer

errores serios

6) Permitir deshacer acciones de forma faacutecil tener la posibilidad de remediar acciones

erroacuteneas por lo tanto construir un sistema reversible Este sistema suaviza la

ansiedad que se puede producir en el usuario

7) Dar soporte al control interno ofrecer a los operadores experimentados la sensacioacuten

de controlar la interfaz y que esta responde a sus acciones Las acciones

sorprendentes por parte de la interfaz las secuencias de entrada de datos tediosas la

incapacidad o dificultad para obtener la informacioacuten necesaria y la incapacidad para

producir acciones deseadas crean ansiedad e insatisfaccioacuten

8) Reducir la carga de la memoria a corto plazo disentildear sistemas de visualizacioacuten

simples que la frecuencia de movimiento de ventana se reduzca y que se asigne

suficiente tiempo de entrenamiento para coacutedigos y secuencias de acciones

Como consecuencia un buen disentildeo de interfaz graacutefica no solo se centra en la parte

visual su esteacutetica y la composicioacuten sino tambieacuten en el desarrollo de su interaccioacuten a traveacutes

de las reglas anteriormente mencionadas Ambos aspectos se complementan ya que en

gran medida determinan la buena experiencia de uso por parte del usuario

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

10

6 Disentildeo adaptativo

Sin duda alguna el siglo XXI se ha caracterizado por el uso cada vez maacutes frecuente y

cotidiano de dispositivos moacuteviles como tabletas teleacutefonos inteligentes y computadoras

portaacutetiles entre otros Seguacuten las Directrices para las poliacuteticas de aprendizaje moacutevil de la

Unesco (Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura)

Hay en el mundo maacutes de 3200 millones de usuarios registrados con teleacutefonos moacuteviles

lo que hace de estos dispositivos la modalidad de TIC maacutes utilizada en la Tierra En los

paiacuteses desarrollados 4 de cada 5 personas poseen y utilizan un teleacutefono moacutevil y

aunque la tasa es significativamente maacutes baja que en los paiacuteses en desarrollo (2 de

cada 5) es en estos paiacuteses donde se registra el crecimiento maacutes raacutepido en cuanto a

iacutendice de penetracioacuten en el mercado (2013 p 7)

En el contexto educativo este fenoacutemeno no ha pasado desapercibido los y las

estudiantes de diferentes modelos educativos en el mundo utilizan estos dispositivos con

diferentes objetivos como gestioacuten administrativa comunicacioacuten y en procesos de

ensentildeanza-aprendizaje Seguacuten las Directrices para las poliacuteticas de aprendizaje moacutevil de la

Unesco se cree al respecto que

[hellip] las tecnologiacuteas moacuteviles pueden ampliar y enriquecer las oportunidades educativas

en distintos contextos Hay cada vez maacutes datos que indican que los omnipresentes

dispositivos moacuteviles en particular los teleacutefonos moacuteviles y maacutes recientemente las

tabletas son utilizados por educandos y docentes de todo el mundo para acceder a

informacioacuten simplificar la administracioacuten y facilitar el aprendizaje de una forma nueva e

innovadora (2013 p5)

En el caso particular de la UNED de Costa Rica seguacuten un estudio realizado en el antildeo

2014 por Salazar Berrocal Salas y Valerio en el que se consideroacute la respuesta de 877

estudiantes y 211 tutores representativos de las instancias acadeacutemicas de la universidad el

90 afirmoacute poseer un teleacutefono moacutevil de los cuales 633 son teleacutefonos inteligentes un 30

son tabletas y un 42 son reproductores de audio y video

A partir de dicha informacioacuten se generoacute una reflexioacuten respecto a la forma en que los

usuarios (especialmente estudiantes) pueden utilizar los materiales didaacutecticos ademaacutes de un

anaacutelisis en cuanto a la presentacioacuten de contenidos y reestructuracioacuten del proceso de

produccioacuten de quienes los llevan a cabo y es asiacute como el disentildeo adaptativo surge como una

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

11

posible respuesta a la necesidad de que dichos materiales esteacuten disponibles para

dispositivos moacuteviles con el propoacutesito de que estos no queden fuera del contexto actual

El disentildeador Manuel Rubio en su artiacuteculo iquestQueacute es Disentildeo Adaptativo lo define como

ldquo[hellip] una teacutecnica de disentildeo y desarrollo web que mediante el uso de estructuras e imaacutegenes

fluidas asiacute como de media-queries en las hojas de estilo CSS se consigue adaptar el sitio

web al dispositivo del usuariordquo (2013 paacuterr 1) Esta adaptacioacuten implica que la interfaz graacutefica

asiacute como los contenidos educativos desarrollados para un material didaacutectico de la

Universidad se ajustan seguacuten la resolucioacuten de la pantalla sin importar el tipo de dispositivo

desde el que se accede pero en ninguacuten caso (a menos que asiacute se contemple) significa el

sacrificio de contenido para cumplir tal propoacutesito Asiacute tanto la informacioacuten escrita apoyada de

imaacutegenes videos animaciones actividades entre otros recursos son adaptados

7 Eleccioacuten de disentildeo adaptativo

El disentildeo adaptativo es una metodologiacutea de disentildeo que permite una mayor

universalizacioacuten de los contenidos de un material en especiacutefico pero la eleccioacuten de este tipo

de disentildeo no debe recaer simplemente en la versatilidad de produccioacuten sino que su

implementacioacuten debe cumplir criterios de produccioacuten para que sea efectivo de lo contrario

seriacutea mejor optar por otro tipo de soluciones

Se debe procurar que la adaptacioacuten de los materiales sea tal que el usuario no tenga

problemas en determinar el cambio maacutexime cuando se trabaja en coordinacioacuten con otras

estrategias didaacutecticas Si bien es cierto el desarrollo de disentildeo adaptativo ahorra tiempo si

se le compara con la produccioacuten de una versioacuten seguacuten dispositivo se debe contemplar el

hecho de que la programacioacuten necesaria para elaborar un material de este tipo es compleja y

debe estar muy bien planificada

Aunque en la actualidad se habla de una mayor penetracioacuten de las tecnologiacuteas moacuteviles

en el mundo antes de implementarlo con un propoacutesito didaacutectico se debe revisar el nivel de

utilizacioacuten potencial que los usuarios del material hacen de sus dispositivos moacuteviles de

manera que se pueda valorar a futuro la idoneidad de la puesta en marcha de la

implementacioacuten de este tipo de disentildeo

8 Aportes y experiencias del PEM en la produccioacuten de multimedia educativo

El PEM ha desarrollado multimedias educativos desde su creacioacuten en el antildeo 2000 La

consigna de produccioacuten acadeacutemica es buscar e implementar en ellos la mejor combinacioacuten

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

12

posible de mediacioacuten de contenidos y uso de las TIC en beneficio del estudiantado a partir

de criterios pedagoacutegicos y de disentildeo En este mismo espiacuteritu de observar y analizar los

cambios que se dan a nivel educativo con respecto a las diferentes posibilidades

tecnoloacutegicas es que el PEM comenzoacute su incursioacuten en el uso del disentildeo adaptativo en la

produccioacuten de multimedia educativo a partir del uso de herramientas y disposiciones

conceptuales para obtener materiales didaacutecticos maacutes inclusivos

Cabe aclarar que el puacuteblico meta del PEM son los y las estudiantes de las diferentes

carreras impartidas en la Universidad usuarios que bien podriacutean presentar alguna condicioacuten

o necesidad especial de aprendizaje que obliga al programa a pensar en las distintas

posibilidades de acceso y uso de sus multimedias educativos

En lo referente a la implementacioacuten de los conceptos anteriormente definidos en la

produccioacuten de multimedia educativo cabe sentildealar que su uso depende del cumplimiento de

criterios de seleccioacuten entre ellos la pertinencia pedagoacutegica con respecto a los contenidos o

bien el uso de los dispositivos moacuteviles por parte del estudiantado

Hoy maacutes que nunca la portabilidad y el uso de variados dispositivos plantea

interrogantes importantes en cuanto a produccioacuten y disentildeo que se tratan de responder desde

la investigacioacuten experimentacioacuten implementacioacuten y posterior evaluacioacuten de la propuesta

Como ejemplo de lo anterior y en el marco de la incursioacuten de los diferentes conceptos

expuestos en este ensayo en el PEM se han elaborado dos materiales que marcaron el

inicio de la implementacioacuten de las metodologiacuteas abordadas

En el antildeo 2013 se produjo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica En

esta primera experiencia se presentoacute un multimedia educativo que sirve de apoyo al libro

Meacutetodos Numeacutericos para la Ensentildeanza publicado por la Editorial de la Universidad Estatal a

Distancia (EUNED) de Costa Rica y que se utiliza en el curso Meacutetodos Numeacutericos que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia El material

ofrece a la persona estudiante la solucioacuten de ejemplos por medio de software libre y gratuito

para la resolucioacuten de problemas y ejercicios en temas relacionados con la Teoriacutea del error

Meacutetodos de aproximacioacuten para soluciones de ecuaciones no lineales Aproximacioacuten

polinomial para valores de funciones y Aproximaciones en derivacioacuten e integracioacuten utilizando

diversas teacutecnicas y meacutetodos

La metaacutefora pedagoacutegica desarrollada se elaboroacute bajo el concepto de un mapa de

estrategia que propone cuatro escenarios que representan las aacutereas temaacuteticas mencionadas

La propuesta se seleccionoacute porque mantiene una estrecha relacioacuten con las aacutereas del

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

13

conocimiento expuestas y porque presenta similitud con los mapas estrateacutegicos utilizados

comuacutenmente en videojuegos de estrategia que son de gran aceptacioacuten y reconocimiento por

parte del puacuteblico meta del material A continuacioacuten se muestra la propuesta graacutefica de la

portada y los moacutedulos de contenido del material

Figura 1 Portada del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

14

Figura 2 Moacutedulos de contenido del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por esta razoacuten los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos del material estaacuten

concebidos de forma modular independientes y adaptables dispuestos en un plano

cartograacutefico que de igual manera se adapta seguacuten la resolucioacuten de pantalla del dispositivo

desde el que se accede

El disentildeo graacutefico del multimedia educativo se disentildeoacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual de esta justificada pedagoacutegicamente y

elaborada a partir de la composicioacuten equilibrada y agradable de imaacutegenes mapa de bits e

ilustraciones vectoriales inspiradas como se mencionoacute anteriormente en los videojuegos de

estrategia que utilizan isomeacutetricos para ambientar sus escenarios Este material cuenta con

algunos aportes del disentildeo universal aplicados en un contexto educativo como uso

equiparable flexible intuitivo y simple Se consideran ademaacutes aspectos importantes de

accesibilidad e inclusioacuten como la posibilidad de ampliar disminuir y restablecer el tamantildeo del

texto en el contenido

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

15

Esta primera experiencia sirvioacute como base para el establecimiento de ciertos criterios

de produccioacuten en este tipo de materiales didaacutecticos como contemplar la adaptabilidad del

material desde el inicio de la produccioacuten considerar en el disentildeo de la metaacutefora pedagoacutegica

aspectos que implica el disentildeo adaptativo la simplicidad en el disentildeo graacutefico que se debe

utilizar en la elaboracioacuten de la interfaz graacutefica y los diferentes recursos audiovisuales entre

otros

Con la intensioacuten de continuar la produccioacuten de multimedia educativo bajo las

metodologiacuteas desarrolladas y adoptadas en el PEM a partir de experiencias previas en el

antildeo 2015 se produjo Geometriacutea Eucliacutedea Esta segunda experiencia presenta un material

didaacutectico utilizado en los cursos de Geometriacutea Eucliacutedea y Construcciones geomeacutetricas que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia Fue producido

bajo el concepto de laboratorio virtual y se compone de cuatro laboratorios que le permiten al

estudiantado y futuro docente de la Universidad aprender a realizar construcciones

geomeacutetricas a partir de la teacutecnica de Regla y compaacutes Portasegmentos Doblado de papel y

Software matemaacutetico

La metaacutefora pedagoacutegica se elaboroacute en torno a un vivero se tomoacute en consideracioacuten el

trasfondo histoacuterico y teoacuterico de la geometriacutea su clara percepcioacuten en la naturaleza desde la

antiguumledad asiacute como la manifestacioacuten cotidiana de elementos geomeacutetricos que rodean al

ser humano por ejemplo los puntos los planos las liacuteneas rectas curvas entre otros A

continuacioacuten se muestra la propuesta graacutefica de la portada y los laboratorios virtuales del

material

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

16

Figura 3 Portada del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

Figura 4 Laboratorios virtuales del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por este motivo los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos multimedia estaacuten

concebidos de forma modular independientes escalables y adaptables presentados en

varios estantes de exhibicioacuten de plantas

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

17

El disentildeo graacutefico del multimedia educativo se elaboroacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual justificada pedagoacutegicamente y disentildeada

a partir de una composicioacuten equilibrada y agradable de ilustraciones vectoriales inspiradas

como se mencionoacute anteriormente en ambientes cotidianos de un vivero con el objetivo de

reforzar la temaacutetica general del material con el contexto en que se presentan los contenidos

De igual manera este recurso cuenta con algunos aportes del disentildeo universal como

su uso equiparable flexible informacioacuten perceptible y tolerancia al error aplicados en el

aacutembito educativo y que tambieacuten consideran aspectos importantes de accesibilidad e

inclusioacuten

Estos dos ejemplos de multimedia educativo producidos en el PEM aunados a

esfuerzos de investigacioacuten y capacitacioacuten a nivel interno del programa son los primeros

pasos hacia el desarrollo de nuevos materiales didaacutecticos maacutes accesibles e inclusivos como

el reciente desarrollo de los laboratorios virtuales para el aprendizaje que tienen como fin

seguir poniendo a disposicioacuten del estudiantado materiales de calidad que apoyen sus

procesos de aprendizaje a distancia y en congruencia con las nuevas posibilidades

tecnoloacutegicas especialmente de formato y medios de reproduccioacuten

9 Conclusiones

A partir de las experiencias generadas desde el PEM asiacute como de valoraciones

recibidas de otras instancias acadeacutemicas de la Universidad con las que se ha trabajado en

conjunto se presentan algunos factores a considerar a la hora de emprender una produccioacuten

de multimedia educativo que contemple algunos de los principios de disentildeo desarrollados

con anterioridad

El disentildeo adaptativo demanda una mayor reflexioacuten a la hora de planificar y concretar la

propuesta graacutefica y la disposicioacuten de contenidos porque se deben contemplar nuevos

escenarios y posibilidades en la visualizacioacuten de los multimedia educativos en tabletas y en

teleacutefonos inteligentes Eso no implica el sacrificio total o parcial de la graacutefica y los contenidos

dado que dichos elementos se vinculan entre siacute independientemente de la resolucioacuten de

pantalla del dispositivo Por lo anterior en los uacuteltimos 5 antildeos el programa ha estado

revisando perioacutedicamente los procesos de produccioacuten y flujos de trabajo con el propoacutesito de

responder a las necesidades actuales de contenidos maacutes accesibles e inclusivos

El disentildeo de la interfaz graacutefica debe conceptualizarse en una uacutenica propuesta simple

concreta escalable y adaptable para hacer maacutes eficiente su proceso de elaboracioacuten Este

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

18

cambio de paradigma obligoacute a replantear el flujo de trabajo en disentildeo ya que se pasoacute de

elaborar varias versiones de una interfaz seguacuten la resolucioacuten de pantalla del dispositivo a

concentrar los esfuerzos en una uacutenica propuesta centrada en los elementos y acciones maacutes

importantes de navegacioacuten lo cual contribuyoacute a mejorar tanto la experiencia como la

usabilidad del material pues todos sus elementos graacuteficos y de contenido se adaptan

El disentildeo universal aplicado en la interfaz converge con el disentildeo adaptativo en la

concrecioacuten de propuestas que evidencien accesibilidad e inclusioacuten en armoniacutea con la graacutefica

ya que los materiales estaacuten orientados a los y las estudiantes y de ellos depende el impacto

que puede tener lo que se disentildee Por lo anterior el disentildeo graacutefico es valorado desde una

perspectiva pedagoacutegica que permite generar empatiacutea y motivacioacuten para explorar los

contenidos Bajo esa premisa el PEM estaacute en constante investigacioacuten de nuevas

metodologiacuteas que contribuyan a mejorar la mediacioacuten de los contenidos asiacute como la

experiencia visual de la interfaz graacutefica de los materiales que desarrolla

Los multimedia educativos se deben producir en funcioacuten de las necesidades y

capacidades del estudiantado por lo tanto es necesario un mayor anaacutelisis del puacuteblico meta

con especial eacutenfasis en acceso y tipo de dispositivos asiacute como la forma en que los utilizan

para acceder a los materiales esto permitiraacute seleccionar los medios y elementos graacuteficos

que realmente contribuyan a la mediacioacuten de los contenidos

Es necesario ademaacutes mejorar los procesos de evaluacioacuten de los multimedia

educativos con el propoacutesito de saber si las metodologiacuteas de disentildeo y produccioacuten utilizadas

actualmente mejoran la accesibilidad e inclusioacuten de los materiales disponibles para el

estudiantado como apoyo en sus procesos de aprendizaje a distancia

Referencias

Burgstahler Sheryl (2007) Universal Design in Education Principles and Applications Recuperado de httpwwwwashingtonedudoitBrochuresAcademicsud_eduhtml

Diacuteaz Luis Fernando (2011) Principios sobre la metaacutefora pedagoacutegica Recuperado de

httpwwwluisfernandodiazcomp=105 Fornasari de Menegazzo Lilia (1994) Didaacutectica de la imagen Zaragoza Editorial Latina Fundacioacuten SIDAR (2007) Principios del disentildeo universal Recuperado de

httpwwwsidarorgrecurdesdiusabledudtphp Gilliam Scott Robert (1980) Fundamentos del disentildeo Buenos Aires Editorial U Leru

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

19

Gutieacuterrez Favio (2012) Principios fundamentales de la tipografiacutea Recuperado de httpwwwfaviogutierrezcomcategorytipografia

Mantildeas Moiseacutes (2011) Interfases Reglasteoacutericas Recuperado de

httppersonalesupvesmoimacarmasterdownloadinterfacespdf Misischia Bibiana (3 de setiembre de 2013) Supresioacuten de barreras en la universidad

Paacutegina12 Recuperado de httpwwwpagina12comardiariouniversidad10-228134-2013-09-03html

Morton Jill (2010) Why color matters Recuperado de

httpwwwcolorcomcomresearchwhy-color-matters Observatorio de la Accesibilidad (sf) Breve historia Recuperado de

httpwwwobservatoriodelaaccesibilidadesaccesibilidadbreve-historia Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura - Unesco

(2013) Directrices para las Poliacuteticas de Aprendizaje Moacutevil Recuperado de httpunesdocunescoorgimages0021002196219662Spdf

Rand Paul (2007) Design form and chaos Massachusetts Rockport Publishers Inc Real Academia Espantildeola (2001) Imagen En Diccionario de la lengua espantildeola (22ordf ed)

Recuperado de httpdleraeesid=KzwDY4y Rubio Manuel (1 de setiembre de 2013) iquestQueacute es Disentildeo Adaptativo Recuperado de

httpsmagazinejoomlaorgesediciones-anterioressept-2013item1514-que-es-diseno-adaptativo

Salazar Bejarano Ana Gabriela Berrocal Carvajal Viviana Salas Campos lleana y Valerio

Aacutelvarez Cinthya (2014) Propuesta para el desarrollo de una aplicacioacuten para la gestioacuten administrativa en la UNED Costa Rica Revista Innovaciones Educativas 16(21) 1-11

Shneiderman Ben (1998) Designing the user interface Strategies for effective human-

computer interaction Massachusetts Addison-Wesley Pub Co Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfa) Geometriacutea Euclidea Recuperado de httprepositoriounedaccrmultimediasgeometria_euclideaindexhtml

Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb) Meacutetodos numeacutericos para la ensentildeanza Recuperado de httprepositoriounedaccrmultimediasmetodos_numericos_ensenanza

Velasco Santos Perla Laureano Cruces Ana Lilia Mora Torres Marta y Herrera Bautista

Miguel Aacutengel (octubre 2010) Disentildeo de agentes pedagoacutegicos a partir de los estilos de aprendizaje una perspectiva a traveacutes del color Ponencia presentada en el IV Congreso Mundial de Estilos de Aprendizaje Recuperado de httpkaliazcuammxclc02_publicacionesmaterialDiseC3B1o_de_AvataresPerspColor_10pdf

Page 5: El diseño universal en la interfaz gráfica de multimedia ... · El diseño universal en la interfaz gráfica de multimedia educativo ... aporte de otras metodologías como el diseño

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

4

21 Principios del disentildeo universal

El Centro para el Disentildeo Universal (1997 citado por la Fundacioacuten SIDAR 2007)

traduce los principios a considerar en este tema de la siguiente manera

1) Uso equiparable Es uacutetil y vendible a personas con diversas capacidades

2) Uso flexible Se acomoda a un amplio rango de preferencias y habilidades

individuales

3) Simple e intuitivo Su uso es faacutecil de entender atiende a la experiencia

conocimientos habilidades linguumliacutesticas o grado de concentracioacuten actual del usuario

4) Informacioacuten perceptible Comunica de manera eficaz la informacioacuten necesaria para el

usuario y pone atencioacuten a las condiciones ambientales o a las capacidades sensoriales

del usuario

5) Con tolerancia al error Minimiza los riesgos y las consecuencias adversas de

acciones involuntarias o accidentales

6) Que exija poco esfuerzo fiacutesico Puede ser usado eficaz y confortablemente y con un

miacutenimo de fatiga

7) Tamantildeo y espacio para el acceso y uso Proporciona un tamantildeo y espacio

apropiados para el acceso alcance manipulacioacuten y uso y contempla el tamantildeo del

cuerpo la postura o la movilidad del usuario

Con base en lo anterior es importante mencionar que el proceso de disentildeo a traveacutes

de estas pautas evidencia un sentimiento de responsabilidad en cuanto a la inclusioacuten de la

mayor diversidad de usuarios posible Ademaacutes es necesario considerar una etapa de

investigacioacuten de usuarios para conocer y considerar sus caracteriacutesticas como necesidades

ya que de ellos depende el impacto que puede tener lo que se disentildee

En el aacutembito de la educacioacuten el disentildeo universal actualmente tiene una gran influencia

en las poliacuteticas y metodologiacuteas educativas de diferentes paiacuteses donde se integra de manera

formal en los procesos de educacioacuten inclusiva y en la UNED de Costa Rica esto no ha

pasado desapercibido En los uacuteltimos antildeos se han venido desarrollando diferentes iniciativas

para promover su uso y principales enfoques como por ejemplo el disentildeo universal en

educacioacuten desarrollado por el DO-IT Center (Discapacidades Oportunidades Interconexioacuten

de redes y Tecnologiacutea por sus siglas en ingleacutes) de la Universidad de Washington en los

Estados Unidos

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

5

Sheryl Burgstahler directora y fundadora del DO-IT Center define este enfoque como

ldquohellipun marco filosoacutefico para disentildear un rango general de productos y ambientes educativosrdquo

(2007 paacuterr 2) De este modo no solo se centra en el disentildeo de los curriacuteculos sino que por

su concepcioacuten maacutes amplia tambieacuten analiza otros factores como por ejemplo software

educativo y sitios web entre otros recursos que se pueden considerar materiales didaacutecticos

con componente tecnoloacutegico

3 Disentildeo graacutefico

Paul Rand disentildeador graacutefico y profesor en la Universidad de Yale define el disentildeo

graacutefico en su libro Design Form and Chaos como

entender el significado del disentildeo no es soacutelo entender el papel que desempentildean la

forma y el contenido sino descubrir que el disentildeo es tambieacuten un comentario una

opinioacuten un punto de vista y una responsabilidad social Disentildear es mucho maacutes que

simplemente ensamblar ordenar incluso editar es antildeadir valor y significado iluminar

simplificar aclarar modificar teatralizar persuadir y quizaacute incluso entretener (2007

p 6)

Lo anterior apoya el hecho de que el disentildeo graacutefico es algo maacutes que un simple

conjunto de imaacutegenes y texto con eacutenfasis en la composicioacuten y la esteacutetica es un elemento

visual comunicativo interpretado en un mensaje por medio de diferentes elementos tangibles

(imaacutegenes formas colores) y otros intangibles (sensaciones percepciones y sentimientos)

Algunos de los elementos que influyen en la forma en que se transmite un mensaje y

que deben tomarse en consideracioacuten al trabajar en disentildeo graacutefico son los siguientes

El color las primeras evidencias de su uso datan desde la eacutepoca de la prehistoria cuando

se realizaron las primeras manifestaciones de arte mediante el color rojo desprendido de las

tierras arcillosas En la actualidad Morton (2010) menciona que los estudios realizados por el

Institute of Color Research evidencian que

[hellip] las personas realizan juicios subconscientes de un ambiente de un producto o una

persona dentro de los 90 segundos de visualizacioacuten inicial y que entre el 62 y el 90 por

ciento de ese juicio se basa solo en el color (paacuterr 4)

Podriacutea decirse que el color es uno de los elementos clave en una composicioacuten graacutefica

ya que contribuye a transmitir sensaciones percepciones y sentimientos en la interpretacioacuten

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

6

de un mensaje Asiacute lo referencian Velasco Laureano Mora y Herrera (2010) quienes

afirman que

[hellip] el color es un elemento clave en el disentildeo graacutefico es el elemento maacutes 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 (Seccioacuten Psicologiacutea del color paacuterr 1)

La tipografiacutea con la invencioacuten de la imprenta en la eacutepoca del Renacimiento la tipografiacutea

toma relevancia de la mano de figuras importantes en su historia como Stanley Morison

(1929) citado por Gutieacuterrez (2012) quien definioacute la tipografiacutea como

[hellip] el arte de disponer correctamente el material de imprimir de acuerdo con un

propoacutesito especiacutefico el de colocar las letras repartir el espacio y organizar los tipos

con vistas a prestar al lector la maacutexima ayuda para la comprensioacuten del texto escrito

verbalmente (paacuterr 1)

Puede considerarse entonces la tipografiacutea como una expresioacuten graacutefica de la voz que

contribuye a transmitir el mensaje por ello es importante cuando se utiliza pensar en el

puacuteblico al que va dirigido ya que este debe tener la capacidad de leerlo y comprenderlo sin

ninguacuten tipo de obstaacuteculo o niveles de dificultad posibles

La imagen seguacuten el diccionario de la Real Academia Espantildeola la palabra imagen

proviene del latiacuten imago que significa figura representacioacuten semejanza y apariencia de algo

Fornasari de Menegazzo va maacutes allaacute de lo simple y la define como ldquotoda representacioacuten

visual que mantiene una relacioacuten de semejanza con el objetivo de ser representadordquo (1994

p 21)

Una imagen es entonces un elemento meramente visual que se utiliza para

representar objetos sujetos o situaciones ficticias o reales que evocan expresiones y

sentimientos para transmitir un mensaje Es un elemento comunicacional de la graacutefica visual

La composicioacuten se entiende como la organizacioacuten de varios elementos graacuteficos dentro

del espacio visual que combinados tienen la capacidad de aportar un significado a la

transmisioacuten de un mensaje Es decir la composicioacuten distribuye los diferentes elementos en

una composicioacuten graacutefica (color tipografiacutea imagen) de forma equilibrada que da sentido a la

transmisioacuten de un mensaje Al respecto Gillian (1980) en su libro Fundamentos del disentildeo

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

7

manifiesta que ldquola composicioacuten significa tambieacuten organizacioacuten estructural y que esta

constituye el fundamento de las relaciones visualesrdquo (p19)

La composicioacuten es por lo tanto importante ya que mediante propiedades como orden

balance unidad y relacioacuten entre los elementos graacuteficos en su conjunto permite transmitir el

mensaje de forma concreta facilitando su comprensioacuten por parte del puacuteblico al cual se

orientoacute

4 Metaacutefora pedagoacutegica

Luis Fernando Diacuteaz productor acadeacutemico de la UNED de Costa Rica la define como

(hellip) un elemento comunicativo usualmente graacutefico a veces animado que trasmite en

forma sucinta y reiterada el mensaje educativo central del multimedio o del objeto

especiacutefico Provee unidad graacutefica (y refuerza la unidad pedagoacutegica) en el disentildeo de

todo el material y no solo en pantallas aisladas o en hiperviacutenculos (2011 paacuterr 6)

Es decir estaacute metodologiacutea permite fortalecer y favorecer mediante la reiteracioacuten del

mensaje y los contenidos educativos el aprendizaje que de forma simultaacutenea se comunica

mediante otras formas semaacutenticas y por lo tanto debe ser un proceso planificado desde el

disentildeo mismo

En los multimedia educativos su concrecioacuten se origina dentro de una etapa creativa

propia del proceso de produccioacuten caracterizada por la elaboracioacuten de una propuesta

pedagoacutegica que ademaacutes de mediar los contenidos es representada graacuteficamente para

favorecer el nexo motivacional y de intereacutes por explorar los contenidos e interartuar con

estos a traveacutes de la interfaz En la elaboracioacuten de la interfaz graacutefica este concepto orienta el

disentildeo de los elementos que la conforman como por ejemplo la interfaz principal

secundarias recursos multimedia y de navegacioacuten tales comomenuacutes botones e iacuteconos

Diacuteaz (2011) destaca 7 aspectos pedagoacutegicos que dan valor a la metaacutefora en la

produccioacuten de materiales didaacutecticos

1) Trasmite en forma sucinta y reiterada el mensaje educativo central

2) Fortalece el aprendizaje por cuanto reitera con otros recursos el mensaje textual Parte

de su valor formativo consiste en que refuerza mediante la repeticioacuten el mensaje y los

contenidos al aprendizaje y a la internalizacioacuten de los conocimientos los valores y las

conductas que simultaacuteneamente se comunican mediante otros lenguajes

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

8

3) Facilita la construccioacuten y la presentacioacuten de iacutendices menuacutes y botoneras para la

navegacioacuten dentro del multimedia Formas simplificadas de la metaacutefora (hojas laacutepices

de color flechas) permiten a los lectores distinguir textos vinculados con el mensaje

principal pero que obedecen a finalidades distintas del dominio de contenidos por

aprender Esta economiacutea de representacioacuten resulta en un ahorro de energiacutea en las

actividades educativas particularmente en la auto-instruccioacuten

4) En ese mismo sentido propicia la construccioacuten de familias de iconos aplicables incluso

a los materiales impresos con la intencioacuten de facilitar el desplazamiento del estudiante

por el texto a traveacutes de instrucciones tanto graacuteficas como verbales

5) Favorece la identificacioacuten de los usuarios porque mueve sus emociones y sus

sentimientos crea empatiacutea y complicidad lo que favorece la exploracioacuten y el uso de los

materiales por el estudiantado

6) Modera la frialdad impliacutecita en la comunicacioacuten viacutea maacutequinas y medios electroacutenicos sin

dejar de atender a la veracidad y la verosimilitud Igual efecto provoca en los

voluminosos textos tradicionales impresos en blanco y negro

7) Es un recurso de calidad Una buena metaacutefora permea y orienta toda la produccioacuten se

reproduce y se enriquece a siacute misma y concentra la atencioacuten de los usuarios En este

rol se espera de ella un efecto multiplicador sobre el aprendizaje

5 Interfaz graacutefica

Ben Shneiderman catedraacutetico en Informaacutetica de la Universidad de Maryland en

Estados Unidos define la interfaz como ldquola membrana de comunicacioacuten entre los usuarios y

el sistema por la que los disentildeadores y desarrolladores de herramientas informaacuteticas pueden

hacer que la tecnologiacutea sea inteligible y sensible a las necesidades de los usuariosrdquo (1998

p 4)

En este caso en particular la interfaz graacutefica se puede considerar un mediador visual

que facilita la comunicacioacuten fluida y clara entre un sistema y el usuario para facilitar su

comprensioacuten y uso Esta por lo general se manifiesta en un entorno graacutefico compuesto

principalmente de imaacutegenes y objetos para representar la informacioacuten y las acciones

disponibles para ejecutar

Shneiderman (1998 mencionado por Mantildeas 2011 pp 27-34) enlista 8 reglas de oro

del disentildeo de interfaces

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

9

1) Esforzarse para conseguir consistencia exigir secuencias de acciones consistentes

utilizar terminologiacutea coherente en los mensajes menuacutes y pantallas de ayuda emplear

de forma consistente el color la composicioacuten las mayuacutesculas las fuentes y otros

elementos similares Las excepciones como la necesaria confirmacioacuten de la orden de

borrado o no mostrar los caracteres de las contrasentildeas deberiacutean ser comprensibles y

limitadas en nuacutemero

2) Atender la usabilidad universal reconocer las necesidades de los diversos usuarios

asiacute como las diferencias entre ellos (principiante o experto edades discapacidades y

diversidad tecnoloacutegica) para facilitar la transformacioacuten del contenido

3) Ofrecer realimentacioacuten informativa incluir para cada accioacuten del sistema una

realimentacioacuten por parte del sistema

4) Disentildear diaacutelogos para conducir a la finalizacioacuten crear sistemas claros de

conduccioacuten hasta el final del proceso de las secuencias de accioacuten del usuario

5) Prevenir errores disentildear el sistema de forma que los usuarios no puedan cometer

errores serios

6) Permitir deshacer acciones de forma faacutecil tener la posibilidad de remediar acciones

erroacuteneas por lo tanto construir un sistema reversible Este sistema suaviza la

ansiedad que se puede producir en el usuario

7) Dar soporte al control interno ofrecer a los operadores experimentados la sensacioacuten

de controlar la interfaz y que esta responde a sus acciones Las acciones

sorprendentes por parte de la interfaz las secuencias de entrada de datos tediosas la

incapacidad o dificultad para obtener la informacioacuten necesaria y la incapacidad para

producir acciones deseadas crean ansiedad e insatisfaccioacuten

8) Reducir la carga de la memoria a corto plazo disentildear sistemas de visualizacioacuten

simples que la frecuencia de movimiento de ventana se reduzca y que se asigne

suficiente tiempo de entrenamiento para coacutedigos y secuencias de acciones

Como consecuencia un buen disentildeo de interfaz graacutefica no solo se centra en la parte

visual su esteacutetica y la composicioacuten sino tambieacuten en el desarrollo de su interaccioacuten a traveacutes

de las reglas anteriormente mencionadas Ambos aspectos se complementan ya que en

gran medida determinan la buena experiencia de uso por parte del usuario

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

10

6 Disentildeo adaptativo

Sin duda alguna el siglo XXI se ha caracterizado por el uso cada vez maacutes frecuente y

cotidiano de dispositivos moacuteviles como tabletas teleacutefonos inteligentes y computadoras

portaacutetiles entre otros Seguacuten las Directrices para las poliacuteticas de aprendizaje moacutevil de la

Unesco (Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura)

Hay en el mundo maacutes de 3200 millones de usuarios registrados con teleacutefonos moacuteviles

lo que hace de estos dispositivos la modalidad de TIC maacutes utilizada en la Tierra En los

paiacuteses desarrollados 4 de cada 5 personas poseen y utilizan un teleacutefono moacutevil y

aunque la tasa es significativamente maacutes baja que en los paiacuteses en desarrollo (2 de

cada 5) es en estos paiacuteses donde se registra el crecimiento maacutes raacutepido en cuanto a

iacutendice de penetracioacuten en el mercado (2013 p 7)

En el contexto educativo este fenoacutemeno no ha pasado desapercibido los y las

estudiantes de diferentes modelos educativos en el mundo utilizan estos dispositivos con

diferentes objetivos como gestioacuten administrativa comunicacioacuten y en procesos de

ensentildeanza-aprendizaje Seguacuten las Directrices para las poliacuteticas de aprendizaje moacutevil de la

Unesco se cree al respecto que

[hellip] las tecnologiacuteas moacuteviles pueden ampliar y enriquecer las oportunidades educativas

en distintos contextos Hay cada vez maacutes datos que indican que los omnipresentes

dispositivos moacuteviles en particular los teleacutefonos moacuteviles y maacutes recientemente las

tabletas son utilizados por educandos y docentes de todo el mundo para acceder a

informacioacuten simplificar la administracioacuten y facilitar el aprendizaje de una forma nueva e

innovadora (2013 p5)

En el caso particular de la UNED de Costa Rica seguacuten un estudio realizado en el antildeo

2014 por Salazar Berrocal Salas y Valerio en el que se consideroacute la respuesta de 877

estudiantes y 211 tutores representativos de las instancias acadeacutemicas de la universidad el

90 afirmoacute poseer un teleacutefono moacutevil de los cuales 633 son teleacutefonos inteligentes un 30

son tabletas y un 42 son reproductores de audio y video

A partir de dicha informacioacuten se generoacute una reflexioacuten respecto a la forma en que los

usuarios (especialmente estudiantes) pueden utilizar los materiales didaacutecticos ademaacutes de un

anaacutelisis en cuanto a la presentacioacuten de contenidos y reestructuracioacuten del proceso de

produccioacuten de quienes los llevan a cabo y es asiacute como el disentildeo adaptativo surge como una

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

11

posible respuesta a la necesidad de que dichos materiales esteacuten disponibles para

dispositivos moacuteviles con el propoacutesito de que estos no queden fuera del contexto actual

El disentildeador Manuel Rubio en su artiacuteculo iquestQueacute es Disentildeo Adaptativo lo define como

ldquo[hellip] una teacutecnica de disentildeo y desarrollo web que mediante el uso de estructuras e imaacutegenes

fluidas asiacute como de media-queries en las hojas de estilo CSS se consigue adaptar el sitio

web al dispositivo del usuariordquo (2013 paacuterr 1) Esta adaptacioacuten implica que la interfaz graacutefica

asiacute como los contenidos educativos desarrollados para un material didaacutectico de la

Universidad se ajustan seguacuten la resolucioacuten de la pantalla sin importar el tipo de dispositivo

desde el que se accede pero en ninguacuten caso (a menos que asiacute se contemple) significa el

sacrificio de contenido para cumplir tal propoacutesito Asiacute tanto la informacioacuten escrita apoyada de

imaacutegenes videos animaciones actividades entre otros recursos son adaptados

7 Eleccioacuten de disentildeo adaptativo

El disentildeo adaptativo es una metodologiacutea de disentildeo que permite una mayor

universalizacioacuten de los contenidos de un material en especiacutefico pero la eleccioacuten de este tipo

de disentildeo no debe recaer simplemente en la versatilidad de produccioacuten sino que su

implementacioacuten debe cumplir criterios de produccioacuten para que sea efectivo de lo contrario

seriacutea mejor optar por otro tipo de soluciones

Se debe procurar que la adaptacioacuten de los materiales sea tal que el usuario no tenga

problemas en determinar el cambio maacutexime cuando se trabaja en coordinacioacuten con otras

estrategias didaacutecticas Si bien es cierto el desarrollo de disentildeo adaptativo ahorra tiempo si

se le compara con la produccioacuten de una versioacuten seguacuten dispositivo se debe contemplar el

hecho de que la programacioacuten necesaria para elaborar un material de este tipo es compleja y

debe estar muy bien planificada

Aunque en la actualidad se habla de una mayor penetracioacuten de las tecnologiacuteas moacuteviles

en el mundo antes de implementarlo con un propoacutesito didaacutectico se debe revisar el nivel de

utilizacioacuten potencial que los usuarios del material hacen de sus dispositivos moacuteviles de

manera que se pueda valorar a futuro la idoneidad de la puesta en marcha de la

implementacioacuten de este tipo de disentildeo

8 Aportes y experiencias del PEM en la produccioacuten de multimedia educativo

El PEM ha desarrollado multimedias educativos desde su creacioacuten en el antildeo 2000 La

consigna de produccioacuten acadeacutemica es buscar e implementar en ellos la mejor combinacioacuten

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

12

posible de mediacioacuten de contenidos y uso de las TIC en beneficio del estudiantado a partir

de criterios pedagoacutegicos y de disentildeo En este mismo espiacuteritu de observar y analizar los

cambios que se dan a nivel educativo con respecto a las diferentes posibilidades

tecnoloacutegicas es que el PEM comenzoacute su incursioacuten en el uso del disentildeo adaptativo en la

produccioacuten de multimedia educativo a partir del uso de herramientas y disposiciones

conceptuales para obtener materiales didaacutecticos maacutes inclusivos

Cabe aclarar que el puacuteblico meta del PEM son los y las estudiantes de las diferentes

carreras impartidas en la Universidad usuarios que bien podriacutean presentar alguna condicioacuten

o necesidad especial de aprendizaje que obliga al programa a pensar en las distintas

posibilidades de acceso y uso de sus multimedias educativos

En lo referente a la implementacioacuten de los conceptos anteriormente definidos en la

produccioacuten de multimedia educativo cabe sentildealar que su uso depende del cumplimiento de

criterios de seleccioacuten entre ellos la pertinencia pedagoacutegica con respecto a los contenidos o

bien el uso de los dispositivos moacuteviles por parte del estudiantado

Hoy maacutes que nunca la portabilidad y el uso de variados dispositivos plantea

interrogantes importantes en cuanto a produccioacuten y disentildeo que se tratan de responder desde

la investigacioacuten experimentacioacuten implementacioacuten y posterior evaluacioacuten de la propuesta

Como ejemplo de lo anterior y en el marco de la incursioacuten de los diferentes conceptos

expuestos en este ensayo en el PEM se han elaborado dos materiales que marcaron el

inicio de la implementacioacuten de las metodologiacuteas abordadas

En el antildeo 2013 se produjo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica En

esta primera experiencia se presentoacute un multimedia educativo que sirve de apoyo al libro

Meacutetodos Numeacutericos para la Ensentildeanza publicado por la Editorial de la Universidad Estatal a

Distancia (EUNED) de Costa Rica y que se utiliza en el curso Meacutetodos Numeacutericos que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia El material

ofrece a la persona estudiante la solucioacuten de ejemplos por medio de software libre y gratuito

para la resolucioacuten de problemas y ejercicios en temas relacionados con la Teoriacutea del error

Meacutetodos de aproximacioacuten para soluciones de ecuaciones no lineales Aproximacioacuten

polinomial para valores de funciones y Aproximaciones en derivacioacuten e integracioacuten utilizando

diversas teacutecnicas y meacutetodos

La metaacutefora pedagoacutegica desarrollada se elaboroacute bajo el concepto de un mapa de

estrategia que propone cuatro escenarios que representan las aacutereas temaacuteticas mencionadas

La propuesta se seleccionoacute porque mantiene una estrecha relacioacuten con las aacutereas del

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

13

conocimiento expuestas y porque presenta similitud con los mapas estrateacutegicos utilizados

comuacutenmente en videojuegos de estrategia que son de gran aceptacioacuten y reconocimiento por

parte del puacuteblico meta del material A continuacioacuten se muestra la propuesta graacutefica de la

portada y los moacutedulos de contenido del material

Figura 1 Portada del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

14

Figura 2 Moacutedulos de contenido del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por esta razoacuten los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos del material estaacuten

concebidos de forma modular independientes y adaptables dispuestos en un plano

cartograacutefico que de igual manera se adapta seguacuten la resolucioacuten de pantalla del dispositivo

desde el que se accede

El disentildeo graacutefico del multimedia educativo se disentildeoacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual de esta justificada pedagoacutegicamente y

elaborada a partir de la composicioacuten equilibrada y agradable de imaacutegenes mapa de bits e

ilustraciones vectoriales inspiradas como se mencionoacute anteriormente en los videojuegos de

estrategia que utilizan isomeacutetricos para ambientar sus escenarios Este material cuenta con

algunos aportes del disentildeo universal aplicados en un contexto educativo como uso

equiparable flexible intuitivo y simple Se consideran ademaacutes aspectos importantes de

accesibilidad e inclusioacuten como la posibilidad de ampliar disminuir y restablecer el tamantildeo del

texto en el contenido

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

15

Esta primera experiencia sirvioacute como base para el establecimiento de ciertos criterios

de produccioacuten en este tipo de materiales didaacutecticos como contemplar la adaptabilidad del

material desde el inicio de la produccioacuten considerar en el disentildeo de la metaacutefora pedagoacutegica

aspectos que implica el disentildeo adaptativo la simplicidad en el disentildeo graacutefico que se debe

utilizar en la elaboracioacuten de la interfaz graacutefica y los diferentes recursos audiovisuales entre

otros

Con la intensioacuten de continuar la produccioacuten de multimedia educativo bajo las

metodologiacuteas desarrolladas y adoptadas en el PEM a partir de experiencias previas en el

antildeo 2015 se produjo Geometriacutea Eucliacutedea Esta segunda experiencia presenta un material

didaacutectico utilizado en los cursos de Geometriacutea Eucliacutedea y Construcciones geomeacutetricas que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia Fue producido

bajo el concepto de laboratorio virtual y se compone de cuatro laboratorios que le permiten al

estudiantado y futuro docente de la Universidad aprender a realizar construcciones

geomeacutetricas a partir de la teacutecnica de Regla y compaacutes Portasegmentos Doblado de papel y

Software matemaacutetico

La metaacutefora pedagoacutegica se elaboroacute en torno a un vivero se tomoacute en consideracioacuten el

trasfondo histoacuterico y teoacuterico de la geometriacutea su clara percepcioacuten en la naturaleza desde la

antiguumledad asiacute como la manifestacioacuten cotidiana de elementos geomeacutetricos que rodean al

ser humano por ejemplo los puntos los planos las liacuteneas rectas curvas entre otros A

continuacioacuten se muestra la propuesta graacutefica de la portada y los laboratorios virtuales del

material

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

16

Figura 3 Portada del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

Figura 4 Laboratorios virtuales del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por este motivo los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos multimedia estaacuten

concebidos de forma modular independientes escalables y adaptables presentados en

varios estantes de exhibicioacuten de plantas

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

17

El disentildeo graacutefico del multimedia educativo se elaboroacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual justificada pedagoacutegicamente y disentildeada

a partir de una composicioacuten equilibrada y agradable de ilustraciones vectoriales inspiradas

como se mencionoacute anteriormente en ambientes cotidianos de un vivero con el objetivo de

reforzar la temaacutetica general del material con el contexto en que se presentan los contenidos

De igual manera este recurso cuenta con algunos aportes del disentildeo universal como

su uso equiparable flexible informacioacuten perceptible y tolerancia al error aplicados en el

aacutembito educativo y que tambieacuten consideran aspectos importantes de accesibilidad e

inclusioacuten

Estos dos ejemplos de multimedia educativo producidos en el PEM aunados a

esfuerzos de investigacioacuten y capacitacioacuten a nivel interno del programa son los primeros

pasos hacia el desarrollo de nuevos materiales didaacutecticos maacutes accesibles e inclusivos como

el reciente desarrollo de los laboratorios virtuales para el aprendizaje que tienen como fin

seguir poniendo a disposicioacuten del estudiantado materiales de calidad que apoyen sus

procesos de aprendizaje a distancia y en congruencia con las nuevas posibilidades

tecnoloacutegicas especialmente de formato y medios de reproduccioacuten

9 Conclusiones

A partir de las experiencias generadas desde el PEM asiacute como de valoraciones

recibidas de otras instancias acadeacutemicas de la Universidad con las que se ha trabajado en

conjunto se presentan algunos factores a considerar a la hora de emprender una produccioacuten

de multimedia educativo que contemple algunos de los principios de disentildeo desarrollados

con anterioridad

El disentildeo adaptativo demanda una mayor reflexioacuten a la hora de planificar y concretar la

propuesta graacutefica y la disposicioacuten de contenidos porque se deben contemplar nuevos

escenarios y posibilidades en la visualizacioacuten de los multimedia educativos en tabletas y en

teleacutefonos inteligentes Eso no implica el sacrificio total o parcial de la graacutefica y los contenidos

dado que dichos elementos se vinculan entre siacute independientemente de la resolucioacuten de

pantalla del dispositivo Por lo anterior en los uacuteltimos 5 antildeos el programa ha estado

revisando perioacutedicamente los procesos de produccioacuten y flujos de trabajo con el propoacutesito de

responder a las necesidades actuales de contenidos maacutes accesibles e inclusivos

El disentildeo de la interfaz graacutefica debe conceptualizarse en una uacutenica propuesta simple

concreta escalable y adaptable para hacer maacutes eficiente su proceso de elaboracioacuten Este

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

18

cambio de paradigma obligoacute a replantear el flujo de trabajo en disentildeo ya que se pasoacute de

elaborar varias versiones de una interfaz seguacuten la resolucioacuten de pantalla del dispositivo a

concentrar los esfuerzos en una uacutenica propuesta centrada en los elementos y acciones maacutes

importantes de navegacioacuten lo cual contribuyoacute a mejorar tanto la experiencia como la

usabilidad del material pues todos sus elementos graacuteficos y de contenido se adaptan

El disentildeo universal aplicado en la interfaz converge con el disentildeo adaptativo en la

concrecioacuten de propuestas que evidencien accesibilidad e inclusioacuten en armoniacutea con la graacutefica

ya que los materiales estaacuten orientados a los y las estudiantes y de ellos depende el impacto

que puede tener lo que se disentildee Por lo anterior el disentildeo graacutefico es valorado desde una

perspectiva pedagoacutegica que permite generar empatiacutea y motivacioacuten para explorar los

contenidos Bajo esa premisa el PEM estaacute en constante investigacioacuten de nuevas

metodologiacuteas que contribuyan a mejorar la mediacioacuten de los contenidos asiacute como la

experiencia visual de la interfaz graacutefica de los materiales que desarrolla

Los multimedia educativos se deben producir en funcioacuten de las necesidades y

capacidades del estudiantado por lo tanto es necesario un mayor anaacutelisis del puacuteblico meta

con especial eacutenfasis en acceso y tipo de dispositivos asiacute como la forma en que los utilizan

para acceder a los materiales esto permitiraacute seleccionar los medios y elementos graacuteficos

que realmente contribuyan a la mediacioacuten de los contenidos

Es necesario ademaacutes mejorar los procesos de evaluacioacuten de los multimedia

educativos con el propoacutesito de saber si las metodologiacuteas de disentildeo y produccioacuten utilizadas

actualmente mejoran la accesibilidad e inclusioacuten de los materiales disponibles para el

estudiantado como apoyo en sus procesos de aprendizaje a distancia

Referencias

Burgstahler Sheryl (2007) Universal Design in Education Principles and Applications Recuperado de httpwwwwashingtonedudoitBrochuresAcademicsud_eduhtml

Diacuteaz Luis Fernando (2011) Principios sobre la metaacutefora pedagoacutegica Recuperado de

httpwwwluisfernandodiazcomp=105 Fornasari de Menegazzo Lilia (1994) Didaacutectica de la imagen Zaragoza Editorial Latina Fundacioacuten SIDAR (2007) Principios del disentildeo universal Recuperado de

httpwwwsidarorgrecurdesdiusabledudtphp Gilliam Scott Robert (1980) Fundamentos del disentildeo Buenos Aires Editorial U Leru

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

19

Gutieacuterrez Favio (2012) Principios fundamentales de la tipografiacutea Recuperado de httpwwwfaviogutierrezcomcategorytipografia

Mantildeas Moiseacutes (2011) Interfases Reglasteoacutericas Recuperado de

httppersonalesupvesmoimacarmasterdownloadinterfacespdf Misischia Bibiana (3 de setiembre de 2013) Supresioacuten de barreras en la universidad

Paacutegina12 Recuperado de httpwwwpagina12comardiariouniversidad10-228134-2013-09-03html

Morton Jill (2010) Why color matters Recuperado de

httpwwwcolorcomcomresearchwhy-color-matters Observatorio de la Accesibilidad (sf) Breve historia Recuperado de

httpwwwobservatoriodelaaccesibilidadesaccesibilidadbreve-historia Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura - Unesco

(2013) Directrices para las Poliacuteticas de Aprendizaje Moacutevil Recuperado de httpunesdocunescoorgimages0021002196219662Spdf

Rand Paul (2007) Design form and chaos Massachusetts Rockport Publishers Inc Real Academia Espantildeola (2001) Imagen En Diccionario de la lengua espantildeola (22ordf ed)

Recuperado de httpdleraeesid=KzwDY4y Rubio Manuel (1 de setiembre de 2013) iquestQueacute es Disentildeo Adaptativo Recuperado de

httpsmagazinejoomlaorgesediciones-anterioressept-2013item1514-que-es-diseno-adaptativo

Salazar Bejarano Ana Gabriela Berrocal Carvajal Viviana Salas Campos lleana y Valerio

Aacutelvarez Cinthya (2014) Propuesta para el desarrollo de una aplicacioacuten para la gestioacuten administrativa en la UNED Costa Rica Revista Innovaciones Educativas 16(21) 1-11

Shneiderman Ben (1998) Designing the user interface Strategies for effective human-

computer interaction Massachusetts Addison-Wesley Pub Co Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfa) Geometriacutea Euclidea Recuperado de httprepositoriounedaccrmultimediasgeometria_euclideaindexhtml

Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb) Meacutetodos numeacutericos para la ensentildeanza Recuperado de httprepositoriounedaccrmultimediasmetodos_numericos_ensenanza

Velasco Santos Perla Laureano Cruces Ana Lilia Mora Torres Marta y Herrera Bautista

Miguel Aacutengel (octubre 2010) Disentildeo de agentes pedagoacutegicos a partir de los estilos de aprendizaje una perspectiva a traveacutes del color Ponencia presentada en el IV Congreso Mundial de Estilos de Aprendizaje Recuperado de httpkaliazcuammxclc02_publicacionesmaterialDiseC3B1o_de_AvataresPerspColor_10pdf

Page 6: El diseño universal en la interfaz gráfica de multimedia ... · El diseño universal en la interfaz gráfica de multimedia educativo ... aporte de otras metodologías como el diseño

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

5

Sheryl Burgstahler directora y fundadora del DO-IT Center define este enfoque como

ldquohellipun marco filosoacutefico para disentildear un rango general de productos y ambientes educativosrdquo

(2007 paacuterr 2) De este modo no solo se centra en el disentildeo de los curriacuteculos sino que por

su concepcioacuten maacutes amplia tambieacuten analiza otros factores como por ejemplo software

educativo y sitios web entre otros recursos que se pueden considerar materiales didaacutecticos

con componente tecnoloacutegico

3 Disentildeo graacutefico

Paul Rand disentildeador graacutefico y profesor en la Universidad de Yale define el disentildeo

graacutefico en su libro Design Form and Chaos como

entender el significado del disentildeo no es soacutelo entender el papel que desempentildean la

forma y el contenido sino descubrir que el disentildeo es tambieacuten un comentario una

opinioacuten un punto de vista y una responsabilidad social Disentildear es mucho maacutes que

simplemente ensamblar ordenar incluso editar es antildeadir valor y significado iluminar

simplificar aclarar modificar teatralizar persuadir y quizaacute incluso entretener (2007

p 6)

Lo anterior apoya el hecho de que el disentildeo graacutefico es algo maacutes que un simple

conjunto de imaacutegenes y texto con eacutenfasis en la composicioacuten y la esteacutetica es un elemento

visual comunicativo interpretado en un mensaje por medio de diferentes elementos tangibles

(imaacutegenes formas colores) y otros intangibles (sensaciones percepciones y sentimientos)

Algunos de los elementos que influyen en la forma en que se transmite un mensaje y

que deben tomarse en consideracioacuten al trabajar en disentildeo graacutefico son los siguientes

El color las primeras evidencias de su uso datan desde la eacutepoca de la prehistoria cuando

se realizaron las primeras manifestaciones de arte mediante el color rojo desprendido de las

tierras arcillosas En la actualidad Morton (2010) menciona que los estudios realizados por el

Institute of Color Research evidencian que

[hellip] las personas realizan juicios subconscientes de un ambiente de un producto o una

persona dentro de los 90 segundos de visualizacioacuten inicial y que entre el 62 y el 90 por

ciento de ese juicio se basa solo en el color (paacuterr 4)

Podriacutea decirse que el color es uno de los elementos clave en una composicioacuten graacutefica

ya que contribuye a transmitir sensaciones percepciones y sentimientos en la interpretacioacuten

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

6

de un mensaje Asiacute lo referencian Velasco Laureano Mora y Herrera (2010) quienes

afirman que

[hellip] el color es un elemento clave en el disentildeo graacutefico es el elemento maacutes 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 (Seccioacuten Psicologiacutea del color paacuterr 1)

La tipografiacutea con la invencioacuten de la imprenta en la eacutepoca del Renacimiento la tipografiacutea

toma relevancia de la mano de figuras importantes en su historia como Stanley Morison

(1929) citado por Gutieacuterrez (2012) quien definioacute la tipografiacutea como

[hellip] el arte de disponer correctamente el material de imprimir de acuerdo con un

propoacutesito especiacutefico el de colocar las letras repartir el espacio y organizar los tipos

con vistas a prestar al lector la maacutexima ayuda para la comprensioacuten del texto escrito

verbalmente (paacuterr 1)

Puede considerarse entonces la tipografiacutea como una expresioacuten graacutefica de la voz que

contribuye a transmitir el mensaje por ello es importante cuando se utiliza pensar en el

puacuteblico al que va dirigido ya que este debe tener la capacidad de leerlo y comprenderlo sin

ninguacuten tipo de obstaacuteculo o niveles de dificultad posibles

La imagen seguacuten el diccionario de la Real Academia Espantildeola la palabra imagen

proviene del latiacuten imago que significa figura representacioacuten semejanza y apariencia de algo

Fornasari de Menegazzo va maacutes allaacute de lo simple y la define como ldquotoda representacioacuten

visual que mantiene una relacioacuten de semejanza con el objetivo de ser representadordquo (1994

p 21)

Una imagen es entonces un elemento meramente visual que se utiliza para

representar objetos sujetos o situaciones ficticias o reales que evocan expresiones y

sentimientos para transmitir un mensaje Es un elemento comunicacional de la graacutefica visual

La composicioacuten se entiende como la organizacioacuten de varios elementos graacuteficos dentro

del espacio visual que combinados tienen la capacidad de aportar un significado a la

transmisioacuten de un mensaje Es decir la composicioacuten distribuye los diferentes elementos en

una composicioacuten graacutefica (color tipografiacutea imagen) de forma equilibrada que da sentido a la

transmisioacuten de un mensaje Al respecto Gillian (1980) en su libro Fundamentos del disentildeo

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

7

manifiesta que ldquola composicioacuten significa tambieacuten organizacioacuten estructural y que esta

constituye el fundamento de las relaciones visualesrdquo (p19)

La composicioacuten es por lo tanto importante ya que mediante propiedades como orden

balance unidad y relacioacuten entre los elementos graacuteficos en su conjunto permite transmitir el

mensaje de forma concreta facilitando su comprensioacuten por parte del puacuteblico al cual se

orientoacute

4 Metaacutefora pedagoacutegica

Luis Fernando Diacuteaz productor acadeacutemico de la UNED de Costa Rica la define como

(hellip) un elemento comunicativo usualmente graacutefico a veces animado que trasmite en

forma sucinta y reiterada el mensaje educativo central del multimedio o del objeto

especiacutefico Provee unidad graacutefica (y refuerza la unidad pedagoacutegica) en el disentildeo de

todo el material y no solo en pantallas aisladas o en hiperviacutenculos (2011 paacuterr 6)

Es decir estaacute metodologiacutea permite fortalecer y favorecer mediante la reiteracioacuten del

mensaje y los contenidos educativos el aprendizaje que de forma simultaacutenea se comunica

mediante otras formas semaacutenticas y por lo tanto debe ser un proceso planificado desde el

disentildeo mismo

En los multimedia educativos su concrecioacuten se origina dentro de una etapa creativa

propia del proceso de produccioacuten caracterizada por la elaboracioacuten de una propuesta

pedagoacutegica que ademaacutes de mediar los contenidos es representada graacuteficamente para

favorecer el nexo motivacional y de intereacutes por explorar los contenidos e interartuar con

estos a traveacutes de la interfaz En la elaboracioacuten de la interfaz graacutefica este concepto orienta el

disentildeo de los elementos que la conforman como por ejemplo la interfaz principal

secundarias recursos multimedia y de navegacioacuten tales comomenuacutes botones e iacuteconos

Diacuteaz (2011) destaca 7 aspectos pedagoacutegicos que dan valor a la metaacutefora en la

produccioacuten de materiales didaacutecticos

1) Trasmite en forma sucinta y reiterada el mensaje educativo central

2) Fortalece el aprendizaje por cuanto reitera con otros recursos el mensaje textual Parte

de su valor formativo consiste en que refuerza mediante la repeticioacuten el mensaje y los

contenidos al aprendizaje y a la internalizacioacuten de los conocimientos los valores y las

conductas que simultaacuteneamente se comunican mediante otros lenguajes

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

8

3) Facilita la construccioacuten y la presentacioacuten de iacutendices menuacutes y botoneras para la

navegacioacuten dentro del multimedia Formas simplificadas de la metaacutefora (hojas laacutepices

de color flechas) permiten a los lectores distinguir textos vinculados con el mensaje

principal pero que obedecen a finalidades distintas del dominio de contenidos por

aprender Esta economiacutea de representacioacuten resulta en un ahorro de energiacutea en las

actividades educativas particularmente en la auto-instruccioacuten

4) En ese mismo sentido propicia la construccioacuten de familias de iconos aplicables incluso

a los materiales impresos con la intencioacuten de facilitar el desplazamiento del estudiante

por el texto a traveacutes de instrucciones tanto graacuteficas como verbales

5) Favorece la identificacioacuten de los usuarios porque mueve sus emociones y sus

sentimientos crea empatiacutea y complicidad lo que favorece la exploracioacuten y el uso de los

materiales por el estudiantado

6) Modera la frialdad impliacutecita en la comunicacioacuten viacutea maacutequinas y medios electroacutenicos sin

dejar de atender a la veracidad y la verosimilitud Igual efecto provoca en los

voluminosos textos tradicionales impresos en blanco y negro

7) Es un recurso de calidad Una buena metaacutefora permea y orienta toda la produccioacuten se

reproduce y se enriquece a siacute misma y concentra la atencioacuten de los usuarios En este

rol se espera de ella un efecto multiplicador sobre el aprendizaje

5 Interfaz graacutefica

Ben Shneiderman catedraacutetico en Informaacutetica de la Universidad de Maryland en

Estados Unidos define la interfaz como ldquola membrana de comunicacioacuten entre los usuarios y

el sistema por la que los disentildeadores y desarrolladores de herramientas informaacuteticas pueden

hacer que la tecnologiacutea sea inteligible y sensible a las necesidades de los usuariosrdquo (1998

p 4)

En este caso en particular la interfaz graacutefica se puede considerar un mediador visual

que facilita la comunicacioacuten fluida y clara entre un sistema y el usuario para facilitar su

comprensioacuten y uso Esta por lo general se manifiesta en un entorno graacutefico compuesto

principalmente de imaacutegenes y objetos para representar la informacioacuten y las acciones

disponibles para ejecutar

Shneiderman (1998 mencionado por Mantildeas 2011 pp 27-34) enlista 8 reglas de oro

del disentildeo de interfaces

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

9

1) Esforzarse para conseguir consistencia exigir secuencias de acciones consistentes

utilizar terminologiacutea coherente en los mensajes menuacutes y pantallas de ayuda emplear

de forma consistente el color la composicioacuten las mayuacutesculas las fuentes y otros

elementos similares Las excepciones como la necesaria confirmacioacuten de la orden de

borrado o no mostrar los caracteres de las contrasentildeas deberiacutean ser comprensibles y

limitadas en nuacutemero

2) Atender la usabilidad universal reconocer las necesidades de los diversos usuarios

asiacute como las diferencias entre ellos (principiante o experto edades discapacidades y

diversidad tecnoloacutegica) para facilitar la transformacioacuten del contenido

3) Ofrecer realimentacioacuten informativa incluir para cada accioacuten del sistema una

realimentacioacuten por parte del sistema

4) Disentildear diaacutelogos para conducir a la finalizacioacuten crear sistemas claros de

conduccioacuten hasta el final del proceso de las secuencias de accioacuten del usuario

5) Prevenir errores disentildear el sistema de forma que los usuarios no puedan cometer

errores serios

6) Permitir deshacer acciones de forma faacutecil tener la posibilidad de remediar acciones

erroacuteneas por lo tanto construir un sistema reversible Este sistema suaviza la

ansiedad que se puede producir en el usuario

7) Dar soporte al control interno ofrecer a los operadores experimentados la sensacioacuten

de controlar la interfaz y que esta responde a sus acciones Las acciones

sorprendentes por parte de la interfaz las secuencias de entrada de datos tediosas la

incapacidad o dificultad para obtener la informacioacuten necesaria y la incapacidad para

producir acciones deseadas crean ansiedad e insatisfaccioacuten

8) Reducir la carga de la memoria a corto plazo disentildear sistemas de visualizacioacuten

simples que la frecuencia de movimiento de ventana se reduzca y que se asigne

suficiente tiempo de entrenamiento para coacutedigos y secuencias de acciones

Como consecuencia un buen disentildeo de interfaz graacutefica no solo se centra en la parte

visual su esteacutetica y la composicioacuten sino tambieacuten en el desarrollo de su interaccioacuten a traveacutes

de las reglas anteriormente mencionadas Ambos aspectos se complementan ya que en

gran medida determinan la buena experiencia de uso por parte del usuario

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

10

6 Disentildeo adaptativo

Sin duda alguna el siglo XXI se ha caracterizado por el uso cada vez maacutes frecuente y

cotidiano de dispositivos moacuteviles como tabletas teleacutefonos inteligentes y computadoras

portaacutetiles entre otros Seguacuten las Directrices para las poliacuteticas de aprendizaje moacutevil de la

Unesco (Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura)

Hay en el mundo maacutes de 3200 millones de usuarios registrados con teleacutefonos moacuteviles

lo que hace de estos dispositivos la modalidad de TIC maacutes utilizada en la Tierra En los

paiacuteses desarrollados 4 de cada 5 personas poseen y utilizan un teleacutefono moacutevil y

aunque la tasa es significativamente maacutes baja que en los paiacuteses en desarrollo (2 de

cada 5) es en estos paiacuteses donde se registra el crecimiento maacutes raacutepido en cuanto a

iacutendice de penetracioacuten en el mercado (2013 p 7)

En el contexto educativo este fenoacutemeno no ha pasado desapercibido los y las

estudiantes de diferentes modelos educativos en el mundo utilizan estos dispositivos con

diferentes objetivos como gestioacuten administrativa comunicacioacuten y en procesos de

ensentildeanza-aprendizaje Seguacuten las Directrices para las poliacuteticas de aprendizaje moacutevil de la

Unesco se cree al respecto que

[hellip] las tecnologiacuteas moacuteviles pueden ampliar y enriquecer las oportunidades educativas

en distintos contextos Hay cada vez maacutes datos que indican que los omnipresentes

dispositivos moacuteviles en particular los teleacutefonos moacuteviles y maacutes recientemente las

tabletas son utilizados por educandos y docentes de todo el mundo para acceder a

informacioacuten simplificar la administracioacuten y facilitar el aprendizaje de una forma nueva e

innovadora (2013 p5)

En el caso particular de la UNED de Costa Rica seguacuten un estudio realizado en el antildeo

2014 por Salazar Berrocal Salas y Valerio en el que se consideroacute la respuesta de 877

estudiantes y 211 tutores representativos de las instancias acadeacutemicas de la universidad el

90 afirmoacute poseer un teleacutefono moacutevil de los cuales 633 son teleacutefonos inteligentes un 30

son tabletas y un 42 son reproductores de audio y video

A partir de dicha informacioacuten se generoacute una reflexioacuten respecto a la forma en que los

usuarios (especialmente estudiantes) pueden utilizar los materiales didaacutecticos ademaacutes de un

anaacutelisis en cuanto a la presentacioacuten de contenidos y reestructuracioacuten del proceso de

produccioacuten de quienes los llevan a cabo y es asiacute como el disentildeo adaptativo surge como una

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

11

posible respuesta a la necesidad de que dichos materiales esteacuten disponibles para

dispositivos moacuteviles con el propoacutesito de que estos no queden fuera del contexto actual

El disentildeador Manuel Rubio en su artiacuteculo iquestQueacute es Disentildeo Adaptativo lo define como

ldquo[hellip] una teacutecnica de disentildeo y desarrollo web que mediante el uso de estructuras e imaacutegenes

fluidas asiacute como de media-queries en las hojas de estilo CSS se consigue adaptar el sitio

web al dispositivo del usuariordquo (2013 paacuterr 1) Esta adaptacioacuten implica que la interfaz graacutefica

asiacute como los contenidos educativos desarrollados para un material didaacutectico de la

Universidad se ajustan seguacuten la resolucioacuten de la pantalla sin importar el tipo de dispositivo

desde el que se accede pero en ninguacuten caso (a menos que asiacute se contemple) significa el

sacrificio de contenido para cumplir tal propoacutesito Asiacute tanto la informacioacuten escrita apoyada de

imaacutegenes videos animaciones actividades entre otros recursos son adaptados

7 Eleccioacuten de disentildeo adaptativo

El disentildeo adaptativo es una metodologiacutea de disentildeo que permite una mayor

universalizacioacuten de los contenidos de un material en especiacutefico pero la eleccioacuten de este tipo

de disentildeo no debe recaer simplemente en la versatilidad de produccioacuten sino que su

implementacioacuten debe cumplir criterios de produccioacuten para que sea efectivo de lo contrario

seriacutea mejor optar por otro tipo de soluciones

Se debe procurar que la adaptacioacuten de los materiales sea tal que el usuario no tenga

problemas en determinar el cambio maacutexime cuando se trabaja en coordinacioacuten con otras

estrategias didaacutecticas Si bien es cierto el desarrollo de disentildeo adaptativo ahorra tiempo si

se le compara con la produccioacuten de una versioacuten seguacuten dispositivo se debe contemplar el

hecho de que la programacioacuten necesaria para elaborar un material de este tipo es compleja y

debe estar muy bien planificada

Aunque en la actualidad se habla de una mayor penetracioacuten de las tecnologiacuteas moacuteviles

en el mundo antes de implementarlo con un propoacutesito didaacutectico se debe revisar el nivel de

utilizacioacuten potencial que los usuarios del material hacen de sus dispositivos moacuteviles de

manera que se pueda valorar a futuro la idoneidad de la puesta en marcha de la

implementacioacuten de este tipo de disentildeo

8 Aportes y experiencias del PEM en la produccioacuten de multimedia educativo

El PEM ha desarrollado multimedias educativos desde su creacioacuten en el antildeo 2000 La

consigna de produccioacuten acadeacutemica es buscar e implementar en ellos la mejor combinacioacuten

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

12

posible de mediacioacuten de contenidos y uso de las TIC en beneficio del estudiantado a partir

de criterios pedagoacutegicos y de disentildeo En este mismo espiacuteritu de observar y analizar los

cambios que se dan a nivel educativo con respecto a las diferentes posibilidades

tecnoloacutegicas es que el PEM comenzoacute su incursioacuten en el uso del disentildeo adaptativo en la

produccioacuten de multimedia educativo a partir del uso de herramientas y disposiciones

conceptuales para obtener materiales didaacutecticos maacutes inclusivos

Cabe aclarar que el puacuteblico meta del PEM son los y las estudiantes de las diferentes

carreras impartidas en la Universidad usuarios que bien podriacutean presentar alguna condicioacuten

o necesidad especial de aprendizaje que obliga al programa a pensar en las distintas

posibilidades de acceso y uso de sus multimedias educativos

En lo referente a la implementacioacuten de los conceptos anteriormente definidos en la

produccioacuten de multimedia educativo cabe sentildealar que su uso depende del cumplimiento de

criterios de seleccioacuten entre ellos la pertinencia pedagoacutegica con respecto a los contenidos o

bien el uso de los dispositivos moacuteviles por parte del estudiantado

Hoy maacutes que nunca la portabilidad y el uso de variados dispositivos plantea

interrogantes importantes en cuanto a produccioacuten y disentildeo que se tratan de responder desde

la investigacioacuten experimentacioacuten implementacioacuten y posterior evaluacioacuten de la propuesta

Como ejemplo de lo anterior y en el marco de la incursioacuten de los diferentes conceptos

expuestos en este ensayo en el PEM se han elaborado dos materiales que marcaron el

inicio de la implementacioacuten de las metodologiacuteas abordadas

En el antildeo 2013 se produjo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica En

esta primera experiencia se presentoacute un multimedia educativo que sirve de apoyo al libro

Meacutetodos Numeacutericos para la Ensentildeanza publicado por la Editorial de la Universidad Estatal a

Distancia (EUNED) de Costa Rica y que se utiliza en el curso Meacutetodos Numeacutericos que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia El material

ofrece a la persona estudiante la solucioacuten de ejemplos por medio de software libre y gratuito

para la resolucioacuten de problemas y ejercicios en temas relacionados con la Teoriacutea del error

Meacutetodos de aproximacioacuten para soluciones de ecuaciones no lineales Aproximacioacuten

polinomial para valores de funciones y Aproximaciones en derivacioacuten e integracioacuten utilizando

diversas teacutecnicas y meacutetodos

La metaacutefora pedagoacutegica desarrollada se elaboroacute bajo el concepto de un mapa de

estrategia que propone cuatro escenarios que representan las aacutereas temaacuteticas mencionadas

La propuesta se seleccionoacute porque mantiene una estrecha relacioacuten con las aacutereas del

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

13

conocimiento expuestas y porque presenta similitud con los mapas estrateacutegicos utilizados

comuacutenmente en videojuegos de estrategia que son de gran aceptacioacuten y reconocimiento por

parte del puacuteblico meta del material A continuacioacuten se muestra la propuesta graacutefica de la

portada y los moacutedulos de contenido del material

Figura 1 Portada del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

14

Figura 2 Moacutedulos de contenido del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por esta razoacuten los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos del material estaacuten

concebidos de forma modular independientes y adaptables dispuestos en un plano

cartograacutefico que de igual manera se adapta seguacuten la resolucioacuten de pantalla del dispositivo

desde el que se accede

El disentildeo graacutefico del multimedia educativo se disentildeoacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual de esta justificada pedagoacutegicamente y

elaborada a partir de la composicioacuten equilibrada y agradable de imaacutegenes mapa de bits e

ilustraciones vectoriales inspiradas como se mencionoacute anteriormente en los videojuegos de

estrategia que utilizan isomeacutetricos para ambientar sus escenarios Este material cuenta con

algunos aportes del disentildeo universal aplicados en un contexto educativo como uso

equiparable flexible intuitivo y simple Se consideran ademaacutes aspectos importantes de

accesibilidad e inclusioacuten como la posibilidad de ampliar disminuir y restablecer el tamantildeo del

texto en el contenido

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

15

Esta primera experiencia sirvioacute como base para el establecimiento de ciertos criterios

de produccioacuten en este tipo de materiales didaacutecticos como contemplar la adaptabilidad del

material desde el inicio de la produccioacuten considerar en el disentildeo de la metaacutefora pedagoacutegica

aspectos que implica el disentildeo adaptativo la simplicidad en el disentildeo graacutefico que se debe

utilizar en la elaboracioacuten de la interfaz graacutefica y los diferentes recursos audiovisuales entre

otros

Con la intensioacuten de continuar la produccioacuten de multimedia educativo bajo las

metodologiacuteas desarrolladas y adoptadas en el PEM a partir de experiencias previas en el

antildeo 2015 se produjo Geometriacutea Eucliacutedea Esta segunda experiencia presenta un material

didaacutectico utilizado en los cursos de Geometriacutea Eucliacutedea y Construcciones geomeacutetricas que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia Fue producido

bajo el concepto de laboratorio virtual y se compone de cuatro laboratorios que le permiten al

estudiantado y futuro docente de la Universidad aprender a realizar construcciones

geomeacutetricas a partir de la teacutecnica de Regla y compaacutes Portasegmentos Doblado de papel y

Software matemaacutetico

La metaacutefora pedagoacutegica se elaboroacute en torno a un vivero se tomoacute en consideracioacuten el

trasfondo histoacuterico y teoacuterico de la geometriacutea su clara percepcioacuten en la naturaleza desde la

antiguumledad asiacute como la manifestacioacuten cotidiana de elementos geomeacutetricos que rodean al

ser humano por ejemplo los puntos los planos las liacuteneas rectas curvas entre otros A

continuacioacuten se muestra la propuesta graacutefica de la portada y los laboratorios virtuales del

material

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

16

Figura 3 Portada del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

Figura 4 Laboratorios virtuales del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por este motivo los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos multimedia estaacuten

concebidos de forma modular independientes escalables y adaptables presentados en

varios estantes de exhibicioacuten de plantas

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

17

El disentildeo graacutefico del multimedia educativo se elaboroacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual justificada pedagoacutegicamente y disentildeada

a partir de una composicioacuten equilibrada y agradable de ilustraciones vectoriales inspiradas

como se mencionoacute anteriormente en ambientes cotidianos de un vivero con el objetivo de

reforzar la temaacutetica general del material con el contexto en que se presentan los contenidos

De igual manera este recurso cuenta con algunos aportes del disentildeo universal como

su uso equiparable flexible informacioacuten perceptible y tolerancia al error aplicados en el

aacutembito educativo y que tambieacuten consideran aspectos importantes de accesibilidad e

inclusioacuten

Estos dos ejemplos de multimedia educativo producidos en el PEM aunados a

esfuerzos de investigacioacuten y capacitacioacuten a nivel interno del programa son los primeros

pasos hacia el desarrollo de nuevos materiales didaacutecticos maacutes accesibles e inclusivos como

el reciente desarrollo de los laboratorios virtuales para el aprendizaje que tienen como fin

seguir poniendo a disposicioacuten del estudiantado materiales de calidad que apoyen sus

procesos de aprendizaje a distancia y en congruencia con las nuevas posibilidades

tecnoloacutegicas especialmente de formato y medios de reproduccioacuten

9 Conclusiones

A partir de las experiencias generadas desde el PEM asiacute como de valoraciones

recibidas de otras instancias acadeacutemicas de la Universidad con las que se ha trabajado en

conjunto se presentan algunos factores a considerar a la hora de emprender una produccioacuten

de multimedia educativo que contemple algunos de los principios de disentildeo desarrollados

con anterioridad

El disentildeo adaptativo demanda una mayor reflexioacuten a la hora de planificar y concretar la

propuesta graacutefica y la disposicioacuten de contenidos porque se deben contemplar nuevos

escenarios y posibilidades en la visualizacioacuten de los multimedia educativos en tabletas y en

teleacutefonos inteligentes Eso no implica el sacrificio total o parcial de la graacutefica y los contenidos

dado que dichos elementos se vinculan entre siacute independientemente de la resolucioacuten de

pantalla del dispositivo Por lo anterior en los uacuteltimos 5 antildeos el programa ha estado

revisando perioacutedicamente los procesos de produccioacuten y flujos de trabajo con el propoacutesito de

responder a las necesidades actuales de contenidos maacutes accesibles e inclusivos

El disentildeo de la interfaz graacutefica debe conceptualizarse en una uacutenica propuesta simple

concreta escalable y adaptable para hacer maacutes eficiente su proceso de elaboracioacuten Este

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

18

cambio de paradigma obligoacute a replantear el flujo de trabajo en disentildeo ya que se pasoacute de

elaborar varias versiones de una interfaz seguacuten la resolucioacuten de pantalla del dispositivo a

concentrar los esfuerzos en una uacutenica propuesta centrada en los elementos y acciones maacutes

importantes de navegacioacuten lo cual contribuyoacute a mejorar tanto la experiencia como la

usabilidad del material pues todos sus elementos graacuteficos y de contenido se adaptan

El disentildeo universal aplicado en la interfaz converge con el disentildeo adaptativo en la

concrecioacuten de propuestas que evidencien accesibilidad e inclusioacuten en armoniacutea con la graacutefica

ya que los materiales estaacuten orientados a los y las estudiantes y de ellos depende el impacto

que puede tener lo que se disentildee Por lo anterior el disentildeo graacutefico es valorado desde una

perspectiva pedagoacutegica que permite generar empatiacutea y motivacioacuten para explorar los

contenidos Bajo esa premisa el PEM estaacute en constante investigacioacuten de nuevas

metodologiacuteas que contribuyan a mejorar la mediacioacuten de los contenidos asiacute como la

experiencia visual de la interfaz graacutefica de los materiales que desarrolla

Los multimedia educativos se deben producir en funcioacuten de las necesidades y

capacidades del estudiantado por lo tanto es necesario un mayor anaacutelisis del puacuteblico meta

con especial eacutenfasis en acceso y tipo de dispositivos asiacute como la forma en que los utilizan

para acceder a los materiales esto permitiraacute seleccionar los medios y elementos graacuteficos

que realmente contribuyan a la mediacioacuten de los contenidos

Es necesario ademaacutes mejorar los procesos de evaluacioacuten de los multimedia

educativos con el propoacutesito de saber si las metodologiacuteas de disentildeo y produccioacuten utilizadas

actualmente mejoran la accesibilidad e inclusioacuten de los materiales disponibles para el

estudiantado como apoyo en sus procesos de aprendizaje a distancia

Referencias

Burgstahler Sheryl (2007) Universal Design in Education Principles and Applications Recuperado de httpwwwwashingtonedudoitBrochuresAcademicsud_eduhtml

Diacuteaz Luis Fernando (2011) Principios sobre la metaacutefora pedagoacutegica Recuperado de

httpwwwluisfernandodiazcomp=105 Fornasari de Menegazzo Lilia (1994) Didaacutectica de la imagen Zaragoza Editorial Latina Fundacioacuten SIDAR (2007) Principios del disentildeo universal Recuperado de

httpwwwsidarorgrecurdesdiusabledudtphp Gilliam Scott Robert (1980) Fundamentos del disentildeo Buenos Aires Editorial U Leru

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

19

Gutieacuterrez Favio (2012) Principios fundamentales de la tipografiacutea Recuperado de httpwwwfaviogutierrezcomcategorytipografia

Mantildeas Moiseacutes (2011) Interfases Reglasteoacutericas Recuperado de

httppersonalesupvesmoimacarmasterdownloadinterfacespdf Misischia Bibiana (3 de setiembre de 2013) Supresioacuten de barreras en la universidad

Paacutegina12 Recuperado de httpwwwpagina12comardiariouniversidad10-228134-2013-09-03html

Morton Jill (2010) Why color matters Recuperado de

httpwwwcolorcomcomresearchwhy-color-matters Observatorio de la Accesibilidad (sf) Breve historia Recuperado de

httpwwwobservatoriodelaaccesibilidadesaccesibilidadbreve-historia Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura - Unesco

(2013) Directrices para las Poliacuteticas de Aprendizaje Moacutevil Recuperado de httpunesdocunescoorgimages0021002196219662Spdf

Rand Paul (2007) Design form and chaos Massachusetts Rockport Publishers Inc Real Academia Espantildeola (2001) Imagen En Diccionario de la lengua espantildeola (22ordf ed)

Recuperado de httpdleraeesid=KzwDY4y Rubio Manuel (1 de setiembre de 2013) iquestQueacute es Disentildeo Adaptativo Recuperado de

httpsmagazinejoomlaorgesediciones-anterioressept-2013item1514-que-es-diseno-adaptativo

Salazar Bejarano Ana Gabriela Berrocal Carvajal Viviana Salas Campos lleana y Valerio

Aacutelvarez Cinthya (2014) Propuesta para el desarrollo de una aplicacioacuten para la gestioacuten administrativa en la UNED Costa Rica Revista Innovaciones Educativas 16(21) 1-11

Shneiderman Ben (1998) Designing the user interface Strategies for effective human-

computer interaction Massachusetts Addison-Wesley Pub Co Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfa) Geometriacutea Euclidea Recuperado de httprepositoriounedaccrmultimediasgeometria_euclideaindexhtml

Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb) Meacutetodos numeacutericos para la ensentildeanza Recuperado de httprepositoriounedaccrmultimediasmetodos_numericos_ensenanza

Velasco Santos Perla Laureano Cruces Ana Lilia Mora Torres Marta y Herrera Bautista

Miguel Aacutengel (octubre 2010) Disentildeo de agentes pedagoacutegicos a partir de los estilos de aprendizaje una perspectiva a traveacutes del color Ponencia presentada en el IV Congreso Mundial de Estilos de Aprendizaje Recuperado de httpkaliazcuammxclc02_publicacionesmaterialDiseC3B1o_de_AvataresPerspColor_10pdf

Page 7: El diseño universal en la interfaz gráfica de multimedia ... · El diseño universal en la interfaz gráfica de multimedia educativo ... aporte de otras metodologías como el diseño

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

6

de un mensaje Asiacute lo referencian Velasco Laureano Mora y Herrera (2010) quienes

afirman que

[hellip] el color es un elemento clave en el disentildeo graacutefico es el elemento maacutes 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 (Seccioacuten Psicologiacutea del color paacuterr 1)

La tipografiacutea con la invencioacuten de la imprenta en la eacutepoca del Renacimiento la tipografiacutea

toma relevancia de la mano de figuras importantes en su historia como Stanley Morison

(1929) citado por Gutieacuterrez (2012) quien definioacute la tipografiacutea como

[hellip] el arte de disponer correctamente el material de imprimir de acuerdo con un

propoacutesito especiacutefico el de colocar las letras repartir el espacio y organizar los tipos

con vistas a prestar al lector la maacutexima ayuda para la comprensioacuten del texto escrito

verbalmente (paacuterr 1)

Puede considerarse entonces la tipografiacutea como una expresioacuten graacutefica de la voz que

contribuye a transmitir el mensaje por ello es importante cuando se utiliza pensar en el

puacuteblico al que va dirigido ya que este debe tener la capacidad de leerlo y comprenderlo sin

ninguacuten tipo de obstaacuteculo o niveles de dificultad posibles

La imagen seguacuten el diccionario de la Real Academia Espantildeola la palabra imagen

proviene del latiacuten imago que significa figura representacioacuten semejanza y apariencia de algo

Fornasari de Menegazzo va maacutes allaacute de lo simple y la define como ldquotoda representacioacuten

visual que mantiene una relacioacuten de semejanza con el objetivo de ser representadordquo (1994

p 21)

Una imagen es entonces un elemento meramente visual que se utiliza para

representar objetos sujetos o situaciones ficticias o reales que evocan expresiones y

sentimientos para transmitir un mensaje Es un elemento comunicacional de la graacutefica visual

La composicioacuten se entiende como la organizacioacuten de varios elementos graacuteficos dentro

del espacio visual que combinados tienen la capacidad de aportar un significado a la

transmisioacuten de un mensaje Es decir la composicioacuten distribuye los diferentes elementos en

una composicioacuten graacutefica (color tipografiacutea imagen) de forma equilibrada que da sentido a la

transmisioacuten de un mensaje Al respecto Gillian (1980) en su libro Fundamentos del disentildeo

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

7

manifiesta que ldquola composicioacuten significa tambieacuten organizacioacuten estructural y que esta

constituye el fundamento de las relaciones visualesrdquo (p19)

La composicioacuten es por lo tanto importante ya que mediante propiedades como orden

balance unidad y relacioacuten entre los elementos graacuteficos en su conjunto permite transmitir el

mensaje de forma concreta facilitando su comprensioacuten por parte del puacuteblico al cual se

orientoacute

4 Metaacutefora pedagoacutegica

Luis Fernando Diacuteaz productor acadeacutemico de la UNED de Costa Rica la define como

(hellip) un elemento comunicativo usualmente graacutefico a veces animado que trasmite en

forma sucinta y reiterada el mensaje educativo central del multimedio o del objeto

especiacutefico Provee unidad graacutefica (y refuerza la unidad pedagoacutegica) en el disentildeo de

todo el material y no solo en pantallas aisladas o en hiperviacutenculos (2011 paacuterr 6)

Es decir estaacute metodologiacutea permite fortalecer y favorecer mediante la reiteracioacuten del

mensaje y los contenidos educativos el aprendizaje que de forma simultaacutenea se comunica

mediante otras formas semaacutenticas y por lo tanto debe ser un proceso planificado desde el

disentildeo mismo

En los multimedia educativos su concrecioacuten se origina dentro de una etapa creativa

propia del proceso de produccioacuten caracterizada por la elaboracioacuten de una propuesta

pedagoacutegica que ademaacutes de mediar los contenidos es representada graacuteficamente para

favorecer el nexo motivacional y de intereacutes por explorar los contenidos e interartuar con

estos a traveacutes de la interfaz En la elaboracioacuten de la interfaz graacutefica este concepto orienta el

disentildeo de los elementos que la conforman como por ejemplo la interfaz principal

secundarias recursos multimedia y de navegacioacuten tales comomenuacutes botones e iacuteconos

Diacuteaz (2011) destaca 7 aspectos pedagoacutegicos que dan valor a la metaacutefora en la

produccioacuten de materiales didaacutecticos

1) Trasmite en forma sucinta y reiterada el mensaje educativo central

2) Fortalece el aprendizaje por cuanto reitera con otros recursos el mensaje textual Parte

de su valor formativo consiste en que refuerza mediante la repeticioacuten el mensaje y los

contenidos al aprendizaje y a la internalizacioacuten de los conocimientos los valores y las

conductas que simultaacuteneamente se comunican mediante otros lenguajes

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

8

3) Facilita la construccioacuten y la presentacioacuten de iacutendices menuacutes y botoneras para la

navegacioacuten dentro del multimedia Formas simplificadas de la metaacutefora (hojas laacutepices

de color flechas) permiten a los lectores distinguir textos vinculados con el mensaje

principal pero que obedecen a finalidades distintas del dominio de contenidos por

aprender Esta economiacutea de representacioacuten resulta en un ahorro de energiacutea en las

actividades educativas particularmente en la auto-instruccioacuten

4) En ese mismo sentido propicia la construccioacuten de familias de iconos aplicables incluso

a los materiales impresos con la intencioacuten de facilitar el desplazamiento del estudiante

por el texto a traveacutes de instrucciones tanto graacuteficas como verbales

5) Favorece la identificacioacuten de los usuarios porque mueve sus emociones y sus

sentimientos crea empatiacutea y complicidad lo que favorece la exploracioacuten y el uso de los

materiales por el estudiantado

6) Modera la frialdad impliacutecita en la comunicacioacuten viacutea maacutequinas y medios electroacutenicos sin

dejar de atender a la veracidad y la verosimilitud Igual efecto provoca en los

voluminosos textos tradicionales impresos en blanco y negro

7) Es un recurso de calidad Una buena metaacutefora permea y orienta toda la produccioacuten se

reproduce y se enriquece a siacute misma y concentra la atencioacuten de los usuarios En este

rol se espera de ella un efecto multiplicador sobre el aprendizaje

5 Interfaz graacutefica

Ben Shneiderman catedraacutetico en Informaacutetica de la Universidad de Maryland en

Estados Unidos define la interfaz como ldquola membrana de comunicacioacuten entre los usuarios y

el sistema por la que los disentildeadores y desarrolladores de herramientas informaacuteticas pueden

hacer que la tecnologiacutea sea inteligible y sensible a las necesidades de los usuariosrdquo (1998

p 4)

En este caso en particular la interfaz graacutefica se puede considerar un mediador visual

que facilita la comunicacioacuten fluida y clara entre un sistema y el usuario para facilitar su

comprensioacuten y uso Esta por lo general se manifiesta en un entorno graacutefico compuesto

principalmente de imaacutegenes y objetos para representar la informacioacuten y las acciones

disponibles para ejecutar

Shneiderman (1998 mencionado por Mantildeas 2011 pp 27-34) enlista 8 reglas de oro

del disentildeo de interfaces

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

9

1) Esforzarse para conseguir consistencia exigir secuencias de acciones consistentes

utilizar terminologiacutea coherente en los mensajes menuacutes y pantallas de ayuda emplear

de forma consistente el color la composicioacuten las mayuacutesculas las fuentes y otros

elementos similares Las excepciones como la necesaria confirmacioacuten de la orden de

borrado o no mostrar los caracteres de las contrasentildeas deberiacutean ser comprensibles y

limitadas en nuacutemero

2) Atender la usabilidad universal reconocer las necesidades de los diversos usuarios

asiacute como las diferencias entre ellos (principiante o experto edades discapacidades y

diversidad tecnoloacutegica) para facilitar la transformacioacuten del contenido

3) Ofrecer realimentacioacuten informativa incluir para cada accioacuten del sistema una

realimentacioacuten por parte del sistema

4) Disentildear diaacutelogos para conducir a la finalizacioacuten crear sistemas claros de

conduccioacuten hasta el final del proceso de las secuencias de accioacuten del usuario

5) Prevenir errores disentildear el sistema de forma que los usuarios no puedan cometer

errores serios

6) Permitir deshacer acciones de forma faacutecil tener la posibilidad de remediar acciones

erroacuteneas por lo tanto construir un sistema reversible Este sistema suaviza la

ansiedad que se puede producir en el usuario

7) Dar soporte al control interno ofrecer a los operadores experimentados la sensacioacuten

de controlar la interfaz y que esta responde a sus acciones Las acciones

sorprendentes por parte de la interfaz las secuencias de entrada de datos tediosas la

incapacidad o dificultad para obtener la informacioacuten necesaria y la incapacidad para

producir acciones deseadas crean ansiedad e insatisfaccioacuten

8) Reducir la carga de la memoria a corto plazo disentildear sistemas de visualizacioacuten

simples que la frecuencia de movimiento de ventana se reduzca y que se asigne

suficiente tiempo de entrenamiento para coacutedigos y secuencias de acciones

Como consecuencia un buen disentildeo de interfaz graacutefica no solo se centra en la parte

visual su esteacutetica y la composicioacuten sino tambieacuten en el desarrollo de su interaccioacuten a traveacutes

de las reglas anteriormente mencionadas Ambos aspectos se complementan ya que en

gran medida determinan la buena experiencia de uso por parte del usuario

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

10

6 Disentildeo adaptativo

Sin duda alguna el siglo XXI se ha caracterizado por el uso cada vez maacutes frecuente y

cotidiano de dispositivos moacuteviles como tabletas teleacutefonos inteligentes y computadoras

portaacutetiles entre otros Seguacuten las Directrices para las poliacuteticas de aprendizaje moacutevil de la

Unesco (Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura)

Hay en el mundo maacutes de 3200 millones de usuarios registrados con teleacutefonos moacuteviles

lo que hace de estos dispositivos la modalidad de TIC maacutes utilizada en la Tierra En los

paiacuteses desarrollados 4 de cada 5 personas poseen y utilizan un teleacutefono moacutevil y

aunque la tasa es significativamente maacutes baja que en los paiacuteses en desarrollo (2 de

cada 5) es en estos paiacuteses donde se registra el crecimiento maacutes raacutepido en cuanto a

iacutendice de penetracioacuten en el mercado (2013 p 7)

En el contexto educativo este fenoacutemeno no ha pasado desapercibido los y las

estudiantes de diferentes modelos educativos en el mundo utilizan estos dispositivos con

diferentes objetivos como gestioacuten administrativa comunicacioacuten y en procesos de

ensentildeanza-aprendizaje Seguacuten las Directrices para las poliacuteticas de aprendizaje moacutevil de la

Unesco se cree al respecto que

[hellip] las tecnologiacuteas moacuteviles pueden ampliar y enriquecer las oportunidades educativas

en distintos contextos Hay cada vez maacutes datos que indican que los omnipresentes

dispositivos moacuteviles en particular los teleacutefonos moacuteviles y maacutes recientemente las

tabletas son utilizados por educandos y docentes de todo el mundo para acceder a

informacioacuten simplificar la administracioacuten y facilitar el aprendizaje de una forma nueva e

innovadora (2013 p5)

En el caso particular de la UNED de Costa Rica seguacuten un estudio realizado en el antildeo

2014 por Salazar Berrocal Salas y Valerio en el que se consideroacute la respuesta de 877

estudiantes y 211 tutores representativos de las instancias acadeacutemicas de la universidad el

90 afirmoacute poseer un teleacutefono moacutevil de los cuales 633 son teleacutefonos inteligentes un 30

son tabletas y un 42 son reproductores de audio y video

A partir de dicha informacioacuten se generoacute una reflexioacuten respecto a la forma en que los

usuarios (especialmente estudiantes) pueden utilizar los materiales didaacutecticos ademaacutes de un

anaacutelisis en cuanto a la presentacioacuten de contenidos y reestructuracioacuten del proceso de

produccioacuten de quienes los llevan a cabo y es asiacute como el disentildeo adaptativo surge como una

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

11

posible respuesta a la necesidad de que dichos materiales esteacuten disponibles para

dispositivos moacuteviles con el propoacutesito de que estos no queden fuera del contexto actual

El disentildeador Manuel Rubio en su artiacuteculo iquestQueacute es Disentildeo Adaptativo lo define como

ldquo[hellip] una teacutecnica de disentildeo y desarrollo web que mediante el uso de estructuras e imaacutegenes

fluidas asiacute como de media-queries en las hojas de estilo CSS se consigue adaptar el sitio

web al dispositivo del usuariordquo (2013 paacuterr 1) Esta adaptacioacuten implica que la interfaz graacutefica

asiacute como los contenidos educativos desarrollados para un material didaacutectico de la

Universidad se ajustan seguacuten la resolucioacuten de la pantalla sin importar el tipo de dispositivo

desde el que se accede pero en ninguacuten caso (a menos que asiacute se contemple) significa el

sacrificio de contenido para cumplir tal propoacutesito Asiacute tanto la informacioacuten escrita apoyada de

imaacutegenes videos animaciones actividades entre otros recursos son adaptados

7 Eleccioacuten de disentildeo adaptativo

El disentildeo adaptativo es una metodologiacutea de disentildeo que permite una mayor

universalizacioacuten de los contenidos de un material en especiacutefico pero la eleccioacuten de este tipo

de disentildeo no debe recaer simplemente en la versatilidad de produccioacuten sino que su

implementacioacuten debe cumplir criterios de produccioacuten para que sea efectivo de lo contrario

seriacutea mejor optar por otro tipo de soluciones

Se debe procurar que la adaptacioacuten de los materiales sea tal que el usuario no tenga

problemas en determinar el cambio maacutexime cuando se trabaja en coordinacioacuten con otras

estrategias didaacutecticas Si bien es cierto el desarrollo de disentildeo adaptativo ahorra tiempo si

se le compara con la produccioacuten de una versioacuten seguacuten dispositivo se debe contemplar el

hecho de que la programacioacuten necesaria para elaborar un material de este tipo es compleja y

debe estar muy bien planificada

Aunque en la actualidad se habla de una mayor penetracioacuten de las tecnologiacuteas moacuteviles

en el mundo antes de implementarlo con un propoacutesito didaacutectico se debe revisar el nivel de

utilizacioacuten potencial que los usuarios del material hacen de sus dispositivos moacuteviles de

manera que se pueda valorar a futuro la idoneidad de la puesta en marcha de la

implementacioacuten de este tipo de disentildeo

8 Aportes y experiencias del PEM en la produccioacuten de multimedia educativo

El PEM ha desarrollado multimedias educativos desde su creacioacuten en el antildeo 2000 La

consigna de produccioacuten acadeacutemica es buscar e implementar en ellos la mejor combinacioacuten

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

12

posible de mediacioacuten de contenidos y uso de las TIC en beneficio del estudiantado a partir

de criterios pedagoacutegicos y de disentildeo En este mismo espiacuteritu de observar y analizar los

cambios que se dan a nivel educativo con respecto a las diferentes posibilidades

tecnoloacutegicas es que el PEM comenzoacute su incursioacuten en el uso del disentildeo adaptativo en la

produccioacuten de multimedia educativo a partir del uso de herramientas y disposiciones

conceptuales para obtener materiales didaacutecticos maacutes inclusivos

Cabe aclarar que el puacuteblico meta del PEM son los y las estudiantes de las diferentes

carreras impartidas en la Universidad usuarios que bien podriacutean presentar alguna condicioacuten

o necesidad especial de aprendizaje que obliga al programa a pensar en las distintas

posibilidades de acceso y uso de sus multimedias educativos

En lo referente a la implementacioacuten de los conceptos anteriormente definidos en la

produccioacuten de multimedia educativo cabe sentildealar que su uso depende del cumplimiento de

criterios de seleccioacuten entre ellos la pertinencia pedagoacutegica con respecto a los contenidos o

bien el uso de los dispositivos moacuteviles por parte del estudiantado

Hoy maacutes que nunca la portabilidad y el uso de variados dispositivos plantea

interrogantes importantes en cuanto a produccioacuten y disentildeo que se tratan de responder desde

la investigacioacuten experimentacioacuten implementacioacuten y posterior evaluacioacuten de la propuesta

Como ejemplo de lo anterior y en el marco de la incursioacuten de los diferentes conceptos

expuestos en este ensayo en el PEM se han elaborado dos materiales que marcaron el

inicio de la implementacioacuten de las metodologiacuteas abordadas

En el antildeo 2013 se produjo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica En

esta primera experiencia se presentoacute un multimedia educativo que sirve de apoyo al libro

Meacutetodos Numeacutericos para la Ensentildeanza publicado por la Editorial de la Universidad Estatal a

Distancia (EUNED) de Costa Rica y que se utiliza en el curso Meacutetodos Numeacutericos que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia El material

ofrece a la persona estudiante la solucioacuten de ejemplos por medio de software libre y gratuito

para la resolucioacuten de problemas y ejercicios en temas relacionados con la Teoriacutea del error

Meacutetodos de aproximacioacuten para soluciones de ecuaciones no lineales Aproximacioacuten

polinomial para valores de funciones y Aproximaciones en derivacioacuten e integracioacuten utilizando

diversas teacutecnicas y meacutetodos

La metaacutefora pedagoacutegica desarrollada se elaboroacute bajo el concepto de un mapa de

estrategia que propone cuatro escenarios que representan las aacutereas temaacuteticas mencionadas

La propuesta se seleccionoacute porque mantiene una estrecha relacioacuten con las aacutereas del

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

13

conocimiento expuestas y porque presenta similitud con los mapas estrateacutegicos utilizados

comuacutenmente en videojuegos de estrategia que son de gran aceptacioacuten y reconocimiento por

parte del puacuteblico meta del material A continuacioacuten se muestra la propuesta graacutefica de la

portada y los moacutedulos de contenido del material

Figura 1 Portada del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

14

Figura 2 Moacutedulos de contenido del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por esta razoacuten los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos del material estaacuten

concebidos de forma modular independientes y adaptables dispuestos en un plano

cartograacutefico que de igual manera se adapta seguacuten la resolucioacuten de pantalla del dispositivo

desde el que se accede

El disentildeo graacutefico del multimedia educativo se disentildeoacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual de esta justificada pedagoacutegicamente y

elaborada a partir de la composicioacuten equilibrada y agradable de imaacutegenes mapa de bits e

ilustraciones vectoriales inspiradas como se mencionoacute anteriormente en los videojuegos de

estrategia que utilizan isomeacutetricos para ambientar sus escenarios Este material cuenta con

algunos aportes del disentildeo universal aplicados en un contexto educativo como uso

equiparable flexible intuitivo y simple Se consideran ademaacutes aspectos importantes de

accesibilidad e inclusioacuten como la posibilidad de ampliar disminuir y restablecer el tamantildeo del

texto en el contenido

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

15

Esta primera experiencia sirvioacute como base para el establecimiento de ciertos criterios

de produccioacuten en este tipo de materiales didaacutecticos como contemplar la adaptabilidad del

material desde el inicio de la produccioacuten considerar en el disentildeo de la metaacutefora pedagoacutegica

aspectos que implica el disentildeo adaptativo la simplicidad en el disentildeo graacutefico que se debe

utilizar en la elaboracioacuten de la interfaz graacutefica y los diferentes recursos audiovisuales entre

otros

Con la intensioacuten de continuar la produccioacuten de multimedia educativo bajo las

metodologiacuteas desarrolladas y adoptadas en el PEM a partir de experiencias previas en el

antildeo 2015 se produjo Geometriacutea Eucliacutedea Esta segunda experiencia presenta un material

didaacutectico utilizado en los cursos de Geometriacutea Eucliacutedea y Construcciones geomeacutetricas que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia Fue producido

bajo el concepto de laboratorio virtual y se compone de cuatro laboratorios que le permiten al

estudiantado y futuro docente de la Universidad aprender a realizar construcciones

geomeacutetricas a partir de la teacutecnica de Regla y compaacutes Portasegmentos Doblado de papel y

Software matemaacutetico

La metaacutefora pedagoacutegica se elaboroacute en torno a un vivero se tomoacute en consideracioacuten el

trasfondo histoacuterico y teoacuterico de la geometriacutea su clara percepcioacuten en la naturaleza desde la

antiguumledad asiacute como la manifestacioacuten cotidiana de elementos geomeacutetricos que rodean al

ser humano por ejemplo los puntos los planos las liacuteneas rectas curvas entre otros A

continuacioacuten se muestra la propuesta graacutefica de la portada y los laboratorios virtuales del

material

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

16

Figura 3 Portada del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

Figura 4 Laboratorios virtuales del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por este motivo los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos multimedia estaacuten

concebidos de forma modular independientes escalables y adaptables presentados en

varios estantes de exhibicioacuten de plantas

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

17

El disentildeo graacutefico del multimedia educativo se elaboroacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual justificada pedagoacutegicamente y disentildeada

a partir de una composicioacuten equilibrada y agradable de ilustraciones vectoriales inspiradas

como se mencionoacute anteriormente en ambientes cotidianos de un vivero con el objetivo de

reforzar la temaacutetica general del material con el contexto en que se presentan los contenidos

De igual manera este recurso cuenta con algunos aportes del disentildeo universal como

su uso equiparable flexible informacioacuten perceptible y tolerancia al error aplicados en el

aacutembito educativo y que tambieacuten consideran aspectos importantes de accesibilidad e

inclusioacuten

Estos dos ejemplos de multimedia educativo producidos en el PEM aunados a

esfuerzos de investigacioacuten y capacitacioacuten a nivel interno del programa son los primeros

pasos hacia el desarrollo de nuevos materiales didaacutecticos maacutes accesibles e inclusivos como

el reciente desarrollo de los laboratorios virtuales para el aprendizaje que tienen como fin

seguir poniendo a disposicioacuten del estudiantado materiales de calidad que apoyen sus

procesos de aprendizaje a distancia y en congruencia con las nuevas posibilidades

tecnoloacutegicas especialmente de formato y medios de reproduccioacuten

9 Conclusiones

A partir de las experiencias generadas desde el PEM asiacute como de valoraciones

recibidas de otras instancias acadeacutemicas de la Universidad con las que se ha trabajado en

conjunto se presentan algunos factores a considerar a la hora de emprender una produccioacuten

de multimedia educativo que contemple algunos de los principios de disentildeo desarrollados

con anterioridad

El disentildeo adaptativo demanda una mayor reflexioacuten a la hora de planificar y concretar la

propuesta graacutefica y la disposicioacuten de contenidos porque se deben contemplar nuevos

escenarios y posibilidades en la visualizacioacuten de los multimedia educativos en tabletas y en

teleacutefonos inteligentes Eso no implica el sacrificio total o parcial de la graacutefica y los contenidos

dado que dichos elementos se vinculan entre siacute independientemente de la resolucioacuten de

pantalla del dispositivo Por lo anterior en los uacuteltimos 5 antildeos el programa ha estado

revisando perioacutedicamente los procesos de produccioacuten y flujos de trabajo con el propoacutesito de

responder a las necesidades actuales de contenidos maacutes accesibles e inclusivos

El disentildeo de la interfaz graacutefica debe conceptualizarse en una uacutenica propuesta simple

concreta escalable y adaptable para hacer maacutes eficiente su proceso de elaboracioacuten Este

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

18

cambio de paradigma obligoacute a replantear el flujo de trabajo en disentildeo ya que se pasoacute de

elaborar varias versiones de una interfaz seguacuten la resolucioacuten de pantalla del dispositivo a

concentrar los esfuerzos en una uacutenica propuesta centrada en los elementos y acciones maacutes

importantes de navegacioacuten lo cual contribuyoacute a mejorar tanto la experiencia como la

usabilidad del material pues todos sus elementos graacuteficos y de contenido se adaptan

El disentildeo universal aplicado en la interfaz converge con el disentildeo adaptativo en la

concrecioacuten de propuestas que evidencien accesibilidad e inclusioacuten en armoniacutea con la graacutefica

ya que los materiales estaacuten orientados a los y las estudiantes y de ellos depende el impacto

que puede tener lo que se disentildee Por lo anterior el disentildeo graacutefico es valorado desde una

perspectiva pedagoacutegica que permite generar empatiacutea y motivacioacuten para explorar los

contenidos Bajo esa premisa el PEM estaacute en constante investigacioacuten de nuevas

metodologiacuteas que contribuyan a mejorar la mediacioacuten de los contenidos asiacute como la

experiencia visual de la interfaz graacutefica de los materiales que desarrolla

Los multimedia educativos se deben producir en funcioacuten de las necesidades y

capacidades del estudiantado por lo tanto es necesario un mayor anaacutelisis del puacuteblico meta

con especial eacutenfasis en acceso y tipo de dispositivos asiacute como la forma en que los utilizan

para acceder a los materiales esto permitiraacute seleccionar los medios y elementos graacuteficos

que realmente contribuyan a la mediacioacuten de los contenidos

Es necesario ademaacutes mejorar los procesos de evaluacioacuten de los multimedia

educativos con el propoacutesito de saber si las metodologiacuteas de disentildeo y produccioacuten utilizadas

actualmente mejoran la accesibilidad e inclusioacuten de los materiales disponibles para el

estudiantado como apoyo en sus procesos de aprendizaje a distancia

Referencias

Burgstahler Sheryl (2007) Universal Design in Education Principles and Applications Recuperado de httpwwwwashingtonedudoitBrochuresAcademicsud_eduhtml

Diacuteaz Luis Fernando (2011) Principios sobre la metaacutefora pedagoacutegica Recuperado de

httpwwwluisfernandodiazcomp=105 Fornasari de Menegazzo Lilia (1994) Didaacutectica de la imagen Zaragoza Editorial Latina Fundacioacuten SIDAR (2007) Principios del disentildeo universal Recuperado de

httpwwwsidarorgrecurdesdiusabledudtphp Gilliam Scott Robert (1980) Fundamentos del disentildeo Buenos Aires Editorial U Leru

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

19

Gutieacuterrez Favio (2012) Principios fundamentales de la tipografiacutea Recuperado de httpwwwfaviogutierrezcomcategorytipografia

Mantildeas Moiseacutes (2011) Interfases Reglasteoacutericas Recuperado de

httppersonalesupvesmoimacarmasterdownloadinterfacespdf Misischia Bibiana (3 de setiembre de 2013) Supresioacuten de barreras en la universidad

Paacutegina12 Recuperado de httpwwwpagina12comardiariouniversidad10-228134-2013-09-03html

Morton Jill (2010) Why color matters Recuperado de

httpwwwcolorcomcomresearchwhy-color-matters Observatorio de la Accesibilidad (sf) Breve historia Recuperado de

httpwwwobservatoriodelaaccesibilidadesaccesibilidadbreve-historia Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura - Unesco

(2013) Directrices para las Poliacuteticas de Aprendizaje Moacutevil Recuperado de httpunesdocunescoorgimages0021002196219662Spdf

Rand Paul (2007) Design form and chaos Massachusetts Rockport Publishers Inc Real Academia Espantildeola (2001) Imagen En Diccionario de la lengua espantildeola (22ordf ed)

Recuperado de httpdleraeesid=KzwDY4y Rubio Manuel (1 de setiembre de 2013) iquestQueacute es Disentildeo Adaptativo Recuperado de

httpsmagazinejoomlaorgesediciones-anterioressept-2013item1514-que-es-diseno-adaptativo

Salazar Bejarano Ana Gabriela Berrocal Carvajal Viviana Salas Campos lleana y Valerio

Aacutelvarez Cinthya (2014) Propuesta para el desarrollo de una aplicacioacuten para la gestioacuten administrativa en la UNED Costa Rica Revista Innovaciones Educativas 16(21) 1-11

Shneiderman Ben (1998) Designing the user interface Strategies for effective human-

computer interaction Massachusetts Addison-Wesley Pub Co Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfa) Geometriacutea Euclidea Recuperado de httprepositoriounedaccrmultimediasgeometria_euclideaindexhtml

Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb) Meacutetodos numeacutericos para la ensentildeanza Recuperado de httprepositoriounedaccrmultimediasmetodos_numericos_ensenanza

Velasco Santos Perla Laureano Cruces Ana Lilia Mora Torres Marta y Herrera Bautista

Miguel Aacutengel (octubre 2010) Disentildeo de agentes pedagoacutegicos a partir de los estilos de aprendizaje una perspectiva a traveacutes del color Ponencia presentada en el IV Congreso Mundial de Estilos de Aprendizaje Recuperado de httpkaliazcuammxclc02_publicacionesmaterialDiseC3B1o_de_AvataresPerspColor_10pdf

Page 8: El diseño universal en la interfaz gráfica de multimedia ... · El diseño universal en la interfaz gráfica de multimedia educativo ... aporte de otras metodologías como el diseño

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

7

manifiesta que ldquola composicioacuten significa tambieacuten organizacioacuten estructural y que esta

constituye el fundamento de las relaciones visualesrdquo (p19)

La composicioacuten es por lo tanto importante ya que mediante propiedades como orden

balance unidad y relacioacuten entre los elementos graacuteficos en su conjunto permite transmitir el

mensaje de forma concreta facilitando su comprensioacuten por parte del puacuteblico al cual se

orientoacute

4 Metaacutefora pedagoacutegica

Luis Fernando Diacuteaz productor acadeacutemico de la UNED de Costa Rica la define como

(hellip) un elemento comunicativo usualmente graacutefico a veces animado que trasmite en

forma sucinta y reiterada el mensaje educativo central del multimedio o del objeto

especiacutefico Provee unidad graacutefica (y refuerza la unidad pedagoacutegica) en el disentildeo de

todo el material y no solo en pantallas aisladas o en hiperviacutenculos (2011 paacuterr 6)

Es decir estaacute metodologiacutea permite fortalecer y favorecer mediante la reiteracioacuten del

mensaje y los contenidos educativos el aprendizaje que de forma simultaacutenea se comunica

mediante otras formas semaacutenticas y por lo tanto debe ser un proceso planificado desde el

disentildeo mismo

En los multimedia educativos su concrecioacuten se origina dentro de una etapa creativa

propia del proceso de produccioacuten caracterizada por la elaboracioacuten de una propuesta

pedagoacutegica que ademaacutes de mediar los contenidos es representada graacuteficamente para

favorecer el nexo motivacional y de intereacutes por explorar los contenidos e interartuar con

estos a traveacutes de la interfaz En la elaboracioacuten de la interfaz graacutefica este concepto orienta el

disentildeo de los elementos que la conforman como por ejemplo la interfaz principal

secundarias recursos multimedia y de navegacioacuten tales comomenuacutes botones e iacuteconos

Diacuteaz (2011) destaca 7 aspectos pedagoacutegicos que dan valor a la metaacutefora en la

produccioacuten de materiales didaacutecticos

1) Trasmite en forma sucinta y reiterada el mensaje educativo central

2) Fortalece el aprendizaje por cuanto reitera con otros recursos el mensaje textual Parte

de su valor formativo consiste en que refuerza mediante la repeticioacuten el mensaje y los

contenidos al aprendizaje y a la internalizacioacuten de los conocimientos los valores y las

conductas que simultaacuteneamente se comunican mediante otros lenguajes

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

8

3) Facilita la construccioacuten y la presentacioacuten de iacutendices menuacutes y botoneras para la

navegacioacuten dentro del multimedia Formas simplificadas de la metaacutefora (hojas laacutepices

de color flechas) permiten a los lectores distinguir textos vinculados con el mensaje

principal pero que obedecen a finalidades distintas del dominio de contenidos por

aprender Esta economiacutea de representacioacuten resulta en un ahorro de energiacutea en las

actividades educativas particularmente en la auto-instruccioacuten

4) En ese mismo sentido propicia la construccioacuten de familias de iconos aplicables incluso

a los materiales impresos con la intencioacuten de facilitar el desplazamiento del estudiante

por el texto a traveacutes de instrucciones tanto graacuteficas como verbales

5) Favorece la identificacioacuten de los usuarios porque mueve sus emociones y sus

sentimientos crea empatiacutea y complicidad lo que favorece la exploracioacuten y el uso de los

materiales por el estudiantado

6) Modera la frialdad impliacutecita en la comunicacioacuten viacutea maacutequinas y medios electroacutenicos sin

dejar de atender a la veracidad y la verosimilitud Igual efecto provoca en los

voluminosos textos tradicionales impresos en blanco y negro

7) Es un recurso de calidad Una buena metaacutefora permea y orienta toda la produccioacuten se

reproduce y se enriquece a siacute misma y concentra la atencioacuten de los usuarios En este

rol se espera de ella un efecto multiplicador sobre el aprendizaje

5 Interfaz graacutefica

Ben Shneiderman catedraacutetico en Informaacutetica de la Universidad de Maryland en

Estados Unidos define la interfaz como ldquola membrana de comunicacioacuten entre los usuarios y

el sistema por la que los disentildeadores y desarrolladores de herramientas informaacuteticas pueden

hacer que la tecnologiacutea sea inteligible y sensible a las necesidades de los usuariosrdquo (1998

p 4)

En este caso en particular la interfaz graacutefica se puede considerar un mediador visual

que facilita la comunicacioacuten fluida y clara entre un sistema y el usuario para facilitar su

comprensioacuten y uso Esta por lo general se manifiesta en un entorno graacutefico compuesto

principalmente de imaacutegenes y objetos para representar la informacioacuten y las acciones

disponibles para ejecutar

Shneiderman (1998 mencionado por Mantildeas 2011 pp 27-34) enlista 8 reglas de oro

del disentildeo de interfaces

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

9

1) Esforzarse para conseguir consistencia exigir secuencias de acciones consistentes

utilizar terminologiacutea coherente en los mensajes menuacutes y pantallas de ayuda emplear

de forma consistente el color la composicioacuten las mayuacutesculas las fuentes y otros

elementos similares Las excepciones como la necesaria confirmacioacuten de la orden de

borrado o no mostrar los caracteres de las contrasentildeas deberiacutean ser comprensibles y

limitadas en nuacutemero

2) Atender la usabilidad universal reconocer las necesidades de los diversos usuarios

asiacute como las diferencias entre ellos (principiante o experto edades discapacidades y

diversidad tecnoloacutegica) para facilitar la transformacioacuten del contenido

3) Ofrecer realimentacioacuten informativa incluir para cada accioacuten del sistema una

realimentacioacuten por parte del sistema

4) Disentildear diaacutelogos para conducir a la finalizacioacuten crear sistemas claros de

conduccioacuten hasta el final del proceso de las secuencias de accioacuten del usuario

5) Prevenir errores disentildear el sistema de forma que los usuarios no puedan cometer

errores serios

6) Permitir deshacer acciones de forma faacutecil tener la posibilidad de remediar acciones

erroacuteneas por lo tanto construir un sistema reversible Este sistema suaviza la

ansiedad que se puede producir en el usuario

7) Dar soporte al control interno ofrecer a los operadores experimentados la sensacioacuten

de controlar la interfaz y que esta responde a sus acciones Las acciones

sorprendentes por parte de la interfaz las secuencias de entrada de datos tediosas la

incapacidad o dificultad para obtener la informacioacuten necesaria y la incapacidad para

producir acciones deseadas crean ansiedad e insatisfaccioacuten

8) Reducir la carga de la memoria a corto plazo disentildear sistemas de visualizacioacuten

simples que la frecuencia de movimiento de ventana se reduzca y que se asigne

suficiente tiempo de entrenamiento para coacutedigos y secuencias de acciones

Como consecuencia un buen disentildeo de interfaz graacutefica no solo se centra en la parte

visual su esteacutetica y la composicioacuten sino tambieacuten en el desarrollo de su interaccioacuten a traveacutes

de las reglas anteriormente mencionadas Ambos aspectos se complementan ya que en

gran medida determinan la buena experiencia de uso por parte del usuario

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

10

6 Disentildeo adaptativo

Sin duda alguna el siglo XXI se ha caracterizado por el uso cada vez maacutes frecuente y

cotidiano de dispositivos moacuteviles como tabletas teleacutefonos inteligentes y computadoras

portaacutetiles entre otros Seguacuten las Directrices para las poliacuteticas de aprendizaje moacutevil de la

Unesco (Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura)

Hay en el mundo maacutes de 3200 millones de usuarios registrados con teleacutefonos moacuteviles

lo que hace de estos dispositivos la modalidad de TIC maacutes utilizada en la Tierra En los

paiacuteses desarrollados 4 de cada 5 personas poseen y utilizan un teleacutefono moacutevil y

aunque la tasa es significativamente maacutes baja que en los paiacuteses en desarrollo (2 de

cada 5) es en estos paiacuteses donde se registra el crecimiento maacutes raacutepido en cuanto a

iacutendice de penetracioacuten en el mercado (2013 p 7)

En el contexto educativo este fenoacutemeno no ha pasado desapercibido los y las

estudiantes de diferentes modelos educativos en el mundo utilizan estos dispositivos con

diferentes objetivos como gestioacuten administrativa comunicacioacuten y en procesos de

ensentildeanza-aprendizaje Seguacuten las Directrices para las poliacuteticas de aprendizaje moacutevil de la

Unesco se cree al respecto que

[hellip] las tecnologiacuteas moacuteviles pueden ampliar y enriquecer las oportunidades educativas

en distintos contextos Hay cada vez maacutes datos que indican que los omnipresentes

dispositivos moacuteviles en particular los teleacutefonos moacuteviles y maacutes recientemente las

tabletas son utilizados por educandos y docentes de todo el mundo para acceder a

informacioacuten simplificar la administracioacuten y facilitar el aprendizaje de una forma nueva e

innovadora (2013 p5)

En el caso particular de la UNED de Costa Rica seguacuten un estudio realizado en el antildeo

2014 por Salazar Berrocal Salas y Valerio en el que se consideroacute la respuesta de 877

estudiantes y 211 tutores representativos de las instancias acadeacutemicas de la universidad el

90 afirmoacute poseer un teleacutefono moacutevil de los cuales 633 son teleacutefonos inteligentes un 30

son tabletas y un 42 son reproductores de audio y video

A partir de dicha informacioacuten se generoacute una reflexioacuten respecto a la forma en que los

usuarios (especialmente estudiantes) pueden utilizar los materiales didaacutecticos ademaacutes de un

anaacutelisis en cuanto a la presentacioacuten de contenidos y reestructuracioacuten del proceso de

produccioacuten de quienes los llevan a cabo y es asiacute como el disentildeo adaptativo surge como una

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

11

posible respuesta a la necesidad de que dichos materiales esteacuten disponibles para

dispositivos moacuteviles con el propoacutesito de que estos no queden fuera del contexto actual

El disentildeador Manuel Rubio en su artiacuteculo iquestQueacute es Disentildeo Adaptativo lo define como

ldquo[hellip] una teacutecnica de disentildeo y desarrollo web que mediante el uso de estructuras e imaacutegenes

fluidas asiacute como de media-queries en las hojas de estilo CSS se consigue adaptar el sitio

web al dispositivo del usuariordquo (2013 paacuterr 1) Esta adaptacioacuten implica que la interfaz graacutefica

asiacute como los contenidos educativos desarrollados para un material didaacutectico de la

Universidad se ajustan seguacuten la resolucioacuten de la pantalla sin importar el tipo de dispositivo

desde el que se accede pero en ninguacuten caso (a menos que asiacute se contemple) significa el

sacrificio de contenido para cumplir tal propoacutesito Asiacute tanto la informacioacuten escrita apoyada de

imaacutegenes videos animaciones actividades entre otros recursos son adaptados

7 Eleccioacuten de disentildeo adaptativo

El disentildeo adaptativo es una metodologiacutea de disentildeo que permite una mayor

universalizacioacuten de los contenidos de un material en especiacutefico pero la eleccioacuten de este tipo

de disentildeo no debe recaer simplemente en la versatilidad de produccioacuten sino que su

implementacioacuten debe cumplir criterios de produccioacuten para que sea efectivo de lo contrario

seriacutea mejor optar por otro tipo de soluciones

Se debe procurar que la adaptacioacuten de los materiales sea tal que el usuario no tenga

problemas en determinar el cambio maacutexime cuando se trabaja en coordinacioacuten con otras

estrategias didaacutecticas Si bien es cierto el desarrollo de disentildeo adaptativo ahorra tiempo si

se le compara con la produccioacuten de una versioacuten seguacuten dispositivo se debe contemplar el

hecho de que la programacioacuten necesaria para elaborar un material de este tipo es compleja y

debe estar muy bien planificada

Aunque en la actualidad se habla de una mayor penetracioacuten de las tecnologiacuteas moacuteviles

en el mundo antes de implementarlo con un propoacutesito didaacutectico se debe revisar el nivel de

utilizacioacuten potencial que los usuarios del material hacen de sus dispositivos moacuteviles de

manera que se pueda valorar a futuro la idoneidad de la puesta en marcha de la

implementacioacuten de este tipo de disentildeo

8 Aportes y experiencias del PEM en la produccioacuten de multimedia educativo

El PEM ha desarrollado multimedias educativos desde su creacioacuten en el antildeo 2000 La

consigna de produccioacuten acadeacutemica es buscar e implementar en ellos la mejor combinacioacuten

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

12

posible de mediacioacuten de contenidos y uso de las TIC en beneficio del estudiantado a partir

de criterios pedagoacutegicos y de disentildeo En este mismo espiacuteritu de observar y analizar los

cambios que se dan a nivel educativo con respecto a las diferentes posibilidades

tecnoloacutegicas es que el PEM comenzoacute su incursioacuten en el uso del disentildeo adaptativo en la

produccioacuten de multimedia educativo a partir del uso de herramientas y disposiciones

conceptuales para obtener materiales didaacutecticos maacutes inclusivos

Cabe aclarar que el puacuteblico meta del PEM son los y las estudiantes de las diferentes

carreras impartidas en la Universidad usuarios que bien podriacutean presentar alguna condicioacuten

o necesidad especial de aprendizaje que obliga al programa a pensar en las distintas

posibilidades de acceso y uso de sus multimedias educativos

En lo referente a la implementacioacuten de los conceptos anteriormente definidos en la

produccioacuten de multimedia educativo cabe sentildealar que su uso depende del cumplimiento de

criterios de seleccioacuten entre ellos la pertinencia pedagoacutegica con respecto a los contenidos o

bien el uso de los dispositivos moacuteviles por parte del estudiantado

Hoy maacutes que nunca la portabilidad y el uso de variados dispositivos plantea

interrogantes importantes en cuanto a produccioacuten y disentildeo que se tratan de responder desde

la investigacioacuten experimentacioacuten implementacioacuten y posterior evaluacioacuten de la propuesta

Como ejemplo de lo anterior y en el marco de la incursioacuten de los diferentes conceptos

expuestos en este ensayo en el PEM se han elaborado dos materiales que marcaron el

inicio de la implementacioacuten de las metodologiacuteas abordadas

En el antildeo 2013 se produjo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica En

esta primera experiencia se presentoacute un multimedia educativo que sirve de apoyo al libro

Meacutetodos Numeacutericos para la Ensentildeanza publicado por la Editorial de la Universidad Estatal a

Distancia (EUNED) de Costa Rica y que se utiliza en el curso Meacutetodos Numeacutericos que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia El material

ofrece a la persona estudiante la solucioacuten de ejemplos por medio de software libre y gratuito

para la resolucioacuten de problemas y ejercicios en temas relacionados con la Teoriacutea del error

Meacutetodos de aproximacioacuten para soluciones de ecuaciones no lineales Aproximacioacuten

polinomial para valores de funciones y Aproximaciones en derivacioacuten e integracioacuten utilizando

diversas teacutecnicas y meacutetodos

La metaacutefora pedagoacutegica desarrollada se elaboroacute bajo el concepto de un mapa de

estrategia que propone cuatro escenarios que representan las aacutereas temaacuteticas mencionadas

La propuesta se seleccionoacute porque mantiene una estrecha relacioacuten con las aacutereas del

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

13

conocimiento expuestas y porque presenta similitud con los mapas estrateacutegicos utilizados

comuacutenmente en videojuegos de estrategia que son de gran aceptacioacuten y reconocimiento por

parte del puacuteblico meta del material A continuacioacuten se muestra la propuesta graacutefica de la

portada y los moacutedulos de contenido del material

Figura 1 Portada del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

14

Figura 2 Moacutedulos de contenido del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por esta razoacuten los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos del material estaacuten

concebidos de forma modular independientes y adaptables dispuestos en un plano

cartograacutefico que de igual manera se adapta seguacuten la resolucioacuten de pantalla del dispositivo

desde el que se accede

El disentildeo graacutefico del multimedia educativo se disentildeoacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual de esta justificada pedagoacutegicamente y

elaborada a partir de la composicioacuten equilibrada y agradable de imaacutegenes mapa de bits e

ilustraciones vectoriales inspiradas como se mencionoacute anteriormente en los videojuegos de

estrategia que utilizan isomeacutetricos para ambientar sus escenarios Este material cuenta con

algunos aportes del disentildeo universal aplicados en un contexto educativo como uso

equiparable flexible intuitivo y simple Se consideran ademaacutes aspectos importantes de

accesibilidad e inclusioacuten como la posibilidad de ampliar disminuir y restablecer el tamantildeo del

texto en el contenido

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

15

Esta primera experiencia sirvioacute como base para el establecimiento de ciertos criterios

de produccioacuten en este tipo de materiales didaacutecticos como contemplar la adaptabilidad del

material desde el inicio de la produccioacuten considerar en el disentildeo de la metaacutefora pedagoacutegica

aspectos que implica el disentildeo adaptativo la simplicidad en el disentildeo graacutefico que se debe

utilizar en la elaboracioacuten de la interfaz graacutefica y los diferentes recursos audiovisuales entre

otros

Con la intensioacuten de continuar la produccioacuten de multimedia educativo bajo las

metodologiacuteas desarrolladas y adoptadas en el PEM a partir de experiencias previas en el

antildeo 2015 se produjo Geometriacutea Eucliacutedea Esta segunda experiencia presenta un material

didaacutectico utilizado en los cursos de Geometriacutea Eucliacutedea y Construcciones geomeacutetricas que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia Fue producido

bajo el concepto de laboratorio virtual y se compone de cuatro laboratorios que le permiten al

estudiantado y futuro docente de la Universidad aprender a realizar construcciones

geomeacutetricas a partir de la teacutecnica de Regla y compaacutes Portasegmentos Doblado de papel y

Software matemaacutetico

La metaacutefora pedagoacutegica se elaboroacute en torno a un vivero se tomoacute en consideracioacuten el

trasfondo histoacuterico y teoacuterico de la geometriacutea su clara percepcioacuten en la naturaleza desde la

antiguumledad asiacute como la manifestacioacuten cotidiana de elementos geomeacutetricos que rodean al

ser humano por ejemplo los puntos los planos las liacuteneas rectas curvas entre otros A

continuacioacuten se muestra la propuesta graacutefica de la portada y los laboratorios virtuales del

material

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

16

Figura 3 Portada del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

Figura 4 Laboratorios virtuales del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por este motivo los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos multimedia estaacuten

concebidos de forma modular independientes escalables y adaptables presentados en

varios estantes de exhibicioacuten de plantas

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

17

El disentildeo graacutefico del multimedia educativo se elaboroacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual justificada pedagoacutegicamente y disentildeada

a partir de una composicioacuten equilibrada y agradable de ilustraciones vectoriales inspiradas

como se mencionoacute anteriormente en ambientes cotidianos de un vivero con el objetivo de

reforzar la temaacutetica general del material con el contexto en que se presentan los contenidos

De igual manera este recurso cuenta con algunos aportes del disentildeo universal como

su uso equiparable flexible informacioacuten perceptible y tolerancia al error aplicados en el

aacutembito educativo y que tambieacuten consideran aspectos importantes de accesibilidad e

inclusioacuten

Estos dos ejemplos de multimedia educativo producidos en el PEM aunados a

esfuerzos de investigacioacuten y capacitacioacuten a nivel interno del programa son los primeros

pasos hacia el desarrollo de nuevos materiales didaacutecticos maacutes accesibles e inclusivos como

el reciente desarrollo de los laboratorios virtuales para el aprendizaje que tienen como fin

seguir poniendo a disposicioacuten del estudiantado materiales de calidad que apoyen sus

procesos de aprendizaje a distancia y en congruencia con las nuevas posibilidades

tecnoloacutegicas especialmente de formato y medios de reproduccioacuten

9 Conclusiones

A partir de las experiencias generadas desde el PEM asiacute como de valoraciones

recibidas de otras instancias acadeacutemicas de la Universidad con las que se ha trabajado en

conjunto se presentan algunos factores a considerar a la hora de emprender una produccioacuten

de multimedia educativo que contemple algunos de los principios de disentildeo desarrollados

con anterioridad

El disentildeo adaptativo demanda una mayor reflexioacuten a la hora de planificar y concretar la

propuesta graacutefica y la disposicioacuten de contenidos porque se deben contemplar nuevos

escenarios y posibilidades en la visualizacioacuten de los multimedia educativos en tabletas y en

teleacutefonos inteligentes Eso no implica el sacrificio total o parcial de la graacutefica y los contenidos

dado que dichos elementos se vinculan entre siacute independientemente de la resolucioacuten de

pantalla del dispositivo Por lo anterior en los uacuteltimos 5 antildeos el programa ha estado

revisando perioacutedicamente los procesos de produccioacuten y flujos de trabajo con el propoacutesito de

responder a las necesidades actuales de contenidos maacutes accesibles e inclusivos

El disentildeo de la interfaz graacutefica debe conceptualizarse en una uacutenica propuesta simple

concreta escalable y adaptable para hacer maacutes eficiente su proceso de elaboracioacuten Este

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

18

cambio de paradigma obligoacute a replantear el flujo de trabajo en disentildeo ya que se pasoacute de

elaborar varias versiones de una interfaz seguacuten la resolucioacuten de pantalla del dispositivo a

concentrar los esfuerzos en una uacutenica propuesta centrada en los elementos y acciones maacutes

importantes de navegacioacuten lo cual contribuyoacute a mejorar tanto la experiencia como la

usabilidad del material pues todos sus elementos graacuteficos y de contenido se adaptan

El disentildeo universal aplicado en la interfaz converge con el disentildeo adaptativo en la

concrecioacuten de propuestas que evidencien accesibilidad e inclusioacuten en armoniacutea con la graacutefica

ya que los materiales estaacuten orientados a los y las estudiantes y de ellos depende el impacto

que puede tener lo que se disentildee Por lo anterior el disentildeo graacutefico es valorado desde una

perspectiva pedagoacutegica que permite generar empatiacutea y motivacioacuten para explorar los

contenidos Bajo esa premisa el PEM estaacute en constante investigacioacuten de nuevas

metodologiacuteas que contribuyan a mejorar la mediacioacuten de los contenidos asiacute como la

experiencia visual de la interfaz graacutefica de los materiales que desarrolla

Los multimedia educativos se deben producir en funcioacuten de las necesidades y

capacidades del estudiantado por lo tanto es necesario un mayor anaacutelisis del puacuteblico meta

con especial eacutenfasis en acceso y tipo de dispositivos asiacute como la forma en que los utilizan

para acceder a los materiales esto permitiraacute seleccionar los medios y elementos graacuteficos

que realmente contribuyan a la mediacioacuten de los contenidos

Es necesario ademaacutes mejorar los procesos de evaluacioacuten de los multimedia

educativos con el propoacutesito de saber si las metodologiacuteas de disentildeo y produccioacuten utilizadas

actualmente mejoran la accesibilidad e inclusioacuten de los materiales disponibles para el

estudiantado como apoyo en sus procesos de aprendizaje a distancia

Referencias

Burgstahler Sheryl (2007) Universal Design in Education Principles and Applications Recuperado de httpwwwwashingtonedudoitBrochuresAcademicsud_eduhtml

Diacuteaz Luis Fernando (2011) Principios sobre la metaacutefora pedagoacutegica Recuperado de

httpwwwluisfernandodiazcomp=105 Fornasari de Menegazzo Lilia (1994) Didaacutectica de la imagen Zaragoza Editorial Latina Fundacioacuten SIDAR (2007) Principios del disentildeo universal Recuperado de

httpwwwsidarorgrecurdesdiusabledudtphp Gilliam Scott Robert (1980) Fundamentos del disentildeo Buenos Aires Editorial U Leru

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

19

Gutieacuterrez Favio (2012) Principios fundamentales de la tipografiacutea Recuperado de httpwwwfaviogutierrezcomcategorytipografia

Mantildeas Moiseacutes (2011) Interfases Reglasteoacutericas Recuperado de

httppersonalesupvesmoimacarmasterdownloadinterfacespdf Misischia Bibiana (3 de setiembre de 2013) Supresioacuten de barreras en la universidad

Paacutegina12 Recuperado de httpwwwpagina12comardiariouniversidad10-228134-2013-09-03html

Morton Jill (2010) Why color matters Recuperado de

httpwwwcolorcomcomresearchwhy-color-matters Observatorio de la Accesibilidad (sf) Breve historia Recuperado de

httpwwwobservatoriodelaaccesibilidadesaccesibilidadbreve-historia Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura - Unesco

(2013) Directrices para las Poliacuteticas de Aprendizaje Moacutevil Recuperado de httpunesdocunescoorgimages0021002196219662Spdf

Rand Paul (2007) Design form and chaos Massachusetts Rockport Publishers Inc Real Academia Espantildeola (2001) Imagen En Diccionario de la lengua espantildeola (22ordf ed)

Recuperado de httpdleraeesid=KzwDY4y Rubio Manuel (1 de setiembre de 2013) iquestQueacute es Disentildeo Adaptativo Recuperado de

httpsmagazinejoomlaorgesediciones-anterioressept-2013item1514-que-es-diseno-adaptativo

Salazar Bejarano Ana Gabriela Berrocal Carvajal Viviana Salas Campos lleana y Valerio

Aacutelvarez Cinthya (2014) Propuesta para el desarrollo de una aplicacioacuten para la gestioacuten administrativa en la UNED Costa Rica Revista Innovaciones Educativas 16(21) 1-11

Shneiderman Ben (1998) Designing the user interface Strategies for effective human-

computer interaction Massachusetts Addison-Wesley Pub Co Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfa) Geometriacutea Euclidea Recuperado de httprepositoriounedaccrmultimediasgeometria_euclideaindexhtml

Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb) Meacutetodos numeacutericos para la ensentildeanza Recuperado de httprepositoriounedaccrmultimediasmetodos_numericos_ensenanza

Velasco Santos Perla Laureano Cruces Ana Lilia Mora Torres Marta y Herrera Bautista

Miguel Aacutengel (octubre 2010) Disentildeo de agentes pedagoacutegicos a partir de los estilos de aprendizaje una perspectiva a traveacutes del color Ponencia presentada en el IV Congreso Mundial de Estilos de Aprendizaje Recuperado de httpkaliazcuammxclc02_publicacionesmaterialDiseC3B1o_de_AvataresPerspColor_10pdf

Page 9: El diseño universal en la interfaz gráfica de multimedia ... · El diseño universal en la interfaz gráfica de multimedia educativo ... aporte de otras metodologías como el diseño

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

8

3) Facilita la construccioacuten y la presentacioacuten de iacutendices menuacutes y botoneras para la

navegacioacuten dentro del multimedia Formas simplificadas de la metaacutefora (hojas laacutepices

de color flechas) permiten a los lectores distinguir textos vinculados con el mensaje

principal pero que obedecen a finalidades distintas del dominio de contenidos por

aprender Esta economiacutea de representacioacuten resulta en un ahorro de energiacutea en las

actividades educativas particularmente en la auto-instruccioacuten

4) En ese mismo sentido propicia la construccioacuten de familias de iconos aplicables incluso

a los materiales impresos con la intencioacuten de facilitar el desplazamiento del estudiante

por el texto a traveacutes de instrucciones tanto graacuteficas como verbales

5) Favorece la identificacioacuten de los usuarios porque mueve sus emociones y sus

sentimientos crea empatiacutea y complicidad lo que favorece la exploracioacuten y el uso de los

materiales por el estudiantado

6) Modera la frialdad impliacutecita en la comunicacioacuten viacutea maacutequinas y medios electroacutenicos sin

dejar de atender a la veracidad y la verosimilitud Igual efecto provoca en los

voluminosos textos tradicionales impresos en blanco y negro

7) Es un recurso de calidad Una buena metaacutefora permea y orienta toda la produccioacuten se

reproduce y se enriquece a siacute misma y concentra la atencioacuten de los usuarios En este

rol se espera de ella un efecto multiplicador sobre el aprendizaje

5 Interfaz graacutefica

Ben Shneiderman catedraacutetico en Informaacutetica de la Universidad de Maryland en

Estados Unidos define la interfaz como ldquola membrana de comunicacioacuten entre los usuarios y

el sistema por la que los disentildeadores y desarrolladores de herramientas informaacuteticas pueden

hacer que la tecnologiacutea sea inteligible y sensible a las necesidades de los usuariosrdquo (1998

p 4)

En este caso en particular la interfaz graacutefica se puede considerar un mediador visual

que facilita la comunicacioacuten fluida y clara entre un sistema y el usuario para facilitar su

comprensioacuten y uso Esta por lo general se manifiesta en un entorno graacutefico compuesto

principalmente de imaacutegenes y objetos para representar la informacioacuten y las acciones

disponibles para ejecutar

Shneiderman (1998 mencionado por Mantildeas 2011 pp 27-34) enlista 8 reglas de oro

del disentildeo de interfaces

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

9

1) Esforzarse para conseguir consistencia exigir secuencias de acciones consistentes

utilizar terminologiacutea coherente en los mensajes menuacutes y pantallas de ayuda emplear

de forma consistente el color la composicioacuten las mayuacutesculas las fuentes y otros

elementos similares Las excepciones como la necesaria confirmacioacuten de la orden de

borrado o no mostrar los caracteres de las contrasentildeas deberiacutean ser comprensibles y

limitadas en nuacutemero

2) Atender la usabilidad universal reconocer las necesidades de los diversos usuarios

asiacute como las diferencias entre ellos (principiante o experto edades discapacidades y

diversidad tecnoloacutegica) para facilitar la transformacioacuten del contenido

3) Ofrecer realimentacioacuten informativa incluir para cada accioacuten del sistema una

realimentacioacuten por parte del sistema

4) Disentildear diaacutelogos para conducir a la finalizacioacuten crear sistemas claros de

conduccioacuten hasta el final del proceso de las secuencias de accioacuten del usuario

5) Prevenir errores disentildear el sistema de forma que los usuarios no puedan cometer

errores serios

6) Permitir deshacer acciones de forma faacutecil tener la posibilidad de remediar acciones

erroacuteneas por lo tanto construir un sistema reversible Este sistema suaviza la

ansiedad que se puede producir en el usuario

7) Dar soporte al control interno ofrecer a los operadores experimentados la sensacioacuten

de controlar la interfaz y que esta responde a sus acciones Las acciones

sorprendentes por parte de la interfaz las secuencias de entrada de datos tediosas la

incapacidad o dificultad para obtener la informacioacuten necesaria y la incapacidad para

producir acciones deseadas crean ansiedad e insatisfaccioacuten

8) Reducir la carga de la memoria a corto plazo disentildear sistemas de visualizacioacuten

simples que la frecuencia de movimiento de ventana se reduzca y que se asigne

suficiente tiempo de entrenamiento para coacutedigos y secuencias de acciones

Como consecuencia un buen disentildeo de interfaz graacutefica no solo se centra en la parte

visual su esteacutetica y la composicioacuten sino tambieacuten en el desarrollo de su interaccioacuten a traveacutes

de las reglas anteriormente mencionadas Ambos aspectos se complementan ya que en

gran medida determinan la buena experiencia de uso por parte del usuario

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

10

6 Disentildeo adaptativo

Sin duda alguna el siglo XXI se ha caracterizado por el uso cada vez maacutes frecuente y

cotidiano de dispositivos moacuteviles como tabletas teleacutefonos inteligentes y computadoras

portaacutetiles entre otros Seguacuten las Directrices para las poliacuteticas de aprendizaje moacutevil de la

Unesco (Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura)

Hay en el mundo maacutes de 3200 millones de usuarios registrados con teleacutefonos moacuteviles

lo que hace de estos dispositivos la modalidad de TIC maacutes utilizada en la Tierra En los

paiacuteses desarrollados 4 de cada 5 personas poseen y utilizan un teleacutefono moacutevil y

aunque la tasa es significativamente maacutes baja que en los paiacuteses en desarrollo (2 de

cada 5) es en estos paiacuteses donde se registra el crecimiento maacutes raacutepido en cuanto a

iacutendice de penetracioacuten en el mercado (2013 p 7)

En el contexto educativo este fenoacutemeno no ha pasado desapercibido los y las

estudiantes de diferentes modelos educativos en el mundo utilizan estos dispositivos con

diferentes objetivos como gestioacuten administrativa comunicacioacuten y en procesos de

ensentildeanza-aprendizaje Seguacuten las Directrices para las poliacuteticas de aprendizaje moacutevil de la

Unesco se cree al respecto que

[hellip] las tecnologiacuteas moacuteviles pueden ampliar y enriquecer las oportunidades educativas

en distintos contextos Hay cada vez maacutes datos que indican que los omnipresentes

dispositivos moacuteviles en particular los teleacutefonos moacuteviles y maacutes recientemente las

tabletas son utilizados por educandos y docentes de todo el mundo para acceder a

informacioacuten simplificar la administracioacuten y facilitar el aprendizaje de una forma nueva e

innovadora (2013 p5)

En el caso particular de la UNED de Costa Rica seguacuten un estudio realizado en el antildeo

2014 por Salazar Berrocal Salas y Valerio en el que se consideroacute la respuesta de 877

estudiantes y 211 tutores representativos de las instancias acadeacutemicas de la universidad el

90 afirmoacute poseer un teleacutefono moacutevil de los cuales 633 son teleacutefonos inteligentes un 30

son tabletas y un 42 son reproductores de audio y video

A partir de dicha informacioacuten se generoacute una reflexioacuten respecto a la forma en que los

usuarios (especialmente estudiantes) pueden utilizar los materiales didaacutecticos ademaacutes de un

anaacutelisis en cuanto a la presentacioacuten de contenidos y reestructuracioacuten del proceso de

produccioacuten de quienes los llevan a cabo y es asiacute como el disentildeo adaptativo surge como una

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

11

posible respuesta a la necesidad de que dichos materiales esteacuten disponibles para

dispositivos moacuteviles con el propoacutesito de que estos no queden fuera del contexto actual

El disentildeador Manuel Rubio en su artiacuteculo iquestQueacute es Disentildeo Adaptativo lo define como

ldquo[hellip] una teacutecnica de disentildeo y desarrollo web que mediante el uso de estructuras e imaacutegenes

fluidas asiacute como de media-queries en las hojas de estilo CSS se consigue adaptar el sitio

web al dispositivo del usuariordquo (2013 paacuterr 1) Esta adaptacioacuten implica que la interfaz graacutefica

asiacute como los contenidos educativos desarrollados para un material didaacutectico de la

Universidad se ajustan seguacuten la resolucioacuten de la pantalla sin importar el tipo de dispositivo

desde el que se accede pero en ninguacuten caso (a menos que asiacute se contemple) significa el

sacrificio de contenido para cumplir tal propoacutesito Asiacute tanto la informacioacuten escrita apoyada de

imaacutegenes videos animaciones actividades entre otros recursos son adaptados

7 Eleccioacuten de disentildeo adaptativo

El disentildeo adaptativo es una metodologiacutea de disentildeo que permite una mayor

universalizacioacuten de los contenidos de un material en especiacutefico pero la eleccioacuten de este tipo

de disentildeo no debe recaer simplemente en la versatilidad de produccioacuten sino que su

implementacioacuten debe cumplir criterios de produccioacuten para que sea efectivo de lo contrario

seriacutea mejor optar por otro tipo de soluciones

Se debe procurar que la adaptacioacuten de los materiales sea tal que el usuario no tenga

problemas en determinar el cambio maacutexime cuando se trabaja en coordinacioacuten con otras

estrategias didaacutecticas Si bien es cierto el desarrollo de disentildeo adaptativo ahorra tiempo si

se le compara con la produccioacuten de una versioacuten seguacuten dispositivo se debe contemplar el

hecho de que la programacioacuten necesaria para elaborar un material de este tipo es compleja y

debe estar muy bien planificada

Aunque en la actualidad se habla de una mayor penetracioacuten de las tecnologiacuteas moacuteviles

en el mundo antes de implementarlo con un propoacutesito didaacutectico se debe revisar el nivel de

utilizacioacuten potencial que los usuarios del material hacen de sus dispositivos moacuteviles de

manera que se pueda valorar a futuro la idoneidad de la puesta en marcha de la

implementacioacuten de este tipo de disentildeo

8 Aportes y experiencias del PEM en la produccioacuten de multimedia educativo

El PEM ha desarrollado multimedias educativos desde su creacioacuten en el antildeo 2000 La

consigna de produccioacuten acadeacutemica es buscar e implementar en ellos la mejor combinacioacuten

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

12

posible de mediacioacuten de contenidos y uso de las TIC en beneficio del estudiantado a partir

de criterios pedagoacutegicos y de disentildeo En este mismo espiacuteritu de observar y analizar los

cambios que se dan a nivel educativo con respecto a las diferentes posibilidades

tecnoloacutegicas es que el PEM comenzoacute su incursioacuten en el uso del disentildeo adaptativo en la

produccioacuten de multimedia educativo a partir del uso de herramientas y disposiciones

conceptuales para obtener materiales didaacutecticos maacutes inclusivos

Cabe aclarar que el puacuteblico meta del PEM son los y las estudiantes de las diferentes

carreras impartidas en la Universidad usuarios que bien podriacutean presentar alguna condicioacuten

o necesidad especial de aprendizaje que obliga al programa a pensar en las distintas

posibilidades de acceso y uso de sus multimedias educativos

En lo referente a la implementacioacuten de los conceptos anteriormente definidos en la

produccioacuten de multimedia educativo cabe sentildealar que su uso depende del cumplimiento de

criterios de seleccioacuten entre ellos la pertinencia pedagoacutegica con respecto a los contenidos o

bien el uso de los dispositivos moacuteviles por parte del estudiantado

Hoy maacutes que nunca la portabilidad y el uso de variados dispositivos plantea

interrogantes importantes en cuanto a produccioacuten y disentildeo que se tratan de responder desde

la investigacioacuten experimentacioacuten implementacioacuten y posterior evaluacioacuten de la propuesta

Como ejemplo de lo anterior y en el marco de la incursioacuten de los diferentes conceptos

expuestos en este ensayo en el PEM se han elaborado dos materiales que marcaron el

inicio de la implementacioacuten de las metodologiacuteas abordadas

En el antildeo 2013 se produjo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica En

esta primera experiencia se presentoacute un multimedia educativo que sirve de apoyo al libro

Meacutetodos Numeacutericos para la Ensentildeanza publicado por la Editorial de la Universidad Estatal a

Distancia (EUNED) de Costa Rica y que se utiliza en el curso Meacutetodos Numeacutericos que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia El material

ofrece a la persona estudiante la solucioacuten de ejemplos por medio de software libre y gratuito

para la resolucioacuten de problemas y ejercicios en temas relacionados con la Teoriacutea del error

Meacutetodos de aproximacioacuten para soluciones de ecuaciones no lineales Aproximacioacuten

polinomial para valores de funciones y Aproximaciones en derivacioacuten e integracioacuten utilizando

diversas teacutecnicas y meacutetodos

La metaacutefora pedagoacutegica desarrollada se elaboroacute bajo el concepto de un mapa de

estrategia que propone cuatro escenarios que representan las aacutereas temaacuteticas mencionadas

La propuesta se seleccionoacute porque mantiene una estrecha relacioacuten con las aacutereas del

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

13

conocimiento expuestas y porque presenta similitud con los mapas estrateacutegicos utilizados

comuacutenmente en videojuegos de estrategia que son de gran aceptacioacuten y reconocimiento por

parte del puacuteblico meta del material A continuacioacuten se muestra la propuesta graacutefica de la

portada y los moacutedulos de contenido del material

Figura 1 Portada del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

14

Figura 2 Moacutedulos de contenido del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por esta razoacuten los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos del material estaacuten

concebidos de forma modular independientes y adaptables dispuestos en un plano

cartograacutefico que de igual manera se adapta seguacuten la resolucioacuten de pantalla del dispositivo

desde el que se accede

El disentildeo graacutefico del multimedia educativo se disentildeoacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual de esta justificada pedagoacutegicamente y

elaborada a partir de la composicioacuten equilibrada y agradable de imaacutegenes mapa de bits e

ilustraciones vectoriales inspiradas como se mencionoacute anteriormente en los videojuegos de

estrategia que utilizan isomeacutetricos para ambientar sus escenarios Este material cuenta con

algunos aportes del disentildeo universal aplicados en un contexto educativo como uso

equiparable flexible intuitivo y simple Se consideran ademaacutes aspectos importantes de

accesibilidad e inclusioacuten como la posibilidad de ampliar disminuir y restablecer el tamantildeo del

texto en el contenido

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

15

Esta primera experiencia sirvioacute como base para el establecimiento de ciertos criterios

de produccioacuten en este tipo de materiales didaacutecticos como contemplar la adaptabilidad del

material desde el inicio de la produccioacuten considerar en el disentildeo de la metaacutefora pedagoacutegica

aspectos que implica el disentildeo adaptativo la simplicidad en el disentildeo graacutefico que se debe

utilizar en la elaboracioacuten de la interfaz graacutefica y los diferentes recursos audiovisuales entre

otros

Con la intensioacuten de continuar la produccioacuten de multimedia educativo bajo las

metodologiacuteas desarrolladas y adoptadas en el PEM a partir de experiencias previas en el

antildeo 2015 se produjo Geometriacutea Eucliacutedea Esta segunda experiencia presenta un material

didaacutectico utilizado en los cursos de Geometriacutea Eucliacutedea y Construcciones geomeacutetricas que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia Fue producido

bajo el concepto de laboratorio virtual y se compone de cuatro laboratorios que le permiten al

estudiantado y futuro docente de la Universidad aprender a realizar construcciones

geomeacutetricas a partir de la teacutecnica de Regla y compaacutes Portasegmentos Doblado de papel y

Software matemaacutetico

La metaacutefora pedagoacutegica se elaboroacute en torno a un vivero se tomoacute en consideracioacuten el

trasfondo histoacuterico y teoacuterico de la geometriacutea su clara percepcioacuten en la naturaleza desde la

antiguumledad asiacute como la manifestacioacuten cotidiana de elementos geomeacutetricos que rodean al

ser humano por ejemplo los puntos los planos las liacuteneas rectas curvas entre otros A

continuacioacuten se muestra la propuesta graacutefica de la portada y los laboratorios virtuales del

material

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

16

Figura 3 Portada del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

Figura 4 Laboratorios virtuales del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por este motivo los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos multimedia estaacuten

concebidos de forma modular independientes escalables y adaptables presentados en

varios estantes de exhibicioacuten de plantas

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

17

El disentildeo graacutefico del multimedia educativo se elaboroacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual justificada pedagoacutegicamente y disentildeada

a partir de una composicioacuten equilibrada y agradable de ilustraciones vectoriales inspiradas

como se mencionoacute anteriormente en ambientes cotidianos de un vivero con el objetivo de

reforzar la temaacutetica general del material con el contexto en que se presentan los contenidos

De igual manera este recurso cuenta con algunos aportes del disentildeo universal como

su uso equiparable flexible informacioacuten perceptible y tolerancia al error aplicados en el

aacutembito educativo y que tambieacuten consideran aspectos importantes de accesibilidad e

inclusioacuten

Estos dos ejemplos de multimedia educativo producidos en el PEM aunados a

esfuerzos de investigacioacuten y capacitacioacuten a nivel interno del programa son los primeros

pasos hacia el desarrollo de nuevos materiales didaacutecticos maacutes accesibles e inclusivos como

el reciente desarrollo de los laboratorios virtuales para el aprendizaje que tienen como fin

seguir poniendo a disposicioacuten del estudiantado materiales de calidad que apoyen sus

procesos de aprendizaje a distancia y en congruencia con las nuevas posibilidades

tecnoloacutegicas especialmente de formato y medios de reproduccioacuten

9 Conclusiones

A partir de las experiencias generadas desde el PEM asiacute como de valoraciones

recibidas de otras instancias acadeacutemicas de la Universidad con las que se ha trabajado en

conjunto se presentan algunos factores a considerar a la hora de emprender una produccioacuten

de multimedia educativo que contemple algunos de los principios de disentildeo desarrollados

con anterioridad

El disentildeo adaptativo demanda una mayor reflexioacuten a la hora de planificar y concretar la

propuesta graacutefica y la disposicioacuten de contenidos porque se deben contemplar nuevos

escenarios y posibilidades en la visualizacioacuten de los multimedia educativos en tabletas y en

teleacutefonos inteligentes Eso no implica el sacrificio total o parcial de la graacutefica y los contenidos

dado que dichos elementos se vinculan entre siacute independientemente de la resolucioacuten de

pantalla del dispositivo Por lo anterior en los uacuteltimos 5 antildeos el programa ha estado

revisando perioacutedicamente los procesos de produccioacuten y flujos de trabajo con el propoacutesito de

responder a las necesidades actuales de contenidos maacutes accesibles e inclusivos

El disentildeo de la interfaz graacutefica debe conceptualizarse en una uacutenica propuesta simple

concreta escalable y adaptable para hacer maacutes eficiente su proceso de elaboracioacuten Este

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

18

cambio de paradigma obligoacute a replantear el flujo de trabajo en disentildeo ya que se pasoacute de

elaborar varias versiones de una interfaz seguacuten la resolucioacuten de pantalla del dispositivo a

concentrar los esfuerzos en una uacutenica propuesta centrada en los elementos y acciones maacutes

importantes de navegacioacuten lo cual contribuyoacute a mejorar tanto la experiencia como la

usabilidad del material pues todos sus elementos graacuteficos y de contenido se adaptan

El disentildeo universal aplicado en la interfaz converge con el disentildeo adaptativo en la

concrecioacuten de propuestas que evidencien accesibilidad e inclusioacuten en armoniacutea con la graacutefica

ya que los materiales estaacuten orientados a los y las estudiantes y de ellos depende el impacto

que puede tener lo que se disentildee Por lo anterior el disentildeo graacutefico es valorado desde una

perspectiva pedagoacutegica que permite generar empatiacutea y motivacioacuten para explorar los

contenidos Bajo esa premisa el PEM estaacute en constante investigacioacuten de nuevas

metodologiacuteas que contribuyan a mejorar la mediacioacuten de los contenidos asiacute como la

experiencia visual de la interfaz graacutefica de los materiales que desarrolla

Los multimedia educativos se deben producir en funcioacuten de las necesidades y

capacidades del estudiantado por lo tanto es necesario un mayor anaacutelisis del puacuteblico meta

con especial eacutenfasis en acceso y tipo de dispositivos asiacute como la forma en que los utilizan

para acceder a los materiales esto permitiraacute seleccionar los medios y elementos graacuteficos

que realmente contribuyan a la mediacioacuten de los contenidos

Es necesario ademaacutes mejorar los procesos de evaluacioacuten de los multimedia

educativos con el propoacutesito de saber si las metodologiacuteas de disentildeo y produccioacuten utilizadas

actualmente mejoran la accesibilidad e inclusioacuten de los materiales disponibles para el

estudiantado como apoyo en sus procesos de aprendizaje a distancia

Referencias

Burgstahler Sheryl (2007) Universal Design in Education Principles and Applications Recuperado de httpwwwwashingtonedudoitBrochuresAcademicsud_eduhtml

Diacuteaz Luis Fernando (2011) Principios sobre la metaacutefora pedagoacutegica Recuperado de

httpwwwluisfernandodiazcomp=105 Fornasari de Menegazzo Lilia (1994) Didaacutectica de la imagen Zaragoza Editorial Latina Fundacioacuten SIDAR (2007) Principios del disentildeo universal Recuperado de

httpwwwsidarorgrecurdesdiusabledudtphp Gilliam Scott Robert (1980) Fundamentos del disentildeo Buenos Aires Editorial U Leru

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

19

Gutieacuterrez Favio (2012) Principios fundamentales de la tipografiacutea Recuperado de httpwwwfaviogutierrezcomcategorytipografia

Mantildeas Moiseacutes (2011) Interfases Reglasteoacutericas Recuperado de

httppersonalesupvesmoimacarmasterdownloadinterfacespdf Misischia Bibiana (3 de setiembre de 2013) Supresioacuten de barreras en la universidad

Paacutegina12 Recuperado de httpwwwpagina12comardiariouniversidad10-228134-2013-09-03html

Morton Jill (2010) Why color matters Recuperado de

httpwwwcolorcomcomresearchwhy-color-matters Observatorio de la Accesibilidad (sf) Breve historia Recuperado de

httpwwwobservatoriodelaaccesibilidadesaccesibilidadbreve-historia Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura - Unesco

(2013) Directrices para las Poliacuteticas de Aprendizaje Moacutevil Recuperado de httpunesdocunescoorgimages0021002196219662Spdf

Rand Paul (2007) Design form and chaos Massachusetts Rockport Publishers Inc Real Academia Espantildeola (2001) Imagen En Diccionario de la lengua espantildeola (22ordf ed)

Recuperado de httpdleraeesid=KzwDY4y Rubio Manuel (1 de setiembre de 2013) iquestQueacute es Disentildeo Adaptativo Recuperado de

httpsmagazinejoomlaorgesediciones-anterioressept-2013item1514-que-es-diseno-adaptativo

Salazar Bejarano Ana Gabriela Berrocal Carvajal Viviana Salas Campos lleana y Valerio

Aacutelvarez Cinthya (2014) Propuesta para el desarrollo de una aplicacioacuten para la gestioacuten administrativa en la UNED Costa Rica Revista Innovaciones Educativas 16(21) 1-11

Shneiderman Ben (1998) Designing the user interface Strategies for effective human-

computer interaction Massachusetts Addison-Wesley Pub Co Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfa) Geometriacutea Euclidea Recuperado de httprepositoriounedaccrmultimediasgeometria_euclideaindexhtml

Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb) Meacutetodos numeacutericos para la ensentildeanza Recuperado de httprepositoriounedaccrmultimediasmetodos_numericos_ensenanza

Velasco Santos Perla Laureano Cruces Ana Lilia Mora Torres Marta y Herrera Bautista

Miguel Aacutengel (octubre 2010) Disentildeo de agentes pedagoacutegicos a partir de los estilos de aprendizaje una perspectiva a traveacutes del color Ponencia presentada en el IV Congreso Mundial de Estilos de Aprendizaje Recuperado de httpkaliazcuammxclc02_publicacionesmaterialDiseC3B1o_de_AvataresPerspColor_10pdf

Page 10: El diseño universal en la interfaz gráfica de multimedia ... · El diseño universal en la interfaz gráfica de multimedia educativo ... aporte de otras metodologías como el diseño

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

9

1) Esforzarse para conseguir consistencia exigir secuencias de acciones consistentes

utilizar terminologiacutea coherente en los mensajes menuacutes y pantallas de ayuda emplear

de forma consistente el color la composicioacuten las mayuacutesculas las fuentes y otros

elementos similares Las excepciones como la necesaria confirmacioacuten de la orden de

borrado o no mostrar los caracteres de las contrasentildeas deberiacutean ser comprensibles y

limitadas en nuacutemero

2) Atender la usabilidad universal reconocer las necesidades de los diversos usuarios

asiacute como las diferencias entre ellos (principiante o experto edades discapacidades y

diversidad tecnoloacutegica) para facilitar la transformacioacuten del contenido

3) Ofrecer realimentacioacuten informativa incluir para cada accioacuten del sistema una

realimentacioacuten por parte del sistema

4) Disentildear diaacutelogos para conducir a la finalizacioacuten crear sistemas claros de

conduccioacuten hasta el final del proceso de las secuencias de accioacuten del usuario

5) Prevenir errores disentildear el sistema de forma que los usuarios no puedan cometer

errores serios

6) Permitir deshacer acciones de forma faacutecil tener la posibilidad de remediar acciones

erroacuteneas por lo tanto construir un sistema reversible Este sistema suaviza la

ansiedad que se puede producir en el usuario

7) Dar soporte al control interno ofrecer a los operadores experimentados la sensacioacuten

de controlar la interfaz y que esta responde a sus acciones Las acciones

sorprendentes por parte de la interfaz las secuencias de entrada de datos tediosas la

incapacidad o dificultad para obtener la informacioacuten necesaria y la incapacidad para

producir acciones deseadas crean ansiedad e insatisfaccioacuten

8) Reducir la carga de la memoria a corto plazo disentildear sistemas de visualizacioacuten

simples que la frecuencia de movimiento de ventana se reduzca y que se asigne

suficiente tiempo de entrenamiento para coacutedigos y secuencias de acciones

Como consecuencia un buen disentildeo de interfaz graacutefica no solo se centra en la parte

visual su esteacutetica y la composicioacuten sino tambieacuten en el desarrollo de su interaccioacuten a traveacutes

de las reglas anteriormente mencionadas Ambos aspectos se complementan ya que en

gran medida determinan la buena experiencia de uso por parte del usuario

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

10

6 Disentildeo adaptativo

Sin duda alguna el siglo XXI se ha caracterizado por el uso cada vez maacutes frecuente y

cotidiano de dispositivos moacuteviles como tabletas teleacutefonos inteligentes y computadoras

portaacutetiles entre otros Seguacuten las Directrices para las poliacuteticas de aprendizaje moacutevil de la

Unesco (Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura)

Hay en el mundo maacutes de 3200 millones de usuarios registrados con teleacutefonos moacuteviles

lo que hace de estos dispositivos la modalidad de TIC maacutes utilizada en la Tierra En los

paiacuteses desarrollados 4 de cada 5 personas poseen y utilizan un teleacutefono moacutevil y

aunque la tasa es significativamente maacutes baja que en los paiacuteses en desarrollo (2 de

cada 5) es en estos paiacuteses donde se registra el crecimiento maacutes raacutepido en cuanto a

iacutendice de penetracioacuten en el mercado (2013 p 7)

En el contexto educativo este fenoacutemeno no ha pasado desapercibido los y las

estudiantes de diferentes modelos educativos en el mundo utilizan estos dispositivos con

diferentes objetivos como gestioacuten administrativa comunicacioacuten y en procesos de

ensentildeanza-aprendizaje Seguacuten las Directrices para las poliacuteticas de aprendizaje moacutevil de la

Unesco se cree al respecto que

[hellip] las tecnologiacuteas moacuteviles pueden ampliar y enriquecer las oportunidades educativas

en distintos contextos Hay cada vez maacutes datos que indican que los omnipresentes

dispositivos moacuteviles en particular los teleacutefonos moacuteviles y maacutes recientemente las

tabletas son utilizados por educandos y docentes de todo el mundo para acceder a

informacioacuten simplificar la administracioacuten y facilitar el aprendizaje de una forma nueva e

innovadora (2013 p5)

En el caso particular de la UNED de Costa Rica seguacuten un estudio realizado en el antildeo

2014 por Salazar Berrocal Salas y Valerio en el que se consideroacute la respuesta de 877

estudiantes y 211 tutores representativos de las instancias acadeacutemicas de la universidad el

90 afirmoacute poseer un teleacutefono moacutevil de los cuales 633 son teleacutefonos inteligentes un 30

son tabletas y un 42 son reproductores de audio y video

A partir de dicha informacioacuten se generoacute una reflexioacuten respecto a la forma en que los

usuarios (especialmente estudiantes) pueden utilizar los materiales didaacutecticos ademaacutes de un

anaacutelisis en cuanto a la presentacioacuten de contenidos y reestructuracioacuten del proceso de

produccioacuten de quienes los llevan a cabo y es asiacute como el disentildeo adaptativo surge como una

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

11

posible respuesta a la necesidad de que dichos materiales esteacuten disponibles para

dispositivos moacuteviles con el propoacutesito de que estos no queden fuera del contexto actual

El disentildeador Manuel Rubio en su artiacuteculo iquestQueacute es Disentildeo Adaptativo lo define como

ldquo[hellip] una teacutecnica de disentildeo y desarrollo web que mediante el uso de estructuras e imaacutegenes

fluidas asiacute como de media-queries en las hojas de estilo CSS se consigue adaptar el sitio

web al dispositivo del usuariordquo (2013 paacuterr 1) Esta adaptacioacuten implica que la interfaz graacutefica

asiacute como los contenidos educativos desarrollados para un material didaacutectico de la

Universidad se ajustan seguacuten la resolucioacuten de la pantalla sin importar el tipo de dispositivo

desde el que se accede pero en ninguacuten caso (a menos que asiacute se contemple) significa el

sacrificio de contenido para cumplir tal propoacutesito Asiacute tanto la informacioacuten escrita apoyada de

imaacutegenes videos animaciones actividades entre otros recursos son adaptados

7 Eleccioacuten de disentildeo adaptativo

El disentildeo adaptativo es una metodologiacutea de disentildeo que permite una mayor

universalizacioacuten de los contenidos de un material en especiacutefico pero la eleccioacuten de este tipo

de disentildeo no debe recaer simplemente en la versatilidad de produccioacuten sino que su

implementacioacuten debe cumplir criterios de produccioacuten para que sea efectivo de lo contrario

seriacutea mejor optar por otro tipo de soluciones

Se debe procurar que la adaptacioacuten de los materiales sea tal que el usuario no tenga

problemas en determinar el cambio maacutexime cuando se trabaja en coordinacioacuten con otras

estrategias didaacutecticas Si bien es cierto el desarrollo de disentildeo adaptativo ahorra tiempo si

se le compara con la produccioacuten de una versioacuten seguacuten dispositivo se debe contemplar el

hecho de que la programacioacuten necesaria para elaborar un material de este tipo es compleja y

debe estar muy bien planificada

Aunque en la actualidad se habla de una mayor penetracioacuten de las tecnologiacuteas moacuteviles

en el mundo antes de implementarlo con un propoacutesito didaacutectico se debe revisar el nivel de

utilizacioacuten potencial que los usuarios del material hacen de sus dispositivos moacuteviles de

manera que se pueda valorar a futuro la idoneidad de la puesta en marcha de la

implementacioacuten de este tipo de disentildeo

8 Aportes y experiencias del PEM en la produccioacuten de multimedia educativo

El PEM ha desarrollado multimedias educativos desde su creacioacuten en el antildeo 2000 La

consigna de produccioacuten acadeacutemica es buscar e implementar en ellos la mejor combinacioacuten

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

12

posible de mediacioacuten de contenidos y uso de las TIC en beneficio del estudiantado a partir

de criterios pedagoacutegicos y de disentildeo En este mismo espiacuteritu de observar y analizar los

cambios que se dan a nivel educativo con respecto a las diferentes posibilidades

tecnoloacutegicas es que el PEM comenzoacute su incursioacuten en el uso del disentildeo adaptativo en la

produccioacuten de multimedia educativo a partir del uso de herramientas y disposiciones

conceptuales para obtener materiales didaacutecticos maacutes inclusivos

Cabe aclarar que el puacuteblico meta del PEM son los y las estudiantes de las diferentes

carreras impartidas en la Universidad usuarios que bien podriacutean presentar alguna condicioacuten

o necesidad especial de aprendizaje que obliga al programa a pensar en las distintas

posibilidades de acceso y uso de sus multimedias educativos

En lo referente a la implementacioacuten de los conceptos anteriormente definidos en la

produccioacuten de multimedia educativo cabe sentildealar que su uso depende del cumplimiento de

criterios de seleccioacuten entre ellos la pertinencia pedagoacutegica con respecto a los contenidos o

bien el uso de los dispositivos moacuteviles por parte del estudiantado

Hoy maacutes que nunca la portabilidad y el uso de variados dispositivos plantea

interrogantes importantes en cuanto a produccioacuten y disentildeo que se tratan de responder desde

la investigacioacuten experimentacioacuten implementacioacuten y posterior evaluacioacuten de la propuesta

Como ejemplo de lo anterior y en el marco de la incursioacuten de los diferentes conceptos

expuestos en este ensayo en el PEM se han elaborado dos materiales que marcaron el

inicio de la implementacioacuten de las metodologiacuteas abordadas

En el antildeo 2013 se produjo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica En

esta primera experiencia se presentoacute un multimedia educativo que sirve de apoyo al libro

Meacutetodos Numeacutericos para la Ensentildeanza publicado por la Editorial de la Universidad Estatal a

Distancia (EUNED) de Costa Rica y que se utiliza en el curso Meacutetodos Numeacutericos que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia El material

ofrece a la persona estudiante la solucioacuten de ejemplos por medio de software libre y gratuito

para la resolucioacuten de problemas y ejercicios en temas relacionados con la Teoriacutea del error

Meacutetodos de aproximacioacuten para soluciones de ecuaciones no lineales Aproximacioacuten

polinomial para valores de funciones y Aproximaciones en derivacioacuten e integracioacuten utilizando

diversas teacutecnicas y meacutetodos

La metaacutefora pedagoacutegica desarrollada se elaboroacute bajo el concepto de un mapa de

estrategia que propone cuatro escenarios que representan las aacutereas temaacuteticas mencionadas

La propuesta se seleccionoacute porque mantiene una estrecha relacioacuten con las aacutereas del

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

13

conocimiento expuestas y porque presenta similitud con los mapas estrateacutegicos utilizados

comuacutenmente en videojuegos de estrategia que son de gran aceptacioacuten y reconocimiento por

parte del puacuteblico meta del material A continuacioacuten se muestra la propuesta graacutefica de la

portada y los moacutedulos de contenido del material

Figura 1 Portada del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

14

Figura 2 Moacutedulos de contenido del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por esta razoacuten los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos del material estaacuten

concebidos de forma modular independientes y adaptables dispuestos en un plano

cartograacutefico que de igual manera se adapta seguacuten la resolucioacuten de pantalla del dispositivo

desde el que se accede

El disentildeo graacutefico del multimedia educativo se disentildeoacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual de esta justificada pedagoacutegicamente y

elaborada a partir de la composicioacuten equilibrada y agradable de imaacutegenes mapa de bits e

ilustraciones vectoriales inspiradas como se mencionoacute anteriormente en los videojuegos de

estrategia que utilizan isomeacutetricos para ambientar sus escenarios Este material cuenta con

algunos aportes del disentildeo universal aplicados en un contexto educativo como uso

equiparable flexible intuitivo y simple Se consideran ademaacutes aspectos importantes de

accesibilidad e inclusioacuten como la posibilidad de ampliar disminuir y restablecer el tamantildeo del

texto en el contenido

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

15

Esta primera experiencia sirvioacute como base para el establecimiento de ciertos criterios

de produccioacuten en este tipo de materiales didaacutecticos como contemplar la adaptabilidad del

material desde el inicio de la produccioacuten considerar en el disentildeo de la metaacutefora pedagoacutegica

aspectos que implica el disentildeo adaptativo la simplicidad en el disentildeo graacutefico que se debe

utilizar en la elaboracioacuten de la interfaz graacutefica y los diferentes recursos audiovisuales entre

otros

Con la intensioacuten de continuar la produccioacuten de multimedia educativo bajo las

metodologiacuteas desarrolladas y adoptadas en el PEM a partir de experiencias previas en el

antildeo 2015 se produjo Geometriacutea Eucliacutedea Esta segunda experiencia presenta un material

didaacutectico utilizado en los cursos de Geometriacutea Eucliacutedea y Construcciones geomeacutetricas que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia Fue producido

bajo el concepto de laboratorio virtual y se compone de cuatro laboratorios que le permiten al

estudiantado y futuro docente de la Universidad aprender a realizar construcciones

geomeacutetricas a partir de la teacutecnica de Regla y compaacutes Portasegmentos Doblado de papel y

Software matemaacutetico

La metaacutefora pedagoacutegica se elaboroacute en torno a un vivero se tomoacute en consideracioacuten el

trasfondo histoacuterico y teoacuterico de la geometriacutea su clara percepcioacuten en la naturaleza desde la

antiguumledad asiacute como la manifestacioacuten cotidiana de elementos geomeacutetricos que rodean al

ser humano por ejemplo los puntos los planos las liacuteneas rectas curvas entre otros A

continuacioacuten se muestra la propuesta graacutefica de la portada y los laboratorios virtuales del

material

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

16

Figura 3 Portada del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

Figura 4 Laboratorios virtuales del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por este motivo los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos multimedia estaacuten

concebidos de forma modular independientes escalables y adaptables presentados en

varios estantes de exhibicioacuten de plantas

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

17

El disentildeo graacutefico del multimedia educativo se elaboroacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual justificada pedagoacutegicamente y disentildeada

a partir de una composicioacuten equilibrada y agradable de ilustraciones vectoriales inspiradas

como se mencionoacute anteriormente en ambientes cotidianos de un vivero con el objetivo de

reforzar la temaacutetica general del material con el contexto en que se presentan los contenidos

De igual manera este recurso cuenta con algunos aportes del disentildeo universal como

su uso equiparable flexible informacioacuten perceptible y tolerancia al error aplicados en el

aacutembito educativo y que tambieacuten consideran aspectos importantes de accesibilidad e

inclusioacuten

Estos dos ejemplos de multimedia educativo producidos en el PEM aunados a

esfuerzos de investigacioacuten y capacitacioacuten a nivel interno del programa son los primeros

pasos hacia el desarrollo de nuevos materiales didaacutecticos maacutes accesibles e inclusivos como

el reciente desarrollo de los laboratorios virtuales para el aprendizaje que tienen como fin

seguir poniendo a disposicioacuten del estudiantado materiales de calidad que apoyen sus

procesos de aprendizaje a distancia y en congruencia con las nuevas posibilidades

tecnoloacutegicas especialmente de formato y medios de reproduccioacuten

9 Conclusiones

A partir de las experiencias generadas desde el PEM asiacute como de valoraciones

recibidas de otras instancias acadeacutemicas de la Universidad con las que se ha trabajado en

conjunto se presentan algunos factores a considerar a la hora de emprender una produccioacuten

de multimedia educativo que contemple algunos de los principios de disentildeo desarrollados

con anterioridad

El disentildeo adaptativo demanda una mayor reflexioacuten a la hora de planificar y concretar la

propuesta graacutefica y la disposicioacuten de contenidos porque se deben contemplar nuevos

escenarios y posibilidades en la visualizacioacuten de los multimedia educativos en tabletas y en

teleacutefonos inteligentes Eso no implica el sacrificio total o parcial de la graacutefica y los contenidos

dado que dichos elementos se vinculan entre siacute independientemente de la resolucioacuten de

pantalla del dispositivo Por lo anterior en los uacuteltimos 5 antildeos el programa ha estado

revisando perioacutedicamente los procesos de produccioacuten y flujos de trabajo con el propoacutesito de

responder a las necesidades actuales de contenidos maacutes accesibles e inclusivos

El disentildeo de la interfaz graacutefica debe conceptualizarse en una uacutenica propuesta simple

concreta escalable y adaptable para hacer maacutes eficiente su proceso de elaboracioacuten Este

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

18

cambio de paradigma obligoacute a replantear el flujo de trabajo en disentildeo ya que se pasoacute de

elaborar varias versiones de una interfaz seguacuten la resolucioacuten de pantalla del dispositivo a

concentrar los esfuerzos en una uacutenica propuesta centrada en los elementos y acciones maacutes

importantes de navegacioacuten lo cual contribuyoacute a mejorar tanto la experiencia como la

usabilidad del material pues todos sus elementos graacuteficos y de contenido se adaptan

El disentildeo universal aplicado en la interfaz converge con el disentildeo adaptativo en la

concrecioacuten de propuestas que evidencien accesibilidad e inclusioacuten en armoniacutea con la graacutefica

ya que los materiales estaacuten orientados a los y las estudiantes y de ellos depende el impacto

que puede tener lo que se disentildee Por lo anterior el disentildeo graacutefico es valorado desde una

perspectiva pedagoacutegica que permite generar empatiacutea y motivacioacuten para explorar los

contenidos Bajo esa premisa el PEM estaacute en constante investigacioacuten de nuevas

metodologiacuteas que contribuyan a mejorar la mediacioacuten de los contenidos asiacute como la

experiencia visual de la interfaz graacutefica de los materiales que desarrolla

Los multimedia educativos se deben producir en funcioacuten de las necesidades y

capacidades del estudiantado por lo tanto es necesario un mayor anaacutelisis del puacuteblico meta

con especial eacutenfasis en acceso y tipo de dispositivos asiacute como la forma en que los utilizan

para acceder a los materiales esto permitiraacute seleccionar los medios y elementos graacuteficos

que realmente contribuyan a la mediacioacuten de los contenidos

Es necesario ademaacutes mejorar los procesos de evaluacioacuten de los multimedia

educativos con el propoacutesito de saber si las metodologiacuteas de disentildeo y produccioacuten utilizadas

actualmente mejoran la accesibilidad e inclusioacuten de los materiales disponibles para el

estudiantado como apoyo en sus procesos de aprendizaje a distancia

Referencias

Burgstahler Sheryl (2007) Universal Design in Education Principles and Applications Recuperado de httpwwwwashingtonedudoitBrochuresAcademicsud_eduhtml

Diacuteaz Luis Fernando (2011) Principios sobre la metaacutefora pedagoacutegica Recuperado de

httpwwwluisfernandodiazcomp=105 Fornasari de Menegazzo Lilia (1994) Didaacutectica de la imagen Zaragoza Editorial Latina Fundacioacuten SIDAR (2007) Principios del disentildeo universal Recuperado de

httpwwwsidarorgrecurdesdiusabledudtphp Gilliam Scott Robert (1980) Fundamentos del disentildeo Buenos Aires Editorial U Leru

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

19

Gutieacuterrez Favio (2012) Principios fundamentales de la tipografiacutea Recuperado de httpwwwfaviogutierrezcomcategorytipografia

Mantildeas Moiseacutes (2011) Interfases Reglasteoacutericas Recuperado de

httppersonalesupvesmoimacarmasterdownloadinterfacespdf Misischia Bibiana (3 de setiembre de 2013) Supresioacuten de barreras en la universidad

Paacutegina12 Recuperado de httpwwwpagina12comardiariouniversidad10-228134-2013-09-03html

Morton Jill (2010) Why color matters Recuperado de

httpwwwcolorcomcomresearchwhy-color-matters Observatorio de la Accesibilidad (sf) Breve historia Recuperado de

httpwwwobservatoriodelaaccesibilidadesaccesibilidadbreve-historia Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura - Unesco

(2013) Directrices para las Poliacuteticas de Aprendizaje Moacutevil Recuperado de httpunesdocunescoorgimages0021002196219662Spdf

Rand Paul (2007) Design form and chaos Massachusetts Rockport Publishers Inc Real Academia Espantildeola (2001) Imagen En Diccionario de la lengua espantildeola (22ordf ed)

Recuperado de httpdleraeesid=KzwDY4y Rubio Manuel (1 de setiembre de 2013) iquestQueacute es Disentildeo Adaptativo Recuperado de

httpsmagazinejoomlaorgesediciones-anterioressept-2013item1514-que-es-diseno-adaptativo

Salazar Bejarano Ana Gabriela Berrocal Carvajal Viviana Salas Campos lleana y Valerio

Aacutelvarez Cinthya (2014) Propuesta para el desarrollo de una aplicacioacuten para la gestioacuten administrativa en la UNED Costa Rica Revista Innovaciones Educativas 16(21) 1-11

Shneiderman Ben (1998) Designing the user interface Strategies for effective human-

computer interaction Massachusetts Addison-Wesley Pub Co Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfa) Geometriacutea Euclidea Recuperado de httprepositoriounedaccrmultimediasgeometria_euclideaindexhtml

Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb) Meacutetodos numeacutericos para la ensentildeanza Recuperado de httprepositoriounedaccrmultimediasmetodos_numericos_ensenanza

Velasco Santos Perla Laureano Cruces Ana Lilia Mora Torres Marta y Herrera Bautista

Miguel Aacutengel (octubre 2010) Disentildeo de agentes pedagoacutegicos a partir de los estilos de aprendizaje una perspectiva a traveacutes del color Ponencia presentada en el IV Congreso Mundial de Estilos de Aprendizaje Recuperado de httpkaliazcuammxclc02_publicacionesmaterialDiseC3B1o_de_AvataresPerspColor_10pdf

Page 11: El diseño universal en la interfaz gráfica de multimedia ... · El diseño universal en la interfaz gráfica de multimedia educativo ... aporte de otras metodologías como el diseño

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

10

6 Disentildeo adaptativo

Sin duda alguna el siglo XXI se ha caracterizado por el uso cada vez maacutes frecuente y

cotidiano de dispositivos moacuteviles como tabletas teleacutefonos inteligentes y computadoras

portaacutetiles entre otros Seguacuten las Directrices para las poliacuteticas de aprendizaje moacutevil de la

Unesco (Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura)

Hay en el mundo maacutes de 3200 millones de usuarios registrados con teleacutefonos moacuteviles

lo que hace de estos dispositivos la modalidad de TIC maacutes utilizada en la Tierra En los

paiacuteses desarrollados 4 de cada 5 personas poseen y utilizan un teleacutefono moacutevil y

aunque la tasa es significativamente maacutes baja que en los paiacuteses en desarrollo (2 de

cada 5) es en estos paiacuteses donde se registra el crecimiento maacutes raacutepido en cuanto a

iacutendice de penetracioacuten en el mercado (2013 p 7)

En el contexto educativo este fenoacutemeno no ha pasado desapercibido los y las

estudiantes de diferentes modelos educativos en el mundo utilizan estos dispositivos con

diferentes objetivos como gestioacuten administrativa comunicacioacuten y en procesos de

ensentildeanza-aprendizaje Seguacuten las Directrices para las poliacuteticas de aprendizaje moacutevil de la

Unesco se cree al respecto que

[hellip] las tecnologiacuteas moacuteviles pueden ampliar y enriquecer las oportunidades educativas

en distintos contextos Hay cada vez maacutes datos que indican que los omnipresentes

dispositivos moacuteviles en particular los teleacutefonos moacuteviles y maacutes recientemente las

tabletas son utilizados por educandos y docentes de todo el mundo para acceder a

informacioacuten simplificar la administracioacuten y facilitar el aprendizaje de una forma nueva e

innovadora (2013 p5)

En el caso particular de la UNED de Costa Rica seguacuten un estudio realizado en el antildeo

2014 por Salazar Berrocal Salas y Valerio en el que se consideroacute la respuesta de 877

estudiantes y 211 tutores representativos de las instancias acadeacutemicas de la universidad el

90 afirmoacute poseer un teleacutefono moacutevil de los cuales 633 son teleacutefonos inteligentes un 30

son tabletas y un 42 son reproductores de audio y video

A partir de dicha informacioacuten se generoacute una reflexioacuten respecto a la forma en que los

usuarios (especialmente estudiantes) pueden utilizar los materiales didaacutecticos ademaacutes de un

anaacutelisis en cuanto a la presentacioacuten de contenidos y reestructuracioacuten del proceso de

produccioacuten de quienes los llevan a cabo y es asiacute como el disentildeo adaptativo surge como una

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

11

posible respuesta a la necesidad de que dichos materiales esteacuten disponibles para

dispositivos moacuteviles con el propoacutesito de que estos no queden fuera del contexto actual

El disentildeador Manuel Rubio en su artiacuteculo iquestQueacute es Disentildeo Adaptativo lo define como

ldquo[hellip] una teacutecnica de disentildeo y desarrollo web que mediante el uso de estructuras e imaacutegenes

fluidas asiacute como de media-queries en las hojas de estilo CSS se consigue adaptar el sitio

web al dispositivo del usuariordquo (2013 paacuterr 1) Esta adaptacioacuten implica que la interfaz graacutefica

asiacute como los contenidos educativos desarrollados para un material didaacutectico de la

Universidad se ajustan seguacuten la resolucioacuten de la pantalla sin importar el tipo de dispositivo

desde el que se accede pero en ninguacuten caso (a menos que asiacute se contemple) significa el

sacrificio de contenido para cumplir tal propoacutesito Asiacute tanto la informacioacuten escrita apoyada de

imaacutegenes videos animaciones actividades entre otros recursos son adaptados

7 Eleccioacuten de disentildeo adaptativo

El disentildeo adaptativo es una metodologiacutea de disentildeo que permite una mayor

universalizacioacuten de los contenidos de un material en especiacutefico pero la eleccioacuten de este tipo

de disentildeo no debe recaer simplemente en la versatilidad de produccioacuten sino que su

implementacioacuten debe cumplir criterios de produccioacuten para que sea efectivo de lo contrario

seriacutea mejor optar por otro tipo de soluciones

Se debe procurar que la adaptacioacuten de los materiales sea tal que el usuario no tenga

problemas en determinar el cambio maacutexime cuando se trabaja en coordinacioacuten con otras

estrategias didaacutecticas Si bien es cierto el desarrollo de disentildeo adaptativo ahorra tiempo si

se le compara con la produccioacuten de una versioacuten seguacuten dispositivo se debe contemplar el

hecho de que la programacioacuten necesaria para elaborar un material de este tipo es compleja y

debe estar muy bien planificada

Aunque en la actualidad se habla de una mayor penetracioacuten de las tecnologiacuteas moacuteviles

en el mundo antes de implementarlo con un propoacutesito didaacutectico se debe revisar el nivel de

utilizacioacuten potencial que los usuarios del material hacen de sus dispositivos moacuteviles de

manera que se pueda valorar a futuro la idoneidad de la puesta en marcha de la

implementacioacuten de este tipo de disentildeo

8 Aportes y experiencias del PEM en la produccioacuten de multimedia educativo

El PEM ha desarrollado multimedias educativos desde su creacioacuten en el antildeo 2000 La

consigna de produccioacuten acadeacutemica es buscar e implementar en ellos la mejor combinacioacuten

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

12

posible de mediacioacuten de contenidos y uso de las TIC en beneficio del estudiantado a partir

de criterios pedagoacutegicos y de disentildeo En este mismo espiacuteritu de observar y analizar los

cambios que se dan a nivel educativo con respecto a las diferentes posibilidades

tecnoloacutegicas es que el PEM comenzoacute su incursioacuten en el uso del disentildeo adaptativo en la

produccioacuten de multimedia educativo a partir del uso de herramientas y disposiciones

conceptuales para obtener materiales didaacutecticos maacutes inclusivos

Cabe aclarar que el puacuteblico meta del PEM son los y las estudiantes de las diferentes

carreras impartidas en la Universidad usuarios que bien podriacutean presentar alguna condicioacuten

o necesidad especial de aprendizaje que obliga al programa a pensar en las distintas

posibilidades de acceso y uso de sus multimedias educativos

En lo referente a la implementacioacuten de los conceptos anteriormente definidos en la

produccioacuten de multimedia educativo cabe sentildealar que su uso depende del cumplimiento de

criterios de seleccioacuten entre ellos la pertinencia pedagoacutegica con respecto a los contenidos o

bien el uso de los dispositivos moacuteviles por parte del estudiantado

Hoy maacutes que nunca la portabilidad y el uso de variados dispositivos plantea

interrogantes importantes en cuanto a produccioacuten y disentildeo que se tratan de responder desde

la investigacioacuten experimentacioacuten implementacioacuten y posterior evaluacioacuten de la propuesta

Como ejemplo de lo anterior y en el marco de la incursioacuten de los diferentes conceptos

expuestos en este ensayo en el PEM se han elaborado dos materiales que marcaron el

inicio de la implementacioacuten de las metodologiacuteas abordadas

En el antildeo 2013 se produjo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica En

esta primera experiencia se presentoacute un multimedia educativo que sirve de apoyo al libro

Meacutetodos Numeacutericos para la Ensentildeanza publicado por la Editorial de la Universidad Estatal a

Distancia (EUNED) de Costa Rica y que se utiliza en el curso Meacutetodos Numeacutericos que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia El material

ofrece a la persona estudiante la solucioacuten de ejemplos por medio de software libre y gratuito

para la resolucioacuten de problemas y ejercicios en temas relacionados con la Teoriacutea del error

Meacutetodos de aproximacioacuten para soluciones de ecuaciones no lineales Aproximacioacuten

polinomial para valores de funciones y Aproximaciones en derivacioacuten e integracioacuten utilizando

diversas teacutecnicas y meacutetodos

La metaacutefora pedagoacutegica desarrollada se elaboroacute bajo el concepto de un mapa de

estrategia que propone cuatro escenarios que representan las aacutereas temaacuteticas mencionadas

La propuesta se seleccionoacute porque mantiene una estrecha relacioacuten con las aacutereas del

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

13

conocimiento expuestas y porque presenta similitud con los mapas estrateacutegicos utilizados

comuacutenmente en videojuegos de estrategia que son de gran aceptacioacuten y reconocimiento por

parte del puacuteblico meta del material A continuacioacuten se muestra la propuesta graacutefica de la

portada y los moacutedulos de contenido del material

Figura 1 Portada del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

14

Figura 2 Moacutedulos de contenido del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por esta razoacuten los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos del material estaacuten

concebidos de forma modular independientes y adaptables dispuestos en un plano

cartograacutefico que de igual manera se adapta seguacuten la resolucioacuten de pantalla del dispositivo

desde el que se accede

El disentildeo graacutefico del multimedia educativo se disentildeoacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual de esta justificada pedagoacutegicamente y

elaborada a partir de la composicioacuten equilibrada y agradable de imaacutegenes mapa de bits e

ilustraciones vectoriales inspiradas como se mencionoacute anteriormente en los videojuegos de

estrategia que utilizan isomeacutetricos para ambientar sus escenarios Este material cuenta con

algunos aportes del disentildeo universal aplicados en un contexto educativo como uso

equiparable flexible intuitivo y simple Se consideran ademaacutes aspectos importantes de

accesibilidad e inclusioacuten como la posibilidad de ampliar disminuir y restablecer el tamantildeo del

texto en el contenido

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

15

Esta primera experiencia sirvioacute como base para el establecimiento de ciertos criterios

de produccioacuten en este tipo de materiales didaacutecticos como contemplar la adaptabilidad del

material desde el inicio de la produccioacuten considerar en el disentildeo de la metaacutefora pedagoacutegica

aspectos que implica el disentildeo adaptativo la simplicidad en el disentildeo graacutefico que se debe

utilizar en la elaboracioacuten de la interfaz graacutefica y los diferentes recursos audiovisuales entre

otros

Con la intensioacuten de continuar la produccioacuten de multimedia educativo bajo las

metodologiacuteas desarrolladas y adoptadas en el PEM a partir de experiencias previas en el

antildeo 2015 se produjo Geometriacutea Eucliacutedea Esta segunda experiencia presenta un material

didaacutectico utilizado en los cursos de Geometriacutea Eucliacutedea y Construcciones geomeacutetricas que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia Fue producido

bajo el concepto de laboratorio virtual y se compone de cuatro laboratorios que le permiten al

estudiantado y futuro docente de la Universidad aprender a realizar construcciones

geomeacutetricas a partir de la teacutecnica de Regla y compaacutes Portasegmentos Doblado de papel y

Software matemaacutetico

La metaacutefora pedagoacutegica se elaboroacute en torno a un vivero se tomoacute en consideracioacuten el

trasfondo histoacuterico y teoacuterico de la geometriacutea su clara percepcioacuten en la naturaleza desde la

antiguumledad asiacute como la manifestacioacuten cotidiana de elementos geomeacutetricos que rodean al

ser humano por ejemplo los puntos los planos las liacuteneas rectas curvas entre otros A

continuacioacuten se muestra la propuesta graacutefica de la portada y los laboratorios virtuales del

material

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

16

Figura 3 Portada del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

Figura 4 Laboratorios virtuales del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por este motivo los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos multimedia estaacuten

concebidos de forma modular independientes escalables y adaptables presentados en

varios estantes de exhibicioacuten de plantas

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

17

El disentildeo graacutefico del multimedia educativo se elaboroacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual justificada pedagoacutegicamente y disentildeada

a partir de una composicioacuten equilibrada y agradable de ilustraciones vectoriales inspiradas

como se mencionoacute anteriormente en ambientes cotidianos de un vivero con el objetivo de

reforzar la temaacutetica general del material con el contexto en que se presentan los contenidos

De igual manera este recurso cuenta con algunos aportes del disentildeo universal como

su uso equiparable flexible informacioacuten perceptible y tolerancia al error aplicados en el

aacutembito educativo y que tambieacuten consideran aspectos importantes de accesibilidad e

inclusioacuten

Estos dos ejemplos de multimedia educativo producidos en el PEM aunados a

esfuerzos de investigacioacuten y capacitacioacuten a nivel interno del programa son los primeros

pasos hacia el desarrollo de nuevos materiales didaacutecticos maacutes accesibles e inclusivos como

el reciente desarrollo de los laboratorios virtuales para el aprendizaje que tienen como fin

seguir poniendo a disposicioacuten del estudiantado materiales de calidad que apoyen sus

procesos de aprendizaje a distancia y en congruencia con las nuevas posibilidades

tecnoloacutegicas especialmente de formato y medios de reproduccioacuten

9 Conclusiones

A partir de las experiencias generadas desde el PEM asiacute como de valoraciones

recibidas de otras instancias acadeacutemicas de la Universidad con las que se ha trabajado en

conjunto se presentan algunos factores a considerar a la hora de emprender una produccioacuten

de multimedia educativo que contemple algunos de los principios de disentildeo desarrollados

con anterioridad

El disentildeo adaptativo demanda una mayor reflexioacuten a la hora de planificar y concretar la

propuesta graacutefica y la disposicioacuten de contenidos porque se deben contemplar nuevos

escenarios y posibilidades en la visualizacioacuten de los multimedia educativos en tabletas y en

teleacutefonos inteligentes Eso no implica el sacrificio total o parcial de la graacutefica y los contenidos

dado que dichos elementos se vinculan entre siacute independientemente de la resolucioacuten de

pantalla del dispositivo Por lo anterior en los uacuteltimos 5 antildeos el programa ha estado

revisando perioacutedicamente los procesos de produccioacuten y flujos de trabajo con el propoacutesito de

responder a las necesidades actuales de contenidos maacutes accesibles e inclusivos

El disentildeo de la interfaz graacutefica debe conceptualizarse en una uacutenica propuesta simple

concreta escalable y adaptable para hacer maacutes eficiente su proceso de elaboracioacuten Este

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

18

cambio de paradigma obligoacute a replantear el flujo de trabajo en disentildeo ya que se pasoacute de

elaborar varias versiones de una interfaz seguacuten la resolucioacuten de pantalla del dispositivo a

concentrar los esfuerzos en una uacutenica propuesta centrada en los elementos y acciones maacutes

importantes de navegacioacuten lo cual contribuyoacute a mejorar tanto la experiencia como la

usabilidad del material pues todos sus elementos graacuteficos y de contenido se adaptan

El disentildeo universal aplicado en la interfaz converge con el disentildeo adaptativo en la

concrecioacuten de propuestas que evidencien accesibilidad e inclusioacuten en armoniacutea con la graacutefica

ya que los materiales estaacuten orientados a los y las estudiantes y de ellos depende el impacto

que puede tener lo que se disentildee Por lo anterior el disentildeo graacutefico es valorado desde una

perspectiva pedagoacutegica que permite generar empatiacutea y motivacioacuten para explorar los

contenidos Bajo esa premisa el PEM estaacute en constante investigacioacuten de nuevas

metodologiacuteas que contribuyan a mejorar la mediacioacuten de los contenidos asiacute como la

experiencia visual de la interfaz graacutefica de los materiales que desarrolla

Los multimedia educativos se deben producir en funcioacuten de las necesidades y

capacidades del estudiantado por lo tanto es necesario un mayor anaacutelisis del puacuteblico meta

con especial eacutenfasis en acceso y tipo de dispositivos asiacute como la forma en que los utilizan

para acceder a los materiales esto permitiraacute seleccionar los medios y elementos graacuteficos

que realmente contribuyan a la mediacioacuten de los contenidos

Es necesario ademaacutes mejorar los procesos de evaluacioacuten de los multimedia

educativos con el propoacutesito de saber si las metodologiacuteas de disentildeo y produccioacuten utilizadas

actualmente mejoran la accesibilidad e inclusioacuten de los materiales disponibles para el

estudiantado como apoyo en sus procesos de aprendizaje a distancia

Referencias

Burgstahler Sheryl (2007) Universal Design in Education Principles and Applications Recuperado de httpwwwwashingtonedudoitBrochuresAcademicsud_eduhtml

Diacuteaz Luis Fernando (2011) Principios sobre la metaacutefora pedagoacutegica Recuperado de

httpwwwluisfernandodiazcomp=105 Fornasari de Menegazzo Lilia (1994) Didaacutectica de la imagen Zaragoza Editorial Latina Fundacioacuten SIDAR (2007) Principios del disentildeo universal Recuperado de

httpwwwsidarorgrecurdesdiusabledudtphp Gilliam Scott Robert (1980) Fundamentos del disentildeo Buenos Aires Editorial U Leru

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

19

Gutieacuterrez Favio (2012) Principios fundamentales de la tipografiacutea Recuperado de httpwwwfaviogutierrezcomcategorytipografia

Mantildeas Moiseacutes (2011) Interfases Reglasteoacutericas Recuperado de

httppersonalesupvesmoimacarmasterdownloadinterfacespdf Misischia Bibiana (3 de setiembre de 2013) Supresioacuten de barreras en la universidad

Paacutegina12 Recuperado de httpwwwpagina12comardiariouniversidad10-228134-2013-09-03html

Morton Jill (2010) Why color matters Recuperado de

httpwwwcolorcomcomresearchwhy-color-matters Observatorio de la Accesibilidad (sf) Breve historia Recuperado de

httpwwwobservatoriodelaaccesibilidadesaccesibilidadbreve-historia Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura - Unesco

(2013) Directrices para las Poliacuteticas de Aprendizaje Moacutevil Recuperado de httpunesdocunescoorgimages0021002196219662Spdf

Rand Paul (2007) Design form and chaos Massachusetts Rockport Publishers Inc Real Academia Espantildeola (2001) Imagen En Diccionario de la lengua espantildeola (22ordf ed)

Recuperado de httpdleraeesid=KzwDY4y Rubio Manuel (1 de setiembre de 2013) iquestQueacute es Disentildeo Adaptativo Recuperado de

httpsmagazinejoomlaorgesediciones-anterioressept-2013item1514-que-es-diseno-adaptativo

Salazar Bejarano Ana Gabriela Berrocal Carvajal Viviana Salas Campos lleana y Valerio

Aacutelvarez Cinthya (2014) Propuesta para el desarrollo de una aplicacioacuten para la gestioacuten administrativa en la UNED Costa Rica Revista Innovaciones Educativas 16(21) 1-11

Shneiderman Ben (1998) Designing the user interface Strategies for effective human-

computer interaction Massachusetts Addison-Wesley Pub Co Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfa) Geometriacutea Euclidea Recuperado de httprepositoriounedaccrmultimediasgeometria_euclideaindexhtml

Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb) Meacutetodos numeacutericos para la ensentildeanza Recuperado de httprepositoriounedaccrmultimediasmetodos_numericos_ensenanza

Velasco Santos Perla Laureano Cruces Ana Lilia Mora Torres Marta y Herrera Bautista

Miguel Aacutengel (octubre 2010) Disentildeo de agentes pedagoacutegicos a partir de los estilos de aprendizaje una perspectiva a traveacutes del color Ponencia presentada en el IV Congreso Mundial de Estilos de Aprendizaje Recuperado de httpkaliazcuammxclc02_publicacionesmaterialDiseC3B1o_de_AvataresPerspColor_10pdf

Page 12: El diseño universal en la interfaz gráfica de multimedia ... · El diseño universal en la interfaz gráfica de multimedia educativo ... aporte de otras metodologías como el diseño

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

11

posible respuesta a la necesidad de que dichos materiales esteacuten disponibles para

dispositivos moacuteviles con el propoacutesito de que estos no queden fuera del contexto actual

El disentildeador Manuel Rubio en su artiacuteculo iquestQueacute es Disentildeo Adaptativo lo define como

ldquo[hellip] una teacutecnica de disentildeo y desarrollo web que mediante el uso de estructuras e imaacutegenes

fluidas asiacute como de media-queries en las hojas de estilo CSS se consigue adaptar el sitio

web al dispositivo del usuariordquo (2013 paacuterr 1) Esta adaptacioacuten implica que la interfaz graacutefica

asiacute como los contenidos educativos desarrollados para un material didaacutectico de la

Universidad se ajustan seguacuten la resolucioacuten de la pantalla sin importar el tipo de dispositivo

desde el que se accede pero en ninguacuten caso (a menos que asiacute se contemple) significa el

sacrificio de contenido para cumplir tal propoacutesito Asiacute tanto la informacioacuten escrita apoyada de

imaacutegenes videos animaciones actividades entre otros recursos son adaptados

7 Eleccioacuten de disentildeo adaptativo

El disentildeo adaptativo es una metodologiacutea de disentildeo que permite una mayor

universalizacioacuten de los contenidos de un material en especiacutefico pero la eleccioacuten de este tipo

de disentildeo no debe recaer simplemente en la versatilidad de produccioacuten sino que su

implementacioacuten debe cumplir criterios de produccioacuten para que sea efectivo de lo contrario

seriacutea mejor optar por otro tipo de soluciones

Se debe procurar que la adaptacioacuten de los materiales sea tal que el usuario no tenga

problemas en determinar el cambio maacutexime cuando se trabaja en coordinacioacuten con otras

estrategias didaacutecticas Si bien es cierto el desarrollo de disentildeo adaptativo ahorra tiempo si

se le compara con la produccioacuten de una versioacuten seguacuten dispositivo se debe contemplar el

hecho de que la programacioacuten necesaria para elaborar un material de este tipo es compleja y

debe estar muy bien planificada

Aunque en la actualidad se habla de una mayor penetracioacuten de las tecnologiacuteas moacuteviles

en el mundo antes de implementarlo con un propoacutesito didaacutectico se debe revisar el nivel de

utilizacioacuten potencial que los usuarios del material hacen de sus dispositivos moacuteviles de

manera que se pueda valorar a futuro la idoneidad de la puesta en marcha de la

implementacioacuten de este tipo de disentildeo

8 Aportes y experiencias del PEM en la produccioacuten de multimedia educativo

El PEM ha desarrollado multimedias educativos desde su creacioacuten en el antildeo 2000 La

consigna de produccioacuten acadeacutemica es buscar e implementar en ellos la mejor combinacioacuten

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

12

posible de mediacioacuten de contenidos y uso de las TIC en beneficio del estudiantado a partir

de criterios pedagoacutegicos y de disentildeo En este mismo espiacuteritu de observar y analizar los

cambios que se dan a nivel educativo con respecto a las diferentes posibilidades

tecnoloacutegicas es que el PEM comenzoacute su incursioacuten en el uso del disentildeo adaptativo en la

produccioacuten de multimedia educativo a partir del uso de herramientas y disposiciones

conceptuales para obtener materiales didaacutecticos maacutes inclusivos

Cabe aclarar que el puacuteblico meta del PEM son los y las estudiantes de las diferentes

carreras impartidas en la Universidad usuarios que bien podriacutean presentar alguna condicioacuten

o necesidad especial de aprendizaje que obliga al programa a pensar en las distintas

posibilidades de acceso y uso de sus multimedias educativos

En lo referente a la implementacioacuten de los conceptos anteriormente definidos en la

produccioacuten de multimedia educativo cabe sentildealar que su uso depende del cumplimiento de

criterios de seleccioacuten entre ellos la pertinencia pedagoacutegica con respecto a los contenidos o

bien el uso de los dispositivos moacuteviles por parte del estudiantado

Hoy maacutes que nunca la portabilidad y el uso de variados dispositivos plantea

interrogantes importantes en cuanto a produccioacuten y disentildeo que se tratan de responder desde

la investigacioacuten experimentacioacuten implementacioacuten y posterior evaluacioacuten de la propuesta

Como ejemplo de lo anterior y en el marco de la incursioacuten de los diferentes conceptos

expuestos en este ensayo en el PEM se han elaborado dos materiales que marcaron el

inicio de la implementacioacuten de las metodologiacuteas abordadas

En el antildeo 2013 se produjo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica En

esta primera experiencia se presentoacute un multimedia educativo que sirve de apoyo al libro

Meacutetodos Numeacutericos para la Ensentildeanza publicado por la Editorial de la Universidad Estatal a

Distancia (EUNED) de Costa Rica y que se utiliza en el curso Meacutetodos Numeacutericos que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia El material

ofrece a la persona estudiante la solucioacuten de ejemplos por medio de software libre y gratuito

para la resolucioacuten de problemas y ejercicios en temas relacionados con la Teoriacutea del error

Meacutetodos de aproximacioacuten para soluciones de ecuaciones no lineales Aproximacioacuten

polinomial para valores de funciones y Aproximaciones en derivacioacuten e integracioacuten utilizando

diversas teacutecnicas y meacutetodos

La metaacutefora pedagoacutegica desarrollada se elaboroacute bajo el concepto de un mapa de

estrategia que propone cuatro escenarios que representan las aacutereas temaacuteticas mencionadas

La propuesta se seleccionoacute porque mantiene una estrecha relacioacuten con las aacutereas del

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

13

conocimiento expuestas y porque presenta similitud con los mapas estrateacutegicos utilizados

comuacutenmente en videojuegos de estrategia que son de gran aceptacioacuten y reconocimiento por

parte del puacuteblico meta del material A continuacioacuten se muestra la propuesta graacutefica de la

portada y los moacutedulos de contenido del material

Figura 1 Portada del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

14

Figura 2 Moacutedulos de contenido del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por esta razoacuten los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos del material estaacuten

concebidos de forma modular independientes y adaptables dispuestos en un plano

cartograacutefico que de igual manera se adapta seguacuten la resolucioacuten de pantalla del dispositivo

desde el que se accede

El disentildeo graacutefico del multimedia educativo se disentildeoacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual de esta justificada pedagoacutegicamente y

elaborada a partir de la composicioacuten equilibrada y agradable de imaacutegenes mapa de bits e

ilustraciones vectoriales inspiradas como se mencionoacute anteriormente en los videojuegos de

estrategia que utilizan isomeacutetricos para ambientar sus escenarios Este material cuenta con

algunos aportes del disentildeo universal aplicados en un contexto educativo como uso

equiparable flexible intuitivo y simple Se consideran ademaacutes aspectos importantes de

accesibilidad e inclusioacuten como la posibilidad de ampliar disminuir y restablecer el tamantildeo del

texto en el contenido

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

15

Esta primera experiencia sirvioacute como base para el establecimiento de ciertos criterios

de produccioacuten en este tipo de materiales didaacutecticos como contemplar la adaptabilidad del

material desde el inicio de la produccioacuten considerar en el disentildeo de la metaacutefora pedagoacutegica

aspectos que implica el disentildeo adaptativo la simplicidad en el disentildeo graacutefico que se debe

utilizar en la elaboracioacuten de la interfaz graacutefica y los diferentes recursos audiovisuales entre

otros

Con la intensioacuten de continuar la produccioacuten de multimedia educativo bajo las

metodologiacuteas desarrolladas y adoptadas en el PEM a partir de experiencias previas en el

antildeo 2015 se produjo Geometriacutea Eucliacutedea Esta segunda experiencia presenta un material

didaacutectico utilizado en los cursos de Geometriacutea Eucliacutedea y Construcciones geomeacutetricas que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia Fue producido

bajo el concepto de laboratorio virtual y se compone de cuatro laboratorios que le permiten al

estudiantado y futuro docente de la Universidad aprender a realizar construcciones

geomeacutetricas a partir de la teacutecnica de Regla y compaacutes Portasegmentos Doblado de papel y

Software matemaacutetico

La metaacutefora pedagoacutegica se elaboroacute en torno a un vivero se tomoacute en consideracioacuten el

trasfondo histoacuterico y teoacuterico de la geometriacutea su clara percepcioacuten en la naturaleza desde la

antiguumledad asiacute como la manifestacioacuten cotidiana de elementos geomeacutetricos que rodean al

ser humano por ejemplo los puntos los planos las liacuteneas rectas curvas entre otros A

continuacioacuten se muestra la propuesta graacutefica de la portada y los laboratorios virtuales del

material

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

16

Figura 3 Portada del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

Figura 4 Laboratorios virtuales del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por este motivo los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos multimedia estaacuten

concebidos de forma modular independientes escalables y adaptables presentados en

varios estantes de exhibicioacuten de plantas

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

17

El disentildeo graacutefico del multimedia educativo se elaboroacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual justificada pedagoacutegicamente y disentildeada

a partir de una composicioacuten equilibrada y agradable de ilustraciones vectoriales inspiradas

como se mencionoacute anteriormente en ambientes cotidianos de un vivero con el objetivo de

reforzar la temaacutetica general del material con el contexto en que se presentan los contenidos

De igual manera este recurso cuenta con algunos aportes del disentildeo universal como

su uso equiparable flexible informacioacuten perceptible y tolerancia al error aplicados en el

aacutembito educativo y que tambieacuten consideran aspectos importantes de accesibilidad e

inclusioacuten

Estos dos ejemplos de multimedia educativo producidos en el PEM aunados a

esfuerzos de investigacioacuten y capacitacioacuten a nivel interno del programa son los primeros

pasos hacia el desarrollo de nuevos materiales didaacutecticos maacutes accesibles e inclusivos como

el reciente desarrollo de los laboratorios virtuales para el aprendizaje que tienen como fin

seguir poniendo a disposicioacuten del estudiantado materiales de calidad que apoyen sus

procesos de aprendizaje a distancia y en congruencia con las nuevas posibilidades

tecnoloacutegicas especialmente de formato y medios de reproduccioacuten

9 Conclusiones

A partir de las experiencias generadas desde el PEM asiacute como de valoraciones

recibidas de otras instancias acadeacutemicas de la Universidad con las que se ha trabajado en

conjunto se presentan algunos factores a considerar a la hora de emprender una produccioacuten

de multimedia educativo que contemple algunos de los principios de disentildeo desarrollados

con anterioridad

El disentildeo adaptativo demanda una mayor reflexioacuten a la hora de planificar y concretar la

propuesta graacutefica y la disposicioacuten de contenidos porque se deben contemplar nuevos

escenarios y posibilidades en la visualizacioacuten de los multimedia educativos en tabletas y en

teleacutefonos inteligentes Eso no implica el sacrificio total o parcial de la graacutefica y los contenidos

dado que dichos elementos se vinculan entre siacute independientemente de la resolucioacuten de

pantalla del dispositivo Por lo anterior en los uacuteltimos 5 antildeos el programa ha estado

revisando perioacutedicamente los procesos de produccioacuten y flujos de trabajo con el propoacutesito de

responder a las necesidades actuales de contenidos maacutes accesibles e inclusivos

El disentildeo de la interfaz graacutefica debe conceptualizarse en una uacutenica propuesta simple

concreta escalable y adaptable para hacer maacutes eficiente su proceso de elaboracioacuten Este

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

18

cambio de paradigma obligoacute a replantear el flujo de trabajo en disentildeo ya que se pasoacute de

elaborar varias versiones de una interfaz seguacuten la resolucioacuten de pantalla del dispositivo a

concentrar los esfuerzos en una uacutenica propuesta centrada en los elementos y acciones maacutes

importantes de navegacioacuten lo cual contribuyoacute a mejorar tanto la experiencia como la

usabilidad del material pues todos sus elementos graacuteficos y de contenido se adaptan

El disentildeo universal aplicado en la interfaz converge con el disentildeo adaptativo en la

concrecioacuten de propuestas que evidencien accesibilidad e inclusioacuten en armoniacutea con la graacutefica

ya que los materiales estaacuten orientados a los y las estudiantes y de ellos depende el impacto

que puede tener lo que se disentildee Por lo anterior el disentildeo graacutefico es valorado desde una

perspectiva pedagoacutegica que permite generar empatiacutea y motivacioacuten para explorar los

contenidos Bajo esa premisa el PEM estaacute en constante investigacioacuten de nuevas

metodologiacuteas que contribuyan a mejorar la mediacioacuten de los contenidos asiacute como la

experiencia visual de la interfaz graacutefica de los materiales que desarrolla

Los multimedia educativos se deben producir en funcioacuten de las necesidades y

capacidades del estudiantado por lo tanto es necesario un mayor anaacutelisis del puacuteblico meta

con especial eacutenfasis en acceso y tipo de dispositivos asiacute como la forma en que los utilizan

para acceder a los materiales esto permitiraacute seleccionar los medios y elementos graacuteficos

que realmente contribuyan a la mediacioacuten de los contenidos

Es necesario ademaacutes mejorar los procesos de evaluacioacuten de los multimedia

educativos con el propoacutesito de saber si las metodologiacuteas de disentildeo y produccioacuten utilizadas

actualmente mejoran la accesibilidad e inclusioacuten de los materiales disponibles para el

estudiantado como apoyo en sus procesos de aprendizaje a distancia

Referencias

Burgstahler Sheryl (2007) Universal Design in Education Principles and Applications Recuperado de httpwwwwashingtonedudoitBrochuresAcademicsud_eduhtml

Diacuteaz Luis Fernando (2011) Principios sobre la metaacutefora pedagoacutegica Recuperado de

httpwwwluisfernandodiazcomp=105 Fornasari de Menegazzo Lilia (1994) Didaacutectica de la imagen Zaragoza Editorial Latina Fundacioacuten SIDAR (2007) Principios del disentildeo universal Recuperado de

httpwwwsidarorgrecurdesdiusabledudtphp Gilliam Scott Robert (1980) Fundamentos del disentildeo Buenos Aires Editorial U Leru

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

19

Gutieacuterrez Favio (2012) Principios fundamentales de la tipografiacutea Recuperado de httpwwwfaviogutierrezcomcategorytipografia

Mantildeas Moiseacutes (2011) Interfases Reglasteoacutericas Recuperado de

httppersonalesupvesmoimacarmasterdownloadinterfacespdf Misischia Bibiana (3 de setiembre de 2013) Supresioacuten de barreras en la universidad

Paacutegina12 Recuperado de httpwwwpagina12comardiariouniversidad10-228134-2013-09-03html

Morton Jill (2010) Why color matters Recuperado de

httpwwwcolorcomcomresearchwhy-color-matters Observatorio de la Accesibilidad (sf) Breve historia Recuperado de

httpwwwobservatoriodelaaccesibilidadesaccesibilidadbreve-historia Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura - Unesco

(2013) Directrices para las Poliacuteticas de Aprendizaje Moacutevil Recuperado de httpunesdocunescoorgimages0021002196219662Spdf

Rand Paul (2007) Design form and chaos Massachusetts Rockport Publishers Inc Real Academia Espantildeola (2001) Imagen En Diccionario de la lengua espantildeola (22ordf ed)

Recuperado de httpdleraeesid=KzwDY4y Rubio Manuel (1 de setiembre de 2013) iquestQueacute es Disentildeo Adaptativo Recuperado de

httpsmagazinejoomlaorgesediciones-anterioressept-2013item1514-que-es-diseno-adaptativo

Salazar Bejarano Ana Gabriela Berrocal Carvajal Viviana Salas Campos lleana y Valerio

Aacutelvarez Cinthya (2014) Propuesta para el desarrollo de una aplicacioacuten para la gestioacuten administrativa en la UNED Costa Rica Revista Innovaciones Educativas 16(21) 1-11

Shneiderman Ben (1998) Designing the user interface Strategies for effective human-

computer interaction Massachusetts Addison-Wesley Pub Co Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfa) Geometriacutea Euclidea Recuperado de httprepositoriounedaccrmultimediasgeometria_euclideaindexhtml

Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb) Meacutetodos numeacutericos para la ensentildeanza Recuperado de httprepositoriounedaccrmultimediasmetodos_numericos_ensenanza

Velasco Santos Perla Laureano Cruces Ana Lilia Mora Torres Marta y Herrera Bautista

Miguel Aacutengel (octubre 2010) Disentildeo de agentes pedagoacutegicos a partir de los estilos de aprendizaje una perspectiva a traveacutes del color Ponencia presentada en el IV Congreso Mundial de Estilos de Aprendizaje Recuperado de httpkaliazcuammxclc02_publicacionesmaterialDiseC3B1o_de_AvataresPerspColor_10pdf

Page 13: El diseño universal en la interfaz gráfica de multimedia ... · El diseño universal en la interfaz gráfica de multimedia educativo ... aporte de otras metodologías como el diseño

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

12

posible de mediacioacuten de contenidos y uso de las TIC en beneficio del estudiantado a partir

de criterios pedagoacutegicos y de disentildeo En este mismo espiacuteritu de observar y analizar los

cambios que se dan a nivel educativo con respecto a las diferentes posibilidades

tecnoloacutegicas es que el PEM comenzoacute su incursioacuten en el uso del disentildeo adaptativo en la

produccioacuten de multimedia educativo a partir del uso de herramientas y disposiciones

conceptuales para obtener materiales didaacutecticos maacutes inclusivos

Cabe aclarar que el puacuteblico meta del PEM son los y las estudiantes de las diferentes

carreras impartidas en la Universidad usuarios que bien podriacutean presentar alguna condicioacuten

o necesidad especial de aprendizaje que obliga al programa a pensar en las distintas

posibilidades de acceso y uso de sus multimedias educativos

En lo referente a la implementacioacuten de los conceptos anteriormente definidos en la

produccioacuten de multimedia educativo cabe sentildealar que su uso depende del cumplimiento de

criterios de seleccioacuten entre ellos la pertinencia pedagoacutegica con respecto a los contenidos o

bien el uso de los dispositivos moacuteviles por parte del estudiantado

Hoy maacutes que nunca la portabilidad y el uso de variados dispositivos plantea

interrogantes importantes en cuanto a produccioacuten y disentildeo que se tratan de responder desde

la investigacioacuten experimentacioacuten implementacioacuten y posterior evaluacioacuten de la propuesta

Como ejemplo de lo anterior y en el marco de la incursioacuten de los diferentes conceptos

expuestos en este ensayo en el PEM se han elaborado dos materiales que marcaron el

inicio de la implementacioacuten de las metodologiacuteas abordadas

En el antildeo 2013 se produjo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica En

esta primera experiencia se presentoacute un multimedia educativo que sirve de apoyo al libro

Meacutetodos Numeacutericos para la Ensentildeanza publicado por la Editorial de la Universidad Estatal a

Distancia (EUNED) de Costa Rica y que se utiliza en el curso Meacutetodos Numeacutericos que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia El material

ofrece a la persona estudiante la solucioacuten de ejemplos por medio de software libre y gratuito

para la resolucioacuten de problemas y ejercicios en temas relacionados con la Teoriacutea del error

Meacutetodos de aproximacioacuten para soluciones de ecuaciones no lineales Aproximacioacuten

polinomial para valores de funciones y Aproximaciones en derivacioacuten e integracioacuten utilizando

diversas teacutecnicas y meacutetodos

La metaacutefora pedagoacutegica desarrollada se elaboroacute bajo el concepto de un mapa de

estrategia que propone cuatro escenarios que representan las aacutereas temaacuteticas mencionadas

La propuesta se seleccionoacute porque mantiene una estrecha relacioacuten con las aacutereas del

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

13

conocimiento expuestas y porque presenta similitud con los mapas estrateacutegicos utilizados

comuacutenmente en videojuegos de estrategia que son de gran aceptacioacuten y reconocimiento por

parte del puacuteblico meta del material A continuacioacuten se muestra la propuesta graacutefica de la

portada y los moacutedulos de contenido del material

Figura 1 Portada del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

14

Figura 2 Moacutedulos de contenido del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por esta razoacuten los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos del material estaacuten

concebidos de forma modular independientes y adaptables dispuestos en un plano

cartograacutefico que de igual manera se adapta seguacuten la resolucioacuten de pantalla del dispositivo

desde el que se accede

El disentildeo graacutefico del multimedia educativo se disentildeoacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual de esta justificada pedagoacutegicamente y

elaborada a partir de la composicioacuten equilibrada y agradable de imaacutegenes mapa de bits e

ilustraciones vectoriales inspiradas como se mencionoacute anteriormente en los videojuegos de

estrategia que utilizan isomeacutetricos para ambientar sus escenarios Este material cuenta con

algunos aportes del disentildeo universal aplicados en un contexto educativo como uso

equiparable flexible intuitivo y simple Se consideran ademaacutes aspectos importantes de

accesibilidad e inclusioacuten como la posibilidad de ampliar disminuir y restablecer el tamantildeo del

texto en el contenido

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

15

Esta primera experiencia sirvioacute como base para el establecimiento de ciertos criterios

de produccioacuten en este tipo de materiales didaacutecticos como contemplar la adaptabilidad del

material desde el inicio de la produccioacuten considerar en el disentildeo de la metaacutefora pedagoacutegica

aspectos que implica el disentildeo adaptativo la simplicidad en el disentildeo graacutefico que se debe

utilizar en la elaboracioacuten de la interfaz graacutefica y los diferentes recursos audiovisuales entre

otros

Con la intensioacuten de continuar la produccioacuten de multimedia educativo bajo las

metodologiacuteas desarrolladas y adoptadas en el PEM a partir de experiencias previas en el

antildeo 2015 se produjo Geometriacutea Eucliacutedea Esta segunda experiencia presenta un material

didaacutectico utilizado en los cursos de Geometriacutea Eucliacutedea y Construcciones geomeacutetricas que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia Fue producido

bajo el concepto de laboratorio virtual y se compone de cuatro laboratorios que le permiten al

estudiantado y futuro docente de la Universidad aprender a realizar construcciones

geomeacutetricas a partir de la teacutecnica de Regla y compaacutes Portasegmentos Doblado de papel y

Software matemaacutetico

La metaacutefora pedagoacutegica se elaboroacute en torno a un vivero se tomoacute en consideracioacuten el

trasfondo histoacuterico y teoacuterico de la geometriacutea su clara percepcioacuten en la naturaleza desde la

antiguumledad asiacute como la manifestacioacuten cotidiana de elementos geomeacutetricos que rodean al

ser humano por ejemplo los puntos los planos las liacuteneas rectas curvas entre otros A

continuacioacuten se muestra la propuesta graacutefica de la portada y los laboratorios virtuales del

material

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

16

Figura 3 Portada del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

Figura 4 Laboratorios virtuales del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por este motivo los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos multimedia estaacuten

concebidos de forma modular independientes escalables y adaptables presentados en

varios estantes de exhibicioacuten de plantas

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

17

El disentildeo graacutefico del multimedia educativo se elaboroacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual justificada pedagoacutegicamente y disentildeada

a partir de una composicioacuten equilibrada y agradable de ilustraciones vectoriales inspiradas

como se mencionoacute anteriormente en ambientes cotidianos de un vivero con el objetivo de

reforzar la temaacutetica general del material con el contexto en que se presentan los contenidos

De igual manera este recurso cuenta con algunos aportes del disentildeo universal como

su uso equiparable flexible informacioacuten perceptible y tolerancia al error aplicados en el

aacutembito educativo y que tambieacuten consideran aspectos importantes de accesibilidad e

inclusioacuten

Estos dos ejemplos de multimedia educativo producidos en el PEM aunados a

esfuerzos de investigacioacuten y capacitacioacuten a nivel interno del programa son los primeros

pasos hacia el desarrollo de nuevos materiales didaacutecticos maacutes accesibles e inclusivos como

el reciente desarrollo de los laboratorios virtuales para el aprendizaje que tienen como fin

seguir poniendo a disposicioacuten del estudiantado materiales de calidad que apoyen sus

procesos de aprendizaje a distancia y en congruencia con las nuevas posibilidades

tecnoloacutegicas especialmente de formato y medios de reproduccioacuten

9 Conclusiones

A partir de las experiencias generadas desde el PEM asiacute como de valoraciones

recibidas de otras instancias acadeacutemicas de la Universidad con las que se ha trabajado en

conjunto se presentan algunos factores a considerar a la hora de emprender una produccioacuten

de multimedia educativo que contemple algunos de los principios de disentildeo desarrollados

con anterioridad

El disentildeo adaptativo demanda una mayor reflexioacuten a la hora de planificar y concretar la

propuesta graacutefica y la disposicioacuten de contenidos porque se deben contemplar nuevos

escenarios y posibilidades en la visualizacioacuten de los multimedia educativos en tabletas y en

teleacutefonos inteligentes Eso no implica el sacrificio total o parcial de la graacutefica y los contenidos

dado que dichos elementos se vinculan entre siacute independientemente de la resolucioacuten de

pantalla del dispositivo Por lo anterior en los uacuteltimos 5 antildeos el programa ha estado

revisando perioacutedicamente los procesos de produccioacuten y flujos de trabajo con el propoacutesito de

responder a las necesidades actuales de contenidos maacutes accesibles e inclusivos

El disentildeo de la interfaz graacutefica debe conceptualizarse en una uacutenica propuesta simple

concreta escalable y adaptable para hacer maacutes eficiente su proceso de elaboracioacuten Este

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

18

cambio de paradigma obligoacute a replantear el flujo de trabajo en disentildeo ya que se pasoacute de

elaborar varias versiones de una interfaz seguacuten la resolucioacuten de pantalla del dispositivo a

concentrar los esfuerzos en una uacutenica propuesta centrada en los elementos y acciones maacutes

importantes de navegacioacuten lo cual contribuyoacute a mejorar tanto la experiencia como la

usabilidad del material pues todos sus elementos graacuteficos y de contenido se adaptan

El disentildeo universal aplicado en la interfaz converge con el disentildeo adaptativo en la

concrecioacuten de propuestas que evidencien accesibilidad e inclusioacuten en armoniacutea con la graacutefica

ya que los materiales estaacuten orientados a los y las estudiantes y de ellos depende el impacto

que puede tener lo que se disentildee Por lo anterior el disentildeo graacutefico es valorado desde una

perspectiva pedagoacutegica que permite generar empatiacutea y motivacioacuten para explorar los

contenidos Bajo esa premisa el PEM estaacute en constante investigacioacuten de nuevas

metodologiacuteas que contribuyan a mejorar la mediacioacuten de los contenidos asiacute como la

experiencia visual de la interfaz graacutefica de los materiales que desarrolla

Los multimedia educativos se deben producir en funcioacuten de las necesidades y

capacidades del estudiantado por lo tanto es necesario un mayor anaacutelisis del puacuteblico meta

con especial eacutenfasis en acceso y tipo de dispositivos asiacute como la forma en que los utilizan

para acceder a los materiales esto permitiraacute seleccionar los medios y elementos graacuteficos

que realmente contribuyan a la mediacioacuten de los contenidos

Es necesario ademaacutes mejorar los procesos de evaluacioacuten de los multimedia

educativos con el propoacutesito de saber si las metodologiacuteas de disentildeo y produccioacuten utilizadas

actualmente mejoran la accesibilidad e inclusioacuten de los materiales disponibles para el

estudiantado como apoyo en sus procesos de aprendizaje a distancia

Referencias

Burgstahler Sheryl (2007) Universal Design in Education Principles and Applications Recuperado de httpwwwwashingtonedudoitBrochuresAcademicsud_eduhtml

Diacuteaz Luis Fernando (2011) Principios sobre la metaacutefora pedagoacutegica Recuperado de

httpwwwluisfernandodiazcomp=105 Fornasari de Menegazzo Lilia (1994) Didaacutectica de la imagen Zaragoza Editorial Latina Fundacioacuten SIDAR (2007) Principios del disentildeo universal Recuperado de

httpwwwsidarorgrecurdesdiusabledudtphp Gilliam Scott Robert (1980) Fundamentos del disentildeo Buenos Aires Editorial U Leru

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

19

Gutieacuterrez Favio (2012) Principios fundamentales de la tipografiacutea Recuperado de httpwwwfaviogutierrezcomcategorytipografia

Mantildeas Moiseacutes (2011) Interfases Reglasteoacutericas Recuperado de

httppersonalesupvesmoimacarmasterdownloadinterfacespdf Misischia Bibiana (3 de setiembre de 2013) Supresioacuten de barreras en la universidad

Paacutegina12 Recuperado de httpwwwpagina12comardiariouniversidad10-228134-2013-09-03html

Morton Jill (2010) Why color matters Recuperado de

httpwwwcolorcomcomresearchwhy-color-matters Observatorio de la Accesibilidad (sf) Breve historia Recuperado de

httpwwwobservatoriodelaaccesibilidadesaccesibilidadbreve-historia Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura - Unesco

(2013) Directrices para las Poliacuteticas de Aprendizaje Moacutevil Recuperado de httpunesdocunescoorgimages0021002196219662Spdf

Rand Paul (2007) Design form and chaos Massachusetts Rockport Publishers Inc Real Academia Espantildeola (2001) Imagen En Diccionario de la lengua espantildeola (22ordf ed)

Recuperado de httpdleraeesid=KzwDY4y Rubio Manuel (1 de setiembre de 2013) iquestQueacute es Disentildeo Adaptativo Recuperado de

httpsmagazinejoomlaorgesediciones-anterioressept-2013item1514-que-es-diseno-adaptativo

Salazar Bejarano Ana Gabriela Berrocal Carvajal Viviana Salas Campos lleana y Valerio

Aacutelvarez Cinthya (2014) Propuesta para el desarrollo de una aplicacioacuten para la gestioacuten administrativa en la UNED Costa Rica Revista Innovaciones Educativas 16(21) 1-11

Shneiderman Ben (1998) Designing the user interface Strategies for effective human-

computer interaction Massachusetts Addison-Wesley Pub Co Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfa) Geometriacutea Euclidea Recuperado de httprepositoriounedaccrmultimediasgeometria_euclideaindexhtml

Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb) Meacutetodos numeacutericos para la ensentildeanza Recuperado de httprepositoriounedaccrmultimediasmetodos_numericos_ensenanza

Velasco Santos Perla Laureano Cruces Ana Lilia Mora Torres Marta y Herrera Bautista

Miguel Aacutengel (octubre 2010) Disentildeo de agentes pedagoacutegicos a partir de los estilos de aprendizaje una perspectiva a traveacutes del color Ponencia presentada en el IV Congreso Mundial de Estilos de Aprendizaje Recuperado de httpkaliazcuammxclc02_publicacionesmaterialDiseC3B1o_de_AvataresPerspColor_10pdf

Page 14: El diseño universal en la interfaz gráfica de multimedia ... · El diseño universal en la interfaz gráfica de multimedia educativo ... aporte de otras metodologías como el diseño

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

13

conocimiento expuestas y porque presenta similitud con los mapas estrateacutegicos utilizados

comuacutenmente en videojuegos de estrategia que son de gran aceptacioacuten y reconocimiento por

parte del puacuteblico meta del material A continuacioacuten se muestra la propuesta graacutefica de la

portada y los moacutedulos de contenido del material

Figura 1 Portada del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza de la Matemaacutetica

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

14

Figura 2 Moacutedulos de contenido del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por esta razoacuten los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos del material estaacuten

concebidos de forma modular independientes y adaptables dispuestos en un plano

cartograacutefico que de igual manera se adapta seguacuten la resolucioacuten de pantalla del dispositivo

desde el que se accede

El disentildeo graacutefico del multimedia educativo se disentildeoacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual de esta justificada pedagoacutegicamente y

elaborada a partir de la composicioacuten equilibrada y agradable de imaacutegenes mapa de bits e

ilustraciones vectoriales inspiradas como se mencionoacute anteriormente en los videojuegos de

estrategia que utilizan isomeacutetricos para ambientar sus escenarios Este material cuenta con

algunos aportes del disentildeo universal aplicados en un contexto educativo como uso

equiparable flexible intuitivo y simple Se consideran ademaacutes aspectos importantes de

accesibilidad e inclusioacuten como la posibilidad de ampliar disminuir y restablecer el tamantildeo del

texto en el contenido

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

15

Esta primera experiencia sirvioacute como base para el establecimiento de ciertos criterios

de produccioacuten en este tipo de materiales didaacutecticos como contemplar la adaptabilidad del

material desde el inicio de la produccioacuten considerar en el disentildeo de la metaacutefora pedagoacutegica

aspectos que implica el disentildeo adaptativo la simplicidad en el disentildeo graacutefico que se debe

utilizar en la elaboracioacuten de la interfaz graacutefica y los diferentes recursos audiovisuales entre

otros

Con la intensioacuten de continuar la produccioacuten de multimedia educativo bajo las

metodologiacuteas desarrolladas y adoptadas en el PEM a partir de experiencias previas en el

antildeo 2015 se produjo Geometriacutea Eucliacutedea Esta segunda experiencia presenta un material

didaacutectico utilizado en los cursos de Geometriacutea Eucliacutedea y Construcciones geomeacutetricas que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia Fue producido

bajo el concepto de laboratorio virtual y se compone de cuatro laboratorios que le permiten al

estudiantado y futuro docente de la Universidad aprender a realizar construcciones

geomeacutetricas a partir de la teacutecnica de Regla y compaacutes Portasegmentos Doblado de papel y

Software matemaacutetico

La metaacutefora pedagoacutegica se elaboroacute en torno a un vivero se tomoacute en consideracioacuten el

trasfondo histoacuterico y teoacuterico de la geometriacutea su clara percepcioacuten en la naturaleza desde la

antiguumledad asiacute como la manifestacioacuten cotidiana de elementos geomeacutetricos que rodean al

ser humano por ejemplo los puntos los planos las liacuteneas rectas curvas entre otros A

continuacioacuten se muestra la propuesta graacutefica de la portada y los laboratorios virtuales del

material

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

16

Figura 3 Portada del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

Figura 4 Laboratorios virtuales del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por este motivo los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos multimedia estaacuten

concebidos de forma modular independientes escalables y adaptables presentados en

varios estantes de exhibicioacuten de plantas

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

17

El disentildeo graacutefico del multimedia educativo se elaboroacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual justificada pedagoacutegicamente y disentildeada

a partir de una composicioacuten equilibrada y agradable de ilustraciones vectoriales inspiradas

como se mencionoacute anteriormente en ambientes cotidianos de un vivero con el objetivo de

reforzar la temaacutetica general del material con el contexto en que se presentan los contenidos

De igual manera este recurso cuenta con algunos aportes del disentildeo universal como

su uso equiparable flexible informacioacuten perceptible y tolerancia al error aplicados en el

aacutembito educativo y que tambieacuten consideran aspectos importantes de accesibilidad e

inclusioacuten

Estos dos ejemplos de multimedia educativo producidos en el PEM aunados a

esfuerzos de investigacioacuten y capacitacioacuten a nivel interno del programa son los primeros

pasos hacia el desarrollo de nuevos materiales didaacutecticos maacutes accesibles e inclusivos como

el reciente desarrollo de los laboratorios virtuales para el aprendizaje que tienen como fin

seguir poniendo a disposicioacuten del estudiantado materiales de calidad que apoyen sus

procesos de aprendizaje a distancia y en congruencia con las nuevas posibilidades

tecnoloacutegicas especialmente de formato y medios de reproduccioacuten

9 Conclusiones

A partir de las experiencias generadas desde el PEM asiacute como de valoraciones

recibidas de otras instancias acadeacutemicas de la Universidad con las que se ha trabajado en

conjunto se presentan algunos factores a considerar a la hora de emprender una produccioacuten

de multimedia educativo que contemple algunos de los principios de disentildeo desarrollados

con anterioridad

El disentildeo adaptativo demanda una mayor reflexioacuten a la hora de planificar y concretar la

propuesta graacutefica y la disposicioacuten de contenidos porque se deben contemplar nuevos

escenarios y posibilidades en la visualizacioacuten de los multimedia educativos en tabletas y en

teleacutefonos inteligentes Eso no implica el sacrificio total o parcial de la graacutefica y los contenidos

dado que dichos elementos se vinculan entre siacute independientemente de la resolucioacuten de

pantalla del dispositivo Por lo anterior en los uacuteltimos 5 antildeos el programa ha estado

revisando perioacutedicamente los procesos de produccioacuten y flujos de trabajo con el propoacutesito de

responder a las necesidades actuales de contenidos maacutes accesibles e inclusivos

El disentildeo de la interfaz graacutefica debe conceptualizarse en una uacutenica propuesta simple

concreta escalable y adaptable para hacer maacutes eficiente su proceso de elaboracioacuten Este

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

18

cambio de paradigma obligoacute a replantear el flujo de trabajo en disentildeo ya que se pasoacute de

elaborar varias versiones de una interfaz seguacuten la resolucioacuten de pantalla del dispositivo a

concentrar los esfuerzos en una uacutenica propuesta centrada en los elementos y acciones maacutes

importantes de navegacioacuten lo cual contribuyoacute a mejorar tanto la experiencia como la

usabilidad del material pues todos sus elementos graacuteficos y de contenido se adaptan

El disentildeo universal aplicado en la interfaz converge con el disentildeo adaptativo en la

concrecioacuten de propuestas que evidencien accesibilidad e inclusioacuten en armoniacutea con la graacutefica

ya que los materiales estaacuten orientados a los y las estudiantes y de ellos depende el impacto

que puede tener lo que se disentildee Por lo anterior el disentildeo graacutefico es valorado desde una

perspectiva pedagoacutegica que permite generar empatiacutea y motivacioacuten para explorar los

contenidos Bajo esa premisa el PEM estaacute en constante investigacioacuten de nuevas

metodologiacuteas que contribuyan a mejorar la mediacioacuten de los contenidos asiacute como la

experiencia visual de la interfaz graacutefica de los materiales que desarrolla

Los multimedia educativos se deben producir en funcioacuten de las necesidades y

capacidades del estudiantado por lo tanto es necesario un mayor anaacutelisis del puacuteblico meta

con especial eacutenfasis en acceso y tipo de dispositivos asiacute como la forma en que los utilizan

para acceder a los materiales esto permitiraacute seleccionar los medios y elementos graacuteficos

que realmente contribuyan a la mediacioacuten de los contenidos

Es necesario ademaacutes mejorar los procesos de evaluacioacuten de los multimedia

educativos con el propoacutesito de saber si las metodologiacuteas de disentildeo y produccioacuten utilizadas

actualmente mejoran la accesibilidad e inclusioacuten de los materiales disponibles para el

estudiantado como apoyo en sus procesos de aprendizaje a distancia

Referencias

Burgstahler Sheryl (2007) Universal Design in Education Principles and Applications Recuperado de httpwwwwashingtonedudoitBrochuresAcademicsud_eduhtml

Diacuteaz Luis Fernando (2011) Principios sobre la metaacutefora pedagoacutegica Recuperado de

httpwwwluisfernandodiazcomp=105 Fornasari de Menegazzo Lilia (1994) Didaacutectica de la imagen Zaragoza Editorial Latina Fundacioacuten SIDAR (2007) Principios del disentildeo universal Recuperado de

httpwwwsidarorgrecurdesdiusabledudtphp Gilliam Scott Robert (1980) Fundamentos del disentildeo Buenos Aires Editorial U Leru

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

19

Gutieacuterrez Favio (2012) Principios fundamentales de la tipografiacutea Recuperado de httpwwwfaviogutierrezcomcategorytipografia

Mantildeas Moiseacutes (2011) Interfases Reglasteoacutericas Recuperado de

httppersonalesupvesmoimacarmasterdownloadinterfacespdf Misischia Bibiana (3 de setiembre de 2013) Supresioacuten de barreras en la universidad

Paacutegina12 Recuperado de httpwwwpagina12comardiariouniversidad10-228134-2013-09-03html

Morton Jill (2010) Why color matters Recuperado de

httpwwwcolorcomcomresearchwhy-color-matters Observatorio de la Accesibilidad (sf) Breve historia Recuperado de

httpwwwobservatoriodelaaccesibilidadesaccesibilidadbreve-historia Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura - Unesco

(2013) Directrices para las Poliacuteticas de Aprendizaje Moacutevil Recuperado de httpunesdocunescoorgimages0021002196219662Spdf

Rand Paul (2007) Design form and chaos Massachusetts Rockport Publishers Inc Real Academia Espantildeola (2001) Imagen En Diccionario de la lengua espantildeola (22ordf ed)

Recuperado de httpdleraeesid=KzwDY4y Rubio Manuel (1 de setiembre de 2013) iquestQueacute es Disentildeo Adaptativo Recuperado de

httpsmagazinejoomlaorgesediciones-anterioressept-2013item1514-que-es-diseno-adaptativo

Salazar Bejarano Ana Gabriela Berrocal Carvajal Viviana Salas Campos lleana y Valerio

Aacutelvarez Cinthya (2014) Propuesta para el desarrollo de una aplicacioacuten para la gestioacuten administrativa en la UNED Costa Rica Revista Innovaciones Educativas 16(21) 1-11

Shneiderman Ben (1998) Designing the user interface Strategies for effective human-

computer interaction Massachusetts Addison-Wesley Pub Co Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfa) Geometriacutea Euclidea Recuperado de httprepositoriounedaccrmultimediasgeometria_euclideaindexhtml

Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb) Meacutetodos numeacutericos para la ensentildeanza Recuperado de httprepositoriounedaccrmultimediasmetodos_numericos_ensenanza

Velasco Santos Perla Laureano Cruces Ana Lilia Mora Torres Marta y Herrera Bautista

Miguel Aacutengel (octubre 2010) Disentildeo de agentes pedagoacutegicos a partir de los estilos de aprendizaje una perspectiva a traveacutes del color Ponencia presentada en el IV Congreso Mundial de Estilos de Aprendizaje Recuperado de httpkaliazcuammxclc02_publicacionesmaterialDiseC3B1o_de_AvataresPerspColor_10pdf

Page 15: El diseño universal en la interfaz gráfica de multimedia ... · El diseño universal en la interfaz gráfica de multimedia educativo ... aporte de otras metodologías como el diseño

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

14

Figura 2 Moacutedulos de contenido del multimedia educativo Meacutetodos numeacutericos para la ensentildeanza

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica Multimedial (sfa)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por esta razoacuten los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos del material estaacuten

concebidos de forma modular independientes y adaptables dispuestos en un plano

cartograacutefico que de igual manera se adapta seguacuten la resolucioacuten de pantalla del dispositivo

desde el que se accede

El disentildeo graacutefico del multimedia educativo se disentildeoacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual de esta justificada pedagoacutegicamente y

elaborada a partir de la composicioacuten equilibrada y agradable de imaacutegenes mapa de bits e

ilustraciones vectoriales inspiradas como se mencionoacute anteriormente en los videojuegos de

estrategia que utilizan isomeacutetricos para ambientar sus escenarios Este material cuenta con

algunos aportes del disentildeo universal aplicados en un contexto educativo como uso

equiparable flexible intuitivo y simple Se consideran ademaacutes aspectos importantes de

accesibilidad e inclusioacuten como la posibilidad de ampliar disminuir y restablecer el tamantildeo del

texto en el contenido

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

15

Esta primera experiencia sirvioacute como base para el establecimiento de ciertos criterios

de produccioacuten en este tipo de materiales didaacutecticos como contemplar la adaptabilidad del

material desde el inicio de la produccioacuten considerar en el disentildeo de la metaacutefora pedagoacutegica

aspectos que implica el disentildeo adaptativo la simplicidad en el disentildeo graacutefico que se debe

utilizar en la elaboracioacuten de la interfaz graacutefica y los diferentes recursos audiovisuales entre

otros

Con la intensioacuten de continuar la produccioacuten de multimedia educativo bajo las

metodologiacuteas desarrolladas y adoptadas en el PEM a partir de experiencias previas en el

antildeo 2015 se produjo Geometriacutea Eucliacutedea Esta segunda experiencia presenta un material

didaacutectico utilizado en los cursos de Geometriacutea Eucliacutedea y Construcciones geomeacutetricas que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia Fue producido

bajo el concepto de laboratorio virtual y se compone de cuatro laboratorios que le permiten al

estudiantado y futuro docente de la Universidad aprender a realizar construcciones

geomeacutetricas a partir de la teacutecnica de Regla y compaacutes Portasegmentos Doblado de papel y

Software matemaacutetico

La metaacutefora pedagoacutegica se elaboroacute en torno a un vivero se tomoacute en consideracioacuten el

trasfondo histoacuterico y teoacuterico de la geometriacutea su clara percepcioacuten en la naturaleza desde la

antiguumledad asiacute como la manifestacioacuten cotidiana de elementos geomeacutetricos que rodean al

ser humano por ejemplo los puntos los planos las liacuteneas rectas curvas entre otros A

continuacioacuten se muestra la propuesta graacutefica de la portada y los laboratorios virtuales del

material

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

16

Figura 3 Portada del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

Figura 4 Laboratorios virtuales del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por este motivo los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos multimedia estaacuten

concebidos de forma modular independientes escalables y adaptables presentados en

varios estantes de exhibicioacuten de plantas

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

17

El disentildeo graacutefico del multimedia educativo se elaboroacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual justificada pedagoacutegicamente y disentildeada

a partir de una composicioacuten equilibrada y agradable de ilustraciones vectoriales inspiradas

como se mencionoacute anteriormente en ambientes cotidianos de un vivero con el objetivo de

reforzar la temaacutetica general del material con el contexto en que se presentan los contenidos

De igual manera este recurso cuenta con algunos aportes del disentildeo universal como

su uso equiparable flexible informacioacuten perceptible y tolerancia al error aplicados en el

aacutembito educativo y que tambieacuten consideran aspectos importantes de accesibilidad e

inclusioacuten

Estos dos ejemplos de multimedia educativo producidos en el PEM aunados a

esfuerzos de investigacioacuten y capacitacioacuten a nivel interno del programa son los primeros

pasos hacia el desarrollo de nuevos materiales didaacutecticos maacutes accesibles e inclusivos como

el reciente desarrollo de los laboratorios virtuales para el aprendizaje que tienen como fin

seguir poniendo a disposicioacuten del estudiantado materiales de calidad que apoyen sus

procesos de aprendizaje a distancia y en congruencia con las nuevas posibilidades

tecnoloacutegicas especialmente de formato y medios de reproduccioacuten

9 Conclusiones

A partir de las experiencias generadas desde el PEM asiacute como de valoraciones

recibidas de otras instancias acadeacutemicas de la Universidad con las que se ha trabajado en

conjunto se presentan algunos factores a considerar a la hora de emprender una produccioacuten

de multimedia educativo que contemple algunos de los principios de disentildeo desarrollados

con anterioridad

El disentildeo adaptativo demanda una mayor reflexioacuten a la hora de planificar y concretar la

propuesta graacutefica y la disposicioacuten de contenidos porque se deben contemplar nuevos

escenarios y posibilidades en la visualizacioacuten de los multimedia educativos en tabletas y en

teleacutefonos inteligentes Eso no implica el sacrificio total o parcial de la graacutefica y los contenidos

dado que dichos elementos se vinculan entre siacute independientemente de la resolucioacuten de

pantalla del dispositivo Por lo anterior en los uacuteltimos 5 antildeos el programa ha estado

revisando perioacutedicamente los procesos de produccioacuten y flujos de trabajo con el propoacutesito de

responder a las necesidades actuales de contenidos maacutes accesibles e inclusivos

El disentildeo de la interfaz graacutefica debe conceptualizarse en una uacutenica propuesta simple

concreta escalable y adaptable para hacer maacutes eficiente su proceso de elaboracioacuten Este

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

18

cambio de paradigma obligoacute a replantear el flujo de trabajo en disentildeo ya que se pasoacute de

elaborar varias versiones de una interfaz seguacuten la resolucioacuten de pantalla del dispositivo a

concentrar los esfuerzos en una uacutenica propuesta centrada en los elementos y acciones maacutes

importantes de navegacioacuten lo cual contribuyoacute a mejorar tanto la experiencia como la

usabilidad del material pues todos sus elementos graacuteficos y de contenido se adaptan

El disentildeo universal aplicado en la interfaz converge con el disentildeo adaptativo en la

concrecioacuten de propuestas que evidencien accesibilidad e inclusioacuten en armoniacutea con la graacutefica

ya que los materiales estaacuten orientados a los y las estudiantes y de ellos depende el impacto

que puede tener lo que se disentildee Por lo anterior el disentildeo graacutefico es valorado desde una

perspectiva pedagoacutegica que permite generar empatiacutea y motivacioacuten para explorar los

contenidos Bajo esa premisa el PEM estaacute en constante investigacioacuten de nuevas

metodologiacuteas que contribuyan a mejorar la mediacioacuten de los contenidos asiacute como la

experiencia visual de la interfaz graacutefica de los materiales que desarrolla

Los multimedia educativos se deben producir en funcioacuten de las necesidades y

capacidades del estudiantado por lo tanto es necesario un mayor anaacutelisis del puacuteblico meta

con especial eacutenfasis en acceso y tipo de dispositivos asiacute como la forma en que los utilizan

para acceder a los materiales esto permitiraacute seleccionar los medios y elementos graacuteficos

que realmente contribuyan a la mediacioacuten de los contenidos

Es necesario ademaacutes mejorar los procesos de evaluacioacuten de los multimedia

educativos con el propoacutesito de saber si las metodologiacuteas de disentildeo y produccioacuten utilizadas

actualmente mejoran la accesibilidad e inclusioacuten de los materiales disponibles para el

estudiantado como apoyo en sus procesos de aprendizaje a distancia

Referencias

Burgstahler Sheryl (2007) Universal Design in Education Principles and Applications Recuperado de httpwwwwashingtonedudoitBrochuresAcademicsud_eduhtml

Diacuteaz Luis Fernando (2011) Principios sobre la metaacutefora pedagoacutegica Recuperado de

httpwwwluisfernandodiazcomp=105 Fornasari de Menegazzo Lilia (1994) Didaacutectica de la imagen Zaragoza Editorial Latina Fundacioacuten SIDAR (2007) Principios del disentildeo universal Recuperado de

httpwwwsidarorgrecurdesdiusabledudtphp Gilliam Scott Robert (1980) Fundamentos del disentildeo Buenos Aires Editorial U Leru

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

19

Gutieacuterrez Favio (2012) Principios fundamentales de la tipografiacutea Recuperado de httpwwwfaviogutierrezcomcategorytipografia

Mantildeas Moiseacutes (2011) Interfases Reglasteoacutericas Recuperado de

httppersonalesupvesmoimacarmasterdownloadinterfacespdf Misischia Bibiana (3 de setiembre de 2013) Supresioacuten de barreras en la universidad

Paacutegina12 Recuperado de httpwwwpagina12comardiariouniversidad10-228134-2013-09-03html

Morton Jill (2010) Why color matters Recuperado de

httpwwwcolorcomcomresearchwhy-color-matters Observatorio de la Accesibilidad (sf) Breve historia Recuperado de

httpwwwobservatoriodelaaccesibilidadesaccesibilidadbreve-historia Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura - Unesco

(2013) Directrices para las Poliacuteticas de Aprendizaje Moacutevil Recuperado de httpunesdocunescoorgimages0021002196219662Spdf

Rand Paul (2007) Design form and chaos Massachusetts Rockport Publishers Inc Real Academia Espantildeola (2001) Imagen En Diccionario de la lengua espantildeola (22ordf ed)

Recuperado de httpdleraeesid=KzwDY4y Rubio Manuel (1 de setiembre de 2013) iquestQueacute es Disentildeo Adaptativo Recuperado de

httpsmagazinejoomlaorgesediciones-anterioressept-2013item1514-que-es-diseno-adaptativo

Salazar Bejarano Ana Gabriela Berrocal Carvajal Viviana Salas Campos lleana y Valerio

Aacutelvarez Cinthya (2014) Propuesta para el desarrollo de una aplicacioacuten para la gestioacuten administrativa en la UNED Costa Rica Revista Innovaciones Educativas 16(21) 1-11

Shneiderman Ben (1998) Designing the user interface Strategies for effective human-

computer interaction Massachusetts Addison-Wesley Pub Co Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfa) Geometriacutea Euclidea Recuperado de httprepositoriounedaccrmultimediasgeometria_euclideaindexhtml

Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb) Meacutetodos numeacutericos para la ensentildeanza Recuperado de httprepositoriounedaccrmultimediasmetodos_numericos_ensenanza

Velasco Santos Perla Laureano Cruces Ana Lilia Mora Torres Marta y Herrera Bautista

Miguel Aacutengel (octubre 2010) Disentildeo de agentes pedagoacutegicos a partir de los estilos de aprendizaje una perspectiva a traveacutes del color Ponencia presentada en el IV Congreso Mundial de Estilos de Aprendizaje Recuperado de httpkaliazcuammxclc02_publicacionesmaterialDiseC3B1o_de_AvataresPerspColor_10pdf

Page 16: El diseño universal en la interfaz gráfica de multimedia ... · El diseño universal en la interfaz gráfica de multimedia educativo ... aporte de otras metodologías como el diseño

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

15

Esta primera experiencia sirvioacute como base para el establecimiento de ciertos criterios

de produccioacuten en este tipo de materiales didaacutecticos como contemplar la adaptabilidad del

material desde el inicio de la produccioacuten considerar en el disentildeo de la metaacutefora pedagoacutegica

aspectos que implica el disentildeo adaptativo la simplicidad en el disentildeo graacutefico que se debe

utilizar en la elaboracioacuten de la interfaz graacutefica y los diferentes recursos audiovisuales entre

otros

Con la intensioacuten de continuar la produccioacuten de multimedia educativo bajo las

metodologiacuteas desarrolladas y adoptadas en el PEM a partir de experiencias previas en el

antildeo 2015 se produjo Geometriacutea Eucliacutedea Esta segunda experiencia presenta un material

didaacutectico utilizado en los cursos de Geometriacutea Eucliacutedea y Construcciones geomeacutetricas que

imparte el Programa Ensentildeanza de la Matemaacutetica bajo modalidad a distancia Fue producido

bajo el concepto de laboratorio virtual y se compone de cuatro laboratorios que le permiten al

estudiantado y futuro docente de la Universidad aprender a realizar construcciones

geomeacutetricas a partir de la teacutecnica de Regla y compaacutes Portasegmentos Doblado de papel y

Software matemaacutetico

La metaacutefora pedagoacutegica se elaboroacute en torno a un vivero se tomoacute en consideracioacuten el

trasfondo histoacuterico y teoacuterico de la geometriacutea su clara percepcioacuten en la naturaleza desde la

antiguumledad asiacute como la manifestacioacuten cotidiana de elementos geomeacutetricos que rodean al

ser humano por ejemplo los puntos los planos las liacuteneas rectas curvas entre otros A

continuacioacuten se muestra la propuesta graacutefica de la portada y los laboratorios virtuales del

material

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

16

Figura 3 Portada del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

Figura 4 Laboratorios virtuales del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por este motivo los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos multimedia estaacuten

concebidos de forma modular independientes escalables y adaptables presentados en

varios estantes de exhibicioacuten de plantas

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

17

El disentildeo graacutefico del multimedia educativo se elaboroacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual justificada pedagoacutegicamente y disentildeada

a partir de una composicioacuten equilibrada y agradable de ilustraciones vectoriales inspiradas

como se mencionoacute anteriormente en ambientes cotidianos de un vivero con el objetivo de

reforzar la temaacutetica general del material con el contexto en que se presentan los contenidos

De igual manera este recurso cuenta con algunos aportes del disentildeo universal como

su uso equiparable flexible informacioacuten perceptible y tolerancia al error aplicados en el

aacutembito educativo y que tambieacuten consideran aspectos importantes de accesibilidad e

inclusioacuten

Estos dos ejemplos de multimedia educativo producidos en el PEM aunados a

esfuerzos de investigacioacuten y capacitacioacuten a nivel interno del programa son los primeros

pasos hacia el desarrollo de nuevos materiales didaacutecticos maacutes accesibles e inclusivos como

el reciente desarrollo de los laboratorios virtuales para el aprendizaje que tienen como fin

seguir poniendo a disposicioacuten del estudiantado materiales de calidad que apoyen sus

procesos de aprendizaje a distancia y en congruencia con las nuevas posibilidades

tecnoloacutegicas especialmente de formato y medios de reproduccioacuten

9 Conclusiones

A partir de las experiencias generadas desde el PEM asiacute como de valoraciones

recibidas de otras instancias acadeacutemicas de la Universidad con las que se ha trabajado en

conjunto se presentan algunos factores a considerar a la hora de emprender una produccioacuten

de multimedia educativo que contemple algunos de los principios de disentildeo desarrollados

con anterioridad

El disentildeo adaptativo demanda una mayor reflexioacuten a la hora de planificar y concretar la

propuesta graacutefica y la disposicioacuten de contenidos porque se deben contemplar nuevos

escenarios y posibilidades en la visualizacioacuten de los multimedia educativos en tabletas y en

teleacutefonos inteligentes Eso no implica el sacrificio total o parcial de la graacutefica y los contenidos

dado que dichos elementos se vinculan entre siacute independientemente de la resolucioacuten de

pantalla del dispositivo Por lo anterior en los uacuteltimos 5 antildeos el programa ha estado

revisando perioacutedicamente los procesos de produccioacuten y flujos de trabajo con el propoacutesito de

responder a las necesidades actuales de contenidos maacutes accesibles e inclusivos

El disentildeo de la interfaz graacutefica debe conceptualizarse en una uacutenica propuesta simple

concreta escalable y adaptable para hacer maacutes eficiente su proceso de elaboracioacuten Este

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

18

cambio de paradigma obligoacute a replantear el flujo de trabajo en disentildeo ya que se pasoacute de

elaborar varias versiones de una interfaz seguacuten la resolucioacuten de pantalla del dispositivo a

concentrar los esfuerzos en una uacutenica propuesta centrada en los elementos y acciones maacutes

importantes de navegacioacuten lo cual contribuyoacute a mejorar tanto la experiencia como la

usabilidad del material pues todos sus elementos graacuteficos y de contenido se adaptan

El disentildeo universal aplicado en la interfaz converge con el disentildeo adaptativo en la

concrecioacuten de propuestas que evidencien accesibilidad e inclusioacuten en armoniacutea con la graacutefica

ya que los materiales estaacuten orientados a los y las estudiantes y de ellos depende el impacto

que puede tener lo que se disentildee Por lo anterior el disentildeo graacutefico es valorado desde una

perspectiva pedagoacutegica que permite generar empatiacutea y motivacioacuten para explorar los

contenidos Bajo esa premisa el PEM estaacute en constante investigacioacuten de nuevas

metodologiacuteas que contribuyan a mejorar la mediacioacuten de los contenidos asiacute como la

experiencia visual de la interfaz graacutefica de los materiales que desarrolla

Los multimedia educativos se deben producir en funcioacuten de las necesidades y

capacidades del estudiantado por lo tanto es necesario un mayor anaacutelisis del puacuteblico meta

con especial eacutenfasis en acceso y tipo de dispositivos asiacute como la forma en que los utilizan

para acceder a los materiales esto permitiraacute seleccionar los medios y elementos graacuteficos

que realmente contribuyan a la mediacioacuten de los contenidos

Es necesario ademaacutes mejorar los procesos de evaluacioacuten de los multimedia

educativos con el propoacutesito de saber si las metodologiacuteas de disentildeo y produccioacuten utilizadas

actualmente mejoran la accesibilidad e inclusioacuten de los materiales disponibles para el

estudiantado como apoyo en sus procesos de aprendizaje a distancia

Referencias

Burgstahler Sheryl (2007) Universal Design in Education Principles and Applications Recuperado de httpwwwwashingtonedudoitBrochuresAcademicsud_eduhtml

Diacuteaz Luis Fernando (2011) Principios sobre la metaacutefora pedagoacutegica Recuperado de

httpwwwluisfernandodiazcomp=105 Fornasari de Menegazzo Lilia (1994) Didaacutectica de la imagen Zaragoza Editorial Latina Fundacioacuten SIDAR (2007) Principios del disentildeo universal Recuperado de

httpwwwsidarorgrecurdesdiusabledudtphp Gilliam Scott Robert (1980) Fundamentos del disentildeo Buenos Aires Editorial U Leru

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

19

Gutieacuterrez Favio (2012) Principios fundamentales de la tipografiacutea Recuperado de httpwwwfaviogutierrezcomcategorytipografia

Mantildeas Moiseacutes (2011) Interfases Reglasteoacutericas Recuperado de

httppersonalesupvesmoimacarmasterdownloadinterfacespdf Misischia Bibiana (3 de setiembre de 2013) Supresioacuten de barreras en la universidad

Paacutegina12 Recuperado de httpwwwpagina12comardiariouniversidad10-228134-2013-09-03html

Morton Jill (2010) Why color matters Recuperado de

httpwwwcolorcomcomresearchwhy-color-matters Observatorio de la Accesibilidad (sf) Breve historia Recuperado de

httpwwwobservatoriodelaaccesibilidadesaccesibilidadbreve-historia Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura - Unesco

(2013) Directrices para las Poliacuteticas de Aprendizaje Moacutevil Recuperado de httpunesdocunescoorgimages0021002196219662Spdf

Rand Paul (2007) Design form and chaos Massachusetts Rockport Publishers Inc Real Academia Espantildeola (2001) Imagen En Diccionario de la lengua espantildeola (22ordf ed)

Recuperado de httpdleraeesid=KzwDY4y Rubio Manuel (1 de setiembre de 2013) iquestQueacute es Disentildeo Adaptativo Recuperado de

httpsmagazinejoomlaorgesediciones-anterioressept-2013item1514-que-es-diseno-adaptativo

Salazar Bejarano Ana Gabriela Berrocal Carvajal Viviana Salas Campos lleana y Valerio

Aacutelvarez Cinthya (2014) Propuesta para el desarrollo de una aplicacioacuten para la gestioacuten administrativa en la UNED Costa Rica Revista Innovaciones Educativas 16(21) 1-11

Shneiderman Ben (1998) Designing the user interface Strategies for effective human-

computer interaction Massachusetts Addison-Wesley Pub Co Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfa) Geometriacutea Euclidea Recuperado de httprepositoriounedaccrmultimediasgeometria_euclideaindexhtml

Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb) Meacutetodos numeacutericos para la ensentildeanza Recuperado de httprepositoriounedaccrmultimediasmetodos_numericos_ensenanza

Velasco Santos Perla Laureano Cruces Ana Lilia Mora Torres Marta y Herrera Bautista

Miguel Aacutengel (octubre 2010) Disentildeo de agentes pedagoacutegicos a partir de los estilos de aprendizaje una perspectiva a traveacutes del color Ponencia presentada en el IV Congreso Mundial de Estilos de Aprendizaje Recuperado de httpkaliazcuammxclc02_publicacionesmaterialDiseC3B1o_de_AvataresPerspColor_10pdf

Page 17: El diseño universal en la interfaz gráfica de multimedia ... · El diseño universal en la interfaz gráfica de multimedia educativo ... aporte de otras metodologías como el diseño

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

16

Figura 3 Portada del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

Figura 4 Laboratorios virtuales del multimedia educativo Geometriacutea Eucliacutedea

Fuente Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb)

La interfaz graacutefica se elaboroacute en HTML5 con disentildeo adaptativo por este motivo los

diferentes elementos graacuteficos de navegacioacuten menuacutes y recursos multimedia estaacuten

concebidos de forma modular independientes escalables y adaptables presentados en

varios estantes de exhibicioacuten de plantas

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

17

El disentildeo graacutefico del multimedia educativo se elaboroacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual justificada pedagoacutegicamente y disentildeada

a partir de una composicioacuten equilibrada y agradable de ilustraciones vectoriales inspiradas

como se mencionoacute anteriormente en ambientes cotidianos de un vivero con el objetivo de

reforzar la temaacutetica general del material con el contexto en que se presentan los contenidos

De igual manera este recurso cuenta con algunos aportes del disentildeo universal como

su uso equiparable flexible informacioacuten perceptible y tolerancia al error aplicados en el

aacutembito educativo y que tambieacuten consideran aspectos importantes de accesibilidad e

inclusioacuten

Estos dos ejemplos de multimedia educativo producidos en el PEM aunados a

esfuerzos de investigacioacuten y capacitacioacuten a nivel interno del programa son los primeros

pasos hacia el desarrollo de nuevos materiales didaacutecticos maacutes accesibles e inclusivos como

el reciente desarrollo de los laboratorios virtuales para el aprendizaje que tienen como fin

seguir poniendo a disposicioacuten del estudiantado materiales de calidad que apoyen sus

procesos de aprendizaje a distancia y en congruencia con las nuevas posibilidades

tecnoloacutegicas especialmente de formato y medios de reproduccioacuten

9 Conclusiones

A partir de las experiencias generadas desde el PEM asiacute como de valoraciones

recibidas de otras instancias acadeacutemicas de la Universidad con las que se ha trabajado en

conjunto se presentan algunos factores a considerar a la hora de emprender una produccioacuten

de multimedia educativo que contemple algunos de los principios de disentildeo desarrollados

con anterioridad

El disentildeo adaptativo demanda una mayor reflexioacuten a la hora de planificar y concretar la

propuesta graacutefica y la disposicioacuten de contenidos porque se deben contemplar nuevos

escenarios y posibilidades en la visualizacioacuten de los multimedia educativos en tabletas y en

teleacutefonos inteligentes Eso no implica el sacrificio total o parcial de la graacutefica y los contenidos

dado que dichos elementos se vinculan entre siacute independientemente de la resolucioacuten de

pantalla del dispositivo Por lo anterior en los uacuteltimos 5 antildeos el programa ha estado

revisando perioacutedicamente los procesos de produccioacuten y flujos de trabajo con el propoacutesito de

responder a las necesidades actuales de contenidos maacutes accesibles e inclusivos

El disentildeo de la interfaz graacutefica debe conceptualizarse en una uacutenica propuesta simple

concreta escalable y adaptable para hacer maacutes eficiente su proceso de elaboracioacuten Este

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

18

cambio de paradigma obligoacute a replantear el flujo de trabajo en disentildeo ya que se pasoacute de

elaborar varias versiones de una interfaz seguacuten la resolucioacuten de pantalla del dispositivo a

concentrar los esfuerzos en una uacutenica propuesta centrada en los elementos y acciones maacutes

importantes de navegacioacuten lo cual contribuyoacute a mejorar tanto la experiencia como la

usabilidad del material pues todos sus elementos graacuteficos y de contenido se adaptan

El disentildeo universal aplicado en la interfaz converge con el disentildeo adaptativo en la

concrecioacuten de propuestas que evidencien accesibilidad e inclusioacuten en armoniacutea con la graacutefica

ya que los materiales estaacuten orientados a los y las estudiantes y de ellos depende el impacto

que puede tener lo que se disentildee Por lo anterior el disentildeo graacutefico es valorado desde una

perspectiva pedagoacutegica que permite generar empatiacutea y motivacioacuten para explorar los

contenidos Bajo esa premisa el PEM estaacute en constante investigacioacuten de nuevas

metodologiacuteas que contribuyan a mejorar la mediacioacuten de los contenidos asiacute como la

experiencia visual de la interfaz graacutefica de los materiales que desarrolla

Los multimedia educativos se deben producir en funcioacuten de las necesidades y

capacidades del estudiantado por lo tanto es necesario un mayor anaacutelisis del puacuteblico meta

con especial eacutenfasis en acceso y tipo de dispositivos asiacute como la forma en que los utilizan

para acceder a los materiales esto permitiraacute seleccionar los medios y elementos graacuteficos

que realmente contribuyan a la mediacioacuten de los contenidos

Es necesario ademaacutes mejorar los procesos de evaluacioacuten de los multimedia

educativos con el propoacutesito de saber si las metodologiacuteas de disentildeo y produccioacuten utilizadas

actualmente mejoran la accesibilidad e inclusioacuten de los materiales disponibles para el

estudiantado como apoyo en sus procesos de aprendizaje a distancia

Referencias

Burgstahler Sheryl (2007) Universal Design in Education Principles and Applications Recuperado de httpwwwwashingtonedudoitBrochuresAcademicsud_eduhtml

Diacuteaz Luis Fernando (2011) Principios sobre la metaacutefora pedagoacutegica Recuperado de

httpwwwluisfernandodiazcomp=105 Fornasari de Menegazzo Lilia (1994) Didaacutectica de la imagen Zaragoza Editorial Latina Fundacioacuten SIDAR (2007) Principios del disentildeo universal Recuperado de

httpwwwsidarorgrecurdesdiusabledudtphp Gilliam Scott Robert (1980) Fundamentos del disentildeo Buenos Aires Editorial U Leru

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

19

Gutieacuterrez Favio (2012) Principios fundamentales de la tipografiacutea Recuperado de httpwwwfaviogutierrezcomcategorytipografia

Mantildeas Moiseacutes (2011) Interfases Reglasteoacutericas Recuperado de

httppersonalesupvesmoimacarmasterdownloadinterfacespdf Misischia Bibiana (3 de setiembre de 2013) Supresioacuten de barreras en la universidad

Paacutegina12 Recuperado de httpwwwpagina12comardiariouniversidad10-228134-2013-09-03html

Morton Jill (2010) Why color matters Recuperado de

httpwwwcolorcomcomresearchwhy-color-matters Observatorio de la Accesibilidad (sf) Breve historia Recuperado de

httpwwwobservatoriodelaaccesibilidadesaccesibilidadbreve-historia Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura - Unesco

(2013) Directrices para las Poliacuteticas de Aprendizaje Moacutevil Recuperado de httpunesdocunescoorgimages0021002196219662Spdf

Rand Paul (2007) Design form and chaos Massachusetts Rockport Publishers Inc Real Academia Espantildeola (2001) Imagen En Diccionario de la lengua espantildeola (22ordf ed)

Recuperado de httpdleraeesid=KzwDY4y Rubio Manuel (1 de setiembre de 2013) iquestQueacute es Disentildeo Adaptativo Recuperado de

httpsmagazinejoomlaorgesediciones-anterioressept-2013item1514-que-es-diseno-adaptativo

Salazar Bejarano Ana Gabriela Berrocal Carvajal Viviana Salas Campos lleana y Valerio

Aacutelvarez Cinthya (2014) Propuesta para el desarrollo de una aplicacioacuten para la gestioacuten administrativa en la UNED Costa Rica Revista Innovaciones Educativas 16(21) 1-11

Shneiderman Ben (1998) Designing the user interface Strategies for effective human-

computer interaction Massachusetts Addison-Wesley Pub Co Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfa) Geometriacutea Euclidea Recuperado de httprepositoriounedaccrmultimediasgeometria_euclideaindexhtml

Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb) Meacutetodos numeacutericos para la ensentildeanza Recuperado de httprepositoriounedaccrmultimediasmetodos_numericos_ensenanza

Velasco Santos Perla Laureano Cruces Ana Lilia Mora Torres Marta y Herrera Bautista

Miguel Aacutengel (octubre 2010) Disentildeo de agentes pedagoacutegicos a partir de los estilos de aprendizaje una perspectiva a traveacutes del color Ponencia presentada en el IV Congreso Mundial de Estilos de Aprendizaje Recuperado de httpkaliazcuammxclc02_publicacionesmaterialDiseC3B1o_de_AvataresPerspColor_10pdf

Page 18: El diseño universal en la interfaz gráfica de multimedia ... · El diseño universal en la interfaz gráfica de multimedia educativo ... aporte de otras metodologías como el diseño

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

17

El disentildeo graacutefico del multimedia educativo se elaboroacute a partir de la concrecioacuten de la

metaacutefora pedagoacutegica y es una representacioacuten visual justificada pedagoacutegicamente y disentildeada

a partir de una composicioacuten equilibrada y agradable de ilustraciones vectoriales inspiradas

como se mencionoacute anteriormente en ambientes cotidianos de un vivero con el objetivo de

reforzar la temaacutetica general del material con el contexto en que se presentan los contenidos

De igual manera este recurso cuenta con algunos aportes del disentildeo universal como

su uso equiparable flexible informacioacuten perceptible y tolerancia al error aplicados en el

aacutembito educativo y que tambieacuten consideran aspectos importantes de accesibilidad e

inclusioacuten

Estos dos ejemplos de multimedia educativo producidos en el PEM aunados a

esfuerzos de investigacioacuten y capacitacioacuten a nivel interno del programa son los primeros

pasos hacia el desarrollo de nuevos materiales didaacutecticos maacutes accesibles e inclusivos como

el reciente desarrollo de los laboratorios virtuales para el aprendizaje que tienen como fin

seguir poniendo a disposicioacuten del estudiantado materiales de calidad que apoyen sus

procesos de aprendizaje a distancia y en congruencia con las nuevas posibilidades

tecnoloacutegicas especialmente de formato y medios de reproduccioacuten

9 Conclusiones

A partir de las experiencias generadas desde el PEM asiacute como de valoraciones

recibidas de otras instancias acadeacutemicas de la Universidad con las que se ha trabajado en

conjunto se presentan algunos factores a considerar a la hora de emprender una produccioacuten

de multimedia educativo que contemple algunos de los principios de disentildeo desarrollados

con anterioridad

El disentildeo adaptativo demanda una mayor reflexioacuten a la hora de planificar y concretar la

propuesta graacutefica y la disposicioacuten de contenidos porque se deben contemplar nuevos

escenarios y posibilidades en la visualizacioacuten de los multimedia educativos en tabletas y en

teleacutefonos inteligentes Eso no implica el sacrificio total o parcial de la graacutefica y los contenidos

dado que dichos elementos se vinculan entre siacute independientemente de la resolucioacuten de

pantalla del dispositivo Por lo anterior en los uacuteltimos 5 antildeos el programa ha estado

revisando perioacutedicamente los procesos de produccioacuten y flujos de trabajo con el propoacutesito de

responder a las necesidades actuales de contenidos maacutes accesibles e inclusivos

El disentildeo de la interfaz graacutefica debe conceptualizarse en una uacutenica propuesta simple

concreta escalable y adaptable para hacer maacutes eficiente su proceso de elaboracioacuten Este

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

18

cambio de paradigma obligoacute a replantear el flujo de trabajo en disentildeo ya que se pasoacute de

elaborar varias versiones de una interfaz seguacuten la resolucioacuten de pantalla del dispositivo a

concentrar los esfuerzos en una uacutenica propuesta centrada en los elementos y acciones maacutes

importantes de navegacioacuten lo cual contribuyoacute a mejorar tanto la experiencia como la

usabilidad del material pues todos sus elementos graacuteficos y de contenido se adaptan

El disentildeo universal aplicado en la interfaz converge con el disentildeo adaptativo en la

concrecioacuten de propuestas que evidencien accesibilidad e inclusioacuten en armoniacutea con la graacutefica

ya que los materiales estaacuten orientados a los y las estudiantes y de ellos depende el impacto

que puede tener lo que se disentildee Por lo anterior el disentildeo graacutefico es valorado desde una

perspectiva pedagoacutegica que permite generar empatiacutea y motivacioacuten para explorar los

contenidos Bajo esa premisa el PEM estaacute en constante investigacioacuten de nuevas

metodologiacuteas que contribuyan a mejorar la mediacioacuten de los contenidos asiacute como la

experiencia visual de la interfaz graacutefica de los materiales que desarrolla

Los multimedia educativos se deben producir en funcioacuten de las necesidades y

capacidades del estudiantado por lo tanto es necesario un mayor anaacutelisis del puacuteblico meta

con especial eacutenfasis en acceso y tipo de dispositivos asiacute como la forma en que los utilizan

para acceder a los materiales esto permitiraacute seleccionar los medios y elementos graacuteficos

que realmente contribuyan a la mediacioacuten de los contenidos

Es necesario ademaacutes mejorar los procesos de evaluacioacuten de los multimedia

educativos con el propoacutesito de saber si las metodologiacuteas de disentildeo y produccioacuten utilizadas

actualmente mejoran la accesibilidad e inclusioacuten de los materiales disponibles para el

estudiantado como apoyo en sus procesos de aprendizaje a distancia

Referencias

Burgstahler Sheryl (2007) Universal Design in Education Principles and Applications Recuperado de httpwwwwashingtonedudoitBrochuresAcademicsud_eduhtml

Diacuteaz Luis Fernando (2011) Principios sobre la metaacutefora pedagoacutegica Recuperado de

httpwwwluisfernandodiazcomp=105 Fornasari de Menegazzo Lilia (1994) Didaacutectica de la imagen Zaragoza Editorial Latina Fundacioacuten SIDAR (2007) Principios del disentildeo universal Recuperado de

httpwwwsidarorgrecurdesdiusabledudtphp Gilliam Scott Robert (1980) Fundamentos del disentildeo Buenos Aires Editorial U Leru

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

19

Gutieacuterrez Favio (2012) Principios fundamentales de la tipografiacutea Recuperado de httpwwwfaviogutierrezcomcategorytipografia

Mantildeas Moiseacutes (2011) Interfases Reglasteoacutericas Recuperado de

httppersonalesupvesmoimacarmasterdownloadinterfacespdf Misischia Bibiana (3 de setiembre de 2013) Supresioacuten de barreras en la universidad

Paacutegina12 Recuperado de httpwwwpagina12comardiariouniversidad10-228134-2013-09-03html

Morton Jill (2010) Why color matters Recuperado de

httpwwwcolorcomcomresearchwhy-color-matters Observatorio de la Accesibilidad (sf) Breve historia Recuperado de

httpwwwobservatoriodelaaccesibilidadesaccesibilidadbreve-historia Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura - Unesco

(2013) Directrices para las Poliacuteticas de Aprendizaje Moacutevil Recuperado de httpunesdocunescoorgimages0021002196219662Spdf

Rand Paul (2007) Design form and chaos Massachusetts Rockport Publishers Inc Real Academia Espantildeola (2001) Imagen En Diccionario de la lengua espantildeola (22ordf ed)

Recuperado de httpdleraeesid=KzwDY4y Rubio Manuel (1 de setiembre de 2013) iquestQueacute es Disentildeo Adaptativo Recuperado de

httpsmagazinejoomlaorgesediciones-anterioressept-2013item1514-que-es-diseno-adaptativo

Salazar Bejarano Ana Gabriela Berrocal Carvajal Viviana Salas Campos lleana y Valerio

Aacutelvarez Cinthya (2014) Propuesta para el desarrollo de una aplicacioacuten para la gestioacuten administrativa en la UNED Costa Rica Revista Innovaciones Educativas 16(21) 1-11

Shneiderman Ben (1998) Designing the user interface Strategies for effective human-

computer interaction Massachusetts Addison-Wesley Pub Co Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfa) Geometriacutea Euclidea Recuperado de httprepositoriounedaccrmultimediasgeometria_euclideaindexhtml

Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb) Meacutetodos numeacutericos para la ensentildeanza Recuperado de httprepositoriounedaccrmultimediasmetodos_numericos_ensenanza

Velasco Santos Perla Laureano Cruces Ana Lilia Mora Torres Marta y Herrera Bautista

Miguel Aacutengel (octubre 2010) Disentildeo de agentes pedagoacutegicos a partir de los estilos de aprendizaje una perspectiva a traveacutes del color Ponencia presentada en el IV Congreso Mundial de Estilos de Aprendizaje Recuperado de httpkaliazcuammxclc02_publicacionesmaterialDiseC3B1o_de_AvataresPerspColor_10pdf

Page 19: El diseño universal en la interfaz gráfica de multimedia ... · El diseño universal en la interfaz gráfica de multimedia educativo ... aporte de otras metodologías como el diseño

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

18

cambio de paradigma obligoacute a replantear el flujo de trabajo en disentildeo ya que se pasoacute de

elaborar varias versiones de una interfaz seguacuten la resolucioacuten de pantalla del dispositivo a

concentrar los esfuerzos en una uacutenica propuesta centrada en los elementos y acciones maacutes

importantes de navegacioacuten lo cual contribuyoacute a mejorar tanto la experiencia como la

usabilidad del material pues todos sus elementos graacuteficos y de contenido se adaptan

El disentildeo universal aplicado en la interfaz converge con el disentildeo adaptativo en la

concrecioacuten de propuestas que evidencien accesibilidad e inclusioacuten en armoniacutea con la graacutefica

ya que los materiales estaacuten orientados a los y las estudiantes y de ellos depende el impacto

que puede tener lo que se disentildee Por lo anterior el disentildeo graacutefico es valorado desde una

perspectiva pedagoacutegica que permite generar empatiacutea y motivacioacuten para explorar los

contenidos Bajo esa premisa el PEM estaacute en constante investigacioacuten de nuevas

metodologiacuteas que contribuyan a mejorar la mediacioacuten de los contenidos asiacute como la

experiencia visual de la interfaz graacutefica de los materiales que desarrolla

Los multimedia educativos se deben producir en funcioacuten de las necesidades y

capacidades del estudiantado por lo tanto es necesario un mayor anaacutelisis del puacuteblico meta

con especial eacutenfasis en acceso y tipo de dispositivos asiacute como la forma en que los utilizan

para acceder a los materiales esto permitiraacute seleccionar los medios y elementos graacuteficos

que realmente contribuyan a la mediacioacuten de los contenidos

Es necesario ademaacutes mejorar los procesos de evaluacioacuten de los multimedia

educativos con el propoacutesito de saber si las metodologiacuteas de disentildeo y produccioacuten utilizadas

actualmente mejoran la accesibilidad e inclusioacuten de los materiales disponibles para el

estudiantado como apoyo en sus procesos de aprendizaje a distancia

Referencias

Burgstahler Sheryl (2007) Universal Design in Education Principles and Applications Recuperado de httpwwwwashingtonedudoitBrochuresAcademicsud_eduhtml

Diacuteaz Luis Fernando (2011) Principios sobre la metaacutefora pedagoacutegica Recuperado de

httpwwwluisfernandodiazcomp=105 Fornasari de Menegazzo Lilia (1994) Didaacutectica de la imagen Zaragoza Editorial Latina Fundacioacuten SIDAR (2007) Principios del disentildeo universal Recuperado de

httpwwwsidarorgrecurdesdiusabledudtphp Gilliam Scott Robert (1980) Fundamentos del disentildeo Buenos Aires Editorial U Leru

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

19

Gutieacuterrez Favio (2012) Principios fundamentales de la tipografiacutea Recuperado de httpwwwfaviogutierrezcomcategorytipografia

Mantildeas Moiseacutes (2011) Interfases Reglasteoacutericas Recuperado de

httppersonalesupvesmoimacarmasterdownloadinterfacespdf Misischia Bibiana (3 de setiembre de 2013) Supresioacuten de barreras en la universidad

Paacutegina12 Recuperado de httpwwwpagina12comardiariouniversidad10-228134-2013-09-03html

Morton Jill (2010) Why color matters Recuperado de

httpwwwcolorcomcomresearchwhy-color-matters Observatorio de la Accesibilidad (sf) Breve historia Recuperado de

httpwwwobservatoriodelaaccesibilidadesaccesibilidadbreve-historia Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura - Unesco

(2013) Directrices para las Poliacuteticas de Aprendizaje Moacutevil Recuperado de httpunesdocunescoorgimages0021002196219662Spdf

Rand Paul (2007) Design form and chaos Massachusetts Rockport Publishers Inc Real Academia Espantildeola (2001) Imagen En Diccionario de la lengua espantildeola (22ordf ed)

Recuperado de httpdleraeesid=KzwDY4y Rubio Manuel (1 de setiembre de 2013) iquestQueacute es Disentildeo Adaptativo Recuperado de

httpsmagazinejoomlaorgesediciones-anterioressept-2013item1514-que-es-diseno-adaptativo

Salazar Bejarano Ana Gabriela Berrocal Carvajal Viviana Salas Campos lleana y Valerio

Aacutelvarez Cinthya (2014) Propuesta para el desarrollo de una aplicacioacuten para la gestioacuten administrativa en la UNED Costa Rica Revista Innovaciones Educativas 16(21) 1-11

Shneiderman Ben (1998) Designing the user interface Strategies for effective human-

computer interaction Massachusetts Addison-Wesley Pub Co Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfa) Geometriacutea Euclidea Recuperado de httprepositoriounedaccrmultimediasgeometria_euclideaindexhtml

Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb) Meacutetodos numeacutericos para la ensentildeanza Recuperado de httprepositoriounedaccrmultimediasmetodos_numericos_ensenanza

Velasco Santos Perla Laureano Cruces Ana Lilia Mora Torres Marta y Herrera Bautista

Miguel Aacutengel (octubre 2010) Disentildeo de agentes pedagoacutegicos a partir de los estilos de aprendizaje una perspectiva a traveacutes del color Ponencia presentada en el IV Congreso Mundial de Estilos de Aprendizaje Recuperado de httpkaliazcuammxclc02_publicacionesmaterialDiseC3B1o_de_AvataresPerspColor_10pdf

Page 20: El diseño universal en la interfaz gráfica de multimedia ... · El diseño universal en la interfaz gráfica de multimedia educativo ... aporte de otras metodologías como el diseño

Revista Electroacutenica ldquoActualidades Investigativas en Educacioacutenrdquo

______________________________________________________________Volumen 17 Nuacutemero 3 Antildeo 2017 ISSN 1409-4703

19

Gutieacuterrez Favio (2012) Principios fundamentales de la tipografiacutea Recuperado de httpwwwfaviogutierrezcomcategorytipografia

Mantildeas Moiseacutes (2011) Interfases Reglasteoacutericas Recuperado de

httppersonalesupvesmoimacarmasterdownloadinterfacespdf Misischia Bibiana (3 de setiembre de 2013) Supresioacuten de barreras en la universidad

Paacutegina12 Recuperado de httpwwwpagina12comardiariouniversidad10-228134-2013-09-03html

Morton Jill (2010) Why color matters Recuperado de

httpwwwcolorcomcomresearchwhy-color-matters Observatorio de la Accesibilidad (sf) Breve historia Recuperado de

httpwwwobservatoriodelaaccesibilidadesaccesibilidadbreve-historia Organizacioacuten de las Naciones Unidas para la Educacioacuten la Ciencia y la Cultura - Unesco

(2013) Directrices para las Poliacuteticas de Aprendizaje Moacutevil Recuperado de httpunesdocunescoorgimages0021002196219662Spdf

Rand Paul (2007) Design form and chaos Massachusetts Rockport Publishers Inc Real Academia Espantildeola (2001) Imagen En Diccionario de la lengua espantildeola (22ordf ed)

Recuperado de httpdleraeesid=KzwDY4y Rubio Manuel (1 de setiembre de 2013) iquestQueacute es Disentildeo Adaptativo Recuperado de

httpsmagazinejoomlaorgesediciones-anterioressept-2013item1514-que-es-diseno-adaptativo

Salazar Bejarano Ana Gabriela Berrocal Carvajal Viviana Salas Campos lleana y Valerio

Aacutelvarez Cinthya (2014) Propuesta para el desarrollo de una aplicacioacuten para la gestioacuten administrativa en la UNED Costa Rica Revista Innovaciones Educativas 16(21) 1-11

Shneiderman Ben (1998) Designing the user interface Strategies for effective human-

computer interaction Massachusetts Addison-Wesley Pub Co Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfa) Geometriacutea Euclidea Recuperado de httprepositoriounedaccrmultimediasgeometria_euclideaindexhtml

Universidad Estatal a Distancia de Costa Rica y Programa de Produccioacuten Electroacutenica

Multimedial (sfb) Meacutetodos numeacutericos para la ensentildeanza Recuperado de httprepositoriounedaccrmultimediasmetodos_numericos_ensenanza

Velasco Santos Perla Laureano Cruces Ana Lilia Mora Torres Marta y Herrera Bautista

Miguel Aacutengel (octubre 2010) Disentildeo de agentes pedagoacutegicos a partir de los estilos de aprendizaje una perspectiva a traveacutes del color Ponencia presentada en el IV Congreso Mundial de Estilos de Aprendizaje Recuperado de httpkaliazcuammxclc02_publicacionesmaterialDiseC3B1o_de_AvataresPerspColor_10pdf