Glossed: Enhanced interlinear glossing for language learning

Excited about Old English? Glossed makes learning easy! Experts efficiently "gloss" texts to create user-friendly learning materials with word structure, grammar, and linked Wiktionary entries.

Comment

Inspiration

What it does

How we built itHere is a comprehensive, ready-to-paste Devpost Project Story for Glossy, structured for the submission form based on your project documentation and technical diffs:

Inspiration

Reading texts in different languages can be a daunting task, especially when you are trying to learn the language. You want so badly to understand the words in front of you. You may know the root but not remember whether a verb is present or past or a noun is nominative or accusative. In the past, one would need to spend time looking words up in a paper dictionary. But what if you don't know the headword to look up? And what if the the entry doesn't list out all the word forms?

This is where Glossy comes in. Glossy leverages web technology and online dictionary and inflectional paradigm resources like Wiktionary to make it easy to look up headwords and relate the form you see to that headword via conjugation and declension tables. Glossy provides Wiktionary links for every word in a real text, along with full-sentence translations and interlinear morphemic glossing for linguistic analysis. You can see exactly which part of each word is contributing a particular piece of meaning! We hope that this makes learning faster and easier.

The goal was to build a modern, high-performance web platform to make it easy to annotate language texts for students. The editing tool allows scholars to create standardized Leipzig glosses and translations, link to dictionary headwords, and create an exportable compilation-ready LaTeX file containing the annotations.

What It Does

Glossy is a local-first web application for reading, editing, and publishing morphologically tagged historical texts:

  • Interactive Reader & Workspace: Seamlessly view and annotate historical texts with Leipzig glosses for morpheme-by-morpheme analysis and understanding, Wiktionary entry integration, and sentence-by-sentence translation.

  • Local-First Authoring & Persistence: Safely author and edit drafts locally with a versioned draft envelope (localStorage) and divergence tracking to prevent data loss.

  • Bidirectional LaTeX gb4e Interoperability: Parse raw multi-sentence linguistic LaTeX files into structured AST nodes and export compilable LaTeX or JSON files.

  • Headless CMS & Git Integration: Sync browser-edited drafts directly back into the source Git repository via TinaCMS GraphQL mutations.

How We Built It

Glossy is engineered using a modern, type-safe web and publishing stack:

  • Core Framework: TypeScript 5, Next.js 15+ (App Router), and React 19 for component-driven UI and hybrid SSG/SSR rendering.

  • Styling & Typography: Tailwind CSS paired with Unicode-compatible fonts like Charis SIL and Georgia to ensure WCAG 2.1 AA contrast compliance and precise Old English diacritic rendering.

  • Data Layer & Validation: Zod schemas (lib/schemas/corpus.ts) enforcing runtime type safety, alongside TinaCMS (GraphQL) for content management and Git commit bridging.

  • Publishing & CI/CD: Client-side WASM PDF compilation via @myriaddreamin/typst.ts, Cloudflare Pages edge deployment, GitHub Actions, and Release Please for automated semantic versioning.

  • Quality Auditing: Custom CLI validation scripts (pnpm run validate:lemmas, pnpm run validate:source) ensuring 100% corpus token alignment against canonical dictionary headwords.

Methodology: Flipped Interaction & Skill Packs

Glossy was architected using the Devpost Learn Skill Pack methodology through a flipped interaction model:

  • AI as Interviewer: The AI agent interviewed the developer/philologist to extract core domain rules—such as handling 42 Leipzig glossing abbreviations and relating inflected forms of words to headwords: infinitives for verbs, nominative (singular) (masculine) (strong) forms for nouns, adjectives, numerals, determiners, and pronouns, and base forms for other parts of speech.

  • Structured Planning: All architectural blueprints are meticulously recorded in devpost/ (scope.md, prd.md, spec.md, and checklist.md).

Accomplishments That We're Proud Of

  • Created a tool that brings the learning of classical languages via preserved texts into the 21st century.
  • Successfully implementing a robust, zero-loss local-first draft persistence and revision divergence engine.
  • Building a custom bi-directional gb4e LaTeX parser that preserves complex linguistic gloss alignments without manual formatting errors.

What We Learned

Translating formal linguistic glossing conventions into structured ASTs required balancing modern web component architecture with strict academic formatting standards. We learned how to tightly couple headless Git workflows with client-side state persistence to give researchers a frictionless authoring experience.

Built With

Share this project:

Updates

Submission history