The Ultimate Guide to Version Control for Designers

Sep 2 2009 by Anatoly Paraev | 39 Comments

For most developers, version control tools are the most important tools in their toolbox. Every development project starts with choosing the right version control system.

However the majority of designers are still not familiar with the concept of version control, and a very few designers actually use some versioning tools in their work.

This article will help you to understand why version control is important for designers and help you to start using it for your projects.

What is version control?

The easiest way to understand the concept of version control is to think of it as of the file history in Photoshop.

What is version control?PixelNovel Timeline is an example of a version control for designers.

However, version control is much better than history in Photoshop: you also get a never-ending "undo", effortless backup, peace of mind, and a more organized way of storing different versions of your work. You can have all of these things simply by taking a few minutes to read this article to understand what version control systems are.

With version control systems, file versions are stored in a special database (usually called a repository). The fact that the history of a file is stored separately from the file itself adds extra safety: even if the file becomes corrupted, you can always restore any of its other versions from the history.

One more advantage of using version control is that you can store the versions of your files on a shared resource such as a computer in your local network, or an internet-based repository. Therefore, you can edit the same file together with other designers in your team without the fear of overwriting each other’s changes–both yours and your colleague’s changes will be saved.

In order to submit a new version of a file–or get an existing one from your repository–you will need to use a client application that connects to your version control system. Whenever you feel you have done something worth saving, click the submit button (it may also be called commit, or check in in some systems) to update your repository. Now this version of the file is saved in the repository and you can always get it from there.

When you get an older version of a file, the client application usually replaces the file on your computer with the version from the repository.

How can designers benefit from using version control?

There are multiple benefits of using version control, and some of the benefits make it especially attractive for designers. The most obvious benefits are:

It helps you keep your files structured and tidy – you don’t need to create multiple copies of the same file and cluttering your hard drive.

Hassle-free backup – all your files are securely stored in the repository along with all their versions.

Centralized and shared storage of all your assets – this feature becomes important when you are working on a project in a team environment, as everyone always knows where to get the latest version of some asset.

Some benefits that are especially important for designers:

The ability to easily save multiple versions of the same file – this is ideal for brainstorming.

Simplified collaboration with developers – if you are working on a web project together with developers who use Subversion (SVN) or Mercurial (which are a couple of popular versioning systems that we’ll talk about later) for the source code, then you can use the same SVN/Mercurial server as they do. This will help your team keep all project files organized in one place and securely backed up.

What version control tool is right for you?

Are you ready to give version control a go? Read on to help you decide what tool is the best for you.

Tools for designers

First, we will review the tools that were made specifically for designers, and then we will discuss generic tools suitable for both designers and developers.

Adobe Version Cue

The first tool aimed at designers is Adobe Version Cue.

Adobe Version Cue is the Adobe’s version control system. Version Cue is a part of Adobe Creative Suite family and is not sold separately, so in order to enjoy Version Cue you will need to have some edition of Creative Suite.

Version Cue also dependent upon other Adobe applications from the Creative Suite package (namely Adobe Bridge and Adobe Drive), so it’s not a standalone solution. However, it’s pretty powerful and is integrated into Photoshop, InDesign and Illustrator very well as they’re all made by the same company.

Here is a very brief guide on how to start using it.

First, you will need to set up a Version Cue server. The server may run on the computer where you do your design work or it can run on a dedicated machine. You don’t need to buy another Creative Suite license for the server, as it doesn’t require activation.

To create a server, you need to open the Version Cue settings in the System Preferences (Mac OS) or Control Panel (Windows). You will need to enter the name and visibility for the server (private or accessible by other users).

Version Cue settings

Now press Start and finish server configuration by providing the admin password.

Version Cue server configuration

Once the server is started, you can connect to it using Adobe Drive: Start Adobe Drive on the computer where you will be doing your design work and you should see the newly created server on the Visible servers page.

Version Cue connect to server

Select the server, enter your user name, password and press Connect.

Version Cue connect to server continued

Now you will need to create a project for your files. A Project is just a folder with logically related files or subfolders. For example, you can have one project for each of your clients, or for each advertising campaign.

To create a Project, open Adobe Bridge and select the Version Cue item on the Favorites tab.

Version Cue Create new project

You should see your server in the Content panel. Double-click it and go to Tools > Version Cue > New Project… item from the main menu.

