Open Source Design: Versions and Forking

It’s almost the new year so I’m getting started early in trying something new.

I moved to using only HTML/CSS for almost all of my mock-up purposes a while ago (see Why we skip Photoshop) . It’s just as fast, interactive, and removes much of the translation issues that that happen when an image is converted into HTML.

While the switch to HTML mock-ups has been good, I’ve continued to encounter the same issues I had with Photoshop images where I have to systematically save new versions of the original source and output.

Versions?

I’ve had many different approaches in trying to version my files.

No index file, just use the HTML list page the web server provides.

  • version 1/
    • prototype.psd
    • prototype.png
  • version 1.1/
    • prototype.psd
    • prototype.png
  • version 2/
    • prototype.psd
    • prototype.png

Or just appending the version numbers to each of the files as you save them.

  • prototype-1.psd
  • prototype-1.png
  • prototype-1.1.psd
  • prototype-1.1.png
  • prototype-2.psd
  • prototype-2.png

Later I end up with a mess of files with version numbers and I don’t really remember what happened changed in each of the versions. This is both true for myself and for anyone else who browsed my designs later.

I’ve also tried creating an index.html file so I could link to all the different versions and describe them but that index file is hard to maintain; eventually getting old and out of date.

Forking?

Oh so you want to participate in the design process? A remix of my mock-up simply means you have to choose a version and then copy all the files onto your own web server and try to get my attention so we can discuss your changes.

Active?

Am I still working on this mock-up or have I moved on? You’ll probably never really know because there’s no easy way to tell. If I have an index.html file then hopefully I put the last active date on it or if I don’t you could use the last modified time in the directory listing.

A New Way!

My new trick that I’ve recently started trying is to use GitHub Pages to host my HTML mock-ups. So far it seems to fix my version and forking problems.

Versions

I’m keeping a simple rule that each check-in must work (I can’t break the whole thing) and I should describe the changes in my commit messages as much as possible so myself and others can understand why the mock-up might have changed drastically.

There is no version numbering to deal with here since git does all the versioning. The GitHub page only displays the latest version, which is a little bit of a setback, but anyone can clone the source and then checkout the older versions locally.

Forking

Not only does GitHub provide a super simple way for people to fork my mock-ups but it also allows me to see what those people are doing by keeping track of the forks and their progress. I could actually incorporate changes from someone else into my mock-ups by merging them in.

Active

It’s pretty easy to see from the source view the last time I was actively working on a mock-up. And you could drop over to my profile view to see what other mock-ups I was more actively working on.e Bonus!

Next

I’m going to try to add some standard pieces to my pages so it’s easy to find the source code and perhaps a README page which quickly describes how to see the older versions of the mock-ups.

Any other ideas?

5 responses to “Open Source Design: Versions and Forking

  1. Pingback: Open Source Design: Versions and ForkingBryan Clark | 9nd.pl

  2. Paul

    Use descriptive tags to mark stable mock-ups.

  3. Jef van Schendel

    This is something I’ve also been wondering about, thanks for the interesting post. :)

    So by doing this using GitHub, does that mean it can also show the forks in the Network Graph Visualizer[1]? Because that would be ideal!

    (Even better if it could show graphical representations of the branches at different times, but that’s a step further.)

    Jef

    [1] https://github.com/blog/39-say-hello-to-the-network-graph-visualizer

  4. I am doing almost all my mockups in Inkscape and this avoids many of the Photoshop problems. Being XML is also friendly with versioning systems.

  5. Yes, like nicu said, using SVG as a file format can give you the best of both worlds: you can still use an image editing program and you can use a versioning system to deal will all the… versioning.

Leave a Reply

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

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

 

aboot

This is the blog personality of Bryan Clark. I'm a designer in a world of open source. This blog reflects mostly writing about Design, Open Source, Economics, Beer, Wine, and Dogs. There's more information about me on this site or you can contact me directly at clarkbw@gmail.com.

scategories