UX Prototyping Tools: How to Pick the Right One (2021)

Подписаться 73 тыс.

Просмотров 29 тыс.

50% 1

You've asked for it, so here it is... the 2021 edition of the latest and greatest UX and product design prototyping tool walkthrough.
As a designer (product, UX etc.) you probably found it hard to keep up with every single tool in the market. Every year there is a brand new tool that allows designers to craft their prototypes in a different way. In this video, I'll walk you through a handful of criteria/principles (consistent from the previous video) that allow me to pick the right UX tool for the right project, budget, occasion etc. You'll also find out my thinking behind evaluating which tools are worth the time to invest and learn based on asymmetrical opportunity/Lindy effect.
The tools I'm walking through and highlighting some of the recent developments:
Figma, UXpin, Justininmind, Sketch, Axure RP, Adobe XD, Principle App, Flinto, Draftium, Invision, Invision Studio, FramerX, Quant-UX, Marvel, Webflow, Protopie, Proto.io, Atomic and the Origami Studio.
As mentioned in the video, here's a public read-only Miro board: miro.com/app/board/o9J_kxk7mGU=/
2020 UX Prototyping tools video: • UX Prototyping Tools: ...
2019 UX Prototyping tools video: • UX Prototyping Tools: ...
2020 UX Design tools survey results: uxtools.co/survey-2020/
🙌 If you like this video, you'll definitely like what comes next;
SUBSCRIBE to this channel and don't forget to share, like, comment: / @vaexperience
👕 UX design and user research themed merch by yours truly: / vaexperience
📩 Get my latest (BEST) updates delivered to your inbox: updates.vaexperience.com/
🚀. I started this channel in 2018 to upskill my design team on user experience methods, rapid UX prototyping, service design, and more at a scale. Gladly the material I use is also relevant for other people across the globe (like yourself).
🧔 Who am I: UX research and design team manager, experience design lead, strategist, and design educator. I love complex services, enterprise UX tools, human decision support and AI tools.
👋 Get in touch: quickest option - @vytautasalech on Twitter; also - hello@vaexperience.com. Note I try to respond to every email, however, given the time constraints it might take a while. The shorter and more specific the query the quicker the response!
#ux #uxdesign #uxprototyping 🎒 Coursera UX courses: imp.i384100.net/dakRLQ

Опубликовано:

4 июн 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 65

@shaun4787 3 года назад

shoot, I posed a question about Figma vs. Axure before this vid went alive. Somehow it got deleted. Oh well. Good points in this vid. Good stuff, VAX. Damn, it's just hard for me to revisit Gosling's early career, I much prefer to see him as the "Officer K" in the BR 2049, what a film, pure visual porn from frame 1 to frame N....🤪 Serious question. What would be a good wireframing tool work well with Design/Proto tools today? I have people(mostly product/dev team people) using Balsamiq, OmniGraffle, even Miro...

@vaexperience 3 года назад

If you have a decent design system that is branched across the prototyping tools, nothing beats pen and paper for speed. But alternatively, anything the team has readily available that doesn't take days to pull ideas together

@shaun4787 3 года назад

@@vaexperience That's what I've been using: pencil and paper. My background was Industrial Design, sketching on paper is native to me. My challenges is that the stakeholders always want/prefer to see something that has a bit more fidelity than pencil and paper sketch. I started to use Miro freehand sketching tool. It works pretty good for now. But when I run a design workshop remotely in Miro, stakeholders quickly started to "stitch" screen shots to use as crazy 6/8 ideas which brings an uneven level of detail when compare with my freehand sketch ideas. Dot voting can naturally be skewed towards whoever has the highest fidelity. Describing "interaction", but not "interface" is easier to say than done for product/dev stakeholders...

@vaexperience 3 года назад

Yeah, absolutely. That's why it's worth having a few tools under your belt, so that you can use whichever is most appropriate for the context. These days my teams usually use core tools and then each individual designer has their own few secret tools that they bring when neccessary 👌

@rohitslb7455 3 года назад

Thanks, mate 🙌🏻 Helpfull Video update.

@faranakvn3976 Год назад

that notebook movie snippet was hilarious! 🤣

@codehermano8002 2 года назад

the scene with adobe is smashing me away 😂😂

@OneBrighDay 2 года назад

