A gamified, AI-powered web platform for teaching Afrikaans Eerste Addisionele Taal (EAT) to English-speaking Grade 10 learners. Built around real South African curriculum content, past papers, and the Via Afrika Studiegids.
Target audience: Grade 10 learners (high school, ~15–16 years old) who speak English as a first language and are learning Afrikaans as a First Additional Language (FAL/EAT). Many are struggling and relatively new to the language.
Curriculum alignment:
- CAPS-aligned (Nasionale Kurrikulum- en Assesseringsbeleidsverklaring)
- Noord-Wes Provinsie June 2018 & 2019 Vraestel 1 past papers
- Via Afrika Afrikaans EAT Graad 10 Studiegids (L. Greeff, R. Hugo, M. Manyane, A. Stanley, M. Struwig, A. van den Berg)
Three paper structure (Vraestel breakdown):
| Paper | Focus | Marks | Time |
|---|---|---|---|
| Vraestel 1 | Leesbegrip, Opsomming, Taalstrukture | 80 | 2 hr |
| Vraestel 2 | Letterkunde (poetry, drama, novel) | 80 | 2 hr |
| Vraestel 3 | Skryfwerk (opstelle, transaksionele tekste) | 100 | 2 hr |
All content is derived from the following documents (keep these in /assets/source/):
| File | Description |
|---|---|
Gr10-AFR-EAT-OG-SG_LR.pdf |
Via Afrika Graad 10 EAT Studiegids (130 pages) — grammar rules, vocab, worked examples, sample papers with memos |
Afrikaans-GR-10-FAL-Vraestel-1_-2.pdf |
NW June 2018 Vraestel 1 — actual exam paper |
Afrikaans-GR-10-FAL-MEMO_-1.pdf |
NW June 2018 Vraestel 1 Memorandum |
Afrikaans-GR-10-FAL-Vraestel-1_.pdf |
NW June 2019 Vraestel 1 — actual exam paper |
Afrikaans-GR-10-FAL-MEMO_.pdf |
NW June 2019 Vraestel 1 Memorandum |
File: games/word-match-blitz.html
Concept: Timed English → Afrikaans word matching game. Tap an English word, then its Afrikaans pair. 5 rounds of 4 pairs against a countdown.
Categories (all from source materials):
- Persone & beroepe (people/professions from study guide vocab list)
- Diere van Afrika (wildlife vocab from 2018 past paper text)
- Taalreëls (grammar terminology)
- Daaglikse lewe (everyday words from study guide's misspelled-words list)
Mechanics:
- 3 difficulty levels: Easy (40s), Medium (25s), Hard (15s) per round
- Streak bonus: score multiplies when consecutive correct matches
- End screen shows missed words with correct translations
- Progress dots track round completion
Vocab source: Study guide pages 67–68 (persoonsname table), past paper "Wilde diere van Afrika" text, study guide grammar terminology sections.
Drag scrambled words into the correct STOMPI order (Subjek, Tyd, Objek, Manier, Plek, Infinitief). Colour-coded slots, gets harder as tyd/wyse/plek determinations are added.
Key rules to implement:
- Basic STOMPI: S + T + O + M + P + I
- Question order: inversion of subject and verb
- The verb always stays in second position in a main clause
- Compound sentences (voegwoorde) shift verb position
Source: Study guide pages 68–70 (sinsvolgorde), past paper grammar sections (vraag 5.1.2, 5.1.14).
Type the correct spelling of a displayed Afrikaans word. Teaches deelteken (ë/ï), kappie (ê/ô/î/û), and koppelteken rules.
Word source: Study guide pages 90–92 — the A–Z commonly-misspelled words list plus the spelling rules tables (open/closed syllables, double consonants, etc.).
Key rules to implement:
- Deelteken: marks start of a new syllable (beëindig, geïnteresseer, voël)
- Kappie: lengthens vowel sound (sê, lê, môre, wêreld)
- Koppelteken: 12 use-cases from study guide pages 91–92
Interactive step-by-step grammar lessons with visual models and drill questions. Each rule: explanation → visual model → 5 practice questions → score.
Four core modules:
- Voegwoorde groups (Group 1: verb stays; Group 2: verb moves to middle; Group 3: verb goes to end)
- Ontkennende vorm — double "nie" rule
- Verlede tyd — ge- prefix rules (including exceptions: be-, ge-, her-, ont-, ver-)
- Vergrotende/Oortreffende trap — comparative and superlative forms
Source: Study guide pages 65–110 (Hersiening: Taalaspekte), past paper memo patterns.
Full timed Vraestel 1 simulation using real past paper questions. Countdown timer, section A/B/C navigation, AI marking via the Anthropic API, results report card.
Structure follows real exam:
- Afdeling A: Leesbegrip (30 pts, 50 min) — comprehension + visual literacy
- Afdeling B: Opsomming (10 pts, 30 min) — summary writing
- Afdeling C: Taalstrukture (40 pts, 40 min) — grammar applied
AI marking: Open-ended answers (opsomming, oop vrae) marked against official memo using Claude Sonnet via /v1/messages. Multiple-choice and short-answer questions auto-marked in JS.
AI-powered reading comprehension adventure. Learner reads a short Afrikaans passage, then answers comprehension questions in Afrikaans. An AI tutor character (friendly, encouraging) gives hints, corrects answers, awards stars.
Passages to use: "Wilde diere van Afrika" (2018 paper), "Herkoms van hoenders" (2019 paper), "Reëls in die bos" (2018 paper), "Kameelperde en hul lang nekke" (2018 paper).
Key rules for Afrikaans FAL Grade 10 (implement these across all games):
Subject — Tyd — Objek — Manier — Plek — Infinitief
Die seun het gister sy boek vinnig by die skool gelees.
| Group | Words | Effect on verb |
|---|---|---|
| 1 | want, maar, of, en, dog | Verb stays in same position |
| 2 | dus, daarom, tog, nogtans | Verb moves to position 2 (inverted) |
| 3 | omdat, dat, as, wanneer, sodat, hoewel | Verb moves to end of clause |
- Short sentences: one "nie" at the end —
Sy slaap nie. - Longer sentences: double "nie" —
Sy wil nie nou slaap nie. - Rule: the second "nie" always closes the sentence
- Standard: add
ge-prefix —loop → geloop,eet → geëet - Exceptions (no
ge-): verbs starting with be-, ge-, her-, ont-, ver- —verstaan → verstaan,betaal → betaal - Auxiliary: use
het—Hy het geloop.
- Positief: groot
- Vergrotend: groter (add
-er) - Oortreffend: grootste (add
-ste) - Irregulars: goed → beter → beste; baie → meer → meeste
- Direct:
Hy sê: "Ek is moeg." - Indirect:
Hy sê dat hy moeg is.(verb shifts to end; pronouns change; tense shifts)
| English | Afrikaans |
|---|---|
| optimist | optimis |
| pessimist | pessimis |
| daredevil | waaghals |
| coward | bangbroek |
| conductor (orchestra) | dirigent |
| auctioneer | afslaer |
| auditor | ouditeur |
| electrician | elektrisiën |
| immigrant | immigrant |
| emigrant | emigrant |
| pedestrian | voetganger |
| commuter | pendelaar |
| spectator | toeskouer |
| stand-in / deputy | plaasvervanger |
| burglar | inbreker |
| security guard | sekuriteitswag |
| snatch thief | grypdief |
| recruits | rekrute |
| veterans | veterane |
| athlete | atleet |
| English | Afrikaans |
|---|---|
| elephant | olifant |
| rhinoceros | renoster |
| giraffe | kameelperd |
| buffalo | buffel |
| lion | leeu |
| leopard | luiperd |
| hippo | seekoei |
| warthog | vlakvark |
| crocodile | krokodil |
| zebra | sebra |
| trunk (elephant) | slurp |
| tusk | ivoortand |
| mane | maanhaar |
| savanna | savanne |
| predator | roofdier |
| prey | prooi |
| herd | trop |
Aaklig, adres, akkommodasie, biblioteek, bietjie, dieselfde, dissipline, eienaar, entoesiasme, familie, grammatika, interessant, kanselleer, komitee, kommunikasie, koöperasie, liggaam, maatskappy, masjien, minuut, misdadiger, nuuskierig, onmiddellik, polisie, prokureur, rapport, sjokolade, standaard, teleurgesteld, universiteit, vakansie, verrassing, wedstryd.
Used in: Game 5 (Mock Exam), Game 6 (Story Mode)
const response = await fetch("https://api.anthropic.com/v1/messages", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({
model: "claude-sonnet-4-20250514",
max_tokens: 400,
system: `Jy is 'n Afrikaans EAT Graad 10 onderwyser. Merk die leerder se antwoord teen die memorandum.
Reageer in Afrikaans. Wees bemoedigend maar eerlik. Gee punte uit [marks].
Begin met "✅ Korrek", "⚠️ Gedeeltelik", of "❌ Verkeerd", dan verduidelik kortliks en gee die memo-antwoord.
Formaat: [✅/⚠️/❌] [Punte: X/Y] [Kort verduideliking]`,
messages: [{
role: "user",
content: `Vraag: ${question}\n\nLeerder se antwoord: ${studentAnswer}\n\nMemorandum-antwoord: ${memoAnswer}`
}]
})
});Note: No API key is needed in the claude.ai artifact context — the proxy handles it. In Claude Code or production, set ANTHROPIC_API_KEY as an environment variable and pass it in the x-api-key header.
The platform uses the original Lekkerish design from the first iteration (dark theme, gamified arcade feel):
--groen: #00C853;
--oranje: #FF6D00;
--blou: #1565C0;
--geel: #FFD600;
--rooi: #D50000;
--pers: #6A1B9A;
--donker: #1A1A2E; /* page background */- Display/headers:
Fredoka One(Google Fonts) - Body:
Nunito(Google Fonts)
- XP bar (persistent, shown in header)
- Streak counter
- Day streak tracker (🔥 dae)
- Badge/achievement system (8 badges defined, some locked)
- Confetti pop animation on correct answers
- Bounce-in animations on feedback
- Progress dots: green = correct, amber = partial, red = wrong, blue border = current
- Feedback banners: green border/bg = correct, red = wrong, amber = partial
- Tab pills for section navigation (A/B/C)
- Card-based question layout with mark indicator
lekkerish/
├── README.md # This file
├── HANDOVER.md # Claude Code handover notes
├── index.html # Platform home / game selector
├── assets/
│ ├── source/ # Original PDF source materials (keep private)
│ ├── css/
│ │ └── afrikaans.css # Shared styles (dark theme, fonts, game UI)
│ └── js/
│ ├── api.js # Anthropic API wrapper
│ ├── xp.js # XP/streak/badge system
│ └── vocab-data.js # All vocabulary banks as JS modules
├── games/
│ ├── word-match-blitz.html # Game 1 ✅
│ ├── sentence-builder.html # Game 2 (to build)
│ ├── spelling-bee.html # Game 3 (to build)
│ ├── grammar-clinic.html # Game 4 (to build)
│ ├── mock-exam.html # Game 5 (to build)
│ └── story-mode.html # Game 6 (to build)
└── data/
├── questions-2018.json # 2018 past paper questions + memos
├── questions-2019.json # 2019 past paper questions + memos
└── grammar-rules.json # Grammar rules + examples
| Q | Question | Marks | Type | Memo |
|---|---|---|---|---|
| 1.1 | Skryf EEN woord uit die hoofopskrif wat beteken die diere is nie mak nie | 1 | Open | wilde |
| 1.2 | Noem TWEE redes waarom die wild se habitat verlore gaan | 2 | Open | Menslike indringing; Wilddiewery |
| 1.3 | Karnivore is diere wat … vreet (A–D) | 1 | MC | B – vleis |
| 1.4 | Watter dier is die grootste soogdier? | 1 | Open | Olifant |
| 1.5 | Wat gebruik die olifant om water te vind? | 1 | Open | slurp |
| 1.6 | Enorme beteken … (groot/kort/dik) | 1 | MC | groot |
| 1.7 | Verduidelik: "Hy het 'n geheue soos 'n olifant" | 1 | Open | Kan baie goed onthou |
| 1.8 | Hoeveel renosterspesies bestaan daar? | 1 | Open | 5/vyf |
| 1.9 | Noem TWEE gebiede waar die swartrenoster voorkom | 2 | Open | Savannes & berghange |
| 1.10 | Watter renoster is die skaarste? | 1 | Open | witrenoster |
| 1.11 | "Hy is 'n regte buffel" beteken (A–D) | 1 | MC | B – nors |
| 1.12 | Die (buffel/bees) is die sterkste | 1 | MC | buffel |
| 1.13 | Watter dier word die "koning van die diere" genoem? | 1 | Open | Leeu |
| 1.14 | Bewys dat die leeumannetjie NIE jag nie | 1 | Open | Dis hoofsaaklik die wyfies wat jag |
| 1.15 | Waarom word leeus maklik in oop gebiede gejag? | 1 | Open | Jagters kan leeus maklik sien / geen skuiling |
| 1.16 | Bewys dat leeus ook in gevangeneskap aanteel | 1 | Open | …maar een maal per jaar in gevangeneskap |
| 1.17 | Waarom maak mense die leeus dood? | 1 | Open | Hulle is gevaarlik / mense is bang |
| 1.18 | Hoe lank word die kameelperd se tong? | 1 | Open | 40 cm |
| 1.19 | Waarom word kameelperde in gebiede met bome aangetref? | 1 | Open | Hulle vreet blare wat aan bome groei |
| 1.20 | Wat beteken "langeraad van die diere"? | 1 | Open | Kameelperde is baie lank |
| 1.21 | Hoe lank nadat die kalfie gebore is, kan hy staan? | 1 | Open | twintig/20 minute |
| 1.22 | Dink jy dit sal goed wees net na diere in museums te kyk? Motiveer | 1 | Open | Enige gemotiveerde antwoord |
| Q | Question | Marks | Type | Memo |
|---|---|---|---|---|
| 1.23 | Watter dier vreet ander diere? | 1 | Open | leeu |
| 1.24 | Wat word gebruik om die foto's te neem? | 1 | Open | kamera |
| 1.25 | Watter dier weeg swaarder as die seekoei? | 1 | Open | olifant |
| 1.26 | Die simbool stel die (hartklop/gewig) voor | 1 | MC | gewig |
| 1.27 | Die doel van die visuele teks is … (A–D) | 1 | MC | A – verskillende eienskappe het |
| 1.28 | Waarom noem ons dit 'n visuele teks? | 1 | Open | Prentjies / min woorde |
Som die REËLS IN DIE BOS in SEWE sinne op. Max 70 woorde.
7 key facts (1 pt each):
- Loop altyd agter jou gids
- Moenie hardloop nie
- Gehoorsaam jou gids se handseine
- Moenie aan vreemde goed raak nie
- Moenie plante beskadig nie
- Moenie diere bangmaak nie
- Respekteer die wildernis
3 pts for taal (own words = more marks; direct quotes = fewer)
| Q | Question | Marks | Memo |
|---|---|---|---|
| 3.1 | Hoe vestig adverteerder aandag op opskrif? | 1 | Groot/vet letters |
| 3.3 | @ staan vir … (teen/voor/by) | 1 | teen |
| 3.4 | Korrekte voornaamwoord (Hy/Jy) | 1 | Jy |
| 3.5 | "Bekende" beteken (ken/weet) | 1 | ken |
| 3.6 | Vergrotende trap van "groot" | 1 | groter |
| 3.8 | Skryfteken in "sê" (A–D) | 1 | D – kappie |
| 3.9 | Sin in verlede tyd: "Die wildsfees is baie gewild" | 1 | Die wildsfees was baie gewild |
| 3.10 | Sin in toekomende tyd: "Elke jongman skiet 'n bok" | 1 | Elke jongman sal 'n bok skiet |
| 4.4 | Byvoeglike naamwoord: "Olifante is (gevaarlik) diere" | 1 | gevaarlike |
| 4.7 | Indirekte rede: Boere sê dat olifante … | 1 | …plantasies in woestyne kan verander |
- The arcade-style dark theme with Fredoka One / Nunito fonts resonates with learners
- Streak bonuses motivate continued play
- Showing missed words at the end creates a natural study loop
- AI marking with partial credit (
⚠️ Gedeeltelik) is more encouraging than binary right/wrong - Bilingual feedback (Afrikaans UI, English explanations for harder concepts) helps FAL learners
- Vocabulary banks are hardcoded in JS — should migrate to
vocab-data.jsmodule - No persistent storage yet (scores reset on refresh) — use localStorage or Supabase
- No teacher dashboard — add later for classroom use
- Mobile layout needs testing on smaller screens
- Extract shared CSS and JS into separate files (
afrikaans.css,vocab-data.js) - Build
index.htmlas a game hub with XP/progress visible across games - Build Game 2 (Sentence Builder) — highest educational value for grammar
- Add localStorage persistence for XP and streak
- Build Game 5 (Mock Exam) for exam prep season