Generative Art Bike Paint Job

17,492

158

32

Introduction: Generative Art Bike Paint Job

About: I make things

Earlier this year, I bought myself a second-hand beat-up road bike. It was covered in scratches and was starting to show signs of rust in places. The bike wasn't anything special, but I decided that I'd paint it pink because pink is the best colour. At first, I thought this would be a quick and dirty job, but 3 months later, a custom Inkscape plugin, bike-sized vinyl stickers, and a number of replaced parts, it appears scope creep got the better of me.

When looking at the options for painting my bike I came across spray.bike, a type of spray paint that is specific for bikes. It's super easy to work with and creates a really cool powder-coated texture. After checking out some of the amazing inspiration over at the spray.bike Instagram page my head was full of crazy ideas for designs for my own bike.

I thought how cool it would be to have Turing patterns wrapping around the main tubes of the bike. I thought it would give it this unique organic look.

I'd come across Turing patterns also known as reaction-diffusion patterns in the past. They a pattern that keeps on popping up in nature from the coats of leopards to the pattern on a certain type of pufferfish. What's cool about the pattern is that the process by which it can be generated is described by a pair of differential equations. This means that you can simulate the generation of patterns with a computer. There's even an interactive demo by github user pmneila.

I'm a computer science student, so this kind of thing really excites me. I wanted to have a go at generating my own Turning patterns specifically for my bike. So, in this Instructable, I'm going to document how I went about doing this, and hopefully, inspire you to try something similar.

Step 1: Striping the Bike Down

The only parts of the bike I wanted to paint were the frame and forks. My first challenge was then to strip down the bike so I could easily access just these parts. I wouldn't say I knew much about bikes when I started this project, but taking apart a bike and putting it all back together is a great way to learn!

To make sure I knew how everything went back, I took lots of pictures of each of the parts I was removing and made sure to keep everything separate.

Taking the bike apart wasn't without casualties though. I managed to strip the threads on the inside of the crank that were used to pull it off the bottom bracket. I had to bring the bike to the bike shop for them to remove this for me with an angle grinder. Also, the stem had managed to corrode itself stuck into the fork tube. No amount of degreaser, penetrating oil, and brute force could get it unstuck. I hade to resort to chopping the stem off with a hacksaw and then using the saw blade to cut out the stem from the inside. By hammering the piece from the bottom side of the fork, I eventually managed to get it out.

After getting the forks free and all the remaining parts off the bike, I removed the decals with a craft knife and gave the parts a thorough clean with a bike cleaning product.

Step 2: Measuring Up the Bike

The plan was to paint the bike with a base colour, and then have a vinyl sticker mask. I'd then coat the bike with a final coat and remove the mask. I would then be left with the pattern on the bike.

The next step of the project was then to measure up the parts of the bike I was going to make a mask for. The way I did this was to measure the lengths of the tubes with a tape measure. Then for all the more complex joints, I covered them in masking tape. I cut around these parts with a craft knife and removed the remaining tape. The tape created a 2D unwrapped version of the joints of the bike. I used a pair of calipers to measure some of the other dimensions as well.

One thing I kept in mind was where the seam would be in the final design. Even though I was hoping that my pattern would match all the way around the tube, I knew that any small mismatch might be quite obvious. I made sure to have all the seams at the bottoms of the tubes where it would be less obvious.

I then scanned the shapes to bring them onto my computer and trace around them in the vector graphics tool Inkscape. I could import the scanned page with all the unwrapped joints into my Inkscape document. I just had to scale it so the dimensions in Inkscape matched the dimensions that I had measured on the bike.

Step 3: Writing an Inkscape Extension

I wanted to generate Turing patterns that fit the shape of the different sections of the bike and with no obvious seam around the tubes. The only way I could think to do this was to build a tool specifically for this purpose. I wanted the patterns to be in an SVG format so that I could use a vinyl cutter to cut out the shapes of the different pieces. A good way to do this seemed to do it all directly inside Inkscape, and write a custom extension.

What I love about open source software such as Inkscape is that it is often very easy to get started hacking around with code that interacts with the program through extensions and plugins. There are some good examples of extensions that come pre-installed with Inkscape that I played around with to come up with my own. Since this was really only going to be a one-off project I didn't polish up the code very much and I would call it more of a hack than anything else.

