Skip to content
Adapt User's Guide version 4.5

Frame menu

Frame menu example
Frame Menu

The Frame menu lists Menu choices framed within a picture frame and arranged down the page in a single column. Users of desktop computers and some tablets will see a 3D effect on the graphic as they move their cursor around the frame. Frame Menu allows you to direct the learner to either further menus (sub menus) or to one or more pages of content.

The Frame Menu can display a title, an image, some body text, a progress indicator and a link button.

The Frame Menu’s features are gathered from the Page Settings screen:

Displayed at the top of the box menu floating above the image and not affected by the 3D effect. In the Frame Menu, this field should be considered required and should be succinct as wrapping titles in this menu may have unexpected behavior.

Displayed below the title. In the Frame Menu, the body should be considered required and should be fairly succinct as it will consume image area and may possibly overlap the title if too large.

The text of the button used to open the page. Cannot be left blank.

Duration is not displayed in this menu.

A required graphic to be displayed as the contents of the frame. Omitting the image will display a message to the user indicating that the course is broken.

Alternative text for the graphic.

Frame Menu Graphic Requirements

Frame menu graphic size template
Download Frame Menu Graphic Template

For best results, use a graphic that is 640px (wide) by 500px (high) with a resolution of 72ppi. Unlike the Box Menu, the Frame Menu will forcably crop the image to the size of the frame, then scale the image to cover the graphic area with some overlap to prevent seams. This can cause some issues if the image is improperly sized, such as:

  • Using too small an image will create a blurry, jagged appearance which will appear even worse once the 3D effect is applied.
  • Using an image that is significantly larger will increase the processing required by the browser when applying the 3D effect, making the animation stuttery.
  • If you use an image that is the wrong aspect ratio (portrait instead of landscape), you will be unable to control what portion of the image is displayed.

It is important not to use graphics with text in the Frame Menu. In addition to scaling the image, the Frame Menu will crop the image on lower resolutions. The floating panels in the menu are positioned by percentage and volume of text, making it extremely difficult to predict where the open area of the image will be to place text.

Additionally, accessibility rules warn that text in images is not accessible without additional steps (many of which are not possible in Adapt).