Cards & Resources

What Cards represent in Tutors

Cards

The card metaphor is used throughout tutors as a simple visual feature to represent a variety of learning resources. In general the contents of a card are extracted from the following:

The title, image and summary will be presented on the card, along with a suitable icon.

The Learning resources are typically named to match the context, and are contained in a folder whose name is structured to encode the type of learning resource.

Resource Names

Folder names convey the type of learning resource contained in the folder, with the first letters determining its type. Folders starting with the following names have a significance in Tutors:

Example Source
topic Top level course topic
unit Group of learning objects within a topic
side Group of learning objects framed in a sidebar
archive Downloadable zip file of resources
book Step by step lab instructions, authored in markdown
PDF book Problem or exercises sheet, authored as a PDF
github Link to a GitHub repository
note Single web page, authored in markdown
panelvideo A full screen width video, hosted in YouTube or HEANet
paneltalk Full screen width presentation in pdf format
panelnote Full screen width note
talk Standard presentation in pdf format
web Link to an external web site

To sort the name alphabetically you may append numerals. To enhance meaning, append contextual keywords. For example:

Folder Name
topic-01-introduction
topic-02-learning-html

For all file & folder names, avoid spaces within a file name.

Do Don’t
topic-01-introduction Topic 01 Introduction
topic-02-learning-html Topic 02 Learning HTML

File Names

Each resource will typically have the following files:

File Purpose
some-resource-name.md A markdown file, typically containing title + short summary for the resource
some-resource-name.png Image to he used for the resource. Name must be the same as the .md file, image can be .png, .jpg. .jpeg, .gif

The following filenames are reserved:

File name Description
course.md Title for course (mandatory)
properties.yaml Course properties (mandatory)
course.png Course image
calendar.yaml Course calendar
enrolment.yaml Student enrolment file
weburl link to external web site
videoid id of external video
githubid link to github repo

Image resizing

Some images you mau choose to use may be hi-resolution, appearing to be super sized on the canvas. This can be a particular issue with screen shots. This service here:

Allows you to resize the image to a suitable ‘canvas’ size.