The plugin works by "seeing" what is selected, then converting that to a bitmap, it then runs the algorithm over the bitmap for a number of iterations, then converts the resulting bitmap back to an SVG and inserts it back into the original file. The code for running the pattern generation is mostly modified from Ben Maier's great python tutorial on Turing patterns.

I've attached the extension here. In order to enable it put the files in your default Inkscape extensions folder. The "diffusion_reation.txt" file needs to be renamed to "diffusion_reaction.inx" - Instructables won't let me attach files of that format.

If you are interested in writing your own Inkscape extensions there's not too much documentation to help get started, but there are lots of existing extensions that can be used as examples.

Step 4: Using the Inkscape Extension

With the traced out shapes from step 2, I created a solid object in one colour. I then put a black background behind the object to create a rectangular-shaped boarder. The extension converts the input into a rectangular bitmap and treats the world as a torus (so the edges match). The bits in black tell the extension not to simulate the pattern there. I then covered the shape with a bunch of other shapes in another colour, this doesn't really matter much, but these shapes act as "seeds" for the pattern to work from. By having lots of "seeds" it means that the simulation needs fewer cycles to propagate fully around the shape. This is good because the simulation is pretty inefficient and takes lots of time anyway. To run the extension I went to "Extensions>Diffusion Reaction". It comes up with a prompt about how many cycles to run for and the dpi (dots per inch). Higher dpi and more cycles take longer but may create a more complex and finer pattern.

After running the simulation, it should insert the pattern back into the Inkscape document in the same position as the original shape.

As I mentioned in the previous step, this extension is very unpolished and isn't a very robust piece of code, but works well enough for my purpose. Given it is written in python and is running many operations over a large 2D array, it isn't the most efficient, so it might look like Inkscape is frozen while it is running, but it does eventually finish.

Step 5: Creating the Vinyl Stickers

I'm really lucky and have some friends who own a vinyl cutter. I was able to get them to cut out the patterns I had designed so that I could transfer them onto the bike. The patterns were first cut into the vinyl, then I cut them down to size with a pair of scissors, I removed all the bits I didn't want to transfer onto the bike, then used some transfer paper to get the sticker in one piece onto the bike.

The vinyl comes on a large roll which is perfect for the long stickers that are used for the tubes of the bike.

Step 6: Spraying the Primer and Base Colours

I built myself a makeshift stand for the frame using a recycling box, a mop handle, and a few large rocks I found from around the garden. I used masking tape to keep paint off any of the parts I wanted to keep clean.

The first layer was a "Smoothing Putty" that helped cover the remaining rust and scratches. The next layer I put on was a light blue. and finally, I used a darker blue to blend into the light from the bottom of the frame upwards. This created quite a nice effect, and I wasn't too worried to make a mess of this step, because the colors were quite close, and the pattern would be covering most of this anyway.

Step 7: Wrapping the Bike

After letting the paint dry overnight, I set about sticking on the vinyl stickers I had made. This was rather challenging, but I took my time and touched up any bits I wasn't happy with, with some extra vinyl and a craft knife. I started with the smaller sections and moved up to the larger tubes. I made sure that the sticker was properly stuck before removing the transfer paper.

I was really stoked with the look after the stickers had all been stuck on, and was getting very excited for the next step.

Step 8: Second Colour

Once the stickers were on I coated everything in a layer of pink. I was quite worried to do this, as I didn't want to ruin all the work I had done by covering it in a clashing colour.

Step 9: Removing the Stickers and Adding Gloss

After giving the pink layer some time to dry, I removed the stickers carefully to reveal the design. removing the stickers was very satisfying and revealed an amazing look that I was very proud of.

To give the bike a glossy finish and the paint some protection from scratches, I used a whole can of the spray.bike transparent gloss finish. This gave the frame a professional feel.

Step 10: Putting It All Back Together

Once the gloss had dried, I put all the parts back onto the bike after giving them a good clean. I had to get myself a new stem and bottom bracket, to replace the ones that were destructively removed during teardown.

I'm super proud with how it turned out am excited to show it off.

I hope you enjoyed this Instructable and are feeling inspired to go and paint a bike of your own!

Bikes Challenge

First Prize in the
Bikes Challenge

