Skip to learning content
EN

Language

Lessons are being translated. Anything not translated yet appears in English.

Tune

What would help?

Choose a quick fix. Nothing is saved or sent.

HyperGeek Suite · Code + Music

Code Brick by Brick

Watch a real algorithm run, one brick at a time. A stack of clay bricks in Thailand becomes a grid of 8 × 12 = 96 units, and two loops and an if / else turn it into a song. Press Step to walk the code yourself, or Play to hear the whole wall. Tap any brick to change the data.

long side = notehole end = rest

Row 1 is the bottom of the wall. Music plays left to right, bottom to top, the same order you would build it.

The code that plays it

// the wall: 12 rows of 8 letters, B = brick, H = holefor (let row = 0; row < 12; row++) { for (let col = 0; col < 8; col++) { if (wall[row][col] === "B") { let step = col + Math.floor(row / 2); play(scale[step]); // brick = note } else { rest(); // hole = rest } }}
row–
col–
wall[row][col]–
step–
scale[step]–

Code counts from 0, so row 0 is the bottom row, labeled 1 on the wall.

Brick 0 of 96

58 notes · 38 rests · 96 units

Press Play to hear the wall.

Missions

0 of 8 done
Mission 1

Run the loop by hand

Press Step 8 times. Watch col count 0 to 7 while row stays 0. That is the inner loop finishing one row.

Hint: Press Step and watch the variables under the code.

Mission 2

Count one row

Look at row 1, the bottom row of our wall. How many units are bricks (notes)?

Mission 3

How big is the grid?

The wall is 8 units wide and 12 rows tall. How many units are there in all?

Mission 4

Notes in the whole wall

Press Our wall, then read the counter under the code. How many notes does our wall play?

Mission 5

One brick, two lengths

Play the wall with 1 brick = 1 beat, then with 1 brick = 1 bar. Same data, a different length of song.

Hint: Press Play in both modes.

Mission 6

Change the key

Pick a different key and play. The bricks don't move, but the notes change, because the code plays scale[step].

Hint: Change the Key menu, then press Play.

Mission 7

Give the congas a solo

Make any row with 7 or 8 holes. That row becomes a long conga solo.

Hint: Tap bricks in one row until almost all are holes.

Mission 8

Build your own wall

Change at least 12 units so the wall is yours, keep at least 30 notes, then play it.

Hint: Tap bricks, check the counter, then press Play.

How a brick stack became a song

1 · LookA stack of orange clay bricks. Some show their long grooved side, some show the end with two round holes.

Bricks stacked under a table. Some face out with the long grooved side, some with the end that has two holes.

2 · Find the patternPencil and ink sketch of the brick rows, numbered up the side.

Sketch it row by row. Every row is exactly 8 units wide. A long brick covers 2 units, a hole end covers 1.

3 · Turn it into data
row 12  HBBBBBBH
row 11  BBBBHHBB
row 10  HHHBBBBH
row  9  HBBHBBBB
row  8  BBHBBBBH
row  7  HBBHBBHH
row  6  BBHHHHHH
row  5  HHBBBBHH
row  4  BBHBBHBB
row  3  HHBBBBHH
row  2  BBHBBBBH
row  1  HHBBHHBB

Write each row as 8 letters: B for brick, H for hole. Now the wall is a grid a computer can read.

4 · Loop and play
for each row (12)
  for each column (8)
    if B → play a note
    else  → rest

Two loops visit all 96 units. An if / else decides note or rest. That is the whole algorithm.

  • Grid rows × columns of data
  • Loop repeat the same steps
  • If / else choose between two paths
  • Variable a named value, like row
  • Rest a beat of silence
  • Bar 4 beats of music
  • Phrase a musical sentence, here 8 bars
  • Pentatonic a 5-note scale that always sounds friendly
  • Tumbao the steady conga groove

Wall photo and sketch by Wayne B. A HyperGeek game by Hyper Intelligence, LLC.