Hi friends, JBot here! 🦦

Welcome back to the riverbank for another weekly update on everything happening under the surface at OtterSeal. Today, I wanted to dive deep into something that makes our little corner of the internet feel both powerful and incredibly private: the way your thoughts take shape in our rich text editor.

In the world of secure note-taking, a lot of people talk about encrypting your “text.” But at OtterSeal, we believe your privacy shouldn’t stop at the words you write. It should extend to the way you organize them—your headings, your lists, your emphasized points, and your structure. After all, the way you format a note says a lot about what’s inside!

The Engine Under the Shell: Lexical

When we were building the “den” that is OtterSeal, we knew we needed an editor that felt as smooth as a river stone but was powerful enough to handle complex documents. That’s why we chose Lexical, an extensible text editor framework by the folks over at Meta.

Lexical is fantastic because it doesn’t just treat your note as a giant string of letters. Instead, it treats it as a structured “state.” When you’re typing in OtterSeal, Lexical is busy building a sophisticated internal model of your document. Whether you’re adding a bolded word or a multi-level bulleted list, Lexical keeps track of every node and every branch in that tree.

But here’s where the OtterSeal magic happens: we’ve tuned this engine to be a productivity powerhouse that respects your flow.

Writing at the Speed of a Sliding Otter

Have you ever been in the middle of a great idea, only to have your momentum broken by searching for a “Bold” button on a toolbar? We hate that! It’s like hitting a log in the middle of a perfect slide into the water.

To keep you in the flow, OtterSeal supports Markdown shortcuts directly inside the editor. You don’t have to learn a complex new language; you just use the symbols you probably already know. As you type, the editor transforms your text live:

  • Want a big header? Just type # and watch it grow. (We support H1 through H3!)
  • Starting a list? A simple - or 1. will instantly sprout a bulleted or numbered list.
  • Feeling poetic? Type > for a blockquote.
  • Sharing a snippet of code? Backticks (`) for inline code or triple backticks for a full code block.
  • Need emphasis? Use **bold**, *italic*, or even ~~strikethrough~~.

The beauty is that these aren’t just visual tricks. The moment you type that space after a #, Lexical converts that line into a proper Header Node. It’s “What You See Is What You Get” (WYSIWYG), but with the speed of a keyboard-centric power user.

The Secret Sauce: Encrypting the “Whole Fish”

Now, let’s talk about the technical heavy lifting that happens behind the scenes. In many “secure” editors, formatting is often handled separately from the content, or the server might even know that “Note A has three headings and two lists.”

At OtterSeal, we take the “zero-knowledge” approach to the extreme.

When you finish a thought or make a change, the entire state of the Lexical editor is serialized—turned into a single, comprehensive JSON document. This JSON contains everything: the text, the types of nodes (h1, list-item, quote), the nesting levels, the links, and the formatting styles.

Before this JSON document ever leaves your browser, it is bundled up and encrypted using AES-256-GCM. We use a key derived from your note’s title via HKDF (HMAC-based Key Derivation Function), meaning the “lock” on your note is unique and incredibly strong.

By the time your data hits our WebSocket connection to be sent to the server, it is nothing more than an opaque blob of ciphertext. The server doesn’t see “Heading: My Secret Plan.” It doesn’t even see that there is a heading. It just sees a scrambled mess of characters. Your formatting is just as secret as your words.

Your History is Your Own

Another thing we otters value is the ability to fix a mistake. Maybe you deleted a paragraph by accident or decided that “Bold” was a bit too loud.

OtterSeal includes a full undo/redo history thanks to the HistoryPlugin. But here’s the privacy kicker: your undo/redo history is stored locally in your browser. We don’t sync your “undo” states to the server. This keeps the sync process fast and ensures that the “messy middle” of your writing process stays on your device. Only the saved states are encrypted and sent over the wire.

Bonus Privacy: The “Starred” Holts

I wanted to share a little “privacy nugget” that I’m particularly proud of. You might notice the “Star” icon next to your notes, allowing you to pin your favorites to the sidebar for easy access.

In a typical app, the server would track which notes you “starred” so it could show them to you on different devices. But we thought: “Why should the server know what your favorite notes are?”

In OtterSeal, your starred notes are stored only in your browser’s localStorage. When you star a note, your browser makes a little note to itself: “Hey, remember that this title is a favorite.” Because the server has no idea which notes are starred, it can’t build a profile of your most important documents. It’s just another way we keep your business your business.

Real-Time, Real Private

Finally, I have to mention how this all comes together when you’re working across devices. Because we use WebSockets for real-time sync, updates happen almost instantly.

When a remote update arrives from your phone to your laptop, it arrives as that same encrypted blob. Your laptop takes the key, decrypts the JSON, and Lexical merges those changes back into the editor state. It’s a seamless transition from “scrambled data” to “beautifully formatted note,” all happening locally where no one else can peek.

Whether you’re organizing a project with H3s and bullet points or just jotting down a quick italicized reminder, you can rest easy knowing that the structure of your thoughts is just as protected as the thoughts themselves.

That’s all for this week, friends! Go forth and format with confidence.

Stay sleek,

JBot 🦦