Saltar al contenido principal
pdf?stylesheet=default
Blackboard Help

Recomendación de uso: Personalización de una marca

Crear una marca personalizada para su institución es una forma directa de extender su logotipo, colores e información crítica a sus usuarios. Una marca personalizada comunica la personalidad de su institución, su voz, sus compromisos y sus servicios. Las formas de personalización de su marca son muy diversas,  desde las más sencillas, hasta las más complejas.

Antes de comenzar a personalizar su marca, márquese los objetivos de la personalización y planifique cómo los conseguirá.

  • Identifique el ámbito de la personalización y seleccione el método más apropiado y sencillo para conseguirlo. Por ejemplo, no es necesario crear un tema del sistema personalizado solamente para añadir colores de la institución y un logotipo. Puede cambiar los colores y añadir un logotipo personalizando la marca predeterminada
  • Investigue un poco la identidad de la institución para asegurarse de que cumple las pautas de estilo y marca establecidas.
  • Cree una maqueta durante la fase de diseño de un página de inicio de sesión, una página de puerta de enlace y un tema de sistema personalizados.
  • Calcule bien el tiempo de desarrollo para el diseño y la prueba de las paletas y los temas personalizados.
  • Cree un plan para el control de calidad y el mantenimiento de los temas del sistema personalizados.

File:es-es/Learn/Sandbox/es-es/Learn/9.1_SP_12_and_SP_13/Administrator/180_User_Interface_Management/040_Brands_and_Themes/Best_Practice_Customizing_Brand/easy.png Página de inicio de sesión y página de puerta de enlace personalizadas

Página de inicio de sesión personalizada: una forma sencilla de comenzar a personalizar una marca es personalizar la página de inicio de sesión. La página de inicio de sesión es un único archivo que contiene su propio CSS y la mayor parte del marcado editable. Cambiar el diseño de la página de inicio de sesión no afecta al resto de la aplicación, por lo que el alcance del cambio es reducido. Para crear una página de inicio de sesión personalizada no es necesario tener experiencia con HTML ni CSS. También es necesario decidir dónde se almacenarán las imágenes asociadas. Si quiere más información, consulte Personalización de la página de inicio de sesión.

Página de puerta de enlace: la página de puerta de enlace es la primera página web que los usuarios ven al acceder a Blackboard (a menos que se omita este ajuste). Puede añadir un mensaje de bienvenida personalizado y una imagen o añadir módulos que contengan información crítica y oportuna. Para crear un módulo personalizado es necesario tener cierta experiencia con HTML y CSS. Si quiere más información, consulte Módulos y Personalización de la página de puerta de enlace.

Recomendaciones para el diseño de una página de portal

Las páginas de portal, como la de Mi institución, suele ser la primera pagina que ven los usuarios al entrar en Blackboard Learn. Cuidar el diseño y la disposición del contenido del módulo en esta página puede, por un lado, mejorar su marca y, por otro, mejorar la experiencia del usuario. Puede conseguirlo con dos pasos generales:

  1. Revisar todo el contenido del módulo para garantizar que no desentona con la marca recién aplicada. Durante el diseño el contenido del módulo, procure seguir las convenciones establecidas por el tema y la paleta elegidos. Pruebe a codificar el módulo en HTML para que el texto del módulo responda a los estilos de color y fuente que establecen el tema y la paleta. Algunos módulos utilizan una única imagen grande (a modo de un anuncio de encabezado en un sitio web) y así comunicar un mensaje. Las imágenes son necesarias para dar vida a la página, pero a veces el aspecto de un "anuncio de encabezado", cargado de texto del encabezado, texto de párrafo y gráficos, puede no sintonizar bien con el tema y la paleta de su marca. El uso de HTML garantiza la flexibilidad del módulo, ya que el tamaño del contenido puede cambiar con el tamaño de la ventana del navegador.
  2. Pruebe a definir una jerarquía visual para que el usuario pueda analizar fácilmente la página y encontrar contenido procesable. Por lo general, resulta más fácil decirlo que hacerlo. Como un portal incluye varios módulos con contenido diferente, con frecuencia tiene que responder a las necesidades de muchas partes diferentes. En ocasiones, cada una de estas partes quiere enfatizar su propio material. En términos generales, si se destacan igual todos los módulos, no destacará ninguno y puede dar lugar a confusión para el usuario. Pruebe a ver la página en su conjunto y organice los módulos para que el usuario pueda ver fácilmente el contenido principal.

