easwee.net // tiny digital playground

svg drawing with github copilot

This week I noticed that I've got Github Copilot invitation that has been sitting in my mailbox for some time now - not sure how I missed that. Anyway, started playing around with it to see how capable it is and it definetly speeds up typing code - I can see myself getting lazy and hooked on this (and why not, I want to build features and products, not type code).

Soon enough I've got this idea that maybe the boy is smart enough to generate some random vector graphics and maybe get something interesting out of it. Well turns out it is not that interesting at the end of the day, but was a fun experiment:

Github Copilot says Hello World

So how was this SVG generated?

I decided I will pick a few different SVG elements like <circle>, <path>, <rect> etc. and let Github Copilot complete the properties however it feels. I had to change a few colors in the end, because for certain elements it just kept rendering white fill, and also when you use the same element multiple times, it will just keep repeating the same numbers, so I give him a bit more help and setting a "seed" prop from which then it gets a bit more creative and computes different numbers.

I giggled at the <text> tag, where Copilot decided to just put in the text Hello World - I liked that bit. The second time I tried, it put in PHP tags - crazy.

I was disappointed with the <ellipse> tag since it always defines props that result in a circle, so that one is a bit boring.

Github Copilot certainly is not a creative artist, but a great tool.