Advertisement


Using Paper.js with Illustrator


Question

I've been searching for a way to get the average color of a raster image, to use in a vector grid in front of it to create a mosaic effect - the "Object > Create Object Mosaic..." menu option does not provide enough flexibility to get the effect I want.

Basically, I'd like to do this: http://vectorboom.com/load/tutorials/effects/polygonal_vector_mosaic/3-1-0-305

It seems like Scriptographer would have been PERFECT for what I'm trying to do, but it is only supported up to CS5, and I'm on CC. I've looked into Paper.js (the sort of...evolution of Scriptographer), but cannot figure out how to implement it into Illustrator.

Does anyone know how to use Paper.js with Illustrator? And, more specifically, has anyone had any success with Paper.js in creating an effect similar to the one I posted above?

2016/03/16
1
3
3/16/2016 9:17:00 PM

Paper.js is an intentional departure from Illustrator. Here's an explanation from one of the author's website:

[Scriptographer] was initially developed for Illustrator 9, and kept up-to-date and improved in functionality until Illustrator CS5. Unfortunately, the launch of CS6 brought too many changes in the underlying APIs and has therefore set an end to the project.

But the effort lives on in Paper.js, created by Jürg Lehni and Jonathan Puckey as an open-source vector graphics programming framework that runs on top of open-web standards such as Canvas 2D and SVG, with the aim to broaden the reach of Scriptographer’s API and free it from the closed and expensive confines of Illustrator.

If you're determined to use Paper.js to achieve that effect (or any effect for use with Illustrator), it seems like your best bet is to let your web browser do the work, export to SVG, then import the SVG to Illustrator. It worked well for the Mona Lisa example at least!

Paper.js example

Side note: if you're just looking for an easy way to accelerate the process of achieving that effect, you could try using the Crystallize effect. It doesn't give a result anywhere near as nice as a hand-tuned job, but it does give you a head start.

Crystallize filter

This is a raster effect, so you'd have to use Image Trace to create a vector version.

2016/03/16
4
3/16/2016 9:09:00 PM