Last night we had an unfortunate outage at umwdomains, the hosting for ds106 students at the University of Mary Washington. With this being finals week, students working feverishly to finish projects and reflections, twitter was never so lit up with activity.

Let’s give some appreciation to people like Tim Owens who was working on this late at night or Zach Davis and Cast Iron Coding who keep the ds106 server from falling over. Like Jim Groom has done before in Behind Every EDUPUNK is a Miserable Sysadmin, it’s time to stop what you are doing, and give these folks some rainbow love.

(click to see the full size rainbow room)

Thus a new ds106 design assignment Rainbows And Unicorns In The Server Room:

Give some love and recognition for the folks behind the scenes that keep the web servers and internet tubes running- often the only time we contact our server admins is when something is wrong. Twitter fills up with “OMG I CANNOT FINISH MY #DS106 PROJECTS WHAT AM I GONNA DO?”

Make an animated GIF of a server room that includes both rainbows, unicorns, and a message of thanks. The cheesier the better. Bonus points for elves and pink ponies.

My own was constructed with a fair bit of layer play in Photoshop, starting with the base layer from this flickr image

cc licensed ( BY SD ) flickr photo shared by torkildr

I did screen shots of the ds106 site as well as those of two students, Nathan and Lauren‘s blogs that flash on the screens (the latter are pretty tiny, but there). This is done by using the ploygon selection on the screen area, and doing a Edit-> Paste Special -> Paste Into to insert the little screen shots. I use the Edit -> Transform -> Distort to change the shape of the screen shots to fit. I also covered two of the server names from the original with text (“” and “umwdomains”), doing some rotate and shear on the text to make them fit.

I used the Make Frames from Layer menu item in the Photoshop animation window to make the layer individual frames I could play with the timing, and activate the screens to blink on and off. I had now a three frame animation sequence.

I got lucky in searching for the unicorn image to find an animated GIF in a discoussion forum. By opening this GIF in Photoshop, in the animation window I was able to copy three of the animation frames (one where the eye was closed), I could use “copy frames” to then go back to my creation and paste frames in, using te option to Paste Over- meaning it overlaid the frames on the 3 I had. To make the wink effective, I kept the unicorn’s eye frame open on all three, duplicated the third frame, and switched that layer to use the closed unicorn eye- by changing the timing I could make it quickly blink.

I found the perfect rainbow on Best Clipart – perfect cause it had little hearts but also because it was a PNG file with background transparent. I made that visible on the last frame.

For the text, to make it stand out, used the Layer Styles – Outer Glow to make the white haze behind, gradient overlay to add a rainbow, and Stroke to put black border around the lettes.

The beauty of working in layers is the small file size you get with the final GIF- the full size one (1024×681) is only 481k.

Okay, even if you do not do this assignment (and I think you should, anyone who has a web site), I ask my #ds106 students to at least write a blog post or send a tweet of thanks to @timmmmyboy and @zdavis

If this kind of stuff has value, please support me by tossing a one time PayPal kibble or monthly on Patreon
Profile Picture for Alan Levine aka CogDog
An early 90s builder of the web and blogging Alan Levine barks at on web storytelling (#ds106 #4life), photography, bending WordPress, and serendipity in the infinite internet river. He thinks it's weird to write about himself in the third person.


  1. May I submit into the mix of things to consider for this assignment? Michael Branson introduced me to it in his application of my visual assignment ‘When Unicorns Explode.’ It was epic.

Leave a Reply

Your email address will not be published. Required fields are marked *