When designing UI/UX for both web sites and mobile apps, we’re willing to try anything once. We are frequently asked about the software we use, and for good reason – we have over a decade of UI and UX experience. We’ve been at it since before the first iPhone came along, so we’ve been using these UX tools since their inception and throughout their development.
Design software isn’t cheap. Especially since a lot of it has gone the way of subscription-based “software as a service.” Monthly rates for each license can add up painfully fast, but screwing up the design process tends to be deadly. While some developers may be concerned about costs, our concern is on the process. “Perfect the process and you’ll always get a good result” is a maxim that works quite nicely in improving your ROI on Design. With this, we bring you our Top Ten UX Tools for Designers.
1. Sketch
Sketch is a designer’s best friend and one that we frequently use. It’s a vector graphics editor for Mac that’s good for mobile, web and User Interface (UI) design. Many designers love Sketch for its focus on having only the best, most-used of Photoshop’s features. Sketch also does a few things Photoshop doesn’t with built-in prototyping and making it easy to share styles with layers, where its competitors often require more steps. As a bonus, Sketch has an “all you can eat” buffet of plugins and is integrated with Abstract, Avocode, Zeplin and other programs.
Note that Sketch doesn’t work on Windows or Linux. That is one major downside. While much of the design industry uses Macs, many do not. Many clients don’t, either. Sketch needs macOS High Sierra (10.13.4) or newer. They offer a free trial but thereafter it costs $99.99 to own and to receive “updates” for a full year. Updates beyond the first year can be obtained through their subscriptions.
We like and use Sketch so much that we developed a free Moodboard Builder, to give designers some “plug-in-play” Inspiration:
2. Adobe Photoshop
It’s been around since at least 1862 when the term photoshopped came into popular use as a term for fake photos – being facetious. Adobe Photoshop, initially released in 1990, is a pixel or raster-based graphics editor. Today’s Photoshop is designed to be used interchangeably with other titles of Adobe Software Suite, some of which are also included in our list of UX tools. It has many, unique features. While Photoshop is good for web design, it’s not so great for responsive or scalable graphics. For print and responsive design, you’ll want to use Sketch or Adobe Illustrator. Otherwise, Photoshop can do almost everything Sketch can do, and then a lot more.
It’s available for Mac, Windows and with Wine will also run on Linux. Adobe’s Creative Cloud services for businesses offer your choice of one desktop app for $33.99 per month per license or all 21+ Adobe titles for $79.99 per month. Adobe also offers discounts for students and freelancers.
3. Principle 5
Principle 5 helps designers create animated and interactive user interfaces. This software makes it easier for you to work with audio and video layers. Principle also lets you pause and change the values of videos during transitions while providing enhanced export file support. Compare Principle with After Effects on Slant. It works with Sketch and is limited to Macs. Principle costs $129 and comes with 1 year of updates. Oleksandr Pronskyi offers some cool Principle app tips and tricks.
4. Adobe Illustrator
The second of the three Adobe titles in our list, Illustrator is a vector-based graphics editor, that is far more tuned for creating responsive logos and graphics than Photoshop. Illustrator is also better at enhancing existing graphics with text and other effects. Illustrator’s great for print, web and motion graphics, logos, paintings, and illustrations. It’s not Adobe’s best stand-alone product. That’s not an issue if you go with the aforementioned $79.99 per month license for all of their Creative Suite.
5. Cinema 4D
Cinema 4D by Maxon is an application for 3D modeling, animation and motion graphics. It has an extensive suite of tools to help with polygonal and procedural modeling, texturing, lighting and rendering. Many designers like it because it’s fast and powerful, but also easy to learn and use. Flexibility is a huge bonus here. It works just as well with 3D motion graphics and illustrations for mobile apps, as it does with graphics for video games. Cinema 4D runs a tidy $1695.
6. Adobe After Effects
Adobe After Effects lets you add visual effects to motion graphics, but it is not a video editor in the fullest sense – that’s why it’s often used in conjunction with Adobe Premiere Pro. Video editing software is its own thing though, with Avid Media Composure being just one alternative. We design mobile apps, not Star Wars movies, so Adobe After Effects comes into use for transitions, special effects, creating cinematic titles, animations, and creating rendered visuals from scratch. Envato.com offers over 6,800 video templates compatible with Adobe After Effects, just in case you could use some ideas. It is also part of Adobe’s 21+ Creative Suite package.
7. Invision
Invision is touted as, “The world’s most powerful screen design tool.” A code-free UX program that makes it easy to turn design mockups into interactive prototypes. Iteration in design is critical. Being able to iterate fast, especially in a project’s early stages with mockups and wireframes, gives you more time to refine and perfect the design with feedback from all stakeholders. Invision makes collaboration, experimentation, and testing of interactive prototypes faster and easier in a team environment. Best used with Craft to sync up with Sketch or Photoshop. You can get Invision for free for 1 project. Otherwise, they have 3 subscription options at $15, $25 and a five-team member tier for $99 per month.
8. Abstract
Abstract works with Sketch to simplify the version control management and collaboration of your files, by keeping everything in the same place. One of its nicest features is that it lets several designers work simultaneously on the same file. Marie Lu Vinh goes into more detail about Abstract’s features and comparison, along with comparisons versus Kactus and Plant. Abstract offers a free 30-day trial and three pricing plans to suit you.
9. Zeplin
Zeplin is another huge timesaver, being able to be integrated with Sketch, Adobe Photoshop, and project management tools like Slack and Trello. Support for Jira’s on the way. Zeplin makes it easy to “handoff designs and style guides with accurate specs, assets, code snippets—automatically.” And it does that in just a few seconds. It notifies everyone when changes are made. Zeplin gives them access to the latest design resources and helps keep everyone on the same page. For unlimited projects and 12 team members, pricing runs $147 with monthly payments, but you can try it with one project for free.
10. Avocode
Avocode is another tool, like Zeplin, underscores the ease of being able to open designs without design tools, very helpful for clients who aren’t into design. You can also export images without preparing layers and simply click on layers to get code. We like Avocode for making it very easy to hand-off Sketch, Photoshop and Illustrator files across our team. Some like Avocode better than Zeplin because it “allows users to be able to get comfortable and familiar with the service before signing up and paying the subscription fee.” Still, it’s a question of being best or second best in the category; for more in-depth details of Avocode’s functionality make sure to check out 10 things you might not know about Avocode. Avocode offers a free trial and several pricing plans, including a $100 pay-by-month option for 5 team members – and it works on Mac, Windows, and Linux.
UX Tools: Sketch vs. Adobe – or Why Both?
We have the advantage of a widely specialized team able to use whichever service that may be best for a given product. Not everyone has this advantage, and while many designers do prefer Macs, Adobe’s still worth consideration for two good reasons. For one, Adobe is a powerhouse in design software and is consistently releasing new, more competitive versions of its software. Another reason is that you cannot expect all of your clients to be using Macs. This can make sharing files with them more complicated, and many companies have to make Adobe versions of their work anyways.
Loading...
Leave a Reply