With new design and prototyping tools hitting the market every few months, the pace of software development that targets designers is accelerating. While it’s great to see the attention being given to improving software that we as designers use, I’m typically slow to adopt new tools. Maybe I’m set in my ways, but I find the learning curve often outweighs any new power or efficiency gains that I’ll receive.

Of course, there are always exceptions. Sketch 3 from Bohemian Coding is one of them.

The hype surrounding Sketch 3 has been building for months. Designers such as Cole Vin and Jean-Marc Denis have regularly extolled the virtues of this new interface design tool. When I finally began playing with Sketch this past spring, it quickly became apparent that it would become my new design tool of choice.

What impressed me is how comfortable and proficient with the application I’ve become in a short period. For 15+ years I’ve used Adobe Photoshop for the majority of my design work. After all those years, it had a well-worn feel. But after only a few weeks, I found Sketch to be more efficient and better suited to the mobile and web work I do.

Sketch is built around designing layouts for the web–unlike Photoshop, which at its heart is a photo editing tool. Sketch provides a number of excellent features that make it an extremely powerful tool for web and interface designers. I listed a few of these features below:

• Infinite Canvas
  Instead of specifying a specific width and height, an infinite canvas allows a designer to work with multiple pages/screens at the same time (within a single file). Art boards can be utilized as containers for specific pages/screens. But the freedom to work outside the concept of a page/screen is equally powerful, allowing for detailed interactions and variations alongside each layout. 
  
• Export
  Sketch is inherently vector-based. This makes it easy to produce multiple art assets at various sizes (required for mobile apps and other high resolution devices) or file formats (PNG, JPG, GIF and SVG).
   
• Shared Symbols and Styles
  Before using Sketch, it was painful, and time-consuming to maintain consistency between multiple pages/screens during all the changes that occur throughout the creative process. But no longer does a tweak in the header or footer lead to hours of updates to multiple pages. Shared symbols and styles allow for adjustments large and small to automatically update multiple instances of the same elements. 
  
• Export CSS Styles
  If you can create a visual design element (color, gradient, drop shadow, border, typeface, etc.) in Sketch it can be replicated with CSS. With one click, copy the style and use it yourself, or provide specifics to a developer. This significantly reduces the back and forth needed to nail down the exact look and feel you intended. 
  
• Grids
  Typically my first step when starting a new design is to set up a grid that will act as the foundation for the layout to come. Sketch provides a simple settings panel to customize any grid pattern. With just a keyboard shortcut, you can hide or show the grid. 

Sketch contains a ton of additional features that make it easily worth the $99 purchase price (a bargain if you consider Adobe is charging a $19.99/month subscription fee for the latest version of Photoshop). And beyond specific features, the bottom line for me is Sketch has returned a sense of enjoyment to pushing pixels. While it isn’t perfect–small quirks exist such as mysteriously expanding folder groups and random crashes–if you design for the web or mobile, it’s worth your time and money. Start with a free demo, watch a few video tutorials and read a handful of these articles.