Screenshot Capture Checklist
The manual text is complete without images. This is the list of screenshots referenced by the chapters, each with the exact state to set up before capturing.
Save files into docs/user-manual/screenshots/ using the exact filenames below —
the manual already links to them.
Before you start
Sign in as an instructor on a course with realistic content: several chapters, at least one lab with programming and quiz activities, and 20+ enrolled students. An empty course produces screenshots that teach nothing.
Use placeholder student data. These images may be shared outside your institution. Names like “Student One” and
student1@example.eduare safer than a real roster, and avoid any privacy question entirely.Browser window 1440 × 900, zoom 100%.
Hide bookmarks bar and any browser extensions.
The list
# |
Filename |
Screen |
State to set up |
|---|---|---|---|
1 |
|
Login page → Register tab |
Form filled in, showing the confirmation step with the details under review |
2 |
|
Login page → Sign In tab |
Empty form, Change/Forgot Password? link visible |
3 |
|
Any page, navigation bar |
Mode dropdown open showing Instructor / Student. Crop to the navbar |
4 |
|
My Courses |
At least 3 course cards, mixing published and unpublished, at least one Moderated so both badges appear |
5 |
|
Course Management → People |
Approved Students tab, counters populated, a few rows selected so the bulk bar shows |
6 |
|
Course Content → Multimedia Book |
3+ chapters, one expanded showing mixed content types, one chapter hidden so both eye states appear |
7 |
|
A video’s page |
Chapters & Markers panel open with at least one section marker and one quiz marker |
8 |
|
Course Content → Labs |
Counter cards populated, a mix of visible/hidden labs and at least one exam |
9 |
|
New Lab dialog |
Is an Exam toggled on, so Duration, Buffer and IP fields are showing |
10 |
|
Live Dashboard, exam running |
The most important image in the manual. Needs several students with different flags — ideally an IP collision, a late start, and one active. Set this up on a test exam |
11 |
|
Performance → Grades, flat view |
Populated gradebook: multimedia and lab columns, at least one extra column, one excluded column showing its badge |
12 |
|
Grades → Import CSV, preview step |
Deliberately imperfect CSV — some matched students, at least one not found, one validation error. The value of this image is showing what problems look like |
13 |
|
Interactions → Email Notices |
Send Email tab, several recipients selected, the “N selected of M” counter visible |
14 |
|
Performance → Statistics |
At least two panels expanded with real chart data |
Capture notes
Number 10 is worth real effort. The proctoring dashboard is the screen instructors consult under pressure, and a screenshot showing only healthy rows teaches nothing about the flags. Run a test exam with two browsers on one machine to produce an IP collision, and start one student late to produce a late-start flag.
Number 12 likewise. A successful import preview is not informative; one showing an unmatched student and a validation error tells instructors what to look for.
Do not crop away the surrounding navigation unless the row above says to. Readers orient themselves by the sidebar and tabs.
Adding a screenshot to a chapter
The chapters already contain the image links. If you add more, follow the existing form:
Write alt text that describes what the reader should notice, not just the screen name — it is what a screen-reader user gets instead of the image.
Keeping images current
Screenshots age faster than text. When the interface changes:
Re-capture only the affected images — the filenames are stable, so no chapter edits are needed.
If a screen disappears entirely, remove the image link from the chapter as well as the file.