The pattern safari

Follow your curiosity.

We are extending Platypus, our visuals engine, so it can draw patterns from code, in support of our authoring tools. These are the first tests: fifteen stops, from one simple rule to two rules crossed.

Each plate is drawn by mosaic, a small Python library of our own, from a few lines of mathematics. No image model is involved.

One word, Ciao, sits in the same place on every plate. It holds still and the pattern around it changes.

Every stop has a dial. It changes one number in the formula. Turn it and see what that number was doing.

Every stop but the last has a cell in our Periodic Table of Image Elements. The cell is where we keep the notes: what we tried, what broke, and what is still open. See the table →

Stop 1 of 15 · A rule on a circle

The times table, drawn

Points sit evenly round a circle. Each one is joined to the point k times further round.

This is how you follow your curiosity: change the number.

In the periodic table · Tt · Times-Table Circle

How this plate was made

The library wrote these lines itself when it drew the plate.

  1. safari.times_tablePut 200 points evenly around a circle and number them 0 to 199. For each point i, draw a straight line to point number (i x 7) counted round the circle, wrapping past 199 back to 0 (the remainder after dividing by 200).
  2. safari.word_inkWherever a line passes through the letters it is drawn heavier, in the accent class.

Stop 2 of 15 · One formula, one curve

The rose

One curve. Its distance from the centre swings in and out as the angle turns.

In the periodic table · Ros · Rose Curve

How this plate was made

The library wrote these lines itself when it drew the plate.

  1. safari.roseTake the rose curve r = sin(4 x angle): the distance from the centre swings out and back as the angle turns, making 8 petals. Instead of tracing it smoothly, jump the angle on by 97 degrees each time (360 jumps) and join the points with straight lines.
  2. safari.word_inkWherever the line passes through the letters it is drawn heavier, in the accent class.

Stop 3 of 15 · One formula, one curve

Two swings

Two swings at right angles, one side to side and one up and down. Their speeds are in a whole-number ratio.

In the periodic table · Lsj · Lissajous Curve

How this plate was made

The library wrote these lines itself when it drew the plate.

  1. safari.lissajousDraw the path of a point whose x position swings left and right 5 times while its y position swings up and down 4 times in the same time: x = sin(5 t + shift), y = sin(4 t). 14 copies are shown, each with a different shift (a different starting point for the x swing), which turns the single loop into a woven ribbon.
  2. safari.word_inkWherever a line passes through the letters it is drawn heavier, in the accent class.

Stop 4 of 15 · Packing

The sunflower

Each new seed is turned by a fixed angle from the one before. Only the golden angle packs them evenly.

In the periodic table · Phy · Phyllotaxis

How this plate was made

The library wrote these lines itself when it drew the plate.

  1. safari.sunflowerSeed number i (from 0 to 999) is put at distance sqrt(i) from the centre, which spreads the seeds evenly over a disc, and is turned round by i x 137.508 degrees. Each seed is drawn as a small round dot.
  2. safari.word_inkDots whose centre falls inside the letters are drawn in the accent class and a little larger.

Stop 5 of 15 · Territory

Nearest seed wins

Each seed takes the part of the canvas that is nearer to it than to any other seed.

In the periodic table · Vor · Voronoi Diagram

How this plate was made

The library wrote these lines itself when it drew the plate.

  1. generate.phyllotaxis1,634 seeds are placed one after another on a sunflower spiral inside a disc of radius 721.249: the first at the centre, each next one turned by the golden angle (about 137.5 degrees) and a little further out, which spreads them evenly over the disc. Seeds placed one after the other end up far apart; a seed's neighbours in the picture were placed 8, 13, 21, 34 or 55 steps before or after it.
  2. safari.keep_on_canvasOnly the seeds that land on the canvas are kept: 995 of 1,634.
  3. safari.bandsEach seed is given a tone by its distance from the letters: the accent inside them, then three paler bands going outward (under 45, under 130, further).
  4. convert.points_to_regionsEach seed is given the part of the canvas that is nearer to it than to any other seed.
  5. safari.cell_bordersThe borders between neighbouring cells are drawn as thin lines.