Version Cue new project continued

Now choose the name and description for your project and click the Share the project with others option if you want this project to be visible to others.

Version Cue Share project with others

Once the project is created, you can drag and drop a file into it, and it will be automatically become checked in; this means that the first version of this file will be saved on the server. You will need to add a comment for the first version to give it some contextual information that can be used for reference later on.

Version Cue Describe the project]

If you right-click your file in the project and open it in Adobe Photoshop, you can make some modifications to it.

Select the File > Check in menu item to save the second version.

Version Cue Check in

Go back to Adobe Bridge, and you will see that the file now is at Version 2. Right-click the file in Adobe Bridge and select View versions from the context menu; this will display both of your versions in the Content panel.

Version Cue versions displayed in content panel

You can right-click the first version and select Promote to Current Version to get the first version and replace the current file with it.

To read more about Version Cue please visit Adobe website section on Adobe Version Cue.

PixelNovel Timeline

The second version control tool made for designers is PixelNovel Timeline. Timeline is a Subversion client integrated into Photoshop. Though it is not a version control system as such (it’s just a front-end for Subversion), it is interesting because of the user interface. It features a unique UI that makes versioning as intuitive and as user-friendly as possible, integrating very well with Photoshop.

PixelNovel Timeline - Simple user interface.

One more advantage of Timeline is that it comes with a hosted online repository on PixelNovel that you can use straight away, avoiding the efforts needed to set up a Subversion repository server. This makes Timeline the ideal choice for those who want to try version control for the first time and don’t want to put too much effort in setting it up.

To start using Timeline with the PixelNovel online repository, you will first need to sign up for an account:

After confirming your email address and choosing your account settings, you will be able to download and install the Timeline plug-in. After you install it, Timeline Project Assistant will be started. Timeline Project Assistant creates a mapping between the folders on your machine containing your files and the folders in the repository. Just choose the folder on your computer that contains all the files related to one project, and provide a name for this project.

PixelNovel Timeline - Create a new Project.

Now you can open any file from the selected folder in Photoshop, and you will see an uncommitted (not yet submitted) revision in Timeline panel.

PixelNovel Timeline - Timeline panel.

Click Submit to commit the current version of the file to your repository.

PixelNovel Timeline - Saving a version.

The preview of the first version will be displayed in Timeline panel.

PixelNovel Timeline - Preview in Timeline panel.

Now you can edit the file and Timeline will display the uncommitted revision once again.

PixelNovel Timeline - Edit uncommitted version.

You can press Submit once more to submit your second version, and so on.

PixelNovel Timeline - Submit your second version.

You can view your files online if you log into your account at PixelNovel.

PixelNovel Timeline - Submit your second version.

Timeline is also available in a standalone variant that can be used with your own repository.

Being a Subversion client, Timeline inherits all the pros and cons of Subversion that are covered in the next section.

To find out more about Timeline visit PixelNovel website.

Generic Version Control Systems

If you are not happy with the version control solutions oriented towards designers, you may want to consider a generic version control system suitable for any type of files.

Using a generic VC system may also be a good choice if you work on a cross-functional project involving both designers and developers.

I will cover the three systems that are most popular right now: Subversion, Git and Mercurial (Hg).

Subversion (SVN)

Subversion (SVN)

Subversion is the most popular version control system used in many high-scale open source projects, though it has started to lose its positions to Git more recently.

A Subversion server is reasonably easy to set up, and there are plenty of hosted online servers ready to use. Some SVN hosted solutions are tuned for designers such as PixelNovel and Beanstalk.

Subversion is liked for…

  • being easy to understand.
  • reliability.
  • it’s abundance of clients that are readily available.

Subversion is disliked for…

  • being slow.
  • weak support of branching and merging.
  • not being distributed.

More Subversion resources:

Mercurial (Hg)

Mercurial (Hg)

Mercurial is a distributed version control system designed with speed in mind. Distributed version control system means that it may have multiple repositories branched from each other and synchronized on a regular basis.

Distributed version control systems offer many benefits to teams of developers spread out across multiple locations. Unfortunately, this feature gives little benefit to designers. The reason for this is as follows: synchronization between multiple repositories usually involves merging operations. Merging means manually choosing the best parts from two different versions of a file. This operation can only be done on text files such as source code. However, designers usually work with binary files (such as .psd, .ai, .swf and so on), and if the same binary file is edited in two repositories, one set of modifications will be lost.

