versioning in design

Which one is the latest file? Where to find earlier iteration files? How to quickly compare? What changes are made? Who made the changes? Who shared feedback? Are the final changes done? Am I looking at the right file? Have I shared the right one?

Ahhh… too many of them. Do these questions haunt you too? Then you are at the right place.

Be it design or development it’s a mess without an efficient version control system. Developers today are well versed with version control in their workflow. All thanks to great version control systems like GithubBeanstalkSourceTree, etc. These days Git has become a standard and developers can’t even think of writing a single line of code without it.

A version control system tracks and records all your changes and maintains a backup for each version for your reference. With a version control system in place, you need not worry about any changes you make, sharing, collaboration, losing any file or asset, etc. It is much more than just maintaining a history of changes; it transforms your entire workflow as:

  • Different people can work simultaneously on the same file.
  • Everyone has its own local repository where you can view the entire history.
  • It automatically records: what changes are made, who made them and when they were made etc.
  • Makes it possible to revert back to any previous version.
  • Can work on different branches, which you can easily merge to the master file whenever required.
  • No fear of overwriting any file or losing any changes.
  • Makes it easy to communicate changes easily to the entire team and keep things organized.

If you are a designer then of course you know the answer. It’s badly needed. Let me quote some common scenarios :

  • For every design, the designer creates something, shares it, gets feedback; then makes suitable edits and shares it again, and so on. This results in multiple copies of the same file with different suffixes; which are quite difficult to manage.
  • Sometimes you feel the earlier one was better, but you don’t have the backup file for that.
  • Some projects may need more than one designer to work on the same file at the same time. Such changes cannot be merged easily as designers need to visually compare the different files and decide what to keep and what to discard.

Although designers too need a version control system like developers; but still they haven’t made it a part of their workflow. The major issue is:

  • Large file size: Unlike code files; design files are huge.
  • No way to easily compare design files: Code files are text files that can be easily compared thus can be merged easily. But this is not the case with design files, they cannot be compared likewise.

Recently with sketch version 43, Bohemian Coding announced — a revised file format. This new file format enables you to read and write .sketch files. Thus it solves the problem to some extent but not completely.

No doubt, Git is a great versioning tool. For developers, it works quite well. For designers, it’s not a seamless solution but a fair one to start with. If a designer is new to git then there exists some learning edge but it’s worth it.

Git is designed for code(text) files but design files are large so git cannot handle it. So, to work with design files you need to use Git’s Large file storage extension (LFS). With LFS you have all your versions saved in some remote repository. Only the current versions that you need are available on your hard drive. This reduces your local repository size so that git can function optimally.

Now the question is how to merge design files with Git. The complete solution to this is not available yet. But for sketch files, you can use Kactus. It changes your sketch files to git understandable format, thus git can now easily compare and merge sketch files. Moreover, you can add and edit symbols across multiple files keeping them all in sync.

Options for other file formats like .psd will also be available soon.

Thus if your team needs to have a common platform for designers and developers then git can serve it well. It’s evolving and will soon be a better solution.

A quick search for design versioning tools will give you multiple options like Plant, Folio, Pics.io, Figma, Framer, Abstract, brand.ai, etc.

Full-stack design tools like framerFigma, or sketch do autosave version history and have the option to restore any previous version or visually compare two versions but lacks the true power of version control i.e. the ability to work on different branches(local copies) simultaneously and seamlessly merge them to have the final version. Another limitation for such tools is that they just support their native file type.

The best option(to date) I can think of is Abstract. It does a great job. It gives you the flexibility and simplicity of git without needing you to learn git commands or workflow.

 
  • Clearly shows your commits, branches, and master file like git.
  • Can auto compare versions and merge files(you can choose the changes to keep in case of any conflict).
  • Allows real-time feedback and collaboration.
  • Integrates with slack and will come up with GitHub and JIRA integrations soon.
  • Mac-only app.
  • Supports only sketch files (for now).

Other good options are available too, like Plant, Pics.io, Folio. These tools come with a minimal learning curve but auto merging and handling simultaneous operations is what they lack.

PlantIt is a Mac-only app that does not integrate with other version control systems like git. But it has sketch plugin and can merge conflicts. It can identify the artboards with changes and lets you send them specifically.

 

Pics.io: This application is built over Google drive, where you can visually compare the different versions and manage them. It supports all major file types you need to work as a designer but not all(like RAW, PEF, etc.).Being browser-based sometimes bothers designers in terms of security as they are used to the standalone app but today everything is cloud-based and that’s fine I guess.

 

Folio: It’s a Mac-only app, based on Git; with fair enough options as source files(sketch, photoshop, illustrator, and SVG). Organizing files is a bit messy as everything is in the same place and you cannot structure it. The good part is that it integrates with existing version control systems like Github, bitbucket, etc. Thus can easily fit into your current workflow.

 

To make it easy for you to decide the tool of your choice here is a quick reference.

Creativity gets easily lost if the workflow is too tedious to keep up.To make your design workflow smooth and hassle free, a version control system is a must. Which tool you should opt for, purely depends on your project requirements. I have tried to put together the different options for you to choose. If you know some other versioning tool, let me know in the comments.

Collaborate visually on design projects

Sign up and start collaborating with your team! No credit card required.

Related Post