← Years 5–6 Creating Digital Solutions

Interface element: buttons

An interface element the user clicks or taps to make something happen. It needs a clear label, should do one action, and must be big enough to press easily.

Part of: 5-6 Digital Technologies Vic Curric - Creating Digital Solutions — Module 31, 7-8 Digital Technologies: Designing user interfaces and experiences — Module 3, QCE Digital Solutions Unit 1 — User Experiences and Interfaces — Module 42

Understanding Interface element: buttons in Years 5–6 Creating Digital Solutions

What it does: A large size makes the button easy to tap, especially on a tablet or for young users. Each button has its own label and its own action, so there are no surprises. A button is an interface element you click or tap to make an action happen. A clear label tells the user exactly what will happen when they press the button. One button per action keeps things simple, so users are not surprised by what happens. Buttons must be big enough to press easily, especially on touch screens. Labels like Save Drawing describe the action. Button 1 gives no clue.

Common mistakes: A button needs a clear label that tells the user what it does. 'Click here' is vague. The label should be 'Send'. A button should do one action only. This button does two things. The action should be just 'play the music'.

Class: _____________________  ·  Name: _____________________  ·  Date: _________

Free printable worksheet with full answer key — or add this module to a class and your students practise it interactively.

🖨 Print worksheet + answer key Add Interface element: buttons to a class →

This module's key terms are also in a printable crossword (Modules 31–40) and word search (Modules 21–40).

Take this worksheet further — free with Cloodit

Each concept is reinforced from every angle — learned, then applied, then tested.

Learning
Duo
What is a button in an interface?
Something the user clicks or taps to make something happenA place where the user can only read text
Matches
Button: "Click here"
↓
The label is vague. It does not tell the user what the button does. A better label is "Play" or "Send".
Applying
Meanings
Term
button
Meaning
An interface element the user clicks or taps to make something happen. It needs a clear label, should do one action, and must be big enough to press easily.
Practice
<style>
Testing
Gaps
ADD WITH label "Play"
Check Answer
Spots
1Button: Send
2 label: Click here

Cloodit turns curriculum-aligned coding content into journeys students work through one biome at a time.

The 'Silverback Gorilla' badge — Savannah Master, one of Cloodit's 106 collectible badges
Students earn collectable badges

Over 100 of them, across seven natural biomes.

Study Buddy
Students build a real study resource

Turns their work into revision material ready for Flash Cards and Exam study.

Diamond Dash — one of Cloodit's live, competitive Sprint games
Students lock in with Sprints

Live, competitive practice for the start of the lesson or a teacher-led lesson finisher.

A Cloodit certificate of achievement, ready to personalise and print
Custom printable certificates

Honour your top performers, or encourage a student who's trying hard — ready to print in seconds.

Add to class →

Quick Questions

1. What is a button in an interface?
A. A place where the user can only read text
B. Something the user clicks or taps to make something happen ✓
A button is an interface element you click or tap to make an action happen.
2. Which button label is clearer for a game that starts when pressed?
A. Start Game ✓
B. Click
A clear label tells the user exactly what will happen when they press the button.
3. A quiz app has a button that both submits your answer AND deletes your score. Is this a good design?
A. No, each button should do one action ✓
B. Yes, one button doing many things is best
One button per action keeps things simple, so users are not surprised by what happens.
4. Which button is easier for a Year 5 student to tap on a tablet?
A. A tiny button squashed next to other buttons
B. A big button with space around it ✓
Buttons must be big enough to press easily, especially on touch screens.
5. Which label tells the user what the button does?
A. Save Drawing ✓
B. Button 1
Labels like Save Drawing describe the action. Button 1 gives no clue.

Match the Pairs

Button: "Play" → A button with a clear label that tells the user what will happen when they click it
Button: "Save" -> saves the file → A button that does just one action when it is clicked
A button should be big enough for a finger or mouse to press easily → Button: "Next", size: large
Use one button for each action so the user knows what will happen → Button: "Start" and Button: "Stop"
Button: "Click here" → The label is vague. It does not tell the user what the button does. A better label is "Play" or "Send".
Button: "Save and Delete" → The button does two actions at once, which is confusing. It should be two buttons, "Save" and "Delete".

Key Term

button
An interface element the user clicks or taps to make something happen. It needs a clear label, should do one action, and must be big enough to press easily.

Fill in the Blanks

1. ADD BUTTON WITH label "Play"
Hint: Type the name of the interface element that is being added to the screen.
2. WHEN Save button clicked SAVE the drawing
Hint: Type the word for the user action that makes the button do its job.
3. SET Play button width TO 120 pixels
Hint: Type the size property that makes the button wider so it is easy to press.
4. SET Start button label TO "Start game"
Hint: Type the property that holds the words shown on the button so users know what it does.
5. BUTTON Mute ON CLICK: turn sound off ACTIONS: 1
Hint: Type how many actions a single button should do.

Spot the Error

Question 1
A Button: Send
B label: Click here
C action: send the message
D size: 60 x 40 pixels
Line B — A button needs a clear label that tells the user what it does. 'Click here' is vague. The label should be 'Send'.
Question 2
A Button: Play Music
B label: Play Music
C action: play and open shop
D size: big enough to tap
Line C — A button should do one action only. This button does two things. The action should be just 'play the music'.
Question 3
A size: 5 x 5 pixels
B label: Send
C action: send the message
Line A — A button must be big enough to press easily. 5 x 5 pixels is far too small. It should be a size like 60 x 40 pixels.
Question 4
A Screen: Quiz
B Button 1 action: check answer
C Button 1 label: Delete
Line C — The label must match what the button does. The button checks an answer, so the label should be 'Check', not 'Delete'.
Question 5
A Button A label: Play
B Button A action: start game
C Button B label: Pause
D Button B action: start game
Line D — The Pause button must do what its label says. Its action should be 'pause game', not 'start game'.

Student with a class code? Join your class →