LONGOKA DESIGN SYSTEM

A modern learning experience with premium pedagogy

This page validates typography, spacing, components, lesson patterns, loading states and motion — in one place.

Explore courses Read articles
Premium UI Accessible Fast iteration
3 levels
Beginner → Advanced
Micro-lessons
5–12 min chunks
Practice-first
Quizzes + drills
Weekly streak
+12%
72%

Keep consistency: small daily learning beats occasional marathons.

Typography & hierarchy

Headings, body copy, and educational rhythm (short lines, clear emphasis).

H1 / H2 / H3

Learning that feels calm

A strong hierarchy

Readable sections

The goal: reduce cognitive load. Short paragraphs. Clear titles. Consistent spacing.

Inline UI text

Beginner Intermediate Advanced

Course cards (premium)

Cards should carry pedagogy: objective, level, time, next action.

Kikongo Basics
Beginner

Alphabet, word structure, and reading flow — short lessons designed for retention.

1h 20m 12 lessons 4.8
Continue
Nominal Classes
Intermediate

Understand prefixes, agreement, and practical patterns with guided drills.

2h 10m 18 lessons 4.7
Continue
Pronouns & Agreement
Advanced

Pronoun prefixes, relative forms, and real usage with mini-quizzes.

2h 40m 22 lessons 4.6
Continue

Lesson patterns

This is the “school” feeling: objectives, steps, callouts, practice blocks.

Lesson header

Learning objectives
  • Identify the pattern
  • Practice with short drills
  • Validate with a quiz
1
Explain

One idea per block. Keep it short.

2
Practice

Immediate exercises.

3
Check

Quiz + correction.

Callouts

Note

Use notes to clarify vocabulary or context.

Tip

Show a trick that reduces mistakes.

Warning

Highlight common pitfalls and false friends.

Quick quiz

Choose the correct answer (demo UI).

States

Skeletons, empty states, and placeholders to keep UX premium.

Skeleton

No content yet

Empty states should guide the user: what to do next.

Create / add content