Still, Mercurial is a great and fast system so it may well be used for design projects. There are a number of hosted online Mercurial repositories such as freeHg.org and bitbucket.org that you can use to avoid setting up your own repository. There are also some great Mercurial GUI clients such as TortoiseHG for Windows and Mac OS X.

More Mercurial resources:

Git

Git

Git is a creation of the programming superstar, Linus Torvalds.  As with most of Linus’ creations, Git quickly became fashionable amongst programmers. It has a number of advantages compared to SVN, but it’s fairly complicated to use and is not the best tool for beginners. If you are new to version control, I would recommend that you to start with either Subversion or Mercurial.

Git also has a number of hosted online services, Github being the most popular one.

Git’s strengths are…

  • It’s a distributed system with strong support of branching.
  • It’s faster than SVN.

More Git resources:

More version control resources

Your thoughts?

Should all designers use version control systems? Do you have experiences in using version control? What are the negatives of using version control systems? Share your opinions in the comments.

Related Content

About the Author

Anatoly Paraev is the co-founder of PixelNovel, the London-based company determined to make version control more intuitive and less painful. In his spare time, he enjoys playing basketball and watching old French films. If you would like to keep up and get in touch with Anatoly, follow him on Twitter, @pixelnovel.

39 Comments

Tomi

September 2nd, 2009

At the office we use MS VSS (Microsoft Visual Source Safe)

We can use it with Adobe suite too.
But, i like Adobe version cue.

Great article!

MD

September 2nd, 2009

Not real version control systems but it works in my workflow. I work as media designer and I don’t need “deep” versioning. I love to have a few versions to go back to if something happens with the current working file (e.g. Photoshop: flatten layers and hit save).
– gridiron flow http://www.gridironsoftware.com/
– dropbox https://www.getdropbox.com

Sheldon Finlay

September 2nd, 2009

It’s great to see a comprehensive article on version control for designers. I think there is a lot of benefit for anyone working with electronic assets to implement a version control system and teach their team to use. I think the latter part is the most difficult, but once they see how it can save time they easily convert.

The time required to learn either SVN or Git is pretty much identical in my opinion. You can be up to speed in 30 minutes with just a handful of commands. You don’t need to be a poweruser to gain benefit from either SVN or Git. The benefit that Git affords with easy branching and merging, not to mention just working better, makes it the obvious winner over SVN. Add Github.com to the mix and you have an awesome version control setup that the whole team can use.

Rez

September 2nd, 2009

You said at the beginning that we can get never ending “undo”. But it isnt mentioned as a feature of any of those programs.

Thats the only feature that’s enticing to me.

BladedThoth

September 2nd, 2009

While I found your article useful with tips on how to get set up, I did not find your list comprehensive. Another (And very popular) solution is FileHamster. While the developer of the title (MogWare) has changed their website, there is still a free version (Just download the trial and after 30 days it reverts to the Free version), the actual full packages are very affordable. While it doesn’t offer such perks as branching/merging per-say, it does offer its own layer of benefits. I find for design purposes, it works quite well. I’m sure with large projects it could get a little painful. However, the scope of the article above seems to cover small design projects and FileHamster does fit this nicely.

eris

September 2nd, 2009

nice and useful reading

David

September 2nd, 2009

hmmm…. it seems like overkill for designers, but for developers this seems like a must-know/have process.

Ludo

September 2nd, 2009

hi,
I confirm that this article is awesome and very usefull for all people. nobody think to keep a version to come back on some change later or to correct errors.
PixelNovel look a great software because it work with subversion, so you could use this system to archive all your other web files too.

5 stars if vote exist.

Jarod Taylor

September 2nd, 2009

Wow, I’ve been using Subversion for a while now when working with development teams, but had never even really opened Version Cue. What an awesome resource. Great explanation of the benefits as well.

Thanks!

Tab Hockamier

September 2nd, 2009

Great article – much of this could apply to regular developers (ie.. components, desktop, etc)

I have more content on SVN if you wish to give a look:
http://codertools.wordpress.com/2009/03/24/svn-subversion-clients-and-other-tools/

Thanks

stephane

September 2nd, 2009

Interesting article.

I was just looking at version control for a project i’m currently working on so the timing is pretty good.