Be the First to Share

    Recommendations

    • Toys & Games Contest

      Toys & Games Contest
    • Colors of the Rainbow Contest

      Colors of the Rainbow Contest
    • Furniture Contest

      Furniture Contest

    32 Comments

    0
    akhilgowda.d666
    akhilgowda.d666

    Question 2 months ago

    Can I know that spray paint name

    1
    EdwardP2
    EdwardP2

    7 months ago

    Hands down, most awesome bike customisation I've ever seen.

    0
    Yonatan24
    Yonatan24

    8 months ago

    I've head that removing the stickers/tape while the hasn't hasn't dried completely can create sharper lines, have you dried this?
    Probably less flaking/peeling of the paint.
    Looks great!

    0
    EdwardP2
    EdwardP2

    Reply 7 months ago

    Might be tricky to lift the stickers without disturbing the drying paint.

    0
    Yonatan24
    Yonatan24

    Reply 8 months ago

    *Before the paint has dried

    0
    ollie242
    ollie242

    Reply 8 months ago

    Ooh! yeah, I left it only a few hours to dry before peeling the stickers off but the paint says to leave it overnight to fully cure. I'm pretty happy with how crisp the lines were. But that wouldn't surprise me at all though. I haven't experimented much with it. Maybe I should get another bike to paint :)

    2
    phil_347
    phil_347

    Question 8 months ago on Step 3

    hey! I really love the pattern and I tried using your extension and I get an error saying that the module matplotlib was not found. I installed matplotlib with pip and nothing changed, do you have any idea how to fix that?

    0
    ollie242
    ollie242

    Answer 8 months ago

    Hey! I'm happy you like it 😊 I'm going to look into this. I'm not the best at writing robust pieces of multi platform code so bare with me.

    0
    blorgggg
    blorgggg

    Reply 7 months ago

    cool work! I installed my extension into inkscape 0.92 and it shows up in the menu, but there is no option that pops up to click when using it.

    react diffuse error.JPG
    0
    blorgggg
    blorgggg

    Reply 7 months ago

    Upgraded my inkscape and it shows up, now i just get that matplotlib error others get, ahahhaha :)
    Traceback (most recent call last):
    File "diffusion_reaction.py", line 29, in <module>
    from matplotlib import image as im
    ModuleNotFoundError: No module named 'matplotlib'

    0
    phil_347
    phil_347

    Reply 8 months ago

    I don't know a whole lot in python, but let me know if I can be of any help!

    0
    ollie242
    ollie242

    Reply 8 months ago

    Ok, I've spent a while trying to work this one out. So it turns out Inkscape ships with its own python interpreter, so when you do pip install that's not installing the packages in the right place. I have it set up on my computer so that the Inkscape extensions use my computer's python interpreter. I did this a while back for some reason and forgot about it. Here's a link to how to do it https://wiki.inkscape.org/wiki/index.php/Extension_Interpreters. I tried to reproduce this on a virtual machine, but Inkscape couldn't find python2.7 for some reason. Let me know how you get on :)

    0
    phil_347
    phil_347

    Reply 8 months ago

    Hey! it worked, I don't get the error message anymore. I tried this pattern and started the process. I let it run for at least 45 minutes and I stopped it because I figured it was taking too long (24 dpi and 1000 iterations) do I need to select certain objects, does the colors matter for the extension to work? I really appreciate your quick feedback btw!

    image_2020-10-13_165834.png
    0
    ollie242
    ollie242

    Reply 8 months ago

    Nice! Did the whole of Inkscape freeze or did the dialog box just stay there? if it isn't frozen probably it finished running but just didn't do anything. Sometimes I've found I have to select all the pieces, then unselect the bounding box piece and reselect it so that it looks like the bounding box is the last piece selected. Not sure if that is clear.

    0
    ollie242
    ollie242

    Reply 8 months ago

    Here's a gif

    ezgif-6-c0673949c299.gif
    0
    phil_347
    phil_347

    Reply 8 months ago

    It doesn't seem to work for me.. in the last gif you posted did you keep a black rectangle behind the pink one?

    0
    ollie242
    ollie242

    Reply 8 months ago

    The black rectangle isn't necessary for just a simple rectangle. The reason I use it in the instructable is to avoid the pattern wrapping around the top/bottom of the shape. it creates a more obvious border for the pattern. But maybe if you are using a black rectangle, then select it last. To do this, select everything, hold down shift, and click the bounding shape twice. This makes sure that the extension knows it is the bounding box. (yes I know, not very intuitve).

    0
    ollie242
    ollie242

    Reply 8 months ago

    What happens when you make a single blue rectangle, then run the extension for 1 iteration on it?