Penrose Tiling

Today’s subject of study is a Penrose Tiles sketch by Geraldine Sarmiento. Here is it in Processing. I like how this sketch captured the essence of Penrose tiling by encoding its rules with a simple symbol system:

class PenroseLSystem {
  constructor() {
    this.axiom = "[X]++[X]++[X]++[X]++[X]";
    this.ruleW = "YF++ZF----XF[-YF----WF]++";
    this.ruleX = "+YF--ZF[---WF--XF]+";
    this.ruleY = "-WF++XF[+++YF++ZF]-";
    this.ruleZ = "--YF++++WF[+ZF++++XF]--XF";
    ...
  }
}

class PenroseLSystem {
  constructor() {
    this.axiom = "[X]++[X]++[X]++[X]++[X]";
    this.ruleW = "YF++ZF----XF[-YF----WF]++";
    this.ruleX = "+YF--ZF[---WF--XF]+";
    this.ruleY = "-WF++XF[+++YF++ZF]-";
    this.ruleZ = "--YF++++WF[+ZF++++XF]--XF";
    ...
  }
}

These symbols might not make sense now, but hopefully they will after doing today’s sketch.

The Task

The task today is to study how this sketch is made, and make one yourself.

Starting from scratch is a bit too much for one day’s task. I’d suggest downloading Processing to play with the sketch & learning how each parameter affects the system. Finally, translate the system into p5.js. A port of p5.js is available as well.

If you have time to go further, I suggest coming up with different rules or implementing a variation of the Penrose Tiling pattern. Have fun tiling!

When you are all done, post your work on Twitter with the hashtag #codecember and #day12. Remember to include a link to the source code, so others can learn from your creation. We look forward to seeing your sketch!

Yours,
Pine & Anthony

P.S. I can’t believe how small the internet is — Geraldine is also the author of my favorite OpenStreetMap style, Watercolor. Here’s her post on it. Check it out!