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 de sistema personalizado solo para agregar los colores de la institución y un logotipo. En cambio, intente cambiar los colores y agregar un logotipo al personalizar su 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 personalizados del sistema.

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. Para obtener más información, consulte Personalizar la Página principal.

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. Para obtener más información, consulte Módulos y Personalizar la Página de puerta de enlace.

Mejores prácticas al diseñar 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

  • Use Relaciones de contraste accesibles
  • Facilite la legibilidad del texto eligiendo las fuentes, los tamaños y el espacio interlineal apropiados
  • Evite el uso de imágenes en el texto
  • Evite los fondos con texturas
  • Asegúrese de que los nombres de los enlaces son significativos, en lugar de limitarse a indicar "haga clic aquí"
  • Incluya enlaces a W3C y nuestras páginas de 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
  • De ser posible, aplique Técnicas de diseño con capacidad de respuesta para que el tamaño de su contenido se ajuste de manera adecuada a las diferentes pantallas.

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

Controles de la interfaz gráfica del usuario (GUI)

Controles de GUI: puede cambiar fácilmente el aspecto de su marca al seleccionar 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 en todo el sistema. Puede guardar todas las opciones de color que elija como una Paleta de colores.

Paleta de colores y tema del sistema

Paleta de colores: Blackboard Learn cuenta con más de una docena de paletas de colores. 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 con una herramienta de edición de texto o de CSS.

Paleta de colores personalizada

Personalizar paleta de colores: amplíe la personalización de su interfaz de usuario al crear su propia paleta de colores que coincida con la marca, el logotipo o el esquema de colores 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.

Mejores prácticas al diseñar una paleta de colores personalizada

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

  • Utilice los colores que correspondan 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 colores adecuado para la interfaz de usuario.
  • Asegúrese de que los colores elegidos combinen bien y de que creen una experiencia visual armoniosa. Aprenda acerca de los esquemas de colores monocromáticos, análogos y complementarios en el sitio web Color Matters. Conocer la teoría del color facilita la selección de colores que combinan bien con la institución.

Tema del sistema personalizado

Personalizar el tema del sistema: puede transformar por completo la interfaz de usuario de la instalación de Learn de su institución al crear 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.

Mejores prácticas al diseñar 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 colores monocromáticos, análogos y complementarios facilita la elección de colores que combinan bien entre sí y con los de la marca de su 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.
  • 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.
  • Íconos: puede rediseñar algunos íconos y utilizarlos en toda la aplicación como imágenes de fondo.

Temas del sistema y Building Blocks personalizados

Si cuenta con un tema personalizado para el sistema, es posible que quiera extender sus ajustes personalizados a las páginas nuevas incluidas en un Building Block. No todos los Building Blocks tienen sus propias hojas de estilo específicas de cada herramienta, pero algunos sí.

En el Panel del administrador, encontrará información que determina si un Building Block contiene hojas de estilo específicas de cada herramienta o no. En la sección Integraciones, seleccione Building Blocks y, luego, haga clic en Herramientas instaladas. Abra el menú de cualquier Building Block de la lista y seleccione Ver componentes. Si el Building Block contiene hojas de estilo específicas de cada herramienta para cualquiera de los temas de Learn predeterminados, los controladores de los temas aparecerán en esta página.

Marcas diferentes para la misma instalación de Learn

Puede crear marcas diferentes para distintos grupos de usuarios según su rol en el sistema. Se han de crear nombres de host personalizados para permitir el uso de varias marcas en una sola instancia de Learn.