<p>Published on <a href="https://blog.prototypr.io/design-versioning-its-true-it-s-here-let-s-talk-and-learn-more-about-it-9fef5d7cb517?source=rss----eb297ea1161a---4">| Prototyping: From UX to Front End &mdash; Medium</a> Caio Calderari </p>
<h4>Times are changing, new tools are available. <strong>Finally designers were heard!</strong> Now there are a few options available for versioning our design masterpieces. <em>Yeah! Dude, that&#8217;s real.</em></h4>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*nnPt-nzru9c46ub9t1ruFQ.png"></p>
<blockquote><p>But wait, I&#8217;m confused. That&#8217;s good news, I need to learn more about it. I&#8217;m excited. How do we get started?</p></blockquote>
<p>Ok, let&#8217;s take a quick look into these new options for design versioning and also learn from other designers experiences to have a better picture of all these design goodness. <strong>Who want some candy?</strong></p>
<p><strong>Like this post? Don’t forget to 💚 and share with your friends!</strong></p>
<h3>The Problem</h3>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1000/1*1p9lQMO6bAxhQjIgXexxiA.png">I got this image from here: <a href="https://blog.enki.com/yes-designers-can-use-git-too-79f3cef9c899">https://blog.enki.com/yes-designers-can-use-git-too-79f3cef9c899</a><img alt="" src="https://cdn-images-1.medium.com/max/700/1*qkse3Gn8bhdnf0PLXGAErQ.png"></p>
<p><strong>Is it familiar to you?</strong></p>
<ul>
<li>Home Page Layout</li>
<li>Home Page Layout New</li>
<li>Home Page Layout New v2</li>
<li>Home Page Layout v4</li>
<li>Home Page Layout v4 Final</li>
<li>Home Page Layout v4 Really Final</li>
</ul>
<p><img alt="" src="https://cdn-images-1.medium.com/max/773/1*M-Y8RTd3Ioa70XazMahQWg.png"></p>
<p><a href="https://medium.com/u/6575e902f43d">Vitor Guerra</a> wrote an <a href="https://blog.prototypr.io/the-definitive-design-workflow-abstract-app-611b86d7649b">awesome article</a> about it and confirmed himself that he was in that situation before. <strong>Haven’t you too?</strong></p>
<p><strong>Other problems:</strong></p>
<ul>
<li>Hey guys! I&#8217;m using the master file, do not open it right now!</li>
<li>Cool, I&#8217;m done. No wait!</li>
<li>Now I&#8217;m really done. You can open it.</li>
</ul>
<p><img alt="" src="https://cdn-images-1.medium.com/max/790/1*0ubSaTcIYD5UWZS-0ZoSUw.png">Funny screenshot from Pablo&#8217;s Stanley youtube video. Watch it below:</p>
<p>Didn&#8217;t get it? <strong>Watch the video:</strong></p>
<p><iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fwww.youtube.com%2Fembed%2FYu182s04N_Q%3Ffeature%3Doembed&amp;url=http%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DYu182s04N_Q&#038;image=https%3A%2F%2Fi.ytimg.com%2Fvi%2FYu182s04N_Q%2Fhqdefault.jpg&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;type=text%2Fhtml&amp;schema=youtube" width="854" height="480" frameborder="0"><a href="https://medium.com/media/13ae0497ee3265ca5898d2ebf0fc9788/href">https://medium.com/media/13ae0497ee3265ca5898d2ebf0fc9788/href</a></iframe></p>
<p>You should <a href="https://www.youtube.com/channel/UCZHkx_OyRXHb1D3XTqOidRw">subscribe to this channel</a>, <a href="https://medium.com/u/7f968435c6b9">Pablo Stanley</a> has some amazing videos for designers in there! Check it out!</p>
<h3>Why versioning design is a good idea?</h3>
<ul>
<li>Multiple designers can work on the same project, at the same time.</li>
<li>Avoid not knowing what is the most recent file in your project.</li>
<li>You can go back to latest versions if you need to, and review versions, check project history.</li>
<li>You can communicate changes with the entire team with no hassle, and make sure everyone is on the same page.</li>
<li>The project can scale without major problems.</li>
<li>Collaboration and working together can be simpler.</li>
<li>You and your team can be more productive.</li>
<li>and many other advantages… you name it!</li>
</ul>
<p><a href="https://medium.com/u/a8fedfef4fa5">Mark Dodgson</a> wrote a <a href="https://blog.goabstract.com/how-abstract-helped-the-bluespark-team-increase-productivity-by-30-90d0b634c32c">post</a> and said a few things I agree:</p>
<blockquote><p>Changing something as fundamental as an organization’s workflow can be exciting and scary all at the same time.</p></blockquote>
<p>Enough talking about it, let&#8217;s get to it:</p>
<h3>Design Versioning tools</h3>
<p>Are you talking about Git Hub? I don&#8217;t like coding. Yes, you can use Git Hub for versioning! But not only GitHub. There are a few options now.</p>
<p>But before we get into that, I just want to point somethings I heard somewhere. If I remember where I will update it here.</p>
<blockquote><p>Dropbox is not a design versioning tool, sorry guys!</p></blockquote>
<blockquote><p>Github has some issues with big files. (Not sure)</p></blockquote>
<h3>Abstract</h3>
<p><a href="https://www.goabstract.com/">www.goabstract.com</a></p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*I0S2yB5ly2KC_pe1PyGt5w.png"><img alt="" src="https://cdn-images-1.medium.com/max/610/1*DtPGyDE5xnUpARke6w_04Q.gif"></p>
<p>A secure, version-controlled hub for your design files.<br />Abstract helps modern design teams to work smarter and faster — together. A design platform with stable tools and a light weight workflow so you can stay on top of your work easily.</p>
<ul>
<li><a href="https://www.goabstract.com/how-it-works/#file-management">File management</a></li>
<li><a href="https://www.goabstract.com/how-it-works/#version-control">Version Control</a></li>
<li><a href="https://www.goabstract.com/how-it-works/#change-control">Change Control</a></li>
<li><a href="https://www.goabstract.com/how-it-works/#feedback">Feedback</a></li>
<li><a href="https://www.goabstract.com/how-it-works/#integrations">Integrations</a></li>
</ul>
<p>This tool seems to be amazing! I made a few tests and liked it a lot. But I wouldn&#8217;t even waste my time describing it for you, <a href="https://medium.com/u/6575e902f43d">Vitor Guerra</a> wrote an <a href="https://blog.prototypr.io/the-definitive-design-workflow-abstract-app-611b86d7649b">awesome article</a> about it, and you should check it because it&#8217;s very detailed and informative. Anything I would say is already there.</p>
<p>I the future, if I find something else about it I will let you guys know!<br />Give it a try. Downloading and testing is FREE!</p>
<p>You can visit their Medium here:</p>
<p><a href="https://blog.goabstract.com">Abstract</a></p>
<h3>Kactus</h3>
<p><a href="http://kactus.io/">http://kactus.io/</a></p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/909/1*1jhV9kZta1Wyuuas6okQ-g.png"><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*VY28LBIzRR5rMugHEmbZ1Q.png"></p>
<p>Introducing true design version control without changing your tools. Manage changes, document work and keep your team in sync.</p>
<p><strong>Experience Git</strong><br />Enjoy all the benefits of git with our simple UI, leaving you more time to focus on what matters — your design.</p>
<p><strong>Streamline your workflow</strong><br />Create branches, collaborate with other designers or developers, and commit changes without touching the command line.</p>
<p><strong>Make it your own</strong><br />Every pixel is completely open source. Build the features you need and become a part of future Kactus releases.</p>
<p>I tested it a little and it&#8217;s simple to use, but it rely on github, so have that in mind. You can use it for versioning code too, since it&#8217;s github, and if you&#8217;re not familiar with using github via terminal commands, that should be a way to start. Take it for a spin, download and try it.</p>
<p>Kactus is Open Source!<br /><a href="https://github.com/kactus-io/kactus">https://github.com/kactus-io/kactus</a></p>
<p>You can visit their Medium here:</p>
<p><a href="https://medium.com/kactus-io">Kactus.io</a></p>
<p>I recommend reading it too:</p>
<ul>
<li><a href="https://blog.enki.com/yes-designers-can-use-git-too-79f3cef9c899">Yes, Designers can use git too!</a></li>
<li><a href="https://medium.com/kactus-io/unlocking-true-collaboration-around-design-f844527220cb">Unlocking true collaboration around design</a></li>
</ul>
<h3>Folio for Mac</h3>
<p><a href="http://folioformac.com/">http://folioformac.com/</a></p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*fEq2ctTJ8LC6cLO7vhwI9Q.png"><img alt="" src="https://cdn-images-1.medium.com/max/1000/1*LOwFtnmsjJJvT0Z9bugDKQ.png"></p>
<p>Simple version control for design teams based on Git.<br />Folio lets you create and share versions of your designs and automatically keep them in sync with your team.</p>
<p>Their idea is something like a time machine for designers.</p>
<blockquote><p>We love the idea of Time Machine on the Mac (automatic backups, restore previous versions of your work) but found ourselves never really using it.</p></blockquote>
<p>I will let you with <a href="https://medium.com/u/d3b0118af7d3">Paul Demers</a> impressions on this tool, as I couldn&#8217;t test it myself yet. I will do it later and update here if I find something different.</p>
<p><strong>Pros:</strong></p>
<ul>
<li>Integrates with existing version control systems (GitHub, GitLab, and BitBucket)</li>
<li>Includes a free viewer allowing those without a paid license to view file changes and versions</li>
<li>Supports a number of file types including Sketch, Photoshop, and Illustrator</li>
<li>Integrates with GitLab’s free private repositories (10gb storage) and automatically syncs changes</li>
</ul>
<p><strong>Cons:</strong></p>
<ul>
<li>A bit tricky to get an SSH key set up in order to publish changes to GitLab</li>
<li>It’s necessary to close and reopen with reverting to a previous version</li>
</ul>
<p>Read Paul&#8217;s article <a href="https://uxdesign.cc/design-assets-version-control-and-you-566a00bf0eee">here</a>.</p>
<p>You can visit their Medium here:</p>
<p><a href="https://medium.com/@FolioForMac">Folio for Mac &#8211; Medium</a></p>
<h3>Brand.ai</h3>
<p><a href="https://brand.ai/">https://brand.ai/</a></p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*BEVPHoTzZGk0mEQ2ILgF7w.png"><img alt="" src="https://cdn-images-1.medium.com/max/800/1*lVbl2sXtGFoTIbe2591rjw.png"></p>
<p>Manage your design system.<br />Eliminate communication overhead and version conflicts in your design and development workflow.</p>
<p>It seems to be more focused on branding and styleguides, atomic design elements, but it can be an useful tool for some designers, so heres the quick tip. I haven&#8217;t tried it yet. It works with Sketch!</p>
<p>Maybe later I can test it and update my thoughts here.</p>
<p>You can visit their Medium here:</p>
<p><a href="https://blog.brand.ai">Brand.ai Blog</a></p>
<h3>And there are some Sketch Plugins trying to solve the problem too:</h3>
<h3>Plant</h3>
<p><a href="https://plantapp.io/">https://plantapp.io/</a></p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*9BB-juKr7POPqnnlnnW96g.png"><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*js7ving0M5gVjwJ7BNoYDg.png"></p>
<h3>Git Sketch Plugin</h3>
<p><a href="http://mathieudutour.github.io/git-sketch-plugin/">http://mathieudutour.github.io/git-sketch-plugin/</a></p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*R8GdvtxB5i48pWsTZxgkIQ.png"><img alt="" src="https://cdn-images-1.medium.com/max/807/1*3m-B_iVX9SHpRIFTiQhnkQ.png"><img alt="" src="https://cdn-images-1.medium.com/max/982/1*s1moE10kYljy5fKZn0Fc6w.png"></p>
<h4>Know any other Design Versioning tool? Share it with us!</h4>
<h3>Going even further? <br />How about Screen versioning for prototypes:</h3>
<ul>
<li><a href="https://medium.com/@CanvasFlip/how-does-screen-versioning-help-in-design-process-ef35769db06">How does “Screen versioning” help in design process?</a></li>
<li><a href="https://www.canvasflip.com/">Free Prototyping and User Experience Testing Tool for iOS &amp; Android Apps. CanvasFlip</a></li>
</ul>
<h3>Good reads about Design Versioning:</h3>
<p>You should read this:</p>
<ul>
<li><a href="https://blog.goabstract.com/abstract-a-home-for-modern-design-teams-b5e05efd91f0">Abstract: A home for modern design teams.</a></li>
<li><a href="https://blog.goabstract.com/how-abstract-helped-the-bluespark-team-increase-productivity-by-30-90d0b634c32c">How Abstract helped the Bluespark team increase productivity by 30%</a></li>
<li><a href="https://blog.prototypr.io/the-definitive-design-workflow-abstract-app-611b86d7649b">The definitive design workflow: Abstract app</a></li>
<li><a href="https://blog.prototypr.io/abstract-is-git-for-designers-weve-all-been-waiting-for-a064287ec26e">Abstract is Git for Designers we’ve all been waiting for! 👌</a></li>
<li><a href="https://blog.brand.ai/version-controlled-design-collaboration-workflow-in-sketch-afdce3b2fa29">Version-Controlled Design Collaboration Workflow in Sketch</a></li>
<li><a href="https://blog.brand.ai/sharing-an-atomic-design-library-in-sketch-and-beyond-with-brand-ai-cd12e29e15c9">Sharing an Atomic Design Library in Sketch (and beyond) with Brand.ai</a></li>
<li><a href="https://uxdesign.cc/design-assets-version-control-and-you-566a00bf0eee">Design Assets, Version Control, and You</a></li>
<li><a href="https://uxdesign.cc/in-search-for-the-perfect-workflow-version-control-for-sketch-powered-by-git-9f584ed6d167">In search of the perfect workflow: version control for Sketch, powered by git</a></li>
</ul>
<h4>Want to share content? Send it in the comments, I can update it here!</h4>
<p>Other posts:</p>
<ul>
<li><a href="https://blog.framer.com/better-version-control-for-design-projects-5474ea4913f1">Better Version Control for Design Projects</a></li>
<li><a href="https://medium.com/webkul-dev/version-control-system-for-ui-designers-3022ae9c4753">Version Control System for UI Designers</a></li>
<li><a href="https://medium.com/software-design/introduction-to-git-532264bfb89e">Introduction to Git</a></li>
<li><a href="https://github.com/mathieudutour/git-sketch-plugin">mathieudutour/git-sketch-plugin</a></li>
</ul>
<blockquote><p>That&#8217;s all folks! Thanks for reading.</p></blockquote>
<h3><strong>Did you like it? Don’t forget to 💚</strong></h3>
<p><img src="https://medium.com/_/stat?event=post.clientViewed&amp;referrerSource=full_rss&amp;postId=9fef5d7cb517" width="1" height="1" alt="stat?event=post.clientViewed&amp;referrerSou"></p>
<hr>
<p><a href="https://blog.prototypr.io/design-versioning-its-true-it-s-here-let-s-talk-and-learn-more-about-it-9fef5d7cb517">Design Versioning — It&#8217;s true, it&#8217;s here, let&#8217;s talk and learn more about it. 💚</a> was originally published in <a href="https://blog.prototypr.io">prototypr</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>


Design Versioning — It’s true, it’s here, let’s talk and learn more about it.

Times are changing, new tools are available. Finally designers were heard! Now there are a few options available for versioning our des…

Top Stories