Creating a Polygonal artwork workflow in Adobe Photoshop and Illustrator
A style that I have recently noticed trending around the web is the ‘Polygonal Illustrative Style’.
‘So what exactly is this Polygonal style?’
Well, a simple description is it’s a graphic image composed of multiple flat seamlessly connected triangle shapes. Depending on the shape and size of these triangles, you can create anything from abstract imagery to more refined and detailed artwork.
My first encounter with this particular effect was some years ago when I was experimenting with a plugin from Scriptographer that works with the design software Adobe Illustrator. This plugin allows you to create interesting effects at the click of a button utilising the JavaScript language. One of the many effects on offer allows you to create a polygonal style image (at that click of a button I mentioned). I played around with this for a few hours and have to confess I was quite fascinated with the results.
Since my original experimentation with this effect over the past few years, I now see this style popping up around the web so much that it seems to be becoming somewhat of a trend. There’s even an iPad app called Poly which allows you to easily create a similar effect with images on your iPad.
So, after receiving a load of messages from my subscribers requesting a tutorial on this, I thought I‘d return back to this style and look at setting out a simple and comprehensive workflow to share. My initial idea was to compose a workflow based on the Scriptogropher plug in I used some time ago, after all, creating the effect is pretty much effortless and achieved at a click of a button.
Now, as it turns out, the guys over at Scriptographer have yet to release an update for Adobe Illustrator any later than CS5. So if you’re still working on CS5 you could still use this plugin. Now, with Illustrator having moved on since, I felt I had to create a workflow that could be used across any version and without any limits.
With some research, I was surprised to find that there was no video tutorial on this, so the task of creating a workflow from scratch began. And with a little more research, and, to be honest, much deliberation, I decided to create a workflow that would produce not only the polygonal style, but with a gradient effect. I’d seen some examples with the gradient effect and thought the results were really quite striking.
The Workflow
The good news is that the final workflow uses no filters or plugins. It’s a manual process where a creator can start from scratch to build their own artwork. However, to follow this workflow requires some commitment, as it does take a little time to master, but the end results are remarkable.
The process uses both Adobe Photoshop and Illustrator. Illustrator is used to trace a source image to compose the polygon shapes using the pen tool. Illustrator currently has vastly superior pen tool functionality than Photoshop and allows for swift editing and aligning of points. This in turn allows for an accurate trace of the source image and composition of the polygon shapes.
Once the polygon vector shapes have been created, these can then be brought into Photoshop on top of the source image as paths. Photoshop is used at this stage as it has a speedier workflow when using the gradient tool than in Illustrator (which can be pretty laborious to say the least).
In Photoshop, each polygon shape path can be selected and swiftly filled with a gradient effect using the eyedropper tool to select two colours from the source image and then applying the gradient with the gradient tool.
By repeating this process over and over, one can build up a beautiful polygonal gradient effect image.
As for the finished video tutorial, this is 42 minutes and 12 seconds long and takes you through each step in detail.
The video can be watched here
Article by Gareth David - TastyTuts presenter