The Learner Experience can be customized to create a unique user experience and match your brand. All customization options live in Manage Templates, located on the right-side menu bar. This article will outline commonly used creative assets and image sizing suggestions to assist with the creation of a customized design for the Learner Experience.
Design Assets & Image Specifications
Compatible file types are JPG or PNG unless otherwise indicated. This article functions as an outline of design assets that can be customized, and the outcome of doing so. For more information about customizing your Portal, review the following article:
This article indicates image dimensions that may be used as a starting place for your design journey. In most cases, it is possible to modify the dimensions of the image (width or height) to achieve a specific design goal. The maximum file size of the image (10mb as an example) is strict and cannot be exceeded.
Company Logo
The Company Logo appears in the top left of the Learner Experience and Login Page, among other locations. Our default logo appears like this:
| Specification | Details |
| Image Dimensions | 200 x 54px |
| Compatible File Types | JPG, SVG or PNG |
Favicon
A Favicon is a small image used on web browsers to represent a website or a web page.
| Specification | Details |
| Image Dimensions | 16 x 16px |
Login Background Image
The Login Background Image displays on the Login Page, if there is no Public Dashboard in use. If there is a Public Dashboard available, the Login Page will not be displayed and neither will the Login Background Image.
| Specification | Details |
| Image Dimensions | 1920 x 1200px |
Welcome Tile Image
The Welcome Tile is a regular inclusion on a Public or Private Dashboard, and includes the ability to upload a Background and Foreground Image. The Foreground Image will appear on top of the Background Image and by default, is turned off. It should only be used with an intentional design, and is not required for regular usage of the Welcome Tile.
The above showcases the Background Image alone.
The above showcases a Background Image with a Foreground Image enabled.
| Specifications | Details |
| Background Image Dimensions | 768 x 360px |
| Foreground Image Dimensions | 768 x 360px |
Dashboard Background Image
The Dashboard Background Image is an image that will appear behind the tiles of the Public or Private Dashboard it has been configured for. A design for this element of your Portal is often best to be kept basic, or without text so that it doesn't impede the functionality or visibility of other elements.
| Specification | Details |
| Dashboard Background Image Dimensions | 1920 x 860px |
Tile Icons
Tile Icons are the small images that appear on the Public or Private Dashboard. A Tile Icon could also be considered a button. A Tile Icon may be a custom image. An image type that allows for transparent backgrounds like PNG will work best.
| Specification | Details |
| Tile Icon Image Dimensions | 60 x 60px |
| Compatible File Types | PNG or SVG |
Tile Background
The size of a Tile Background is dependent on how many Tiles are in a Container, and the width of the browser window being used to view the Public/Private Dashboard.
| Specification | Details |
| Small Tile Background Image Dimensions | 320 x 160px |
| Big Tile Background Image Dimensions | 1280 x 320px |
Course Banner Image
The Course Banner image is the default Banner that will be showcased for all Online Courses that do not have a Poster, or in addition to the Poster for ILC and Curriculum.
The above showcases where a Banner will appear, for an Online Course, if the Online Course does not have a Poster configured.
The above showcases where a Banner will appear, for an Instructor Led Course, if the Instructor Led Course has a Poster configured. The Poster appears below the Banner for the Instructor Led Course.
| Specification | Details |
| Course Banner Image Dimensions | 1920 x 360px |
Course Poster Image
The Course Poster is the image that will appear at the top of the Course Details page, instead of a Banner if the Course is an Online Course, or in addition to the Banner if the Course is an ILC or Curriculum.
The above showcases where the Course Poster will appear for an Online Course.
The above showcases where the Course Poster will appear for an Instructor Led Course.
| Specification | Details |
| Course Poster Image Dimensions | 1000 x 300px |
My Courses and Catalog Banner
The My Courses and Catalog Banner Image appears at the top of the My Courses or Catalog Pages.
| Specification | Details |
| My Courses and Catalog Banner Image Dimensions | 1920 x 360px |
| Max Image File Size | 300 K |
Menu Icons
The Menu Icons are the small images that accompany the name in the Public or Private Menu. It is advised to use an image with a transparent background.
| Specification | Details |
| Menu Icons Image Dimensions | 24 x 24px |
| Compatible File Types | PNG or SVG |
More Information
For more information, check out the following articles:
Comments
0 comments
Article is closed for comments.