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.
Archive for the ‘Web Stuff’ Category
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.
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.
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.
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.
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.
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.
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.
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.
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.
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.
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)