Hinged Tessellations (Part1)

February 1 , 2014
posted in geometry , and javascript

hinge-tess-anim.gif Jump to the interactive version

What are they?

A tessellation is a set of figures which can cover the plane indefinitely. A hinged tessellation is a set of figures which not only cover the plane indefinitely, but has a set of hinges such that each figure can rotate about it's neighbours.

Regular Hinged Tessellations

The idea of linking a bunch of squares by their vertices has been stumbled across and explored by a number of people, and led to the discovery of a couple other hinged tessellation variations: including two different sized squares, hexagons with triangles, and octagons with squares.

HingedTessellation1_700.gif Like these hinged squares (pic from wolfram mathworld)

Irregular Hinged Tessellations?

Squares and hexagons are boring. Of course they'd work nicely together to hinge. When I first 'discovered' hinged tessellations I was most interested in which irregular shapes might work (if any). I was using blocks at the time and with a little experimentation I constructed this:


Thus it was clear to me that not only regular polygons could work; as that shape is actually a trapezoid (if we only focus on the hinged vertices).


Cool. I of course then sketched out some other trapezoids, and decided that potentially the reason why they can hinge so nicely is because their pairs of corners are both supplementary (add up to 180°). The idea of supplementary corner angles also makes sense

trapezoid-angles.png Angles a + b = 180°

Given that a quadrilateral has 4 corners, there are two different way we can set up the supplementary angles, either next to each other (a trapezoid) or opposite each other. I learned later that these are called cyclic quadrilaterals, because all the vertices lie on a circle.

cyclic-quad.png Angles a + c = b + d = 180°

I knew that one can actually tile the cyclic quadrilateral (because it's been proven that one can tile all quadrilaterals), but looking at that tessellation (see below) it is pretty clearly not hingeable.


I first tried a few times tessellating just the cyclic quads in a similar fashion to the trapezoids, but it was apparent that they wouldn't line up correctly. On a whim I mirrored a couple of the pieces, and then I was pretty certain I had a hingeable structure!

fold-it.png Blue tiles are mirror images, note how external edges all lie on parallel lines

The next step was trying to come up with a geometric proof, but as I had no good idea of how to go about it I ended up writing this little javascript/canvas app which would let you try all of them!

Hinged Tessellation Generator

Try moving the vertices, switching from a trapezoid to a cyclic quadrilateral, and changing the angle at which the tessellation is open!

The app has a standalone page here. There are some odd bugs that I don't remember existing when I oringally wrote this; namely, occasionally doubling the size of some tiles at 0, 90 and 180 degrees. The code can be viewed on github at github.com/algrant/hinged-tess-app.

Future Work

So you may have noticed that the title of this post ends with (Part 1). This is because I have done a lot more work following this, but would prefer to split it up into future articles!

These include:

  • Eventually doing some real math and determining various relationships between expansion rates and interior angles.
  • Creating physical representations of these toys.
  • Determining the rules for making 'Escher' style tiles which can still hinge.

As a teaser, here's the first physical model I built (with a laser cutter and some time/effort)

« Back to project list