Hi everyone.

We're gonna start the course looking at a feature

called First Draft.

Okay? It's AI driven.

It's a great way to kind

of get templates, get kind of started.

Um, it's more useful once you've got a few more

of the skills from this course to kind of take it further.

But I wanna show it now 'cause it's awesome

and it got ready to get started with projects.

So you can see down here I've got the prompt open, okay?

And I'm gonna say it's a basic app.

Make a checkout page for a music event app

and boom, there you go.

It's made a checkout page.

I could play around with the styles and fonts, okay?

But it is something generated from scratch,

from Fig MA's ai.

Let's jump in and look at the pros and cons of it

and how to kind of get it working for you.

We'll also look at the AI feature for ADD interactions.

Alright, let's go.

Alright, so I'm in a new blank design file.

I'm in design, this little tab on the bottom here,

and I'm gonna go to actions.

Now this one here is a paid feature.

Um, so just watch if you're on the free one.

It is, uh, where is, it's called First draft,

so you might search for it.

I've found mine here under Design Tools. Gonna click it.

Okay? The cool thing about it, you can kind

of give it some guidelines as in,

do I want a basic app or a wire frame?

Okay, does it need images or not?

You know, uh, basic site or a site wire frame.

Okay, we've looked at that before.

High fidelity, low fidelity.

Um, so I'm gonna do an app

and I'm gonna say I want it to be, um, it's an event

listing app for music

and just click, make it stand back.

Watch the AI bots do the little thing.

Oh, that was quick thought.

We might even have to jump cut and fast.

Oh, Coldplay, Taylor Swift, I'm out it Sharon, Billy Eilish.

It's not my music. Um,

but what you can see here is it's actually built this

unique app for you.

Um, it is generating, uh, these images.

These images are like it's AI engine making them.

That's why sometimes they can take a little while

and they're kind of like sparkly,

but oh my goodness, it's made an app.

Look at it. This is cool. Let's prototype it. Let's go. Yep.

Okay. And so a look, I like it.

What works, what doesn't? Okay, it's just kind of mocked up.

Doesn't do a whole lot. There's not of, um, interactivity.

You can like in the essentials course go,

you actually, let's look at something else.

Um, let's, at the Colors watch at this.

That's the first colorway. Okay?

You can see, you can go through and say,

oh, I like these ones.

It's a great way to get started.

And once you'll finish this course, the advance one,

you'll be able to add all the interactivity

and all the right ways to kind of get it out for designs.

It's like working with a template except the template.

You get to be very customized, okay?

Especially for things like the colors, things like,

it's like make changes as well.

Look, you can say actually rounded corners.

I want super rounded corners. No rounded corners.

We're going for the boxy look, okay? The spacing.

We want to open that up. It's just very cool.

Oh, what kind of fonts do you wanna use?

Okay, you can work through it.

You can prompt it as well to say, um, can you, uh, add

a large hero

Box?

I dunno if this is gonna work, by the way, okay?

But you can start prompting it to do stuff.

It would be probably easier for me to do a lot

of small changes myself, okay?

'cause it's done a version of it.

It's not the thing I had in my head.

So that's gonna be the tricky part. So you can prompt away.

And sometimes it's easy just to make it.

Let's have a look, uh, under assets, okay?

It has got no assets for this particular, um, document.

There's no library, there's no styles for it.

Maybe that'll change by the time you get to it,

but now there's still a lot of work to do.

But very cool way to get started.

Once you've got some skills, you can't just

be a UX designer.

Go, all right, I've learned nothing about fig.

I'm just gonna use the prompt.

Maybe that's possible in the future.

I don't think so, but I wanna show you that there.

The other thing I wanted to show you from the essentials

course was, let's say we wanna make another page.

Let's go you and let's select it all and delete it.

And this one here, we're gonna go back to our prompt again

and we're gonna say, uh, we got first draft.

Okay? And I'm gonna say event

and listing in detail.

C oh, spell it right Then here we go.

Alright, it's gone. And here it is.

It, oh, it has made a new page rather than trying

to use the one that I made for it.

But you can see here, has it used the same fonts?

Let's have a look. Uh, public sands.

And this one is, uh, no outfit. So it's gonna get better.

You know, I'm looking forward to the time

where I just need a really basic page, like a T's

and C'S page or a checkout page

that looks like a really trustworthy one.

And it can take the styles

that you've already got and then apply them.

That's probably not too far in the future,

but for the moment it's kind of more idea generation.

Um, and you fixing it up and changing it around after. Now.

'cause like everything is different.

But what it can do is we can do, uh, this part here.

We go into the actions

and we can say, I'd like to look at add interactions, okay?

Uh, between you and you add interactions.

Okay? And it did it. Okay?

So it's add the little menal interactions.

So let's give it a prototype.

Now, let's start with this guy

and go to plate and let's have a look.

I can't even remember which button it was.

Oh yeah, it worked. Okay. And then go back to the home.

All right. So those two little things can be powerful okay?

And will be better later on.

But I just wanna show you earlier on in the course, the kind

of new things that are happening with Figma.

And I can come back and update this video in the future.

It's not taking our jobs,

but it is short cutting some of the things we used

to do in terms of like, all right, I wonder

what a good form looks like.

You can start working with, make a first draft

or like normal, go back to home on the browser version.

Remember go up to the F and go to home,

which is at the top, okay?

And you can go to the templates.

There's plenty of templates out there.

It's kind of the way I'm using it at the moment.

It will get better, but it's new, it's fancy

and it will be more handy when your skills are even handier.

And you can kind of like take what that makes

and make it, uh, you know, connect it all up with styles

and auto layouts and variables.

Oh, it's gonna be fun. Alright,

that is it for the first video.

What did you think? Have a play around with it.

I will see you in the next video.