Different Colors for Units in NCE

Alexandra.S.535

How can you set each unit in the NCE to be a different color? I know how to make a theme which would change the color of all units, but in the demo for NCE the course had each unit as a different color.

brad.r.503

In Brightspace's New Content Experience (NCE), visually distinguishing each unit or module can greatly enhance the user experience, making it easier for learners to navigate and recognize distinct sections of the course. While the New Content Experience provides a sleek, modern interface for content delivery, it doesn't natively support assigning different colors to individual units or modules directly within its settings. However, you can employ a few creative approaches to achieve a visually distinct look for each unit:

Custom CSS Styling (If Available):

Some institutions allow custom CSS to be applied to Brightspace courses. This would let you style individual modules or units with specific colors. However, this requires administrative access and knowledge of CSS, and it may not be enabled for all Brightspace environments.
Use of Header Images:

A common and effective workaround is to use header images for each module or unit. You can design these headers to include the desired color and text, and then upload them as the first item in each module. This gives the visual impression that each module is color-coded.
To do this, create an image with the dimensions recommended for your Brightspace layout (often something wide and not too tall, like 1200x300 pixels). Design the image with the color and text you want for the module title and save it as a PNG or JPEG file.
In the module, use the "Upload/Create" button and choose "Upload Files" to upload your header image. Then, set it as the first item in the module.
Descriptive Icons:

Another method to visually distinguish modules is to use descriptive icons at the beginning of each module name. While this doesn't change the color, it does provide a visual cue that can help differentiate modules.
Text Descriptors:

Use text descriptors with color names or themes as part of your module titles. For example, "Unit 1 - The Red Module: Introduction to Biology". While it doesn't change the visual color, it provides a thematic distinction.
Feedback to D2L:

If this is a feature you'd like to see, consider providing feedback to D2L (the company behind Brightspace). They often take customer feedback into account when making updates to the platform.
Remember, any design changes should aim to enhance the user experience, considering accessibility and readability. High contrast between text and background and adherence to accessibility standards are important to ensure that all learners can effectively engage with the course content. If you're using images or color coding, it's good practice to also provide text-based cues to ensure that the information is accessible to users with visual impairments or those using screen readers.

brad.r.503

In Brightspace's New Content Experience (NCE), visually distinguishing each unit or module can greatly enhance the user experience, making it easier for learners to navigate and recognize distinct sections of the course. While the New Content Experience provides a sleek, modern interface for content delivery, it doesn't natively support assigning different colors to individual units or modules directly within its settings. However, you can employ a few creative approaches to achieve a visually distinct look for each unit:

Custom CSS Styling (If Available):

Some institutions allow custom CSS to be applied to Brightspace courses. This would let you style individual modules or units with specific colors. However, this requires administrative access and knowledge of CSS, and it may not be enabled for all Brightspace environments.
Use of Header Images:

A common and effective workaround is to use header images for each module or unit. You can design these headers to include the desired color and text, and then upload them as the first item in each module. This gives the visual impression that each module is color-coded.
To do this, create an image with the dimensions recommended for your Brightspace layout (often something wide and not too tall, like 1200x300 pixels). Design the image with the color and text you want for the module title and save it as a PNG or JPEG file.
In the module, use the "Upload/Create" button and choose "Upload Files" to upload your header image. Then, set it as the first item in the module.
Descriptive Icons:

Another method to visually distinguish modules is to use descriptive icons at the beginning of each module name. While this doesn't change the color, it does provide a visual cue that can help differentiate modules.
Text Descriptors:

Use text descriptors with color names or themes as part of your module titles. For example, "Unit 1 - The Red Module: Introduction to Biology". While it doesn't change the visual color, it provides a thematic distinction.
Feedback to D2L:

If this is a feature you'd like to see, consider providing feedback to D2L (the company behind Brightspace). They often take customer feedback into account when making updates to the platform.
Remember, any design changes should aim to enhance the user experience, considering accessibility and readability. High contrast between text and background and adherence to accessibility standards are important to ensure that all learners can effectively engage with the course content. If you're using images or color coding, it's good practice to also provide text-based cues to ensure that the information is accessible to users with visual impairments or those using screen readers.

David.G.850

Hi @Alexandra.S.535,

We're releasing a new feature to provide an easy way to customize the module colours in the Brightspace New Content Experience. Noted on our Public roadmap (set to be released July 2024) as follows:

Content: Custom Module Colours | GA |

Improve communications with learners and personalize a course by customizing each module with a unique color within the New Content Experience.