There are tools that every UI/UX designer should know, and tools that are just good to know. In this article, we will tell you what tools the best UX design firm San Francisco prefers. Let’s take a look at some of them!
Table of Contents
9 binding tools for every UI/UX designer
There are tools that every UI/UX designer should know, as Dworkz says. For example, here they are:
- Just a pencil and paper
- Sketch/Figma/Adobe XD
- InVision Studio/Proto.io/Marvel/Origami
- Zeplin
- Google Analytics
- Flowmap/Balsamiq
- Bugsee/Appsee/Hotjar
- User Report/Usabilla
Someone may consider that Google is not exactly a tool. Yet, without Google, we would have more difficulties with daily tasks. Probably, any doubts, questions, or problems can be solved with the help of Google.
Unless you are a genius and a recognized expert in a particular field, there are always people with more experience and/or who just know the answer to your question. Google it, most of the questions you were planning to A/B tests might already have been answered.
By all means, in this section, we also include Youtube, Quora, Medium, Wiki How and other resources that Google finds.
Just a pencil and paper
It may be obvious, but it’s probably the best mockup tool out there, and more. I suggest everyone use them more often. In addition to sketches, they can be used to sort cards, collect ideas, and write notes.
I advise you to hone your drawing skills. Even if you never draw, your sketches will be much more attractive to a potential client.
Sketch/Figma/Adobe XD
Today, most UI/UX designers use these three tools. They are very similar to each other and contain only small differences.
Sketch
SketchApp is the industry’s first UI/UX design tool. And frankly, after Sketch, it’s pointless to use these tools unless you’re designing some very unique website or app that simple shapes don’t suit.
Corel Draw and Illustrator are vector programs that are mainly used for creating logos, print designs, pictures, and more.
Figma
The best thing about Figma is that it’s browser-based and everything stays in sync. One team member changes something, and that change is instantly applied to the entire project, without the need to publish the changes.
Another good thing about Figma is that it has CSS, and you don’t have to use a third tool like Zeplin or Inspect from Invision Studio to hand the project over to developers. By the way, Figma is constantly being improved, for example, a scroll animation was recently added to the prototype.
Adobe XD
XD is a great tool when you’re working at a fast pace, Dworkz experts notice. It allows you to solve problems faster, but it has almost the same problems as Sketch, and XD does not have an inner shadow function. We can talk about UI design tools endlessly, but we think this is a topic for a separate article.
Prototyping with InVision Studio/Proto.io/Marvel/Origami
InVision Studio
InVision Studio is a band of 4 cool tools that are very helpful:
- Prototyping is more than just a qualitative tool with powerful interactive animations.
- Inspect is designed to communicate CSS to developers.
- Freehand helps you create wireframes, and sitemaps. It mostly acts like pen and paper on your computer with many helpful templates in one place.
- Craft is essentially a user interface design tool.
Also, InVision Studio works great with Sketch.
Proto.io
Proto.io is a prototyping tool that helps designers create realistic hi-fi prototypes.
Marvel
Marvel is another tool that helps you create Lo-Fi or Hi-Fi prototypes, wireframes, and submit CSS and HTML to developers. This is another prototyping tool that makes the prototype look like the final product through great interaction.
Origami
Origami is the tool that provides possibly the most advanced, realistic interactions, and it works well with Sketch.
However, there are downsides. For example, it doesn’t pass interaction code, it only works on Mac, and it’s hard to master. For beginners, it can be very difficult.
Zeplin
Zeplin is a tool that translates interfaces into CSS. It’s a great tool for collaboration and project handover to developers. I use Zeplin relatively infrequently as Figma has all the core functionality and, as mentioned earlier, I’m a huge Figma fan.
Google Analytics
I know I already mentioned Google, but Google Analytics is a completely different tool. As the name suggests, he deals with data analysis. This is a great tool for collecting statistics on how your site is performing in the field, getting quantitative data, etc.
Strategic planning with Flowmap/Balsamiq
- Flowmap is a tool to help you define your strategy at the start of a project. This is a great tool for creating information architecture, sitemaps, and user flows.
- Balsamic is a simple but great wireframing tool. It requires virtually no training. It already has a lot of wireframe elements, and with a simple drag and drop, you can make a pretty good wireframe.
Qualitative research with Bugsee/Appsee/Hotjar
- Bugsee is a tool designed to detect bugs and crashes in mobile applications.
- On the other hand, Appsee does not focus on bugs.
- Hotjar is a tool that analyzes a website and provides user feedback. Among its features are user flow recording, form analysis, surveys, tester recruitment, etc.
User Testing Tools User Report/Usabilla
- User Report is another great tool based on surveys and reviews. It works as part of your website or application and helps you learn about users as well as communicate with them. In addition, it has integration with Google Analytics.
- Usabilla is a feedback gathering program. It gives real-time feedback from users. It also helps determine your questions and timing.
Conclusion
There are many more tools that UI/UX designers should know, but we have mentioned just a few. And every second there is a new tool that could be the next best product. We just need to be vigilant and not miss the moment of studying this novelty. Thank you for your time!