One thing though, you should always state when your working for one of the product, not saying it in the article remove some of the credibility.

Stefan / intuitiv

September 2nd, 2009

My favorite is subversion, it’s a little bit of hassle setting it up. But if it’s running it integrates very smooth into explorer (windows).
As a web designer you do not have graphics alone, you do have code, some word or pdf files, some of this and some of that.
Subversion is the tool storing binary differences (so called deltas) between the versions and therefore very flexible for my kind of work.

Thanks for the detailed overview.

Cheers, Stefan
(Author of the german book for how to use Twitter: “Twittersweet – 140 Zeichen für den Geschäftsalltag” – Amazon, 14,95 EUR)

Matt

September 2nd, 2009

When I was first looking into version control, I actually found Subversion to be very intimidating out-of-the-box. I went with Git because it was very easy to get started with. Although it has many advanced features, I found the learning curve to be a gentle slope. I would recommend the Railscast on Git to anyone who is getting started with it. Also, RefreshPDX has a great presentation on some of the more advanced features of Git…the presentation also focuses on Git as an SCM tool for designers.

Theo Denovan

September 2nd, 2009

Thanks for an extremely comprehensive over view.

I would add only that another useful hosted version control service is getdropbox.com and that an additional advantage of GIT is that it doesn’t inject itself into every folder of a checked out repository on the local file system unlike SVN.

It’s certainly good to hear a designer’s perspective in what is typically a coder dominated area; hopefully these services will start taking account of a more diverse pool of users. It’d be nice to see file formats as well as file systems facilitate versioning. Services like getdropbox support differential syncrhonisation so that only changed parts of files are transferred however as soon as compression is applied to a file the entire file must necessarily be re-synchronized.

Andy Feliciotti

September 2nd, 2009

I use http://www.getdropbox.com/ it saves all revisions of a file and you can just hook up your work directory to upload to it. Also it’s good for accessing your files anywhere.

Kevin Quillen

September 2nd, 2009

People don’t think they need version control until the shit hits the fan. Then you wish you had it. Definately tools folks and freelancers should be using.

John Wang

September 2nd, 2009

Agree with MD. GridIron Flow FTW! Granted, I also use Git for my coding side of things. But for the design side, Flow is just amazing. It’s what I wish Version Cue was.

Roberto

September 2nd, 2009

I’ve never used this. Will look into it. Thanks.

Bobin

September 3rd, 2009

Great ,

wonderful post , thanks for sharing

Devin

September 3rd, 2009

We use Canto Cumulus 8 for version control. With more than 14,000 digital assets, we needed something that could handle our file load on an enterprise level.

Bridge, or version cue can’t manage the asset numbers that we currently have. I’ll be the first to say that the bare minimum price tag of $3,500 isn’t for everyone (or anyone).

Travis Smith

September 3rd, 2009

We use SVN here at the office (a web design and UI shop). It is great when it works, and it a royal pain when something gets screwed up. But you just delete your folders, and re-checkout the offending files. Our developer is an SVN whiz, so that helps.
This is one of those things that everyone should use, because is really can save your life. Having a web accessible repository is also nice for getting to files when you are away from your computer.
I like SVN so much, that I started using DropBox for my personal file – it has been a lifesaver!

Larry Kwiat

September 3rd, 2009

Git is wonderful, it can be made a lot easier for a design-based team by attending carefully to the meta-data. Make sure you use intelligent names for the file groups and branches, so no one needs to guess. And: publish a file tree.

Webjohn01

September 4th, 2009

This is a great article that I never heard before. This is great because it will help you to become more productive and to secure all the important files.

AlaskaW

September 4th, 2009

We use Subversion also, and we don’t think it is slow unless you are checking out a couple thousand files. But once the job is done, it is great!

Repos & version control are a necessity in our work. And yes, keep the files on a different box and back them up regularly.

colin

September 4th, 2009

So, I stepped out with Adobe Version Cue CS3 and it’s already stopped working on me. It’s barking at me:

“Version Cue CS3 could not be started.” Then it tells me to check the server logs which seem to indicate that it’s having some issues finding the database?

Any ideas?

If I can’t get this fixed I may be 1 and out.

Great article though.

colin

September 4th, 2009

aaannnd, I updated my Version Cue and everything appears to be working correctly. Back on the horse!

Ivan

October 14th, 2009