Stop 6 of 15 · Tiles that repeat

Covering a plane

A few shapes can cover a flat plane by repeating. Each tile here is one of them.

In the periodic table · Til · Tiling

How this plate was made

The library wrote these lines itself when it drew the plate.

  1. safari.repeatRegular octagons with a small square in each gap: two octagons and a square round every corner. Every tile has side 42 units and the pattern repeats in every direction.
  2. safari.wordThe word 'Ciao', set in Space Grotesk Bold, 720 units wide at the centre of the canvas.
  3. safari.cut_by_wordEvery tile is shrunk a little so the ground shows between tiles, then cut along the outline of the word. The part inside the word gets the accent colour; the rest is shaded by how far the tile is from the word (under 40 units, under 130, or further), and alternate tiles take alternate shades.

Stop 7 of 15 · Stars from tiles

Rays from the edges

From the middle of every tile edge, two rays set off. Where they meet their neighbours, stars appear.

In the periodic table · Til · Tiling

How this plate was made

The library wrote these lines itself when it drew the plate.

  1. safari.hankin_starsOn a tiling of octagons and squares, two lines leave the middle of every tile edge at 60 degrees to the edge, leaning toward the tile's corners, and each meets the line coming from the next edge. Joined up, they draw a star in every tile; the steeper the angle, the deeper the star's points cut in.
  2. safari.wordThe word 'Ciao', set in Space Grotesk Bold, 720 units wide at the centre of the canvas.
  3. safari.cut_by_wordEvery tile is shrunk a little so the ground shows between tiles, then cut along the outline of the word. The part inside the word gets the accent colour; the rest is shaded by how far the tile is from the word (under 40 units, under 130, or further), and alternate tiles take alternate shades.

Stop 8 of 15 · Tiles that never repeat

Crossing lines

Families of parallel lines cross each other. Their crossings give rhombi, in an order that never repeats exactly.

In the periodic table · Til · Tiling

How this plate was made

The library wrote these lines itself when it drew the plate.

  1. generate.multigridThe ground is a tiling by rhombi of side 48, made with de Bruijn's multigrid: 5 families of evenly spaced parallel lines, turned from one another by 360/5 degrees; every crossing of two lines becomes one rhombus. It gives 2 rhombus shapes and an order that never repeats exactly. Here: 463 whole rhombi and 121 pieces cut by the canvas edge.
  2. safari.wordThe word 'Ciao', set in Space Grotesk Bold, 720 units wide at the centre of the canvas.
  3. safari.cut_by_wordEvery tile is shrunk a little so the ground shows between tiles, then cut along the outline of the word. The part inside the word gets the accent colour; the rest is shaded by how far the tile is from the word (under 40 units, under 130, or further), and alternate tiles take alternate shades.

Stop 9 of 15 · A rule applied to itself

One line

One unbroken line visits every cell of a grid. The rule that draws it is applied to its own result, and depth counts how many times.

In the periodic table · Sfc · Space-Filling Curve

How this plate was made

The library wrote these lines itself when it drew the plate.

  1. safari.wordThe word 'Ciao', set in Space Grotesk Bold, 720 units wide at the centre of the canvas.
  2. safari.word_ghostThe word is also filled in a middle shade behind the line, so it can be read where the line is sparse.
  3. safari.hilbertOne unbroken line visits the centre of every square in a 64 by 64 grid exactly once, never crossing itself: it is the Hilbert curve. Start with a U shape; replace each of its four corners by a smaller U, turned to fit; do that 6 times in all, so each level joins four copies of the one before.
  4. safari.cut_by_wordEach line is cut where it crosses the outline of the word: the parts inside the word are drawn heavier, in the accent colour, and the parts outside are lighter.

Stop 10 of 15 · A rule applied to itself

Branching

