IELTS Listening · Components

Component Demo

All six reusable components with representative use cases for every IELTS Listening question type

Component → Question-type Coverage

ComponentCovers question types
KnowledgeCardAll chapters — knowledge points section
StrategyStepAll chapters — strategy section
AudioScriptPlayerAll chapters — practice audio
PracticeFormForm / Note / Table / Sentence / Summary / Flowchart / Short-answer completion (Ch 01–05, 12–13)
MultipleChoiceQuestionSingle-answer MCQ (Ch 06) · Multiple-answer MCQ (Ch 07)
MatchingQuestionMatching opinions (Ch 08) · Matching categories (Ch 09) · Map / Diagram labeling letters (Ch 10–11)

1 · KnowledgeCard

Props: title: string, body: string

Word limit
IELTS Listening often specifies "NO MORE THAN ONE WORD AND/OR A NUMBER." Exceeding the limit scores zero even if both words are correct.
Answers appear in order
Blanks map sequentially to the audio. Blank 1 is answered before blank 2 — you will never need to jump backward.

2 · StrategyStep

Props: step: number, title: string, detail: string

1
Use the 30-second preview
Read every blank and predict the answer type: name, number, date, place, or adjective. Priming your brain before the audio starts doubles your catch rate.
2
Underline anchor words
Circle stable words near each blank — headings, names, technical terms. Listen for their paraphrases in the audio.
3
Write immediately, lightly
Jot the answer the moment you hear it. Do not pause to tidy handwriting; fix it during the 10-minute transfer window.

3 · AudioScriptPlayer

Props: lines: AudioLine[], speakers: Record<string, SpeakerConfig>, title?: string, apiEndpoint?: string

Demo — Visitor Registration

■ Officer (male) · ■ Maria (female)

In the real test you hear this once. Play first and attempt the exercise, then read the script to verify.

Officer:Good morning. Can I take your name, please?
Maria:Yes — Maria González. That's G-O-N-Z-Á-L-E-Z.
Officer:And your reference number?
Maria:It's double 7 four nine.

4 · PracticeForm

Props: title: string, subtitle?: string, rows: FormRow[]
FormRow: num, label, pre?, post?, answer, alternates?, display

Covers: Form · Note · Table · Sentence · Summary · Flowchart · Short-answer completion. Use pre / post to add surrounding printed text. The alternates array accepts British/American spelling variants.

Visitor Registration Form — DemoNo more than one word and/or a number per blank
1Family name
2Reference number

Table-completion variant — pre and post carry column context:

Wildlife Survey — Table CompletionNo more than two words per blank
1Species / habitat
found in forests
2Main diet
3Average lifespan
years

5 · MultipleChoiceQuestion

Props: questionNumber, questionText, options: MCQOption[], correctAnswer: string | string[], selectCount?: number

5a — Single-answer MCQ (Ch 06 style)

Q1

Why has Maria come to the office today?

ATo collect a passport
BTo report a lost item
CTo renew a library card

5b — Multiple-answer MCQ, choose 2 (Ch 07 style)

Q2

Which TWO pieces of information does the guide give about the afternoon trip?

Choose 2 answers.

ACost of the tour
BTransport arrangements
CMeeting point location
DDuration of the activity
EEquipment provided

6 · MatchingQuestion

Props: title, instruction?, items: MatchItem[], categories: MatchCategory[], correctAnswers: Record<string, string>

6a — Matching opinions (Ch 08 style)

Research Seminar — Matching OpinionsChoose the opinion (A–D) that each speaker expresses.
Options
A The deadline should be extended.B The methodology is flawed.C The sample size is adequate.D Further research is unnecessary.
1Professor Chen
2Dr. Patel
3Student A

6b — Matching categories (Ch 09 style)

Museum Facilities — Matching CategoriesMatch each facility (1–3) to the correct floor (A–D).
Options
A Ground floorB First floorC Second floorD Basement
1Gift shop
2Temporary exhibitions
3Children's activity room

6c — Map / diagram label matching (Ch 10–11 style)

In a real chapter, an SVG or image of the map appears above this component; the labels below correspond to numbered positions on the diagram.

Campus Map — Label the LocationsMatch each location number (1–4) to the correct building (A–F).
Options
A LibraryB Sports HallC CanteenD Science BlockE Car ParkF Admin Office
1Location 1 (north entrance)
2Location 2 (beside the pond)
3Location 3 (south-east corner)
4Location 4 (central plaza)