Evan Byrne

File version control is important whether you are working with simple Word documents, design files, or source code. Good version control acts as both a backup solution and an annotated log of changes made to the document over time. As a developer, I already use Git extensively for version control, so I wanted to see if I could use Git for Sketch as well.

Starting in version 49, Sketch files started using a new format. The specification dictates that all .sketch files are zipped directories containing various JSON data files and other assets. The simplicity of the format makes tracking everything in Git pretty straightforward, but Sketch itself doesn't include any tools for actually doing that, so here is the exact process I use.

Let's say we have a Sketch file located at my-repository/website.sketch that we want to track in our Git repository located at my-repository. The first thing we need to do is make sure we are not tracking the Sketch file directly by adding a .gitignore rule:

*.sketch

Next, make a copy of the Sketch file:

cd path/to/my-repository/
cp website.sketch website-copy.sketch

Copying the file is not technically necessary to unzip it, but I prefer not to mess with the source file while it has untracked changes any more than I need to.

The next step is to unzip website.zip into a folder named website. If the folder already exists and is tracked in Git, then delete it before unzipping.

rm -r website/                         # Remove previously unzipped Sketch contents.
unzip website-copy.sketch -d website/  # Unzip Sketch contents into website folder.
rm website-copy.sketch                 # Clean up.

Finally, add the folder and commit changes:

git add .gitignore
git add website/
git commit

To restore unzipped Sketch assets back into a .sketch file just zip it back up:

cd website/
zip -r -X website.sketch *

The restored Sketch file will be located at website/website.sketch.

If you are having difficulty opening your new .sketch file, then try a couple things:

• Completely close Sketch before opening the new file.
• Double-check that you are not zipping up extra files or directories.