Polygon Punks
Polygon Punks is a browser-based simulator connecting character design to geometry education. Every part of the punk is a polygon or a star polygon. Children pick a part, choose a shape, and watch a pen walk around the edges to make it. The shape then becomes a head, a pair of sunglasses, a mohawk or a guitar.
The math behind it
What is a polygon?
A polygon is a flat, closed shape made only of straight sides. Each place where two sides meet is a corner. A polygon always has the same number of sides as corners. The word comes from Greek: poly means many, and gon means corner.
How a polygon is made: the walking pen
Imagine a pen that can only walk straight and turn. It walks one side, turns at the corner, walks the next side, and keeps going until it’s back where it started. If it turns the same amount at every corner and every side is the same length, the result is a regular polygon.
The one big idea
All the turns add up to exactly one full spin. A triangle’s pen makes three big turns, each a third of a spin, so its corners are sharp. An octagon’s pen makes eight small turns, each an eighth of a spin, so it looks rounder. Add more and more sides and the polygon starts to look like a circle.
The polygons in the tool
Triangle: 3 sides. Tri means three
Square: 4 equal sides and 4 square corners
Pentagon: 5 sides. Penta means five
Hexagon: 6 sides. Hexa means six. Bees build honeycombs out of hexagons
Heptagon: 7 sides. Hepta means seven
Octagon: 8 sides. Octo means eight, like an octopus. Stop signs are octagons
Nonagon: 9 sides. Nona means nine
Decagon: 10 sides. Deca means ten
Star polygons: the star walk
Put dots evenly around a circle. Connecting each dot to the next makes a regular polygon. If the pen skips dots instead, its lines cross and make a star. Because it skips, the pen has to go around the circle two or three times before it gets home.
Pentagram: a 5-point star. The pen visits every second dot and goes around twice
Heptagram: a 7-point star. This is Spike’s mohawk
Octagram: an 8-point star. The pen visits every third dot
Enneagram: a 9-point star
Decagram: a 10-point star
Gram comes from the Greek for a drawn line.
Some numbers can’t make a star like this. With 6 dots, for example, skipping one dot just traces a triangle and misses half the dots. In those cases the tool grays out the star walk and explains why. That’s a small discovery in itself.
Who it’s for
Primary audience: children ages 5 to 10.
Children 5 to 7 can build almost entirely through pictures: shape tiles, fill swatches, large plus and minus buttons, and dragging parts with a finger
Children 8 to 10 can read the shape cards, follow the “Try this” challenges, and test the turning rule themselves
Wider appeal: the punk styling and the black-and-white zine look also appeal to older kids and adults, much like Cycloid Critters does
Secondary audience: the adults alongside them. Pronunciations and word origins on every card help a parent or teacher talk about the shapes with confidence
What’s built, and why
Parts bin - Six parts: head, shades, mouth, hair, body and guitar. Building one part at a time gives young children a clear path. The two sunglasses lenses move and change together as a pair
Kawaii proportions - Spike has a big head on a small body. The large sunglasses sit just below the middle of the head, and the small mouth sits between the lower halves of the lenses. That keeps the punk cute and friendly rather than tough
Shape tiles - Eight tiles show each shape: triangle, square, pentagon, hexagon, octagon, pentagram, heptagram and octagram. Children can choose by sight before they can read the names
The walking-pen machine - This is the heart of the tool. A mint pen walks the shape one side at a time around a circle of dots, with an arrow showing which way it’s heading. A spin dial beside it fills up a little at every corner and ends with “= 1 full spin!” For stars, it ends with “= 2 full spins!” Children see the rule happen rather than being told it
Shape cards. Each card answers what the shape is called, how it’s made, and why it looks the way it does. It gives the name, how to say it, where the word comes from, and a short, concrete explanation
Sides control - Plus and minus buttons change the number of sides from 3 to 10. Children watch a triangle become a square, then a pentagon, and slowly approach a circle, with the name changing at each step
Straight walk and star walk - These two buttons switch between a polygon and a star polygon with the same number of dots, a simple experiment with a big visual payoff.
“Try this” challenges - Each card ends with one small, open challenge, such as “Stop signs are octagons! Try Star walk to turn yours into an 8-point star.” There are no scores and no wrong answers
Polygon collection - Thirteen badges start hidden and reveal a name when a child watches that shape being walked. This rewards curiosity and invites exploring the whole family
Make it yours - Instead of colors, children choose from seven fills: white, black, neon mint, stripes, dots, checks and crosshatch. They can also change the size and turn, and show or hide each part. Parts can be dragged anywhere on the paper
Punk details
The guitar has a polygon body, a hexagon sound hole, a neck with strings and a headstock
The sunglasses have bold frames and a bridge. The bridge measures the lenses’ real edges, so it always connects, whatever their shape, size or turn
Glare lines on both lenses point the same way, as if lit by one distant light
Name, recipe and surprise
Naming the punk invites storytelling
The “made of” list turns the character back into vocabulary (“Shades: Hexagon × 2”)
“Surprise me” gives hesitant children an easy start, and “Start over” brings back Spike
Starter punk - The tool opens with Spike: an octagon head, hexagon shades, a triangle mouth, a heptagram mohawk, a hexagon jacket and a mint hexagon guitar. Children see what’s possible right away
Punk card download - A downloadable card shows the punk’s name, the punk itself and the polygons it’s made of. If a device or view can’t save files directly, the card appears as a picture to save by right-clicking or by pressing and holding
How it helps children learn
Learning by making. A punk a child designed and named gives them a reason to understand the shapes inside it
Seeing the process. The walking pen and spin dial show how a polygon closes, not just what it looks like
Words with meaning attached. Names like hexagon and pentagram arrive linked to a picture, a motion and a part of the child’s own character
Finding patterns through play. Children notice that more sides make smaller turns, and that only some numbers make stars, by trying things
Art and math together. Fills, size, rotation and punk attitude matter as much as accuracy, so a child drawn in by either side gets both
A connected pair of tools. Polygons with many sides start to look like circles, which links back to the rolling circles of Cycloid Critters
Look and feel
Zine style: black ink on white, like a photocopied punk zine. Cards have bold black borders and hard offset shadows
One accent color: neon mint, chosen to feel gender-neutral. It’s used only as a fill behind black text or shapes, never as text on white, so everything stays readable
Type: a modern, heavy display font appears only in the POLYGON PUNKS title and the punk’s name on the card. Everything else uses a clean, readable sans-serif, with a small typewriter-style font for labels like “8 SIDES · 8 CORNERS”
Paper: the punk sits on dot-grid paper, a nod to drawing polygons by connecting dots
Touch: large buttons and swatches for small hands, and dragging that works with touch
Motion: shapes appear instantly instead of animating for anyone who has reduced motion turned on
Where it fits
Oki Pie Workshops
This is an introductory exercise about polygons before the hands-on activities begin. The hands-on art activity involves creating a collage using polygon shapes - which can be simpler or more complex than the characters in the Claude artifact.
At home
This tool could serve as an intergenerational math exploration for parent and child learning side by side.
