Watch A Web Site Design Unfold Before Your Eyes

This might be a sideways version of a screen cast. At Mboffin.com, Dylan created an animated GIF that shows a screen shot captures for each change as a web site was developed. You can watch it evolve from un-formatted semantic HTML through different iterations of font sizes, creation of the page elements, etc. It’s a testament to the organic evolution of a hand hewed design that is kneaded like bread, not popped out of some easy bake oven. It is like watching a stop motion movie of a flower emerging from a bud. It is like… well that’s enough tacky metaphors

See “Designline A Design Timeline”:

I have often wondered what it would be like to see a web site design progress from start to finish, with each tweak and change being shown as it progresses””a design timeline, if you will. I don’t mean from conceptual start to finish””from blank piece of paper to finished Photoshop image of the design. I mean from a blank browser and text file to a completed HTML file with associated CSS and images…

To create this designline, I took a screenshot basically every time I saved my HTML file. I’m one of those people who impulsively hits Ctrl-S after every tiny little change, so you end up seeing every little change made to the file as it goes. I started out with a blank text file and I go all the way to a completed site design. Check it out.

Now it may or may not have been enhanced by an audio track narrating the changes. Regardless it is a nifty concept, and something that is beautifully old technology (remember the pre-flash, pre plug-in days when an animated GIF was all the rage? well maybe it was not so great remembering all those cheesy moving icons…)

What is even more fun to read is the 10 year old story describing from where in the bowels of Windows95 that produced the name of this site…