Screenshot of CSC Newsletter

Best (and Free) Tools for UX Design and Prototyping in 2018

November 26, 2018

We (UX designers) have been living in an underserved market for years. Until recently, we only had a handful of design and prototyping tools to choose from to execute our UX magic.

Screenshot of CSC Newsletter
Screenshot of Resume Template
Screenshot of slides from workshop

These days new tools come marching into the playing field each month, claiming their superiority. It can feel a bit overwhelming, especially for anyone just breaking into this game or if you're considering jumping the fence. To whom should you pledge your allegiance?

What takes place sort of reminds me of a TV series we all love. In lack of this years season, I thought you might enjoy a spin-off series.

Let's call it Game of Tools. You're reading episode one; Freemium for All.

Today we're going to look closer at three design tools that all share the same war strategy; freemium. A business model that requires a long-term game plan (I'll touch on what freemium means later on in this post.)

Short Background Story of UX Design Tools

There was a time when there was only one tool to rule the throne.

Photoshop had rivals, but none could compete with its photo manipulation capabilities.

The web wasn't vector based back then, and it was supposed to look as real as possible.

Then came flat design, along with a more user-centric approach.

Long story short, Photoshop lost its throne to a new and upcoming rival. A tool that came in and swept an underserved market away and would change the history of UX design forever. It's called Sketch.

"Something" is Coming

Something is lurking in the scenes, and it's not going to be pretty. People will get hurt. Houses will fall.

But as a designer, you will reap the benefits.

Hopefully, the war will last for generations to come. Ultimately, it's during wartime innovation is blooming.

The Three Tools That Share the Freemium Tactic Are:

Figma

Figma is one of the new tools on the field. They have quickly proven themselves to be a worthy rival.

One of their biggest differentiators is their technology; entirely web-based. You can literarily open up any web browser on any computer and keep designing where you left off.

Figma in the browser

One of their other key differentiators is their co-design feature. You can literarily design side-by-side in real-time with your entire team. Their version control feature makes it easy to keep a single source of truth. Especially in larger teams.

When it comes to speed; I'm blown away. It doesn't lag one bit of a second. In fact, it's just as fast as most of the tools out there.

I'm also impressed with the toolset Figma provides. For instance, it comes with a full polygon suite. That means you'll be able to draw stars and triangles right out of the bat. It's a small thing, but nice to have.

Figma polygon tools

You can easily set styles for elements such as typography, grids and effects to speed up your workflow.

One thing you'll notice is that when hitting "CMD + S," you'll get a funny message saying Figma autosaves your work. It takes a while getting used to this feature, but I love it.

Figma auto-saves your work

The prototyping feature is simple, yet intuitive. No big fuss here. I do expect this to mature over time.

Since they're using web technology, they've opened up their API for developers to make plug-ins.

As you can see, Figma is a design tool that has chosen a different route than all the rest. They're an interesting rival that could potentially climb the throne one day.

Link to Figma→
Download Source Files →

Adobe Xd

Adobe has been around for as long as I can remember. As previously mentioned, they had the throne with Photoshop. Ironically enough, a tool made for a whole different purpose.

They bought Macromedia which contained Fireworks but didn't make any noticeable effort into making it the preferred choice for UX designers. In fact, they ended up completely removing it from their suite of tools.

I'm only assuming the fact that they were afraid of cannibalizing their market, and did not try to "fix it" before it was too late.

Just a few years ago, they began to develop Xd (code name Comet). They've done a fantastic job and was the first viable rival to Sketch.

It was initially open beta, but later became part of Adobe's CC package subscription. In mid-2018 they made the smart strategic move to turn it into freemium.

Adobe Xd website

One of their main strength is speed. I honestly think it's the fastest UX design tool on the market right now. In terms of developer handoff you can easily share a link with all the project information available. In addition there's also the ability to comment when you need feedback.

Adobe Xd developer handoff

It lack core features such as simple polygon shapes, but I guess that they rely on Illustrator for the heavy lifting on that part.

Styles, colors, and symbols are all grouped into a tab, which makes perfect sense. Layers are hidden by default, which I actually like. It's easily accessible if you need to dig in too deep.

Adobe Xd sidebar

They've also announced that developers will be able to make plug-ins, which is one of the things that makes Sketch so popular.

Adobe Xd is laying ground and has come to term that this will be a long play. They've got muscles to withstand and will probably stay until the bitter end.

Link to Adobe Xd →
Download Source Files →


InVision Studio

The last free to use design and prototyping tool is at the time of this writing still in beta. InVision has claimed it to be free forever once released.

As a design tool, they've come a long way. They lack core features such as polygon shapes and styles, but this will hopefully get implemented once they reach the final version.

They've made tremendous efforts into making animated prototyping a big deal. That's where they're differentiating themselves.

InVision Studio animation timeline

Let me tell you that they're on a whole different level when it comes to prototyping. You can do impressive motion interactions with just a few clicks.

They're aiming to be the best design AND prototyping tool on the market.

If they make the core tool as solid as the interactive prototyping feature, they'll be the throne worthy!

InVision app store

They've also announced that developers will be able to make plug-ins that will be available in their own app store.

InVision inspect tool

On top of the Studio tool, InVision also offers handoff and versioning features with the ability to comment and inspect. Studio blends in nicely and is a natural step forward.

Link to InVision Studio →
Download Source Files →

What History Tells Us

Adobe has experience in these sort of scenarios. Anyone remember the InDesign and Quark war? Or the Corel and Illustrator war? It ended up in Adobe winning, both!

The battle seems a little different now. The tables have turned; it's free for all.

It's much easier to be the underdog in this game. People are more sympathetic toward underdogs. That's also partly the reason Sketch won so many designers over.

About the Freemium Strategy

Simply explained: Freemium means that core features are free, and pro features are paid. If you're just starting out, you can go months without spending a dime with any of these tools.

They hope that you like their tool so much that they're willing to offer you a lot of value up front, for free.

I completely understand that not everyone can run with the freemium tactic. It often requires venture backing or an established business.

Last Tool Standing

My prediction is that the next tool sitting on the throne will have a freemium tactic in their arsenal.

That's not to say that there won't be any room for a second or third... or even fourth or fifth.

It's still early days, and none is fully developed. They have their core platform ready, but now will be the time where innovation will happen.

Who will go faster, who will have the guts to differentiate themselves and who will have the stamina to withhold?

They're all gathered in the war rooms ready to make their next move.

Final thoughts

If you're about to pick your first tool for UX design and prototyping or simply looking for change, you won't go wrong with any one of these. There's not that much separating them concerning the learning barrier.

In the InVision video above, it's actually my very first time trying out this tool. If you know one of them well, you could easily jump to the next one learning the basics in just a few hours.

Now, one thing is for sure; It's going to be a lot of fun to watch. Grab your popcorn, because it's about to get real.

A real game of tools.

Portfolio Operating System 2.0

Learn the strategies and tactics used by successful hires at leading tech companies. Speed up your job search with tools and tips that will help you stand out.

Learn More