Design like it’s 2017

Over the course of the last year, we’ve introduced some new design tools into our workflow here at Lima Bean, and have seen some major improvements, specifically in speed of output, rate of iterations

by Richard - March 2017

How we stay on top of our design game

Over the course of the last year, we've introduced some new design tools into our workflow here at Lima Bean, and have seen some major improvements, specifically in speed of output, rate of iterations, and more comprehensive design handovers. Around February 2016, we took the plunge and completely changed over from Adobe's Photoshop to Bohemian Coding's Sketch as our design tool of choice, and we haven't looked back since.

The right tools for the job

Trying to complete any task without the appropriate tools is daunting, and digital design is no different. Sure, nothing beats good old pencil and paper (still indispensable) for speed, but when it comes to putting pixels to screen; some tools are simply better suited. Once all the scribbling is done and the ideas are finalised, our job as the design team is to translate that into something that is visually attractive, easy to understand and adheres to brand guidelines. Additionally, we have to consider - as far as possible - the plethora of different screen sizes on which this product will be displayed, and also accommodate varying amounts of content. With all of the above considered, the design phase can quickly become a cumbersome one without the right tools for the task.

Listed below are some features we feel are essential in digital design software in 2017 and beyond.

Vector vs bitmap

Sketch prides itself on being primarily a vector-based design tool, which makes complete sense considering the 'stretchy', fluid nature of today's web. Gone are the days of bitmaps and fixed widths – winning digital design tools need to be vector based from the ground up, and should offer full vector file support.

Keeping it together

The ability to keep all screens in a single project file, rather than across multiple individual files, has been hugely beneficial for us at Lima Bean. In an environment with multiple projects in the pipeline at any given time, it's vital that designers are able to collaborate easily, project folders are kept small and more organized, and designs are easy to find come update time.

Infinite iterations

Design is a messy business, and in contrast to the beautifully clean looking products of today's digital landscape, the process of getting there can be untidy to say the least. Designers should, however, embrace this iterative process, as it's often how better ideas are uncovered. Design tools with infinite canvases encourage iteration, whereas with fixed dimension workspaces, you're more likely to chisel away at one idea without trying new ones often enough.

Native grids

We like grids – they ensure correct alignment and provide a visual uniformity across projects. Additionally, designs that follow an established grid system are easily translated into responsive web pages. Our developers build sites and systems using front-end frameworks (we use Zurb Foundation), which employ the same responsive grid concept. Having this functionality built into the design app aligns designers' work with that of developers right from the get-go.

Speed, ease of use and clever UX

Since making the change from Photoshop to Sketch, we have noticed a general increase in design turnaround times. This could be for a number of reasons - a few of which I've covered already - but above all, we feel it's because Sketch is undeniably easier to use;

  • Selecting, moving and grouping objects is easy and intuitive.
  • Repeated elements (like headers and footers) can be made into 'Symbols' which, when updated once, will update across the entire project. The same goes for text styles.
  • Multiple artboard functionality (with preset device screen sizes) lends itself to responsive and adaptive design.
  • Exporting multiple assets in different formats is dead simple, making handoffs easy.
Sketch's native functions make it feel like a digital design app, rather than a general graphics suite you're repurposing for digital.

It was a bold move for us to change a process to which we had become so accustomed, but the pros seem to be far outweighing the cons. In my next article, I would like to document the kinks we've experienced during the change from Photoshop to Sketch, and what we did them to iron them out.