A rewriting rule is applied to its own output. A turtle, a pen that only moves forward and turns, draws the result.

In the periodic table · Ls · L-system

How this plate was made

The library wrote these lines itself when it drew the plate.

  1. safari.wordThe word 'Ciao', set in Space Grotesk Bold, 720 units wide at the centre of the canvas.
  2. safari.word_ghostThe word is also filled in a middle shade behind the line, so it can be read where the line is sparse.
  3. safari.lsystemStart with one growing tip. The rule: every stem doubles in length, and every tip becomes a short stem, a side shoot to the left, a side shoot to the right (each turned 44 degrees) and a longer stem ending in a new tip. Apply the rule 6 times, then draw it with a pen that walks forward, turns, and steps back to the last fork.
  4. safari.cut_by_wordEach line is cut where it crosses the outline of the word: the parts inside the word are drawn heavier, in the accent colour, and the parts outside are lighter.

Stop 11 of 15 · Soft things

Ripples

Ripples spread from many sources. Where they meet, they add up in some places and cancel in others.

In the periodic table · Wi · Wave Interference

How this plate was made

The library wrote these lines itself when it drew the plate.

  1. safari.wordThe word 'Ciao', set in Space Grotesk Bold, 720 units wide at the centre of the canvas.
  2. safari.waves10 little wave sources are spaced evenly along the outline of the word. Each sends out circular ripples 56 units from crest to crest, weakening with distance (half strength at 60 units); at every place the ripples are added up (crest on crest makes a big number, crest on trough cancels to zero).
  3. convert.field_to_regionsThe field is cut into 3 bands at the levels 0.04, 0.14 (a value exactly on a level goes to the band below), read on a grid 250 cells wide.
  4. safari.paintThe sums are cut into three bands. Outside the word, where the ripples cancel or are weak the plate is left blank, and the places where they add up get one tone and, where they add up most, a stronger one. Inside the word the plate switches to the accent, with only the strongest crests picked out in the lightest tone.

Stop 12 of 15 · Soft things

Smooth noise

Random hills that rise and fall smoothly, bent around the word.

In the periodic table · Fb · fBm

How this plate was made

