Annotator is a collection of tools that work together to let you highlight and leave notes on the web. Here is a simple look at how the different parts of the system fit together.
🧱 The Main Parts
-
The Client: This is the part you see. It appears as an overlay on your browser, allowing you to highlight text and write notes.
-
The Service: This is the “brain” in the background. It saves your notes, handles your account, and makes sure your highlights show up on the right pages.
-
The Extension: A tool for Google Chrome users that “plugs” Annotator into any website you visit.
-
The Bookmarklet: An alternative for other browsers (like Safari or Firefox) that lets you start Annotator with one click from your favorites bar.
-
The Proxy (Via): A special link that lets you see annotations on a page even if you don’t have the extension installed.
-
The LMS App: A version of our tool built specifically for school websites (like Canvas or Blackboard).
👥 Accounts and Groups
-
Annotator Accounts: Most people sign up directly with us.
-
Partner Accounts: Some users get their accounts through their school or a specific publisher.
-
Groups: You can keep your notes private, or join a group to share thoughts with classmates or colleagues.
💻 How the “Client” Works
The tool you interact with has two main jobs:
-
The Highlighter (The Annotator): * It reads the page to find the title and web address.
-
When you select text, it offers you buttons to highlight or comment.
-
It “paints” your saved highlights onto the page so you can see them later.
-
-
The Side Menu (The Sidebar):
-
This is the window that slides out from the right.
-
It lists all the notes for that page.
-
This is where you type your notes using plain text, bold/italic formatting, or even images and video.
-
🌐 Using Annotator on Different Browsers
-
Chrome: Works best using our official extension.
-
Firefox & Safari: You can use the Bookmarklet, though it has some limitations (for example, it won’t work on high-security sites like GitHub).
-
Mobile: Currently, phone browsers don’t support the extension, but you can view notes via our Proxy links.
📄 Working with PDFs
Annotator can read PDF files too!
-
In Chrome, our extension automatically changes the PDF into a format that Annotator can “write” on.
-
On other sites, we use a tool called PDF.js to make sure the document looks right and accepts your highlights.
🔗 Sharing Your Notes (The “Bouncer”)
When you share a link to one of your notes, our system is smart enough to know who is clicking it:
-
If they have the extension: It opens the original website and pops up your note.
-
If they DON’T have the extension: It sends them through our Proxy, which “injects” the note into the page for them so they can still see what you wrote.
⚙️ Under the Hood (For Techies)
-
The API: A way for other apps to talk to our service and grab data.
-
The Realtime Feed: Uses “WebSockets” to make sure that if a teammate leaves a comment, it shows up on your screen almost instantly without you needing to refresh the page.