How Abstract drastically improved our design process

TLDR;

Don't be afraid of Version Control thinking it is a developer's thing. It improves the sketch file organization remarkably and Abstract is one of the best tools out there!


Story so far

Back in the day when I joined my current startup as a designer, my team was working somewhat like this

  • Auto sync on Google Drive Mac app to share the files amongst us.
  • “Please close that file !” was one of the most frequent phrases throughout the day - lest having lots of conflict files.
  • Directories to organize the files like Design -> Product -> Data Platform
  • Everyone having their own versions of the master file creating a confusion as to which feature is present where.
  • Sending a broadcast once a design is finalized so that the team knows where to find it.

And I think most of us designers can relate to this horror story !

As a developer-designer, I was missing the Git flow which was much efficient in organizing files. We tried various sketch plugins but none provided a good solution which was mainly due to Git’s inability to understand sketch files’ modifications.

Finally, Abstract came to the rescue. It simplifies the Git into the key concepts, ignoring all the complex flows and presents them in a GUI specially crafted for visual files. We migrated our projects there as an experiment and in no time we could see our team delighted with the features and organizing files is no longer a horror story.

Now, Shivani in our team can branch out the master file and work on a feature enhancement while I am creating a new page in the same project. No more conflict files !

Using Branches in Abstract

Using branches in Abstract
  • Abstract maintains master files as the starting point of a project. These can be branched out to create new features or update existing components.
  • Mostly our projects are structured as such where branches reflect the enhancements/features on which different people are working.
  • These are finally merged to the master files after review.

Using Design library

Linking Library in Sketch using Abstract
  • Abstract provides support to Sketch Design Library where it can be linked at a project level. The library can sit as a separate project altogether or be part of the existing project.
  • We can now maintain different version of components in the central library and reflect those throughout the projects by pushing them to the master files. Maintaining a Design System has is now much easier our team.

Collections & Request Review

  • It is now much easier to get the designs reviewed from the members of the projects before finalizing, using the request review feature.
  • We use collections to organize, present and share our final work across the teams.

“If everything was perfect, you would never learn and you would never grow”
Even though Abstract is a very powerful tool for designers, there is always a BUT.

Our team also faced a few challenges

  • Creating branches for every feature/enhancement had us lost in a bewildered space of branches.
  • Complex branch structure in Abstract
  • Everytime I want to access an old file to copy something I’ve to wait for like eternity when I “Open Untracked”. And if I forget that (which has happened like a lot of times) and start editing it just to realize I am lost in space now.
  • Sometimes, the “Commit Changes” dialog just disappears leaving me lost in space again.

Final Thoughts

Overall, I would say Abstract has made our design process much more smooth and saved our time in organizing the files.
Also, it wasn’t much of a challenge to get the non-developer designers onboard the Abstract flight. Since it skips the complex Git flows and present the basics in a GUI for visual files, a simple guide to the version control did the job.