I really enjoy Figma but I am super curious/interested in using Framer. I design and code, mostly in React now so it seems like the perfect tool. I wish there was more learning resources out there for it.

@ketoweightloss9825 2 года назад

Any thoughts on the latest Axure RP 10 version?

@LifeinGlow 2 года назад

Interesting video thank you! I am new to UX/UI just started learning a bit. And looking for a free or affordable app to create a prototype for an app and simple software (to offer them as products later). Kind of hard for a beginner to even estimate if those projects are manageable to fulfill on a small budget. If you can recommend a video on that, would be glad to watch.

@marcinszuba1034 3 года назад

Nice update on the tools. Do you have an option for no-code or low-code tools in use for prototyping purposes?

@vaexperience 3 года назад

All of these are no to low code. But if you mean something that makes clean code UI ready for live usage? I wouldn't call that a prototype anymore though. Perhaps Webflow (websites only though not so much apps or proper tools) as it's purpose built for easy website dev.

@divyanshkumar5053 7 месяцев назад

Bro predicted the figma acquisition 0:00

@gilbertumeh 2 года назад

Do Axure and Origami render prototypes to code? I want to know, please. And thanks for this video.

@Penpot 2 года назад

Your research is amazing! Shame Penpot is not in there (wink, wink) : ) You may want to consider the first open-source design and prototyping tool in your next year's review.

@bogyayb 3 года назад

❓What's the problem with Origami Studio? You can design, animate and add some logic to your prototype to really feel like an app. ..and it's FREE! I just dont get it why its not soo popular!?

@karatik.a 3 года назад

Figma it is for me. Next step for figma would be to add more options for prototyping, then good pricing and layout code export and that would make it invincible (it already has CSS/styles export)

@cement006 2 года назад

now free version is changing is it okay?, I am beginner so just a question

@Jada-li9tv Год назад

What are your thoughts on Sketch + Anima? Anima is a plug-in but for bigger teams my company would need to purchase to expand on project/screen numbers and code export options. Is it worth it? And the company I work for is migrating from Sketch to Figma. In the meantime I'll be working in Sketch 😭 Sketch feels so flat, limited, and backwards from what I'm used to with Figma and plug-ins. I really want to request some software to help give Sketch prototypes some "wow", some movement and purpose. For now it's Sketch + Craft + InVision 😴 Feels so limited in micro animations, code hand-off, and other interactions. I love Framer's text input fields and I think Framer has so much potential to add more interactions. I just want all the happy functional stuff at my fingertips. Especially since it will help in convincing stakeholders. I would love Sketch + Framer/Principle + InVision. Or, Sketch + Anima + InVision. My software requests might not get approved but what would you recommend I request - with the team learning it in mind? This company is big, but it needs some UX tlc in my department.

@tharindumadhushan7776 2 года назад

Thanks ❤️

@marksmith2738 Год назад

Miro? Just watched a video on wire framing in Miro and it looked quite awesome. No idea what the price is though.

@arkahhhzzrisingto1071 2 года назад

Thanks 😊

@beyourahi 2 года назад

Figma VS Framer which one's better?

@rihasanatrofolo2472 2 года назад

How about UXpin, is that a good tool?

@elludsko7414 3 года назад

6:02 I'm DEAD

@DXmaryoOD 2 года назад

that joke w adobe was *chef’s kiss* i died 😂

@BrentLagerman Год назад

any update for 22/23?

@divyanshkumar5053 7 месяцев назад

Are you going to make an updated one @vaexperience

@divyanshkumar5053 7 месяцев назад

Please include Flutterflow, CreateWithPlay, and Protopie alongwith what you've already included

@sallygosbert9886 Год назад

This the greatest opening line I've ever heard😂

@bitwise4996 2 года назад

Lunacy is Figma+Sketch but free and works offline. I cant believe no talks about it.

@JulianHarris 2 года назад

Figma is listed at the same level of prototyping ability as Framer. How’s that so? Figma has no data state at all only component state. So if you want to, say, test the selection of items in a list you have to create an instance for every single permutation. 10 items in your list? 10 screens.

@chichi-bu9xu 3 года назад

