Archive for the ‘Web Stuff’ Category

Doodle 889 – Angry Plant Birds vs Zombie Pigs

July 23, 2011

doodle 889 - Angry Plant Birds vs Zombie Pigs

My nephew asked me to doodle a mash-up of Angry Birds and Plants Vs Zombies, so I hope he likes how this came out.  I’ll have to find time to color it up for him later.

Doodle 813 – Mother’s Day 2011

May 8, 2011

doodle 813 - Mothers Day 2011

Happy Birthday all you moms out there!!!  I made a little HTML poem/card with some cherry blossom jQuery animation for my wife and my mom.

Doodle 629 – Nametag Builder

November 5, 2010

Doodle 629 - Nametag Builder

I decided to go the same route I did for the reading certificates and make a jQuery web page for my son’s teacher to build all the nametags for this years camping trip.  All she had to do was figure out the kids names, groups (animal picture), cabin info, table number, and job in a spreadsheet.  Then, she can save the spreadsheet as a comma separated file, and paste the whole thing in this web page.  The page sets up four nametags per sheet and hides the controls when you print it.

Nametag Builder Output

Doodle 567 – Slices Clock

September 4, 2010

Doodle 567 - Slices Clock

Tonight, I obsessively got my slices clock working.  I had to use enormous PNG images as a substitute for HTML5 canvas, so it takes forever to load, and bogs down your browser, but it’s just a proof of concept.

Check it out here.

Doodle 564 – Slices

September 1, 2010

Doodle 564 - Slices

I just couldn’t let go of the clock I wanted to do in HTML5 so I tried figuring out how I would lay it out tonight.

Doodle 562 – css clock finished

August 30, 2010

Doodle 562 - css clock finished

This is what the clock finally ended up looking like when I got it all working.  It’s based on differing opacity so you should be able to put a background picture behind it too…

Check it out here.

Doodle 561 – css clock

August 29, 2010

Doodle 561 - css clock

I wanted to make a clock using the canvas element of HTML5, but was sad to find that it’s still not supported in all browsers.  Instead I decided to try doing something with css and divisions.  I sized everything by em’s so it scales super easily to be the full height of the window.  This is the layout before I got the clock mechanics working.

Doodle 379 – Zombie Tri-pod-bot

February 28, 2010

Doodle 379 - Zombie Tri-pod-bot

I finally got around to trying our odosketch which is a pretty cool way to doodle in your browser.  Wish i had more then my laptop trackpad when I drew this up though.  The best part is that you can go back and watch the whole process here.

Thanks to for suggesting I try it!

Doodle 336 – jQuery Word Clock finished

January 16, 2010

Doodle 336 - Word Clock finished

So this was the final version of the clock when I decided I was happy with it.  You can check it out here.  The one thing I still want to add it for it to auto-size the text to as big as possible for your browser window without overflowing.  Someday I’ll figure it out I suppose.

I was up until 2 a.m. because when it was almost done, the first time, I decided that I wasn’t tracking the states as well as I should, so I basically started all over.

Doodle 335 – jQuery Word Clock preliminary

January 15, 2010

Doodle 335 - Word Clock preliminary

I saw some really cool “word clocks” on the internet like this physical one on instructables and this screensaver.  I thought I would see what I could do with jQuery, so this was some preliminary work I did with minutes and seconds just to figure things out.  The obnoxious colors are just so I can see which state the words are in.

Doodle 287 – Reading Certificate Complete

November 28, 2009

Doodle 287 - Reading Certificate Complete

This is what the final reading certificate ended up looking like.

Here’s an example of how the web page functionally works. Check out the print preview to get a better idea.

Doodle 286 – Reading Certificate Parts

November 27, 2009

Doodle 286 - Reading Certificate Parts

These are the final pieces that I had to generate for my son’s school’s reading certificates.  Now I just need to code up the web page and I’ll probably use it as my doodle tomorrow.

doodle 286 sketch

Doodle 231 – jQuery Sliding Clock

October 3, 2009
Doodle 231 - jQuery Sliding Clock

Doodle 231 - jQuery Sliding Clock

While this is not my normal doodle fare, I still think it should count for my creative output for the day.  I suppose I could scan in my scratchy notes while I was planning it, but they’re all a mess.  This is a html/jQuery clock I made that moves the slides along the scales based on the current date and time. The idea popped in my head some time ago, so I had to make it.

here’s a link to the clock

Doodle 195 – jQuery Flashlight page

August 28, 2009
Doodle 195 - jQuery Flashlight

Doodle 195 - jQuery Flashlight

A few months ago I wrote a jQuery Flashlight page just for giggles because it was a fun idea.  Yesterday I found David Walsh had ported the idea to MooTools, which was cool to see that other people thought the idea was interesting as well.


This was also the last day of class so I did a couple extra doodles.  And I just broke 2000 visits today.  w00t! (yes those are zeros)

Ice Fishing

Ice Fishing

Humpty Dumpty Pirate

Humpty Dumpty Pirate

%d bloggers like this: