Best UX Tools 2021

 Best UX Tools 2021

What's the best on the market?

That Adobe XD is a figma is a sketch all the stuff that you need to know coming up right next.

Best UX Tools 2021

1.adobe xd logo

2.figma xd logo

2.sketch logo

        What's up guys today, we're gonna take a look at some UX tools. What's the best on the market? Is that Adobe XD is a figma is a sketch all the stuff that you need to know coming up

right next. 

     We're going to jump straight in with the hottest design tool at the moment the hottest UX tool which is figma So for the last couple of years people have been using sketchy in the industry Adobe XD We'll talk about those both in a second They both have to still have a valid place in industry 

The First platform

        But, the hottest one at the moment by far is figma one of the reasons it's so hot is that it's free So people always ask me. What's the best design tool I can start with I don't want to invest a lot of money Into a design tool. What's the best free one that's been really hard to answer to be honest in the last couple of years 

Sketch was cheaper $99 but figmas free and figure was got so many advantages on sketch Also what one of the best things about figma is figma is a tool that works It's browser-based so it doesn't work.

     

    So I think it's an Unbelievable design tool it's going to change the industry. It was really hot in 2090 and anything in 2021 It's going to be the hottest design tool so head on over to figma comm. best figma design tool 2021.

        I've just launched this page I'm just going to talk quickly about what figma is used for design is and show you design and show you how to get started But definitely check this out before you check anything else out? so One of the things that figma is based around it's all based around vectors so years ago.

we used to make websites and Photoshop But as you know fur choppers basically for editing photos photos are all pixel based So when you do min on your design, you'd see jaggedy edges pixels Things wouldn't be very smooth but Modern design tools are all based around vectors. 

          You can draw things with a pen you can put shapes in there It looks great on screen and its really good for handing over to developers So that's one of the things that figmas based around as we scroll down Figma keeps on adding new features all the time. 

    Just recently the other two Auto layout So look at this on the left hand side Say your design in a chat app and you wanted to rearrange some elements on the page.

Before you'd have to move it out the way move the other one up move it back in it was a bit of a pain, but now big things are getting more like code actually but a lot easier for Designers to use so you can move things around the page things Auto layout and it's such a cool thing It saves you so much time going forward.

-The things that Really great design software is house.

-They leave it open for plugins for developers to write plugins. 

-It helps the Program grow a lot faster and that's something that figmas got built from the       ground up in so quickly.

    I'm just going to show you a design I put together This is just a really quick app for the moon But let me just show you a couple of things that figments got built in So I'll do a future video on how to design this but this is our design here We've got free iphone screens now in 

the top right hand corner you can see design Prototype and code, so I'll show you the code thing fair So if I click on the button and I click on code you can see it actually spits out the CSS So working in design teams. 

        This is what developers want back in the day We used after go in Photoshop draw red lines on everything say how much space arm is involved? Say the actual hex code the colors, but now everything is built in there.

You can see it's got the hex code for the button It's got that it'll of the font details if I go on it, you can share your figma file before for people There's a share button up here If you click share You can then drop people the link you can drop developers

 the link they can go in they can they won't have access to Right over your files but they all have access to check out all the all the code in everything you need and especially Sharing it with other people in your team two designers coming back on the same file, There's so much more detail. That's gonna go into figma.

The next platform. 

Adobe xd meaning

    "Adobe XD is the Adobe prototyping instrument for client experience and cooperation fashioners. Adobe XD highlights are utilized for making wireframes, models, and screen plans for computerized items, for example, sites and versatile applications."

    I'm gonna talk about is Adobe XD   figma is gaining in popularity So figmas probably the best for individuals looking to guarantee UX and UI Adobe XD seems to be much more professional teams Use earn I've recently checked out Adobe XD.

 I think it's very unpowered Figment to be honest But Adobe XD obviously has the money of Adobe behind there They keep on adding new things and I'm going to show you a couple of features in Adobe XD which probably stand it I'll from figma at the moment in terms of a Few key features especially plugins and UI kit, so I'll just quickly show you the hump.

    So head on over to adobe.com Check out  Adobe XD at the time of publishing. This is free You might need a CC license in the future though We keep changing on the pricing platform, but I envision in the future to compete with figma It's gonna have to be really cheap or free But Adobe XD again what it's got its got code built into it.

     it's got Auto animate, which is a really unique feature within Adobe XD so before when we were moving from one page to another What it will do is if it recognizes an element with the same name on each screen it will then rearrange that element which is really really cool and It seems to be built for us as it's a set.

It's built by designers So they have by far the biggest butchers They all go into some of the world's biggest companies and work of the designers and help improve the product So I say figma being a really big competitor for this but you know Adobe's been around the longest put the most resources into it and although we all probably have the better program at the end of it but again probably More for professional use at the moment.

So let me show you one of the really cool features about Adobe XD adobe XD alternative so Adobe XD has something called UI kits so this is within the resources section of the Adobe XD website so if you go up you can see there's plugins again what we spoke about before with figma where you can Get things built into the platform to make it better, but UI kits is really cool 

So every large company at the moment has a design language for their company It helps people save time when developing and designing things.

    I've several that one for Barclays But what comes free with Adobe XD is their free plan apparatus , dialects and adobe xd send out model one for every last one of the huge young men So you have the Apple plan language the Google material plan language and the Microsoft uwp plan language so I've recently downloaded the Material plan language just to show you what kind of you go so again it's an incredibly basic format of a program.

    every one of the Things you can do around the left hand side It looks extremely straightforward, however it's very mind boggling a couple of the things you can get into when you get into Adobe XD So in the event that I zoom in once more

these are rock loads up, yet you can see there's a free record I've downloaded and every one of the components that you need to plan a site are in here So I've seen individuals send me a few plans for survey of applications.

They may plan an Android application yet a ton of the time Guys, you don't have to spend or burn through a great deal of time Design and stuff that is local inside the program. So things like these chips. These are cards You have you know, you have your top bar your base bar with your slide-out menus This is completely worked in to this UI unit.

I'm gonna be doing more things on Adobe XD So let's take a look at the next design competitor 

which is sketch. This has been the big boy in the industry You don't want to miss out tonight. You'll want to know how to use it And you want to know why these two are taken over So the last design tool I want to show you guys is sketch Helen over to sketch calm take a look So sketch has been something that I've been using for at least five years I used it to build the whole of the award-winning Barclays website.

    I built the whole design language in sketch and I've been using it in some Cisco work. I've been putting together But I have changed I'm gonna be honest.

 I've moved over the fake yesterday in the last couple of months I'm gonna show you the sketch website. I think it's good for you to You know, you can go on to sketch you can try for free. I think I think the price in estill $99 on sketch Really cheaper compared to some of the old design software.

 sketch very similar to the other programs. It's all vector based you can see that sketch has got lots of cool things So the buttons resize you can drag and drop things move about these have all been new features Which have been pushed by figma and some of the stuff at Dobby XD he's been doing Sketches got components built into it so if your design and a website Like I showed you of UI kids before you might design your own UI kit for a website

So you'll have your own headers and buttons this can all be done in sketch Sketch is completely you know that they've been the big boys. So they've been investing a lot in the platform again It's built by designers. It's got very similar things to the other two programs. 

You can view it on your phone you can view Other things one of the big things that sketch doesn't have built into it like diverters prototype in So I'm going to show you a website which I use in conjunction with sketch which is envision app.

     Comm again This is a free website And you'll be able to get a plugin for sketch But what you'll need to do is whenever you make a page or design a page in sketch you'll click on it You'll upload it to your rim vision profile you'll then go on envision to then do all your you know, your links to your buttons and stuff and Envisions a great program.

    I've used it for some of the world's biggest companies. You can see here "Airbnb.Amazon HBO", they all use envision But this is probably a little negative towards sketch so the other two have prototype and built into the platform It's not built into it's not built into sketch and It does slow down your work.

    So it takes a it takes a few more minutes to do different things That you'll be able to do in seconds in the other programs and overtime It doesn't sound like much but it does add up on your program again One of the hot things in the industry is adding code So there's a plug-in called Zeppelin.

    Which is free you add that into sketch so you can make a sketch or a bust but you've got to add all these different Programs and you've got to stay in touch keep them all Keep them all up to date There's probably more plugin so sketch than there is video programs just because it's been around for so long So you can make sketch robust.

       Zeppelin is a plug-in which exports the code to developers again Like I said before developers don't want a PNG or JPEG. They do kind of one interactive prototype but what they want is the code that's what they're gonna have to go in they're gonna have to Put the buttons and they're gonna have to put the colors in they don't want to keep coming back to asking you What the hex code that that color is All of that stuff. 

    So if you want to check our sketch get the free trial get Zeppelin get Envision and Check it out Guys, I hope you enjoyed that lesson today.