How to use GitHub for Design Version Control

‍Disclaimer. I was hungover when writing this article so it is what it is. Rubbish!

Search “GitHub for Designers” in google, you’ll notice there are shit loads of results, I mean shit loads. So what I’m gonna share with you is nothing new but its a simple and works for me. End of.

I’m not going to go into what are the benefits of version control or what Git, GitHub, repo, version control, push, and so on are. That stuff you can read about on GitHub’s website. I’m just gonna quickly show you my workflow for design version control.

At this point, I’m assuming you’ve got Git and GitHub set up so let us begin.

Create a repo and name it “Designs” or “Designland” or “The Magical Fairy Kingdom” or whatever you feel like. This is where you’re going to store your masterpieces.

Once created clone to your mac. Before you freak out and start shouting “SHANE, how the fuck do I clone it?” read this little how-to guide. Better? 😒

Now when you update your designs, wait I mean masterpieces you can push the changes to GitHub. This makes it simple to share with colleagues or just keep them backed up.

I’d love to explain more but I’m a little too hungover.

Keep it tidy

A tidy home is a tidy mind or a wasted life, depending on which way you look at it. But a tidy file structure for designs/development is one that will make your life handier. Below is the file structure that I use:

I keep all my projects in a projects folder. 😱

Each project contains a sketch file, a folder for assets, and a folder for preview images. I use a naming convention that makes sense to me:

• Folders are in lowercase with no spaces, underscores or hyphens. “superawesomefolder”
• Sketch files are in camel case. “SuperAwesomeApp.sketch”
• Images are in lowercase with an underscore between the name and usage of it. “icon_github.png”

If you don’t give a shit about that nonsense, or you think this was a waste of your “precious” time. Keep on doing what you are doing.

‍