LMS Customization Guidelines - Course Posters

Course Posters will appear in an image slider/carousel on the Course Details page. This allows Admins to present more images, descriptions, or visual data to the Learner prior to enrolling or starting the Course. Course Posters are great marketing tools to promote Courses on your LMS. 

Course Posters won't be visible if you do not upload any images. Course Posters can be set to a maximum of five (5) images.

 

The Overview of Online Course Settings article has the information you'll need to get started.

 

Recommended Image Size

The recommended image size is a guideline rather than a strict requirement. The ideal dimensions for a Course Poster can vary depending on the visual outcome you want to achieve, the type of content you are promoting, and how the image is designed. We strongly recommend testing your images before publishing to confirm that the poster appears as intended in the LMS.

Because Learners may access content using a wide range of devices, browsers, and screen resolutions, slight variations in how a Course Poster is displayed are expected. These differences are a normal part of viewing content on the internet and can affect cropping, scaling, and overall presentation.

Many clients find that 1000×300 px (approximately 3.33:1 aspect ratio) works well as a starting point for Course Poster images. For Curriculum Poster images, a larger canvas such as 2400×1000 px (2.4:1 aspect ratio) tends to display more consistently. 

Using a 1000×300 px image as a Curriculum Poster may cause the image to appear squashed, while using a 2400×1000 px image as a Course Poster may result in slight cropping. These are reference points, not rigid requirements, and your optimal dimensions will depend on your content and design goals.

 

Course Posters - Appearance on LMS

Visualize the course posters on the LMS and how the images are used in the context of a component. See the highlighted area of the image below.

 

Tips for Only One Course Poster

gray-diagram.png

 

Image Pointers for using only one course poster

 

Use Gradients

image-with-gradient.png

 

Blend the Background

blending-bakcground.png

 

Transparent Images

transparent.png

 

Multiple Posters - Safe Zones

If you upload more than one course poster, the images are displayed in an image carousel or slider in your course details page. Arrows will overlay on the right/left side of the image taking a 50px width and 55px on hover. Make sure to have a margin of 65px to 80px on the sides of your course poster images, to avoid any unwanted image overlaps and text clippings. 

image-arrows.pngsafe-zone.png

 

Examples

Use depth-of-field to focus on important objects.

good-example1.png

 

No heads are hidden in the group photo.

good-example2.png

 

Action/Gesture is apparent.

good-example3.png

 

Font combination of style and colour is legible.

good-example4.png

 

Colour overlay distinctly separates text and image.

good-example5.png

 

Infographic is not overwhelming with information.

good-example6.png

 

Illustrations add a creative and playful flair to your courses.

illustration.png

 

Considerations

Images with a lot of text

Limit the words in your image, make sure it is legible in terms of colour, font, orientation and size. Make sure that the text is within the safe zone. Exceptions for abstract images, if the purpose is to showcase a programming language, word documents, and handwriting. Use the Course Title and Description for text.

bad-sample1.png

 

Aspect Ratio

Make sure images have a standard aspect ratio of 2.4:1. Unproportioned images could look stretched.

bad-sample3.png

 

Cropping

Crop your images properly, unless intentional to capture a specific object, action or represents an abstract.

bad-sample2.png

 

Copyright

Use images that you own, have purchased, credit authors properly, ask permission for image usage or use creative commons license images with caution. Protect your content from copyright infringement.

bad-sample4.png

Was this article helpful?
2 out of 2 found this helpful

Comments

2 comments
Date Votes
  • Is the background colour still f0f0f0? It looks darker in my set up. #dedede seems to be the latest?

    0
  • In our interface, course posters are displayed in the background of the course information in the catalog, in place of the image defined as the 'course details' image. It's all a bit confusing. 

    0

Article is closed for comments.