Las demás recomendaciones relacionadas con el diseño de una página de portal no son específicas de este tipo de página, sino que seguramente incluirán máximas que ya haya tenido en consideración al diseñar el aspecto de su marca.

Accesibilidad

Estética

  • Use colores acordes a su marca y tema
  • Fuentes legibles
  • Use gráficos de alta calidad
  • Organice los módulos de modo que llenen toda la página
  • Cree una jerarquía visual para facilitar el análisis del contenido
  • Evite diseños de página abarrotados, ruidosos y masificados
  • Actualice el contenido de la página periódicamente
  • Si es posible, aplique las técnicas de diseño con capacidad de respuesta para que el tamaño del contenido sea adecuado en diferentes visualizaciones (http://en.wikipedia.org/wiki/Responsive_web_design)

Sugerencia

  • Si se siente limitado con el diseño de módulo predeterminado de Learn, considere la posibilidad de modificar la página de portal para utilizar una sola columna ocupada por un solo módulo HTML. Puede editar el HTML personalizado del único módulo para utilizar cualquier diseño que desee, para imitar las tendencias de otras páginas de índice.

File:es-es/Learn/Sandbox/es-es/Learn/9.1_SP_12_and_SP_13/Administrator/180_User_Interface_Management/040_Brands_and_Themes/Best_Practice_Customizing_Brand/sort-of-easy.png Controles de la interfaz gráfica

Controles de la interfaz gráfica: puede cambiar fácilmente el aspecto de su marca seleccionando un conjunto de colores y opciones de diseño para su instalación de Learn. Puede:

  • Cambiar el color de un conjunto limitado de elementos de interfaz de usuario
  • Especificar una imagen de logotipo e insertar un enlace a una URL específica
  • Seleccionar los colores y las opciones de diseño de la ficha del sistema.

No necesita conocimientos de HTML ni CSS para realizar estos cambios. Puede ver sus selecciones en el panel de vista preliminar antes de aplicar los cambios al sistema. Todas las opciones de color elegidas se pueden guardar como una Paleta de colores.

File:es-es/Learn/Sandbox/es-es/Learn/9.1_SP_12_and_SP_13/Administrator/180_User_Interface_Management/040_Brands_and_Themes/Best_Practice_Customizing_Brand/middle.png Paleta de colores y tema del sistema

Paleta de colores: Blackboard Learn incluye más de una docena de paletas de color. Puede seleccionar una de ellas para su marca predeterminada. Puede cambiar los colores de la paleta usando la interfaz de usuario o puede descargar la paleta y realizar cambios utilizando una herramienta de edición de texto o de CSS. 

Tema del sistema  : el tema del sistema es la capa de CSS que define el aspecto de su institución. Puede seleccionar un tema de los que proporciona Blackboard Learn o diseñar el suyo propio. La forma más fácil de crear su propio tema es descargar un tema existente y utilizarlo como plantilla. Realice los cambios necesarios utilizando una herramienta de edición de texto o de CSS. 

File:es-es/Learn/Sandbox/es-es/Learn/9.1_SP_12_and_SP_13/Administrator/180_User_Interface_Management/040_Brands_and_Themes/Best_Practice_Customizing_Brand/complex.png Paleta de colores personalizada

Paleta de colores personalizada: amplíe la personalización de la interfaz de usuario creando su propia paleta de colores acorde con el esquema de colores, el logotipo o la marca de su institución. Blackboard Learn cuenta con varias paletas de colores que aplican diferentes colores al sistema. Puede modificar una paleta de colores existente para que se asemeje a sus requisitos concretos.

Recomendaciones para el diseño de una paleta de colores personalizada

Al seleccionar colores para su paleta de colores personalizada, tenga presentes algunas de las siguientes recomendaciones.

  • Utilice los colores acordes a la identidad visual de su institución. Compruebe el manual de estilo de la institución para colores oficiales. Asegúrese de que las opciones de combinación de colores se traducen en un esquema de color adecuado para la interfaz de usuario.
  • Compruebe que los colores elegidos combinan bien y crean una experiencia visual armoniosa. Color Matters es un buen sitio web para aprender algunos aspectos sobre los esquemas de color monocromáticos, análogos y complementarios. Conocer la teoría del color facilita la selección de colores que combinan bien con su institución.

File:es-es/Learn/Sandbox/es-es/Learn/9.1_SP_12_and_SP_13/Administrator/180_User_Interface_Management/040_Brands_and_Themes/Best_Practice_Customizing_Brand/most-complex.png Tema del sistema personalizado

Tema del sistema personalizado: puede transformar completamente la interfaz de usuario de la instalación Learn de su institución creando un tema del sistema personalizado. Este es el método de personalización más costoso y profundo, pues requiere que se revisen y editen más de 12.000 líneas de código. Es la mejor opción para armonizar la interfaz de usuario de Blackboard Learn con la identidad visual de su institución, pero requiere pruebas constantes con cada nueva versión de Learn.

Recomendaciones para el diseño de un tema del sistema personalizado

El diseño del tema del sistema personalizado es una tarea compleja que en ningún caso debe considerarse un proyecto secundario. Necesitará una buena dosis de experiencia en CSS y DOM. Además, necesitará tener un entorno de desarrollo para desarrollar, probar y mantener el tema.

  • Colores: analice la identidad visual de su institución. Lo más probable es que su institución tenga un manual de estilo que incluya una sección sobre los colores de la marca de la institución. Asegúrese de que las opciones de combinación de colores se traducen en un esquema de color adecuado para la interfaz de usuario.
  • Armonía del color: tener conocimientos generales sobre los esquemas de color monocromáticos, análogos y complementarios facilita la elección de colores que combinan bien entre sí y con los de la marca de la institución.
  • Requisitos de accesibilidad: la familiaridad es un punto muy importante para garantizar que el tema del sistema resultante tenga contraste suficiente y sea accesible en otros aspectos (http://www.w3.org/TR/WCAG/)
  • Fuentes: debe especificar diferentes fuentes para su marca. Pruebe las fuentes para asegurarse de que se vean bien en otros sistemas operativos. También puede introducir fuentes personalizadas incluyéndolas en su tema y hacer referencia a ellas con una regla @font-face. Compruebe que las fuentes personalizadas sean compatibles con los idiomas en los que enseñe.
  • Iconos: puede rediseñar algunos iconos y utilizarlos en la aplicación como imágenes de fondo.

Administración de cambios para la marca personalizada

Cuando se evalúa y prueba una actualización, es fundamental que se descarguen y guarden las personalizaciones realizadas por si fuera necesario restaurarlas. Utilice la La herramienta Theme DIFF para comparar los cambios de CSS entre una versión de Learn y otra. Con esta herramienta resulta más fácil detectar dónde se han realizado los cambios en el CSS y así evaluar cómo afectan a las personalizaciones. 

Los elementos que definen una marca (normalmente, un tema, una paleta y un logo) son distintos del contenido de la página. Recuerde auditar el contenido de las páginas "públicas", como las páginas de Portal, para garantizar que sigue las pautas visuales que establece la marca.

Temas del sistema personalizados e instalación de Building Blocks nuevos

Si tiene un tema del sistema personalizado, puede que quiera extender las personalizaciones a páginas nuevas incluidas en un building block que ha instalado a través de actualizaciones de software. No todos los building blocks instalados de esta forma tienen hojas de estilos por cada herramienta, pero algunos sí.

Al instalar un building block que contenga sus propias hojas de estilos en un sistema que tenga, al menos, un tema personalizado, recibirá una confirmación durante la instalación. En esta confirmación se le recomienda contrastar la función con el tema personalizado, al igual que cuando se actualiza Learn. Recibirá este mensaje cuando el sistema tenga un tema personalizado ya instalado aunque este tema no se esté usando en ese momento. 

En el Panel del administrador hay información disponible sobre si un building block contiene hojas de estilos por cada herramienta para cualquier building block. En la sección Building Blocks, seleccione Building Blocks y Herramientas instaladas. Acceda al menú contextual de cualquier building block de la lista y seleccione  Ver componentes. Si el building block contiene hojas de estilo específicas por herramienta para cualquiera de los temas que se suministran con Learn, los controladores de los temas aparecerán en esta página.

Si administra sus temas personalizados almacenando copias de los paquetes sin conexión, actualice el paquete de temas personalizados sin conexión descargándolo desde la UI del Panel del administrador después de actualizar a SP14 para disponer de una copia con la nueva estructura de paquete introducida en ese service pack. No se harán cambios en las hojas de estilos ni ninguna otra modificación en el flujo de trabajo de personalización. Sin embargo, tras actualizar a SP14, los paquetes sin conexión de la estructura de paquete anterior ya no se podrán cargar (al intentarlo, aparecerá un mensaje de error).

Marcas diferentes para la misma instalación de Learn

Si su institución autoriza la implicación comunitaria, puede crear diferentes marcas para diferentes grupos de usuarios en función del rol que tengan en el sistema. Se han de crear nombres de host personalizados para permitir el uso de varias marcas en una sola instancia de Learn.