It’s a familiar scenario for any designer: file-conflict fiascos, Dropbox disarray and a veritable minefield of modifications with no clue has to who has changed what, nor why. Even in the first months of Muxu.Muxu, we had started to encounter these all-too-familiar problems, and the resulting difficulty of communicating around our design decisions. I decided to call time before this started to affect our efficiency, or worse, trickle down to the client.

I first heard about Abstract whilst working on Lattice’s landing page thanks to Jared Erondu. We’ve been using it for about two months now. Abstract is a tool that enables designers to version their work. Put simply, it’s Git for designers and lets you view the modifications that have been enacted in a given design. The makers at Elastic Projects Inc. call it the versioning tool that ‘redesigns the design process’ by helping you to better manage your designs and how they relate to the rest of the organisation.

This represents a huge step forward: designers tend to work with an enormous shared Dropbox folder, and never know the changes present in each file. If ever you need to find a particular file containing a specific version, pre or post certain changes, that system is a nightmare! As with an SVN or Git, with Abstract you can create branches, commit your work and make the equivalent of a pull request. Using Github had not been a feasible part of our workflow before because it would have meant going via the terminal or an external application. Abstract integrates with Sketch, so once a design is finished you just click ‘commit’ at the bottom of the page.

Before Abstract, we too were using Dropbox for our Sketch files. Each important version containing major changes was saved as 1A for example, and minor changes under that version as 1B, 1C, 1D etc. For the next major change, we started again with 2A, modifying in versions 2B, 2C, 2D and so on. We never knew what asset or font had really changed within a given file. For the dev team it was never clear what changes they should integrate. Plus, they had to download the Dropbox file so as not to accidently edit it.

With Abstract, our work is more precise and our workflow is significantly more efficient. We first do the wireframe, and create a branch in which we put all the different versions for web and mobile. This gives us a clearer vision over who does what: via Slack notifications we know what fellow designer Damien is working on for example, and we don’t need to disturb him. We can review the commit directly on Abstract.

Once a given page is ready for review, we put it in the dedicated awaiting-review branch. Damien or I can directly view the modifications, validate the design and merge it back with the master branch, à la Git. As soon as we want to add a new feature, we create a new branch and often have several branches open at once.

Whilst still at Azendoo, we wanted to restore a previous version of the landing page. But we didn’t know the date of the latest modifications. Dropbox syncs automatically, and you can access all the versions in the file history. The problem is that you don’t know the changes present in each file. We finally found the right version — after 3 hours! The time we might have gained by not starting the design from scratch was lost to trawling through the Dropbox sprawl. With Abstract, you simply save your designs to your local repo and then push once you are ready to do so. Saving is an active decision when the work is finished, and the name of the commit can help you in the future to locate what you are looking for.

Currently you can only compare the before and after of a given commit by manually moving up and down the commit history. However, there is a more sophisticated ‘compare’ function in the pipeline which will make this element of the workflow that bit smoother. Abstract are also planning to make integration of Adobe file formats possible soon.

At Muxu.Muxu we are big fans of Abstract: the tool has truly revolutionised the way in which we work. It is really important to know who is working on what, and Abstract makes communicating around design decisions much easier. Time is no longer wasted on dealing with conflicting files: a whole part of our former workflow has been eliminated, clearing the way for stimulating discussion. Now the dev team can inspect our designs on Abstract without having to open Sketch, Atomic or InVision, and we can concentrate on their feedback.

As designers, we can execute better and faster, focussing on design rather than on managing files. We are much more accountable for our work, because we know that any team member can go and look at any version of any modification and in any file! Using Abstract has professionalised the whole process, and raises the bar for the quality of our output. That pushes us to be even more demanding with ourselves.

Article written by the amazing Emily Fiennes ✨