Back to Discovery Zone

Encoding & representation

Secret Codes

How computers represent information — binary, encoding, encryption.

Computers can't really 'see' images, words, or colors — only numbers. These activities make the encoding rules visible: how 8 bits become a color, how dots and dashes become letters, how a grid of pixels becomes a picture, and how a substitution cipher hides a message in plain sight.

Binary representation · RGB encodingBinary Painter

Flip 8 binary switches and watch a color appear. The first 3 bits set red, the next 3 green, the last 2 blue — the same scheme every monitor on Earth uses.

Teaches: Phase 0 · How Computers Think
Symbol encoding · Variable-length codesMorse Code

Tap out letters in dots and dashes. The original binary protocol — and a working primer on how every digital code maps symbols to short, unambiguous patterns.

Teaches: Phase 0 · How Computers Think
2D arrays · Raster imagesPixel Art

Place squares on a grid. The same data structure (a 2D array of color values) is what backs every PNG, every game sprite, every screen on every device you've ever used.

Teaches: Phase 0 · How Computers Think
Substitution ciphers · Cryptography 101Secret Encoder

Scramble a message with a substitution cipher. Learn why the rules of encryption are mathematical — and why this specific cipher hasn't been considered secure since the 9th century.

Teaches: Phase 7 · Security Engineering
Cryptographic hashing · Avalanche propertyHash Avalanche

Paste a message and see its SHA-256 bit grid. Change one character — watch about half the 256 output bits flip. The avalanche property is what makes cryptographic hashes safe for signatures, passwords, and blockchain integrity.

Teaches: Phase 7 · Security Engineering