‘Once upon a time, there was a client who demanded all designs to be delivered in PSD format, aka. Photoshop files, and each in two variants: desktop and mobile'...
This is what I will tell the new generation of designers in an old grandpa voice. In reality, it was not so long ago when this requirement was commonplace in the majority of client projects. Adobe Photoshop—a raster graphics editor versatile enough to handle anything from touching up your vacation photos to conceptualising your next website or app idea - was considered the industry standard.
In this article, I will explain why we switched from that to a new generation of design software, and also help you to navigate through all the choices you have today.
So why did we stop using Photoshop?
Today, we seldom talk about Photoshop when we design websites, other than when it’s time to optimise images. The king of design tools has been reduced to a costly subscription for sustaining our die-hard habits (cue in a close-up of a teardrop slowly rolling down a nostalgic designer’s cheek).
The short answer to the question is that web design has evolved and newer tools much more suited to our modern needs have emerged.
All the new touch devices, screen sizes, and high-density resolutions made it practically impossible for designers to keep using the same raster paradigm to craft their user interfaces. The industry needed and is still in intense need of, a smarter workflow for moving concepts to prototypes.
The next standard
The chances are that you have already heard about Sketch. Despite it being a Mac-only software, the vector design tool has been leading and establishing the next industry standard for the past decade.
That accomplishment is astonishing if you consider the historical bias for PSD files - a format the tool was not only incapable of exporting to but to add insult to injury, its document files were also not viewable on Windows computers, at all!
Sketch did the right things right, such as using vectors by default and allowing designs to be organised in pages and artboards as opposed to single canvases. The features weren’t second thoughts, and they consistently made designers’ jobs much simpler and more enjoyable.
And whatever shortcomings it had were overcome by an amazing ecosystem and community of plugin and service makers. Instead of sending raw documents to clients, we started to use ‘handoff’ tools, such as Zeplin, and present our ideas as prototypes using InVision, which communicated the actual user experience much better than static images in a zip folder.
Design revolution
In recent years several other companies have successfully launched their own ‘Sketch clones,’ with the main ones being:
- Figma
The Google Docs of design: Always in sync, real-time collaboration, and works directly in your browser.
- Adobe XD
Adobe’s better-late-than-never answer is solid, and of course, integrates nicely with Creative Suite.
- InVision Studio
After being mainly a prototype service, the company developed its design tool vision with an animation twist.
Unlike Sketch, these are all cross-platform, meaning that the handful of Windows designers around the world can finally join the game (joking, inclusiveness is hot in 2019.) And with heavy competition comes awesome customer advantages, such as feature parity, aggressive innovation, and cheap entry costs, or even no costs!
What does the modern design team need?
With the plethora of choices, reviewing which product is a good fit for your team becomes harder. Regardless of what fantastical selling points each company is advertising, the tools mostly do the same things. The question is just how compatible the individual product implementations are with your team.
To help you get started, here are the must-have requirements in a modern screen design tool that, in my opinion, have a long term effect on the production workflow:
- Component/symbol system for reusable and coherent design assets.
- Some kind of cloud syncing and collaboration options
- Integrated prototyping tools
- Tools for easy handoffs and design reviews
- Animation editor, native or via plugins
- Version control
- Extendable with add-ons and services
Closing words
Hopefully, you now have a better understanding of why and how we have moved on from Photoshop, and where we are at the moment.
The story is far from over though, as the industry is already slowly advancing towards the next step, which is something I’d like to enthusiastically talk about another day, as well as what Zooma is doing moving forward.
Until then, be sure to download our design tools comparison guide for a comprehensive feature overview.
