FXHASH

Kusamehewa

Generating Realistic Textiles

Over the past year we have created several pieces based on realistic looking textiles. We love to see generative art which calls us to imagine what it would feel like to be able to touch its surface. In this article we explain in some detail how we have achieved near photo-realistic textiles with p5.js.

Some Textiles from Patched with Tartan

When creating a new textile we always begin with a high resolution photograph of the kind of fabric we are intending to emulate.

Single Colour Textiles

For our first textile in our work, Sigil Magic, we began with a photograph of a simple cotton sheet. We analysed the light and shadow in this at high magnification and created a repeating pattern of simple shapes. We filled these with highlight or shadow colours at randomised alpha. In these first examples we used lighter and darker shades of our background colour. Later we tend to use translucent black and white although this doesn't give quite as much depth.

Cotton textile at 7x magnification
Cotton textile at 1x magnification

And that is the process that we used to create many different generative textiles. We always began with a photograph of a physical fabric. We used muslin, linen, canvas, upholstery fabric, denim and others.

Fabric Wallpaper fabric at large and small scale
Brushed Cotton fabric at large and small scale
Upholstery fabric at large and small scale
Linen fabric at large and small scale
Denim1 fabric at large and small scale
Denim2 fabric at large and small scale

Printed Textiles

For our project, Patched, we wanted to create printed patterns on the textiles. We wrote some code to draw thick, slightly rough lines and arcs to make the patterns with. We found that if we drew another more translucent textile layer on top of the 'printed' marks it made them look like they were part of the fabric.

Large and small scale clover pattern on fabric
Large and small scale flower pattern on fabric
Large and small scale circular pattern on fabric

Woven Fabrics

We were also interested in creating patterns with woven fabrics. These offer many more opportunities for playing with colour combinations and allowing for generative surprises.

To do this we created arrays of named colours in different or random orders. Then as the code drew each line of its repeating pattern it would use the colours from those arrays in order.

Large and small scale woven fabric
Large and small scale woven fabric
Large and small scale woven fabric
Large and small scale woven fabric

Because we were now drawing individual threads within the fabric we drew lines across each thread to suggest how it is twined together. While these details are not obviously visible in the fabric rendered at normal sizes they make a surprising difference to how natural the fabric looks. Without them it tends to look much more stiff and synthetic.

Tartan

Possibly our favourite of all the fabrics, tartan was a natural development from woven fabrics. Once we had the code in place for weaving we adjusted everything to produce these very realistic fabrics. We particularly love it when they come out with a distinct softness about them. They work particularly well in the colours of Scottish gorse and heather.

Tartan in soft heather colours
Tartan in dark warm sunset colours
Tartan in natural earth colours
Tartan in deep grey blues and pinks

Embroidery

To join the fabrics together we needed stitches. We created very simple embroidery stitches using round ended strokes of decreasing line width and increasing lightness. We placed these on small shadowy ellipses to give the illusion of them entering the fabric. We coded these to be drawn in straight lines or arcs.

Mixed fabrics with embroidery
Mixed fabrics with embroidery

Then in our pieces Boro and Sashiko we extended the use of stitching to make embroidery patterns covering the surface of plain or woven fabrics.

Boro
Sashiko

Paint on Canvas

Our next project involving fabric texture was Zen Strokes. In this work we wanted to create the look of thick paint on canvas. We made a new canvas texture for this work. On the background we 'painted' many thin, rough strokes of colour onto the canvas and went over them again, randomly erasing - emulating the way that the paint ebbs and flows as it comes down the bristles. We then put the canvas layer on top of what remained of these strokes, finishing with a top layer of thick paint strokes in the centre of the paint mark.

Zen paint magnified
Zen paint magnified
Zen Strokes

Peruvian Cloth

This fabric project involved weaving deliberate patterns into cloth. We studied traditional Peruvian weaving patterns and decided to create a fabric texture with the appearance of being made from thick vertical threads. We could then colour these threads just as in previous weaving patterns but this time with more control to create designs within the cloth.

To understand the construction here is the basic weave shown with and without the weave layer.

Peruvian cloth without weave layer
Peruvian cloth with weave layer

We then created different designs in the weaving. This was not entirely satisfactory as we would have liked to have more randomness in the creation of the designs. We were, however, very pleased with how well the finished tokens match modern Peruvian Cloth.

Peruvian Cloth magnified

Thank you so much for reading. If you would like to know more about anything described here please do not hesitate to contact us on Twitter @Kusamehewa1 or on Discord Kusamehewa #5288




stay ahead with our newsletter

receive news on exclusive drops, releases, product updates, and more