“Imitar papel en la pantalla de una computadora es como arrancar las alas de un 747 y usarlo como autobús en la carretera”. (Ted Nelson, 1999) El paso final del proceso de planeación es fundamental y crítico: elegir el empaque del curso.
Hay una variedad de elementos que son importantes en este proceso, incluyendo la estructura general del contenido, la secuencia, el flujo y la estimulación. La estructura de la presentación también es importante, e incluye consideraciones como el tono y el estado de ánimo proyectados en el texto y 'sensación' del sitio, incluyendo la coherencia, consistencia, navegación, uso estético de colores y gráficos, y las fuentes de texto utilizadas en la interfaz general del sitio del curso. Los componentes importantes se discuten en la siguiente sección.
Unidades de Estudio
Un enfoque uniforme para presentar las unidades de estudio no solo tiene sentido, sino que ayuda a reforzar el aprendizaje. Un modo común de organización es un enfoque jerárquico de módulo, secciones, clases, actividades de apoyo. Dentro de cada actividad de aprendizaje, la uniformidad también ayuda a guiar a los estudiantes a través del contenido. Una manera fácil de organizar las unidades es de lo general a lo específico, comenzando con unidades enfocadas en principios básicos y luego trabajando hasta temas de contenido únicos y específicos. Por ejemplo, un curso sobre diseño de investigación podría comenzar con unidades enfocadas en el proceso general de investigación, búsquedas literarias y similares, luego pasar a procesos específicos de diseño de investigación como el diseño cuantitativo experimental o los métodos cualitativos fenomenológicos.
Estructura
Se debe utilizar una estructura consistente para presentar las unidades de estudio. La información, la ayuda, los recursos y otras secciones deben colocarse en la misma área de la página, a través de pantallas y secciones. El uso generoso del espacio en blanco ayuda a mantener esta estructura accesible y visualmente atractiva para los alumnos. Las actividades de aprendizaje también deben tener una estructura consistente. Un método común es usar una plantilla de lección que incluya títulos como Visión General, Objetivos, En Preparación, Actividades en Clase e Individuales, Reflexión, Actividades o Recursos de Enriquecimiento y Referencias.
La estructura de back-end que apoya el entorno del alumno también debe pensarse cuidadosamente. Se necesitan carpetas o bases de datos para cada grupo o clúster de archivos. Una práctica común es agrupar todas las imágenes en una base de datos o carpeta de imágenes; todas las multimedia en una base de datos o carpeta multimedia; todo el audio en una carpeta separada, y así sucesivamente. Esto no solo ayuda al instructor a encontrar los componentes necesarios, sino que también facilita las actualizaciones y la edición, y facilita la descarga y carga de archivos desde el sitio web del curso.
Secuencia
Un plan para presentar todo el contenido y las actividades en un flujo secuencial es importante para garantizar que los alumnos tengan acceso instantáneo al contenido actual y archivado, y no se pierdan las piezas críticas. La secuenciación seguiría las unidades de estudio y estructura determinadas de antemano, pasando de lo general a lo específico. Esta secuenciación se ve mejor como un menú específico o mapa del sitio, donde los estudiantes pueden obtener una vista de todo el contenido del curso en una pantalla.
Flujo
El flujo se logra presentando el contenido secuencial de una manera intuitiva pero lógica. También se ve potenciada por una navegación clara y consistente y el posicionamiento de los elementos de la pantalla. El alumno debe saber inmediatamente a dónde ir a continuación, sin confusiones ni recurrir a prueba y error haciendo clic en varios botones de navegación o títulos.
Marcapasos
Lo mejor es mantener pequeñas las áreas de texto, para que el contenido del curso se presente en trozos, limitando la cantidad de texto que se presenta en cada pantalla. Las líneas cortas de 40 a 60 caracteres cada una son las mejores. El uso de tablas, gráficos, listas con viñetas y otros organizadores ayudan a aumentar el atractivo visible y reforzar el aprendizaje. Si es posible, evite las páginas largas de desplazamiento vertical; a toda costa.
Tono
El equipo de diseño debe encontrar formas de presentar archivos de ayuda, contenido del curso y otras indicaciones textuales utilizando una voz activa, segunda persona, tiempo presente y un tono conversacional en el diseño del curso. El lenguaje debe ser conciso y consistente. También es mejor evitar el lenguaje y los ejemplos que inhiban la “vida útil” del sitio, como “Ahora en 2008...”.
Coherencia
El equipo de diseño debe asegurarse de que el diseño de cada pantalla sea claro, agradable a la vista y se ajuste al diseño de texto occidental de los estándares de texto de izquierda a derecha, de arriba a abajo, ya que así es como suelen leer los alumnos. Puede ser muy confuso si sus ojos necesitan lanzarse por toda la pantalla para entender lo que tiene ante ellos: esto puede causar tanto disonancia como confusión.
Consistencia
Es importante mantener el diseño general del layout de las pantallas del curso consistente en tamaño, estructura, color, colocación de elementos y uso de fuentes. También es importante asegurarse de que la apariencia y utilidad del sitio sea consistente en todos los navegadores (por ejemplo, el sitio debe verse y actuar igual en Internet Explorer y Firefox). Se deben hacer esfuerzos para facilitar los tiempos de descarga y carga de la pantalla en todos los modos de acceso a Internet, incluido el acceso de banda ancha y acceso de marcación Esto significa mantener el tamaño de los archivos gráficos, de audio, multimedia y de texto compacto y de tamaño razonable, y optimizado para una carga y descarga rápidas. Además, los alumnos deben poder subir archivos al área del curso en unos segundos, y sin que se estrelle sus sistemas ni se congele la pantalla del navegador web.
Navegación
La navegación en línea es como el sistema nervioso del cuerpo humano. Conecta todos los elementos del curso, permitiendo el movimiento y el flujo a medida que los alumnos exploran el curso. La clave para diseñar la navegación es elegir un método uniforme y atenerse a él de manera consistente en todo el sitio del curso. La navegación puede ser tan simple como un conjunto de botones uniformes colocados estratégicamente en el mismo lugar en cada página. O puede consistir en paneles basados en Java o “hot spots” animados de Flash en un mapa de imagen.
Los menús gráficos y los elementos de navegación ayudan a guiar intuitivamente al alumno a través del entorno en línea del curso. Lo mejor es planificar la navegación para darle al alumno control sobre qué secciones puede seleccionar para la navegación pero también proporcionar una “hoja de ruta” con secuencias de navegación sugeridas. Las secciones vinculadas a la navegación deben distinguirse de alguna manera de las partes estáticas no vinculadas del sitio (por ejemplo, usar un color diferente, iconos específicos, subrayado o cambios de texto roll-over). La consistencia en la navegación es importante para reducir la frustración del alumno y maximizar la experiencia de aprendizaje. Los botones de navegación deben estar claramente etiquetados, ser coherentes en todas las páginas y ser fáciles de ver y acceder.
Color
“El color nace de la interpenetración de la luz y la oscuridad”. (Sam Francis, 2003)
El color es una característica importante del diseño efectivo del curso. En primer lugar, lo mejor es elegir los colores que se incluyen en la paleta de colores de plataforma cruzada de 216 colores. Si bien esta precaución es cada vez menos crítica, ya que la mayoría de las computadoras modernas soportarán millones de colores, es seguro atenerse a esta regla para garantizar que los alumnos puedan acceder a la paleta general de 256 colores común en la mayoría de las computadoras fabricadas en los últimos diez años más o menos.
Los colores en la Web son siempre una mezcla de R (Rojo), G (Verde) y B (Azul). El valor R o G o B puede variar de 0 a 255, con 0 lo que significa que el valor de color (por ejemplo, la R) está desactivado, y 255 significa que el valor está completamente activado. Cada color de pantalla tiene un valor que le dice al diseñador cuánto de la R, G y B se muestra o está ausente. En el desarrollo de sitios web, los valores rojo, verde y azul se escriben como codificación hexadecimal de seis dígitos: una combinación de números del 0 al 9 y letras de la A a la F. Por ejemplo, el azul puro tiene un valor hexadecimal de 0000FF, y así sucesivamente. Para garantizar que los colores sean visibles según lo previsto, es aconsejable atenerse a la paleta de tonalidades seguras para la web. Esto se debe a que los colores seguros para el navegador no se difuminan. El tramado es lo que sucede cuando un color no está disponible en la paleta web, por lo que el navegador intenta compensar combinando píxeles de otros colores para sustituirlos. Los colores difuminados se ven ásperos e irregulares: los colores seguros para el navegador se mantienen suaves y uniformes.
El color también es una consideración muy importante para establecer el estado de ánimo, el tono y el atractivo visual de la interfaz del alumno del sitio del curso. Si es posible personalizar el esquema de color para cada curso, dedique tiempo en equipo a visualizar el paisaje o metáfora que sugiere el contenido del curso. Por ejemplo, un curso de biología general podría sugerir el uso de verdes compensados con marrones y blancos; mientras que un curso de metafísica podría sugerir el uso de morados, lilas, azules ricos compensados con blancos. Si quieres despertar a tu público aprendiz, iniciar acción o estimular emociones, un esquema de colores cálidos funciona mejor. Rojos, naranjas, amarillos todos hacen el truco. Si su estado de ánimo previsto es de calma, ocio o refinamiento digno, use colores más fríos: azules, púrpuras, verdes. Si tu declaración es audaz y al grano, los colores nítidos y contrastantes como el blanco y negro o el azul y el naranja funcionan bien.
Teoría básica del color
La teoría del color se centra en cómo se manifiesta el color en el espectro. La psicología del color va un paso más allá para asignar significados comunes o estados de ánimo a colores específicos. Para aplicarlos al diseño del curso, el equipo debe explorar el significado de los colores primarios, secundarios y terciarios, que son los colores más comunes utilizados en la World Wide Web. La figura\(\PageIndex{1}\) ilustra los 12 colores básicos de la rueda de colores.
Figura\(\PageIndex{1}\): La rueda de colores
Los colores primarios son los tres colores de pigmento que no se pueden mezclar ni formar por ninguna combinación de otros colores. Todos los demás colores se derivan de estos tres: rojo, azul y amarillo. Cada uno de estos colores puros despierta diferentes estados de ánimo y sentimientos en un espectador. La figura\(\PageIndex{2}\) ilustra los colores primarios.
Los colores secundarios se forman mezclando dos de los colores primarios juntos. Estos colores mezclados también evocan estados de ánimo particulares. La figura\(\PageIndex{3}\) ilustra los colores secundarios de la mezcla de dos colores primarios.
Naranja (rojo y amarillo) —cálido, otoñal, generoso, fuerte, fructífero, apetitoso
Púrpura (rojo y azul) —real, misterioso, orgullo, lujo, riqueza, sofisticación
Figura\(\PageIndex{3}\): Los colores secundarios
Los colores terciarios se forman mezclando los colores secundarios con los colores primarios. La rueda olour, ilustrada en la Figura,\(\PageIndex{1}\) da ejemplos de los seis colores terciarios entre los tres colores primarios y los tres secundarios.
Amarillo-naranja
Rojo-naranja
Rojo-Morado
Azul-púrpura
Azul-verde
Amarillo-verde
Los colores análogos son tres colores cualquiera que están uno al lado del otro en una rueda de colores de 12 partes. Los colores complementarios son dos colores que están directamente opuestos entre sí, como el rojo y el verde.
Por supuesto también hay blanco y negro, ambos colores muy comunes utilizados en los diseños de cursos.
Figura\(\PageIndex{4}\): Negro, blanco y gris
El negro es la ausencia de luz roja, azul y verde, mientras que el blanco es la saturación más pura de los tres. El blanco y negro más el gris se conocen como tonalidades no cromáticas.
El negro representa estilo, oscuro, misterio, formal, poderoso, autoridad.
El blanco es limpio, puro, castidad, inocencia, fresco, refrescante.
El gris es neutro, conservador, de color formal. El gris va desde el sofisticado gris carbón hasta la plata activa y energizante. También representa madurez, confiabilidad y seguridad.
Fuentes
Finalmente, las fuentes y adornos de texto se pueden utilizar para ayudar a mejorar la exhaustividad, presentación y accesibilidad del contenido. Use una fuente consistente (las comunes incluyen dos fuentes sans serif: Arial y Verdana, y dos fuentes serif, Times New Roman y Georgia) en todo el texto. La figura\(\PageIndex{6}\) muestra ejemplos de estas cuatro fuentes comunes. Use adornos en negrita y cursiva para darle énfasis. Utilice únicamente subrayados para enlaces reales. Evite usar todas las letras mayúsculas. Una buena regla general es usar el tamaño 11 para la fuente de texto general, 14 para los subtítulos, 16 para los títulos. Lo mejor es evitar parpadear el texto, ya que esto puede producir fatiga ocular y puede molestar a los alumnos. Además, las fuentes gráficas dingbat se pueden usar para crear iconos y otros gráficos de apoyo (Figura\(\PageIndex{5}\)).
Figura\(\PageIndex{5}\): Ejemplos de imágenes de fuentes dingbat creadas con la fuente WingdingFigura\(\PageIndex{6}\): Ejemplos de fuentes de texto Arial, Verdana, Times New Roman y Georgia