Excellent article. I’ve been looking for version control alternatives for my designer friends who just can’t understand anything about GIT

Victor

October 15th, 2009

Very nice article Anatoly, quite a good introduction to the topic.

A couple of things for everyone to keep in mind. First off, if you’re a Mac user, Subversion usage can lead to all sorts of issues with certain applications. In order to track changes and hierarchy, subversion creates hidden folders (named ‘.svn’) in every folder of a working copy on your hard drive. This could be a problem when using certain programs on OS X such as any of the iWorks products and Omnigraffle. The problem is that the “Documents” generated by these programs are not files, but are packaged folders. When you open up the document each program will simply look through the package and remove anything that doesn’t belong there (namely the .svn subfolders). This will drive subversion nuts every time you try to update one of these types of documents. While there are workarounds for this, it makes using Subversion more complex than it needs to be on a Mac with these apps.

This is one of the reasons I personally use Git which puts all of its version control information in a single folder at just inside the working copy’s project folder.

The second thing to think about when choosing a version control system is the availability of good GUI clients. On Windows there’s TortoiseSVN and TortoiseGit which integrate well with Explorer and make using version control as simple as right-clicking on a folder.

On the Mac there are excellent subversion clients (like Versions, ZigVersion and Cornerstone). However, there’s a surprising lack of GUI clients for GIT, Mercurial and Bazaar (another popular distributed system). The available GIT clients for the Mac are either difficult to use or they are incomplete, forcing you to learn the cryptic command line tools to get things done.

The bottom line is to look at your file handling needs and check out which tools are available while you’re looking for a version control solution.

Simon Eder

October 26th, 2009

Thanks for the info, I am surprised buy the lack of content at adobe on the subject.
Version control is very important, we are employing more people and trying to centralize our file systems. We had project files stored on different computers and we all work remotly. We develop websites using businesscatalyst.com as a cms and it has it own version control for pages but templates and applications layouts are stored internally with no rollback. On more than one occasion one of our developers (me too)has written over a template or application file with a different one and the file has to be reconstructed. Version cue is great because it is integrated with creative suite a couple concerns is it is free now but for how long and how wise is it to go with the same supplier for all your workflow solutions. Is lock in going to be an issue. Does anyone have any data on how secure version cue is?

Jason Manheim

November 3rd, 2009

Anyone know if there’s any good Mac GUI clients in development for Git?

Ramesh V R

November 11th, 2009

In my opinion still many of the designers don’t use a version controlling system, though they know it will benefit them.
Let this article make them use it.
Great stuff!

Rob Record

November 19th, 2009

I can’t recommend Cornerstone highly enough as a Mac front end for subversion. I was afraid of SVN at first, now it’s like a dream! I love it :) Very easy to use. Has cleaned up my hard disk a lot.

I used that for coding, and just started with Adobe Version Cue for designing. seed it once before but had problems (lost some work) because I didn’t understand how to use it. Here’s hoping second time is the charm!

Thanks for the great article :)

HakNick

February 15th, 2010

Nice article,
But it would be nice if we could get any info on the capabilities of Version Cue for Adobe binary (psd, etc) files. Does it do any smart diffing and revision-ing or does it just save as new copies. Any extra locking capabilities over svn and git? What about between svn and git

Artur

December 31st, 2010

Thanks Anatoly, great overview!

Would be nice to know the speed of each version control system when dealing with larger files: 10-20mb each in a multi user setting: 3 users.

TAG

March 18th, 2011

Great article! It’s all about Dropbox.com though! It’s seriously the easiest and best tool for version control in my opinion…you can share ALL types of files and it has a really simple interface so even the simplest user can swing it. check it out!

Mike Zackary

March 29th, 2011

Great article Anatoly, we found an awesome solution, Evolphin Zoom (http://evolphin.com). For our larger files (over 1 GB+) we are constantly amazed how fast it is. Good locking in a multi-user arrangement for our design team.

Rahu

May 4th, 2011

Is there available any free version control software for these applications (3ds max, Maya, and Photoshop)? OR

how we can plug in with 3ds max, Maya, and Photoshop

Julien

November 17th, 2011

Very good resume of the different options.
Enjoyed reading.

Leave a Comment

Subscribe to the comments on this article.

Mobify empowers marketers and developers to create amazing mobile web experiences. Tap to learn more

Mobify