Harvestry Documentation Annotations

Annotations: Highlights, Margin Notes & Inline Notes

Mark up your transcript and consolidated notes with color-coded highlights, margin commentary, and freeform inline notes — all of which survive into the exported HTML.

Overview

Both the Transcript view and the Consolidated Notes view support the same three annotation tools:

All annotations are stored per-lecture and survive export. A "Modified, re-export needed" badge appears whenever annotations are added, edited, or deleted — click Reexport to regenerate the HTML with your latest annotations.

Harvestry — Annotations
Transcript
1:15
Supervised learning is the most common form. We train on labeled examples and the model learns to predict labels for new inputs.
labeled examples most common form
📌 Compare with unsupervised: here we know the answer beforehand. Key distinction for the exam.
1:42
Examples include image classification, spam detection, and sentiment analysis — anywhere you have a corpus of data with known outputs.
Note
These are all supervised tasks — the label is human-defined. Contrast with clustering in unsupervised.

Highlighting Text

Text highlights work in both the Transcript and Consolidated Notes views.

1
Select text

Click and drag over the text you want to highlight in a passage. A context menu or a floating toolbar appears near the selection.

2
Click the Highlight button

Click the Highlight button in the toolbar that appears. A color picker shows four options:

Yellow Green Blue Pink
3
The highlight appears

The selected text receives a colored background. A chip showing the highlighted phrase appears below the passage. The lecture receives a "Modified" badge.

In the exported HTML, highlights render as <mark data-hl> elements with corresponding color classes. Their state is persisted to localStorage keyed by page title, so highlights survive across browser sessions.

Margin Notes

Margin notes attach a text annotation to a specific anchor phrase in the transcript or consolidated notes. In the exported HTML, they appear as floating aside elements in the page gutter.

1
Select the anchor text

Select a word or phrase that the note should be anchored to.

2
Click "Add Margin Note"

In the toolbar that appears, click Add Margin Note. A popover opens with two fields: the anchor phrase (pre-filled) and a text area for the note body.

3
Choose a side and write the note

Select whether the note appears on the left or right margin in the exported HTML. Write your note text, then press ⌘ Return or click Save.

Margin notes appear as small chips in the transcript panel below the anchored passage. In the HTML export, they render as floating sidebar asides positioned in the document gutter at the same vertical position as their anchor phrase.

Inline Notes

Inline notes are freeform card elements inserted between content blocks in the timeline — between passages, between screenshots, or between any two adjacent elements. They're useful for personal commentary that's not anchored to specific text.

1
Hover between content blocks

Move your cursor over the divider line between two passages or between a passage and a screenshot. An "+ Add note" button appears.

2
Click "+ Add note"

A card appears in the timeline with an editable text field active and focused.

3
Type your note and save

Type your note. Press ⌘ Return to save. The card persists in the timeline as a user-note element with a distinct style. Press Escape to discard.

In the exported HTML, inline notes render as card elements between content blocks, visually distinct from the transcript passages.

Editing and Deleting Annotations

To edit or delete any annotation:

After any edit, the lecture receives a "Modified" badge. Reexport to update the HTML.

Annotations in the HTML Export

Annotation Type HTML Representation
Highlight (Yellow) <mark data-hl="yellow">text</mark> — colored background, persisted in localStorage
Highlight (Green / Blue / Pink) Same pattern with data-hl="green", "blue", "pink"
Margin Note Floating <aside class="margin-note margin-note--left/right"> in the page gutter, vertically aligned with the anchor phrase
Inline Note <div class="user-note"> element between content blocks, styled as a callout card

Notes in Consolidated Notes

The Consolidated Notes view supports the same three annotation tools with identical interaction. Annotations on consolidated notes are stored separately from annotations on the verbatim transcript — they don't interfere with each other. In the exported HTML, consolidated notes appear in a separate tab, and their annotations are scoped to that tab.

💡
Use color-coding to organize by type. A common workflow: Yellow = important definition, Green = key example, Blue = exam topic, Pink = question to revisit.