How I use GitHub for Designs

The hungover ramblings of a silly man and his no-nonsense approach to version control for design.

Shane Doyle
3 min readSep 23, 2017

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.

How I feel right now.

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:

My folder structure for design version control

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.

Really Shane?!! Another gif!!
If you liked my story then you might like my monthly design newsletter where I share stories just like this one.Once a month, I send out an ad-free design newsletter where I share the latest articles, videos, resources, and tools that help you stay in the know and grow as a designer or digital creator.Click here to sign up.

If you liked this article then it would be great if you could tap the 👏 button below or share it with your friends.

And finally, learn more about me and my work @ shanedoyle.io

--

--

Shane Doyle

Husband • Dad • Lead Product Designer • 🇮🇪🇪🇺 • shanedoyle.io • co-founder of getReviewr.com