Webflow for prototyping? What type of prototypes are you pointing at there? websites? I think that Webflow doesn't belong there at all. If we will treat webflow as a prototyping tool because of its visual editor, then shouldn't we compare it against similar tools like WordPress, Squarespace, Adobe Portfolio, Adobe Spark or plain HTML/CSS/JS + Lottie? These alternative tools should atleast be added into the list. In my opionion, Webflow is not a prototyping tool but a visual web builder. It shouldn't be compared to prototyping tools that designers are using like Figma, Principle or FramerX. I am genuinely curious if anybody uses webflow solely as a prototyping tool.. I really don't think it was built for that - at all. It might also be better if you can back this up with a survey or some sort of data because this is really a big news to me that I would like to fact check. EDIT: Advance apologies if my comment sounds mean, my intent is just to point that out. Otherwise, your videos are very good 👍

@vaexperience 3 года назад

Hey, not at all. You'll notice webflow included across the Web in the prototyping as a lot of designers have used it from the start to prototype their client websites and still do. Webflow was not really that great of a website builder in the past. But I agree, if not for the hype and designers still using it to prototype and then deliver the Web products wouldn't have included it. Maybe will take it out in the next yearly round

@neoniquestudio 2 года назад

@@vaexperience I agree with @chichi. Webflow is definitely a visual programming/website development tool, not a prototype/screen design tool. Even if you could use it for prototyping (and some might do) but it´s not supposed to be that and it doesn´t work great as such either. So I feel it´s misleading to have it in that tool category. But hey, thanks a lot for this great summary! It´s quite an effort to keep track on all those tools! I actually was about to get into Invision Studio but since you´ve pointed out it´s somewhat dead, I better shouldn´t. 😂 Cheers!

@Benfry57 2 года назад

How in the world is Sketch so high in versatility for prototyping?

@JR-wu3rx 3 года назад

Could you briefly explain why Figma is a higher fidelity prototyping tool than Protopie? That's really hard for me to believe.

@javiertrevino5535 2 года назад

it's not

@vickyvijayraj Год назад

Figma is not high fidelity prototype tool

@meredithandfriends 3 года назад

I use Figma and I used to hate Adobe XD but I prefer prototyping in Adobe xd

@aint_david 2 года назад

Are you me? Because that's exactly what I think and tell everyone!

@eswag153 2 года назад

The drag to clone feature is lit as well, but collaboration is pretty lousy

@affeui3892 3 года назад

Protopie is best for me

@roter13 2 года назад

Do you have any good tutorials for learning Protopie?

@Its__Jay 2 года назад

@@roter13 isn't is paid ?

@lovetami2 3 года назад

👍

@markinmotion8044 2 года назад

The best one is the one that works for you and does what you need it to do

@violablomsterbed9755 3 года назад

so which is the best ? :D

@vaexperience 3 года назад

There's no such thing, thus the scales. But if I'd have to pick just one it would be Axure

@obinnaokafor6252 Год назад

Lunacy ❤❤❤❤❤❤

@martinui4892 2 года назад

hay alguien que diseñe en Protopie ??? creo que es el gran problema con los UX, que no conocen las herramientas realmente. podrías comprar Figma, adobe XD, Invisión o Sketch, pero protopie o y origami son para crear prototipos de alta. son herramientas diferente.

@thomasdahl2232 2 года назад

What about Balsamiq?

@roter13 2 года назад

No! Just no!

@joshuaj4903 2 года назад

6:02 I laughed so hard!!!

@tokyoprof9083 Год назад

adobe xd 🥺❤️

@jemersonbarros125 Год назад

And today Figma lived long enough to become adobe, but not as a hero. RIP. 0:02

@jamiepeterson386 Год назад

Lol this video aged well in regards to the news Adobe acquiring Figma

@HaifengZhu-pn3uq Год назад

Is Figma free in 2023

@vaexperience Год назад

Free to start

@davinderrehal9391 2 года назад

Sketch has become Adobe

@radokhlebov 2 года назад

I feel like a dinosaur 🦕 using Photoshop design sketching...

@harshitbishtt Год назад

Violated Adobe

@inferno25znc Год назад

...Or you live long enough to become Adobe...

@axelhunger Месяц назад

We need your Advice 2024 IAS. FIGMA FIGJAM - MIRO MAZE The best with all features, the possible in one, simplified and easy to use and quickly learn without much effort and mental energy. Beyond the principles and good smart practices ux and ui. Surveys, qualitative and quantitative research, insights, discovery, ideas, collaboration, methods, frameworks, templates, and testing. -- UIZARD? RELUME?