Pre-Technical — Communication in Pre-Technical Studies

Subtopic: VISUAL PROGRAMMING

Learning objectives (what you will learn):
  • Define visual programming and explain why it is useful.
  • Identify basic parts of a visual program (blocks, sprites, stage, events).
  • Create a simple visual program (example: draw a square using blocks).
  • Work safely and share programs with classmates or online platforms like Scratch.

What is Visual Programming?

Visual programming is a way of making computer programs by putting together coloured blocks or pictures instead of writing long text code. It is easy to learn and helps you understand how programs work. In Kenya, many schools use tools like Scratch and Microsoft MakeCode to teach this.

Event: When Green Flag Clicked
Move 100 steps
Turn 90°
Repeat 4 times

Why learn visual programming?

  • Easy to start — no complicated typing required 😊
  • Helps you think logically and solve problems step-by-step
  • Good for group work — share and remix projects with friends
  • Used in robotics, games, animations and simple mobile apps

Common tools (you can try these)

  • Scratch (scratch.mit.edu) — drag-and-drop blocks, make games & animations. Many Kenyan schools use it.
  • Microsoft MakeCode — good for micro:bit and circuits, also block-based and JavaScript.
  • Blockly — a library many websites use to build block-based editors.

Basic elements of visual programs

  • Blocks: Colored pieces that represent actions (move, speak, wait).
  • Sprites: Characters or objects that perform actions.
  • Stage: The area where the action happens (background, sprites).
  • Events: Start actions (e.g., "when green flag clicked", or "on button press").
  • Control structures: Loops (repeat) and conditionals (if...then).

Example: Make a sprite draw a square (Scratch)

Steps (in Scratch blocks):

When green flag clicked
Pen down
Repeat 4 times
Move 100 steps
Turn 90°
Pen up

What happens? The sprite puts its pen down and repeats move & turn 4 times — this draws a square on the stage.

Visual flow (a simple flowchart)

Flowchart for "Draw a square" program:

Start Repeat 4 times End

Classroom activities and exercises

  1. Try Scratch: Make a sprite say "Jambo!" when clicked. Share with your class.
  2. Create a mini-game: Make a sprite that moves with arrow keys and collects three stars.
  3. Team challenge: In groups, design a visual program that shows how to get to school safely (use events and messages).

Tips and safety

  • Save your work often. Use "Save" or "Download" features on the platform.
  • Be kind when sharing — give credit if you remix someone's project.
  • Ask a teacher before sharing personal information online.
  • Test parts of your program one step at a time (this is called debugging).

Glossary (short)

Block
A colored command piece used to build programs.
Sprite
A character or object on the stage that can move or act.
Event
A trigger that starts a set of actions (example: click a sprite).

Resources (try these websites)

  • Scratch — https://scratch.mit.edu/ (free, block-based)
  • Microsoft MakeCode — https://makecode.microbit.org/ (blocks + JS)
  • Search for "Scratch tutorials" on YouTube for step-by-step guides used in Kenyan schools.

Teacher note: adapt activities for available devices (computers, tablets, micro:bit). Encourage group work and pair programming.


Rate these notes