How to design floor tile plan with Inkscape

We have a spacious floor where we want to lay some tiles. The choice can be overwhelming. What colour, what size, how does the tile feel, how thick is it, questions questions.

Put too many small tiles on a large floor and the result can be distracting. Put very large tiles on the floor and the result can be a bit cheesy.

Why not go for some different patterns….

Well here comes the challenge, how many tiles do I fit in a room with a slanted pattern, or using two different sizes of tiles…

This seems like a simple question which can be answered by a computer! I have the floor plans in a pdf format, perhaps using inkscape I can read the floor shapes and use these as a base.

I found Inkscape has a way of programming extensions using python, excellent!

Rectangular Tiles

Tiles regularFirst challenge: If I know how wide and high a tile is, and I know how much grout joint is needed I can then calculate and draw the tiles. On my mac I can create an extension by writing a python program and copying the code to the folder:

/Applications/Inkscape.app/Contents/ Resources/share/inkscape/extensions

You need to place a python file and an inx file describing the extension.

Here is my first extension (inx file):

<?xml version="1.0" encoding="UTF-8"?>
<inkscape-extension xmlns="http://www.inkscape.org/namespace/inkscape/extension">
<_name>Tile rectangular</_name>
<id>nl.esweb.tile.rectangular</id>
<dependency type="executable" location="extensions">tile01.py</dependency>
<dependency type="executable" location="extensions">inkex.py</dependency>
<param name="tilewidth" type="int" min="5" max="100" _gui-text="Tile width in cm?">20</param>
<param name="tileheight" type="int" min="5" max="100" _gui-text="Tile height in cm?">20</param>
<param name="tilespacing" type="int" min="1" max="100" _gui-text="Tile spacing in mm?">16</param>
<param name="eenheid" type="int" min="1" max="1000" _gui-text="Eenheid 1cm is x meter?">1</param>
<param name="layer" type="string" _gui-text="Use layer with name?">Tile</param>
<effect>
<object-type>all</object-type>
<effects-menu>
<submenu _name="Tiles"/>
</effects-menu>
</effect>
<script>
<command reldir="extensions" interpreter="python">tile01.py</command>
</script>
</inkscape-extension>

There are some parameters and a reference to a tile01.py program. See attached zip file for the full source code.

Copy the files to the inkscape extensions folder and start up inkscape. Draw a box on your page, the extension needs this to know where to dray the tiles. Select the box and open the extensions menu, choose the Tile menu and the newly placed extension with name “Tile rectangular”.

A window will open and ask you the named parameters. Sorry for some left over dutch words but I could not always find a translation. Use google translate! Select Ok and the box will be filled with regular tiles, see example above!

Full Tiles Rectangular source here.

How is it done?

Well using inkscape python extension inkex you can add objects to a new layer.

newtile = inkex.etree.Element(inkex.addNS('rect','svg'))
newtile.set('x', str(runningx + spacingpx))
newtile.set('y', str(runningy + spacingpx))
newtile.set('width',  str( tilewidthpx))
newtile.set('height', str( tileheigthpx))
newtile.set('style', formatStyle(tilestyle))
layer.append(newtile)

Using a few loops to test if we are still within the bounds of the square we can then work across and down to fill the whole square.

Halfsteens Tiles

Tiles HalfSteens

Another tile pattern: In dutch Halfsteens. Half stone or Half layout? Well this is what it looks like actually:

Also a classic pattern seen often in de Boerderij.

Code was pretty easy, each new row is offset by half a tile and repeat.

 

Here is the code Tiles Half Layout.

But now some more complex patterns.

Tiles Big and small

Tiles Big and SmallWhen you mix a larger tile and a smaller tile you can get spectacular designs. Often this involves a lot of extra cutting of the bigger tiles to accommodate for the small tile. But this wastes a lot of material. Therefore the adjusted big and small tiles can be used.

Can work really well where the large tile has a base colour and the smaller tiles add fresh colours.

Here is the code Tiles Big and Small

Tiles one way or the other

Tiles Up and outAnother classic pattern. Found often in Italy using terra cotta.

Here is the code Tiles Om en Om

But the next tile had me puzzled. I thought I might have to get my school books out to calculate triangles and circles to measure correct movement between rotated tiles. But I figured I could use turtle plotting! I never thought I would get to use the technology.

 

Fish pattern of Vissegraat

Tiles VissegraatIn the next diagram you can see the visgraat pattern.

The best way I could describe this was using turtle commands.

turtle.setheading( 45)

turtle.pendown()
turtle.forward( tileheigthpx)

turtle.right(  90)
turtle.forward( tilewidthpx)

turtle.right( 90)
turtle.forward( tileheigthpx)

turtle.right( 90)
turtle.forward(tilewidthpx)
turtle.penup()

And there you have it. Set heading 45 degrees. pendown, go forward, turn right etc… And we have base tile tilted 45 degrees. Perfect!

Want the code Tiles Vissegraat.

Be creative

I hope these pages can help you plan your floor tiles.

And for the dutch readers here are some search words to help find this document.

Tegels kunnen ook met deze extensie ingedeeld worden. Wij gebruiken het voor boeren plavuizen of estrikken. Terracotta wordt het ook wel genoemd of gebakken klei tegels.