Visualizing Design Evolutions using Git
by Alex MacCaw
With technologies like Git, we can easily access the history of a repository, and see how the code is build up over time. I've been wondering if we can do the same with designs, visualizing the evolution of an application from a visual perspective.
My design process is pretty iterative, and I'm constantly tweaking colors and positions to see what looks good. As well as being an interesting perspective into an applications evolution, I think this is also useful from a QA and regression testing perspective.
for commit in $(git rev-list master) do $(git checkout $commit) $(webkit2png public/index.html) done
Unfortunately this particularly method of generation visualizations is probably not going to be ideal for most applications. Stylo is a static JS app, and therefore I don't have to worry about database migrations or other state that's not synconrized with Git commits. The ideal solution is probably taking a screenshot with a pre-commit hook.