The Slicer Tutorial Maker is an extension for 3D Slicer that streamlines the creation of illustrated tutorials in multiple languages. It automates screenshot capture, provides a visual annotation editor, and exports finished tutorials to HTML and Markdown formats.
Documentação em Português Documentación en español
- Installation: Extension Manager
- Installation: Manual / Developer
- How to Use Tutorial Maker
- Annotation Tool
- Developer Mode
- Writing Tutorials
- Uninstallation
- Install 3D Slicer 5.10.0 or the latest stable release.
- Open the Extension Manager and search for
TutorialMaker.
- Click Install, then restart Slicer when prompted.
- Continue to How to Use Tutorial Maker.
Follow these steps to use the latest development version before it appears in the Extension Manager build (published every morning around 9 AM EST).
Warning
We strongly recommend keeping Developer Mode disabled unless you are actively developing the extension. Developer Mode exposes experimental features that may cause instability.
- Install the 3D Slicer Stable Release or Preview Release.
- Open the TutorialMaker repository on GitHub.
- Click the green Code button and select Download ZIP to download
TutorialMaker.zip. - Extract the archive to obtain the
TutorialMaker-maindirectory.
Windows
- Start 3D Slicer.
- Drag and drop the
TutorialMakerfolder onto the Slicer application window. - In the Select a reader dialog, choose Add Python scripted modules to the application and click OK.
- When asked to load the Tutorial Maker module, click Yes.
macOS / Linux
- Start 3D Slicer.
- Go to Edit → Application Settings → Modules.
- In the Additional module paths field, drag and drop the file
TutorialMaker.pyfound inside theTutorialMaker-main/TutorialMaker/directory. - Click OK and restart Slicer.
Open the Tutorial Maker module from the Utilities category in the Slicer module selector.
Important
Before capturing screenshots, switch Slicer to Full-Screen mode and set the application font size to 14 pt to ensure the screenshots are easy to read.
Select the desired tutorial from the list, for example FourMinuteTutorial.
Click Capture Screenshots. A preparation dialog will appear before the capture begins.
The Screenshot Capture Environment Setup dialog offers three options:
| Option | Default | Description |
|---|---|---|
| Save current scene data | Off | Opens the Save Data dialog so you can preserve your work before the scene is cleared. |
| Maximize 3D Slicer window for screen capture | On | Ensures consistent screenshot dimensions across all slides. |
| Close Python console and Error Log window | On | Hides developer panels for cleaner screenshots. |
Warning
The current scene will always be cleared before capture begins, regardless of the options chosen.
Click OK to proceed. A progress dialog will track each capture step and ask you not to interact with Slicer until the capture is complete.
When the capture finishes, Slicer returns to the Tutorial Maker module and displays a confirmation:
Screenshot Capture Completed: Captured Tutorial:
<tutorial name>
After capturing screenshots, the panel shows two buttons side by side:
| Button | Behavior |
|---|---|
| Edit Annotations | Opens the Annotator with no annotations loaded. Use this button to start annotating from scratch or to discard all previous work. |
| Resume Annotations | Opens the Annotator and automatically reloads the most recently saved annotations.json file for the selected tutorial. Use this button to continue work from a previous session. |
Note
Edit Annotations is enabled as soon as a tutorial is selected. Resume Annotations is only enabled when an annotations.json file already exists for the selected tutorial (i.e., you have saved at least once). When enabled, it restores all annotations (labels, positions, styles, slide titles and descriptions) exactly as you left them.
After saving your annotations, click Generate Tutorial to produce the final HTML and Markdown files.
If no annotations file is found, you will see a warning:
No Annotations Found: You don't have any annotations to export. Please annotate your screenshots first using "Edit Annotations".
When generation completes successfully, Slicer opens the output folder automatically and displays a confirmation:
Tutorial Generated: Generated Tutorial:
<tutorial name>
The Annotator window opens as a separate modal window.
The thumbnail strip on the left displays all captured slides. Click any thumbnail to select it.
Editing slide content
On regular screenshot slides, you can edit the Title and Description fields at the top of the panel at any time during the annotation session.
Special slides (such as the Cover Slide) do not have Title and Description fields. Instead, they contain pre-made annotations (author, date, description, etc.) that you can select and edit directly on the slide canvas.
Adding annotations
- Select an annotation tool from the toolbar (Rectangle, Arrow, Text, etc.).
- Choose the annotation style (color, font size, line thickness).
- Click on the slide area where you want to place the annotation and type the label.
Saving
Click the Save button in the toolbar to save annotations to Outputs/Annotations/<tutorial name>/annotations.json inside the extension installation folder.
Note
When closing the Annotator, a dialog will ask whether you want to Save, Discard, or Cancel unsaved changes.
Layout customization
You can resize or rearrange panels by dragging the dividers.
The following keyboard shortcuts are available while the Annotator window is in focus:
| Key | Action |
|---|---|
Del |
Deletes the selected annotation. |
Esc |
Deselects the current annotation without deleting it. |
Shift + click |
Places an annotation and keeps the same tool active, allowing you to add multiple annotations in quick succession without reselecting the tool. |
If Developer Mode is enabled in Slicer (Edit → Application Settings → Developer → Enable developer mode), additional options will appear in the Tutorial Maker panel.
- Fetch From GitHub: Downloads tutorial scripts directly from a curated list of external repositories. Currently disabled by default to avoid issues with GitHub API rate limits.
- Tutorial Creation Tools: Assists in developing new tutorials by automatically recording widget names and paths.
Warning
Developer Mode features are experimental and may cause instability. We strongly recommend keeping Developer Mode disabled for routine tutorial creation.
For guidance on developing your own tutorial scripts, follow the templates and examples available at the SlicerTutorialMakerCollection.
- In 3D Slicer, open View → Extension Manager (or the Extensions Manager button in the toolbar).
- Switch to the Installed Extensions tab.
- Locate TutorialMaker in the list.
- Click the Uninstall (trash / remove) button next to the extension.
- Restart 3D Slicer when prompted to complete the removal.
If you installed the extension by adding it to the Additional module paths, follow these steps:
- Open Edit → Application Settings → Modules.
- In the Additional module paths list, select the entry pointing to the
TutorialMakerfolder (orTutorialMaker.py). - Click the Remove (minus) button to delete the path entry.
- Click OK and restart 3D Slicer.
- After restarting, you can safely delete the
TutorialMaker-maindirectory from your file system.
Note
Removing the module path only unregisters the extension in Slicer. You must manually delete the source folder from disk to remove all files.
Removing generated output files
Tutorial output files (screenshots, annotations, HTML and Markdown) are stored inside the extension installation folder under TutorialMaker/Outputs/. These files are not removed automatically. Delete the Outputs/ directory manually if you no longer need them.