Daily Archive

Hard hitting social commentary to resume soon on DWR. Today, I have a bit of personal fluff that I hope will bring a smile to your day. TL;DR version provided at the end if you’re pressed for time. Just scroll all the way down.

I do not do well with real world objects or processes. My skill with a hammer was once likened to lightning. I never strike the same place twice. With supportive feed back like that (thanks, Dad), it should be no surprise that I do most of my tinkering in the virtual world. In the synthetic land of 1s and 0s, mistakes are a Ctrl-Z away from being completely erased from history.

Recently I’ve had two such interests cross paths: photoshop and web coding. I have spent a great deal of time looking up manuals and tutorials online on these two subjects. In both fields, there are usually a thousand and one ways to get a particular result. The trick is finding a method that is effective, efficient, and caters to your style of doing things. So while I wouldn’t say I’m particularly good at either photoshop or coding, what I have gotten fairly good at is finding the bits and pieces I need on the internet, then combining them to achieve my tinkering goals. My Google-Fu is strong (if I do say so myself).

Throughout my many photoshopping adventures, I have, from time to time, played with geometric shapes, patterns, and psuedo-fractals (check my profile photo). As these shapes are not representing anything, the choice for colours is wide open. This makes things quite difficult for me, as I’m horrible at deriving colour schemes.

“You better marry someone who can dress you, because you don’t know a thing about colour”
-My first web design instructor

While I have many techniques for checking my colour choices, there is one relevant today. I will put a hue adjustment layer on top of my project and slide it slowly around the 360 degrees of the colour wheel until I find a spot I like. On numerous occasions I’ve thought that the shifting colour was more impressive than any one spot on the wheel. I will just play with slider, going back and forth, watching the colours shift into each other. Depending on the project, these colour shifts can be very exciting or quite soothing.

Previously, I played with the idea of taking a number of stills at incremental hue settings and then making an animated GIF out of them. However, GIF files only have 256 colours and the results were less than impressive. On top of that, the process was painfully slow and arduous. After three or four attempts, I gave up on the notion and it disappeared in the lonely wasteland that is the graveyard for broken dreams and abandoned whims. Two recent discoveries brought it back.

First, I learned that it is possible to write scripts for photoshop. While the program comes with a number of actions and the ability to create your own, sometimes a project needs a more custom-fit solution. It turns out that one of the languages you can use for this is javascript, a language I am familiar with because of the web work I’ve done. Further, there is a script reader you can attach to photoshop that will log the script involved in every PS action you take. You can then use that log to inform your scripts. The potential is immense.

Second, I learned about APNGs. I was reading up on reducing web site load times and this article said that you should compress all images, as any file made in photoshop is unnecessarily large. I tested a few online compressors out and indeed, the there was a lot of file shrinking possible. One of these compressors had a new feature. They compressed not just JPGs and PNGs, but also APNGs. Their example blew my mind. It was animated PNG of a panda waving, smoother and clearer than any gif I had ever seen.

It just so happened that these new-to-me things were fresh in my mind when I was using my colour wheel check on a project and it all clicked together. After a little trial and error, I had written a script that would adjust the hue by 5 degrees, save a numbered PNG to a folder on my desktop, then repeat until it went all the way around the colour wheel. I found a couple online APNG assemblers, uploaded my stills, downloaded the animation, and put it through the compressor. Now, I’m not about to pay for the pro service, so I was only able to use one quarter of my stills. This makes the result not nearly as smooth as I’d like, but I’m still pretty happy with it.

So now, after much too much ado, I present a fractal colour morph built on script and Google-Fu, created by yours truly.

For the adventurous among you, I have a second example. With some images, this shifting colour can give the illusion of movement. Warning: The linked animation is big (5MB) and is not recommended for viewers who aren’t comfortable with flashing lights. If you’re cool with that, enjoy some psychedelic splendour.

TL;DR Lookie! Colours!