Live · Open source

Case study 03

Hassala

Every word you translate, kept.

Overview

Hassala is a browser extension for Arabic ↔ English learners. Translate a word by typing, selecting it on a page, or clicking it in a YouTube subtitle — then save it to a private word bank stored inside the extension.

The challenge

Most translators are disposable: you get a translation, close the tab, and lose it. Hassala needed to make saving frictionless while keeping the data local, exportable, and useful for review. It also had to handle Arabic and English direction changes without making the interface feel like two different products.

The approach

I built the extension on Manifest V3 with a local-first storage model in chrome.storage.local. Translation starts automatically after typing stops, selection translation uses a lightweight in-page panel, and YouTube subtitles become interactive word-by-word. The word bank supports folders and exports to Markdown, plain text, CSV, and JSON. The UI is English-first with full Arabic and RTL support, and the companion site includes bilingual guides.

What it does

  • Arabic ↔ English translation with automatic direction
  • Selection translation on any page
  • Interactive YouTube subtitles
  • Private local word bank with folders
  • Export to Markdown, TXT, CSV, and JSON
  • No account, tracking, or analytics
  • English-first UI with full Arabic and RTL support

Technical notes

  • Manifest V3 extension for Chrome, Brave, Edge, and Chromium
  • chrome.storage.local for private on-device data
  • Content scripts for selection and YouTube subtitle interactions
  • Static documentation site with bilingual guides

What I learned

Hassala taught me how much product quality lives in constraints. No account, no server, no tracking — every feature had to earn its place in local storage and in the browser's permission model. The bilingual documentation also made me think about SEO and onboarding as part of the product, not as an afterthought.