The library wrote these lines itself when it drew the plate.

  1. safari.wordThe word 'Ciao', set in Space Grotesk Bold, 720 units wide at the centre of the canvas.
  2. safari.noiseSmooth random hills: a random direction is dropped on a lattice 300 units apart and blended smoothly, then 3 finer layers (each twice as fine, half as strong) are added. The height at each place is read not there but up to 200 units away from it, in the direction pointing away from the letters (taken from the word's distance, blurred over 30 units so it stays smooth), the push fading out about 110 units from the word, so the hills bend round the letters.
  3. convert.field_to_regionsThe field is cut into 5 bands at the levels -0.08, 0, 0.1, 0.2 (a value exactly on a level goes to the band below), read on a grid 260 cells wide; a band piece smaller than 40 square units joins the neighbour it shares most edge with.
  4. safari.paintThe height is cut into five bands: the lowest left blank, then three tones outside the word (the top two bands share the strongest). Inside the word every band takes the accent tone, with only the highest peaks in the lightest tone, so the word stays readable however hard the push.

Stop 13 of 15 · Things that grow

Spots and stripes

Two chemicals spread and react. Nothing else guides them, and spots and stripes form.

In the periodic table · Rd · Reaction-Diffusion

How this plate was made

The library wrote these lines itself when it drew the plate.

  1. safari.wordThe word 'Ciao', set in Space Grotesk Bold, 720 units wide at the centre of the canvas.
  2. safari.gray_scottTwo imaginary chemicals, U and V, spread across a 384 x 384 grid. Where there is V, it turns U into more V, V is slowly removed (rate 0.086) and U is topped up (rate 0.029); U spreads twice as fast as V. The reaction is started on the word and walled in: it can spread up to 112 units beyond the edge of the letters and no further (the last 28 units, where the chemical piles up against the wall, are cleared). We run it for 5,500 steps. Spots or stripes appear by themselves.
  3. convert.field_to_regionsThe field is cut into 3 bands at the levels 0.08, 0.2 (a value exactly on a level goes to the band below), read on a grid 160 cells wide; a band piece smaller than 40 square units joins the neighbour it shares most edge with.
  4. safari.paintThe amount of V is cut into three bands. Outside the word, none is left blank and increasing amounts get increasing tones; inside the word the plate switches to the accent, with only the places of most V in the lightest tone.

Stop 14 of 15 · Never settling

Two lines, over and over

A two-line rule moves a point, then moves it again from where it landed. The point never repeats its path, but the path traces a shape.

In the periodic table · Atr · Strange Attractor

How this plate was made

The library wrote these lines itself when it drew the plate.

  1. safari.cliffordA point is moved again and again by a two-line rule: new x = sin(-1.4 y) + 1 cos(-1.4 x), new y = sin(1.6 x) + 0.7 cos(1.6 y). The point never repeats, but it traces a shape. 6,000 such points are followed for 1,000 steps each (6,000,000 dots in all); we count how many dots fall in each cell of a 256 x 256 grid, blur the counts a little and take the logarithm so that faint haze shows next to the dense cores.
  2. convert.field_to_regionsThe field is cut into 5 bands at the levels 4.35, 5.039, 5.75, 6.504 (a value exactly on a level goes to the band below), read on a grid 200 cells wide; a band piece smaller than 25 square units joins the neighbour it shares most edge with.
  3. safari.wordThe word 'Ciao', set in Space Grotesk Bold, 720 units wide at the centre of the canvas.
  4. safari.paintThe logarithm of the count is cut into five bands: empty space is blank and busier places get stronger tones (the two busiest bands share the strongest). Inside the word the same bands use the accent instead (only the busiest band in the lightest tone), so 'Ciao' shows through the cloud.

Stop 15 of 15 · Two meet

Two families, crossed

Two different families, crossed by one operation.

How this plate was made

The library wrote these lines itself when it drew the plate.

  1. generate.phyllotaxis900 seeds are placed one after another on a sunflower spiral inside a disc of radius 707: the first at the centre, each next one turned by the golden angle (about 137.5 degrees) and a little further out, which spreads them evenly over the disc. Seeds placed one after the other end up far apart; a seed's neighbours in the picture were placed 8, 13, 21, 34 or 55 steps before or after it.
  2. safari.keep_insideOnly the 571 seeds that land on the canvas are kept.
  3. convert.points_to_regionsEach seed is given the part of the canvas that is nearer to it than to any other seed.
  4. safari.wordThe word 'Ciao', set in Space Grotesk Bold, 720 units wide at the centre of the canvas.
  5. safari.noiseSmooth random hills: a random direction is dropped on a lattice 260 units apart and blended smoothly, then 3 finer layers (each twice as fine, half as strong) are added. The word does not push the hills at all.
  6. combine.modulateThe two are crossed by one operation (modulate): each region takes the single value the field has at a point inside the region (its centre, where the centre is inside it).
  7. safari.toneThe value on each tile is sorted into 5 tones, cut at -0.1058, -0.0195, 0.0405, 0.1129 (a value on a cut goes to the higher tone).
  8. safari.paintEach seed of the sunflower spiral owns the patch of canvas nearest to it, and takes one flat tone from the height of the smooth random hills at its centre, five tones shared equally. Patches are cut along the word's edge: outside they are purple tones, inside they alternate between the accent and its lightest tone.
  9. convert.regions_to_curvesOnly the edges between regions are kept, each drawn once.
  10. safari.edges_outside_wordThe edges between tiles are drawn as lines 1.6 units thick, except inside the word.

The word did not move.

Ciao sat in the same place on every plate. Go back and turn a dial you skipped.

The plates are made by mosaic, Alt Shift Lab's own pattern library. Each one comes from a few lines of mathematics.

← Back to the plaza