← Back to Pathshala

Fable 13 · Guide 13 · E-learning

Building পাঠশালা Pathshala

The brief: a Udemy-style e-learning platform in the spirit of Bangladesh's 10 Minute School and Shikho. The idea: Bangla-first, priced in টাকা, honest about its promise — ten minutes a day on the cheapest phone in the bazar.

Bilingual by design

One typeface does the whole job: Hind Siliguri renders Bengali and Latin as siblings, so পদার্থবিজ্ঞান and "Physics" sit on the same baseline without a font-swap seam. Bengali isn't decoration here — course names, lesson titles, numerals (৩৮ courses, ৳ pricing) and the wordmark গ্লিফ are all real. Space Grotesk handles stats and eyebrows.

The signatures

Progress rings: the "continue learning" card greets you mid-course — three SVG rings (normalized pathLength) that fill to 72/45/18% on view, with a streak chip. It sells the product's core loop before a single course is browsed. The lesson player: any course opens a full player — a title-card screen with a play button and progress bar, lesson description, and a playlist with done-checks and the current lesson highlighted, ✓ in leaf green like a teacher's tick. Escape or Back returns focus to the card that opened it.

Colour

paper ultramarine marigold leaf

Exam-guide ultramarine, marigold like the flowers sold at every crossing, leaf green for done-ness. Buttons press down on a hard 4px shadow — tactile, phone-first. Category filters re-stagger the grid via Motion; card anatomy referenced from 21st.dev patterns and rebuilt.


Process — three passes

← All thirteen sites