Case study
Journalist Hajj
Hackathon team — Languages & Translation track · Hackathon
Reconstructed · 5 languages
Hajj coverage
A workspace for journalists.
Language
- Theme
- Interface language as a first-class state
- Stack
- Multilingual UI · Product UI
Overview
Journalist Hajj is a multilingual application built for journalists during Hajj. It placed first in the Mediathon Languages & Translation track, organized with the Ministry of Interior.
Problem
Coverage during Hajj spans many languages. The interface has to switch language without making the product feel like a different tool each time.
My role
Hackathon product work on a multilingual journalist-facing application. This case study focuses on the interface problem — language as state — rather than claiming production architecture that was not part of the brief.
Constraints
- / Hackathon timebox.
- / Support for 5+ languages.
- / Journalists as the primary users, not a general consumer audience.
User flow
- / Open the workspace in a default language.
- / Switch language.
- / Continue the same task with labels and content in the new language.
Interface
The reconstructed demo is a compact language switcher. Choosing a language updates the surface immediately. It is not the original application.
Architecture
- / Locale as UI state.
- / Copy keyed by language.
- / Direction-aware layout where Arabic requires it.
Key technical decisions
- / Keep language switching visible, not buried.
- / Preserve layout structure across languages so the product remains learnable.
- / Treat RTL as a layout concern, not only a font concern.
States & edge cases
- / Language selected
- / RTL layout for Arabic
- / LTR for other locales in the demo
Responsive behavior
Language controls wrap on small screens. The workspace remains a single column at 390px.
Accessibility
Language options are a radiogroup. The current language is announced. Direction changes with the document's demo surface, not the whole site.
Testing / quality
The original project was a hackathon build. The reconstructed demo is checked for keyboard use, direction changes, and reduced motion.
Performance
Language packs in the demo are local and tiny. No runtime translation API is called.
Outcome
1st Place at Mediathon, Languages & Translation track, Ministry of Interior.
What I learned
Localization is an interface architecture problem. If language is bolted on, structure and direction break first.
What I would improve
A longer build would add persistent locale, richer language packs, and more careful typography for each script.