The Figma 2021 Crash Course by Example

Тәжірибелік нұсқаулар және стиль

bit.ly/3rUfpUy - Take my UI Bootcamp now!
-- bit.ly/3q25PAp 👈 Learn UI/UX Today. Use "LAUNCH" for 15% Off!
-- Today, we're going to step into the world of UI/UX design and cover Figma here in 2021. Figma is a UI/UX design and prototyping tool. In this crash course, I'm going to show you how to use Figma to design a website with multiple pages, interactions and animations.
figma.com
www.figma.com/community/plugi...
www.figma.com/community/plugi...
www.figma.com/community/plugi...
0:00 - Introduction
2:58 - An awesome offer from Scrimba
3:36 - Getting Started
10:46 - Navbar
23:45 - Hero Section
42:03 - Finishing the Home Page
55:52 - "Our work" Page
1:02:46 - Prototyping
1:05:41 - Hover Interaction
1:07:48 - Smart Animate
1:11:15 - Closing Thoughts!
Let's get started!
- - - - - - - - - - - - - - - - - - - - - -
Subscribe for NEW VIDEOS!
Learn UI/UX: designcourse.com
My personal FB account: logodesigner
Coursetro FB: coursetro
Coursetro's Twitter: / designcoursecom
Join my Discord! / discord
^-Chat with me and others
- - - - - - - - - - - - - - - - - - - - - -
Who is Gary Simon? Well, I'm a full stack developer with 2+ decades experience and I teach people how to design and code. I've created around 100+ courses for big brands like LinkedIn, Lynda.com, Pluralsight and Envato Network.
Now, I focus all of my time and energy on this channel and my website Designcourse.com.
Come to my discord server or add me on social media and say Hi!

Пікірлер: 479

  • @DesignCourse
    @DesignCourse3 жыл бұрын

    Do you use figma?

  • @roter13

    @roter13

    3 жыл бұрын

    YES!!

  • @adarshkumar3518

    @adarshkumar3518

    3 жыл бұрын

    #Figma4lyf

  • @japroz

    @japroz

    3 жыл бұрын

    Hell yeah

  • @fazilstudio174

    @fazilstudio174

    3 жыл бұрын

    All the time

  • @mohammedaabid8608

    @mohammedaabid8608

    3 жыл бұрын

    YES 😍, As a linux user figma is more helpful for me to design.

  • @klutzy_
    @klutzy_3 жыл бұрын

    best thing about your tutorials is that you don't waste time on unnecessary thing and everything is fully practical and project based.

  • @robertkylethomas173
    @robertkylethomas1733 жыл бұрын

    About 18 minutes in and the frame within a frame using space-between just blew my mind

  • @mithunshanbhag
    @mithunshanbhag3 жыл бұрын

    Hands down, one of the best figma tutorials on youtube. This video touches on nearly every aspect of figma. Highly recommended!

  • @tarraxart
    @tarraxart3 жыл бұрын

    Yeeyy! It's my first experience on working with Figma and I managed to do everything because of your step-by-step explanation :)thank you so much!

  • @OppacaTube
    @OppacaTube3 жыл бұрын

    Me and my team at the company all thank you for the great effort in putting up these videos for the whole designing community 😌😌😌

  • @shox28

    @shox28

    2 жыл бұрын

    Hi i am looking for team to join as Web Developer and Designer

  • @alirezaaslani3047
    @alirezaaslani30473 жыл бұрын

    literally the best person to learn designing from. thanks man i dont know about others but you're really helping me

  • @TheKevinMichael
    @TheKevinMichael2 жыл бұрын

    Gary! Thank you, this was so much fun! I have been scared to dabble in the UI/UX world but this video has help me gain so much confidence. Thank you!

  • @elle4768
    @elle47682 жыл бұрын

    i followed this step by step and love it. i dabbled a little in web design when i was younger, but now im going to uni for interactive design. i havent started my major classes yet but i wanted to get ahead and your videos have been so helpful. thank you!

  • @pyroghost11
    @pyroghost113 жыл бұрын

    Ahh maaan! Thank you so much! I've been a developer for a little longer than a year now and I'm struggling to create nice looking sites and I prefer to work based on pre-created designs as much as possible. I've started making a few landing pages without a design but they got messy pretty quickly. This crash course just came out at the right time! Thank You!

  • @coder.e.d.8060
    @coder.e.d.80603 жыл бұрын

    Thank you, Gary, I really enjoyed this and was able to follow along in Figma and learn some new stuff. I appreciate that you made this video!

  • @japroz
    @japroz3 жыл бұрын

    Dont ever stop creating great content. Hats off!!😃😃

  • @yashasvisingh362
    @yashasvisingh3623 жыл бұрын

    You couldn't stop yourself from giving some UI/UX design tips here and there. Love your work!!!!

  • @marlenestoffers7496
    @marlenestoffers74963 жыл бұрын

    Great lesson! Thank you so much.. I haven't used the program in a long time, and needed to learn the basics in 10 seconds. You saved me!

  • @i5c5e5n8
    @i5c5e5n82 жыл бұрын

    Man, this was a no-BS guide to Figma and UI design, thanks a lot, you really helped me.

  • @jakeforman8194
    @jakeforman81943 жыл бұрын

    love your work Gary and appreciate your time teaching-im new to ux/ui so side stepping into a new career and your video's are so helpful

  • @chickenpasta7359
    @chickenpasta73592 жыл бұрын

    Awesome crash course. It took a lot of intimidation out of Figma. Finding the right plugins also helped me out a ton and taking the guess work out.

  • @mdyousufgazi4030
    @mdyousufgazi40303 жыл бұрын

    thank you so much for this video! i was waiting for Figma for a while

  • @imertron
    @imertron3 жыл бұрын

    Thank you so much for this tut! Concise and useful. I got up to speed in no time!

  • @attilabodi826
    @attilabodi8263 жыл бұрын

    Great video, thank you. I just got a Figma project, so I'm here to learn EVERYTHING.

  • @gennie01
    @gennie012 жыл бұрын

    My introduction tutorial to Figma and I have already learned A LOT. Thanks so much!!!

  • @purple88able
    @purple88able2 жыл бұрын

    Thanks so much for this course I picked up right away. Amazing instructor looking forward to learn more about the design with you. Have a blessed one.

  • @mamahchinecherem6343

    @mamahchinecherem6343

    2 жыл бұрын

    Are you new in designing?? I am too Reply let's get along and help each other

  • @postcardsfrommel490
    @postcardsfrommel4903 жыл бұрын

    This was SO helpful! Thank you. You have no idea how happy this made me!

  • @valentinabearzotti7747
    @valentinabearzotti77473 жыл бұрын

    thanks!!!! this is so useful!!! i've learned a lot plus i took your ui design bootcamp on scrimba (already finished it) and man I learned so many things thank you very much

  • @FridaDaniel
    @FridaDaniel2 жыл бұрын

    Thank you so much for this video, hands down the best tutorial for beginners in figma!!!

  • @ernesto8273
    @ernesto82733 жыл бұрын

    Gary started the year with a bang

  • @Norell88
    @Norell883 жыл бұрын

    Yes, I need to learn Figma. Thank you brother

  • @marialindberg9564
    @marialindberg9564 Жыл бұрын

    This is really excellent! Thank you for giving a easy and clear guidance on Figma.

  • @ovrsees
    @ovrsees3 жыл бұрын

    Thanks for this tutorial! Helped me complete my first design. :D

  • @thecoderguy2566
    @thecoderguy25663 жыл бұрын

    Thank you soo much for this course , it helped me alot to learn Figma and enhance my Skills!!

  • @kleber.smartdev
    @kleber.smartdev2 жыл бұрын

    Thanks Bro, I am working as UX now and basically this video is my foundation in figma

  • @zainabideen381
    @zainabideen3812 жыл бұрын

    Great content as always. Keep up the good work!

  • @anekeifeanyi5129
    @anekeifeanyi51292 жыл бұрын

    I can't watch without commenting. Thanks man for this video. It's awesomw

  • @angelogramatica9967
    @angelogramatica9967 Жыл бұрын

    Wow. Just wow! Very good work. I'll be on your course soon.

  • @rajesht9702
    @rajesht97023 жыл бұрын

    Thank you Simon. Excellent Work. I Really Appreciate It.

  • @brigittekoch2001
    @brigittekoch20013 жыл бұрын

    Thank you so much Simon. I'm a beginner and your video helped me a lot 👌👍😁 !!

  • @benacker8525
    @benacker85252 жыл бұрын

    Man, This was super helpful. As a web-developer the only thing I did was save to drafts and export assets. I had no idea how to use this tool.

  • @AnthonyCandaele
    @AnthonyCandaele3 жыл бұрын

    Great tutorial, can't wait your Design Course

  • @philipsgregory2285
    @philipsgregory22853 жыл бұрын

    Wow! Just what I needed. Thank you Gary

  • @BlackPenguinStudios1972
    @BlackPenguinStudios19722 жыл бұрын

    Thank you . Thank you, this was so much fun! And easy to follow

  • @shourovfoisal
    @shourovfoisal3 жыл бұрын

    This tutorial was excellent. Thank you. 🧡

  • @mustafa_ahmed394
    @mustafa_ahmed3943 жыл бұрын

    Hi Gary, I love this crash course. I had been using Adobe XD for some time now and willing to come back to Figma. A lot has changed and thanks to this course, I can get back in no time. I want to ask you why didn't you use the grid column layout to design the pages? like the vertical columns. Any specific reason? and also, can you make a design crash course that has the basic vertical column layout of a website. The basic layout that most of the internet hosts. I want to clearly learn that kind of website design from you. Thanks for your time!

  • @kikel4n
    @kikel4n2 жыл бұрын

    I really love this crash course. So helpful.

  • @chyjohn6502
    @chyjohn65022 жыл бұрын

    This is beautiful, so so beautiful!... I don't know what else to do or say, I know comments alone aren't enough, but man, Thank you, Thanks a whole lot. we'll forever appreciate this.

  • @gaguhj
    @gaguhj2 жыл бұрын

    Can't wait for your course :)

  • @snoorman9189
    @snoorman91892 жыл бұрын

    this is a fantastic tutorial for improving Figma skills. Thanks very much!

  • @yehyakhaledfawzi
    @yehyakhaledfawzi2 жыл бұрын

    Thank you so much. Your explanation is amazing. I could do everything successfully because of ur amazing explanation.

  • @aniketborkar7114
    @aniketborkar71142 жыл бұрын

    Great effort by you man. Really its grateful to watch your tutorial.

  • @sanderdsz1
    @sanderdsz13 жыл бұрын

    I hope to see more figma's courses in 2021 here.

  • @verad5458
    @verad54582 жыл бұрын

    You cannot imagine how this helped me today, thank you!!!!

  • @silverian
    @silverian3 жыл бұрын

    Thanks for explaining how to use Figma!

  • @vinidscastro
    @vinidscastro2 жыл бұрын

    Thank you Gary! This tutorial is awesome

  • @greyline5
    @greyline53 жыл бұрын

    Really excellent course. very well prepared. thanks man :)

  • @lynnfretzieasico5779
    @lynnfretzieasico57793 жыл бұрын

    Thank you! Im an intern right now and my company uses Figma very useful tutorial!

  • @hirakeshchandraroy3007
    @hirakeshchandraroy3007 Жыл бұрын

    Incredibly Useful and brilliant presentation.

  • @nicholasgood470
    @nicholasgood4702 жыл бұрын

    Really great overview - thanks

  • @juleskobelin
    @juleskobelin3 жыл бұрын

    What a great teacher you are! Thank you!

  • @arianazdadgar
    @arianazdadgar3 жыл бұрын

    Hey, great course! thanks for that, there was just a couple of questions I had in some parts which I hope you can answer: 1- When you create a component do you do that within your design page and keep the original component as part of your design? OR can you actually creat a new page for your designs and put all your main components there and reuse across your design pages? If it is possible then how do toy prototype your component to link to different direction? 2- I've tried making an image gallery by hand but is there a good plugin you recommend to creat gallery layout? In sketch there was a Make Grid command which really helped copying rows and columns of one shape, anything similar in Figma? 3- Do I need to create a hove and Click page for each of those images? Or is it something that UI designers only create one sample of and then developers replicate that behaviour to other images when coding? 4- It would be great to get some more advice on creating responsive layouts and breaking points, using the Auto Layout is really tricky! I was trying to creat a hero banner with text in it and a button and the image to cover 3/4 of the banner and it was just so confusing... any videos you can suggest to watch to learn more about responsivness? Many thanks, look forward to your upcoming tutorials. Arianaz

  • @CoryTheSimmons
    @CoryTheSimmons3 жыл бұрын

    Great tutorial. Would love to see some stuff on working with Team Libraries and such.

  • @nicxzmiller
    @nicxzmiller2 жыл бұрын

    Thinking of adding more pages and different dynamics. Thanks for opening the door

  • @brianrono9629
    @brianrono96292 жыл бұрын

    Thanks Gary. This tutorial is well done.

  • @fazilstudio174
    @fazilstudio1743 жыл бұрын

    Great content as always Thanks man

  • @jezabels95
    @jezabels952 жыл бұрын

    Very very detailed and useful video, thank you so much for all the free information!

  • @bahaajasim3793
    @bahaajasim37932 жыл бұрын

    Thank you Gary for this amazing video. It's made in Jan. and I watched it in Dec. 😀

  • @saraglez7681
    @saraglez76813 жыл бұрын

    More videos like this please!!! Thank for your video tutorials :)

  • @bumbobaggins
    @bumbobaggins3 жыл бұрын

    I watched this video at the time off release and did not open figma until now(nothhing to do with you, i was very busy) i wanted to see how good i was without revisiting the video and i would just like to say i am proud of the website i made thanks to you

  • @dbeentjes
    @dbeentjes2 жыл бұрын

    Really helpful and well explained. Thank you.

  • @sundaramurthybit8414
    @sundaramurthybit84143 жыл бұрын

    Simply Superb and Clear Explanation

  • @VladyslavDontsov
    @VladyslavDontsov3 жыл бұрын

    Thank you for your video! Awesome 🤩

  • @suatbayrak2703
    @suatbayrak27033 жыл бұрын

    great tutorial, learnt a lot ty !!!

  • @juanmamani2110
    @juanmamani21103 жыл бұрын

    Awesome! Thanks for sharing! And what about next challenge from figma to html? It will be great to learn all workflow.

  • @mosaiccorp
    @mosaiccorp3 жыл бұрын

    Excellent tutorial I really loved it many thank's 👍👍👍

  • @iamtheguy5485
    @iamtheguy54853 жыл бұрын

    Loved the trumpet 🎺

  • @eniolaolusola7260
    @eniolaolusola72602 жыл бұрын

    Yasssssss!!! Thank you Gary!

  • @katevaseha4902
    @katevaseha49023 жыл бұрын

    Thank you for this lesson!

  • @hroman_codes
    @hroman_codes2 жыл бұрын

    This was fantastic thank you! 👍

  • @MinalPateriya
    @MinalPateriya2 жыл бұрын

    The best tutorial and well explained, very nicely done.. big thumps up..

  • @cuber_dev
    @cuber_dev10 ай бұрын

    thanks for teaching me some ui/ux principles and figma tips sir :)

  • @Wuddigot
    @Wuddigot3 жыл бұрын

    I've really fallen in love with your channel, and added it to what I recommend to others. Thanks for all that you've done for us! I would love to see a video where you take this design or others made in Figma and show the process of developing it. Thanks again

  • @febrievan1322
    @febrievan13223 жыл бұрын

    This is what i need, best tutorial 👍

  • @ojcsimmons7101
    @ojcsimmons71012 жыл бұрын

    Good video for getting started in Figma.

  • @captain_rum_n_pear
    @captain_rum_n_pear3 жыл бұрын

    Thank you SO MUCH for this

  • @aaraamuthan
    @aaraamuthan3 жыл бұрын

    Best tutorial for figma and ui design fundamentals👍

  • @ta7065
    @ta70653 жыл бұрын

    Perfect course. Thank you

  • @lillykeule5416
    @lillykeule54163 жыл бұрын

    Thank you so much for the video I’m communications designer and I’m new to figma and im so surprised how good it works for me Indesign is dead and much more trouble to work with it. Very good video it helped me a lot to build my portfolio. Greetings from Germany

  • @lillykeule5416

    @lillykeule5416

    3 жыл бұрын

    Ohhhh I just read your name is Gary I have a snail 🐌 his name is Gary 😆

  • @rachanakan
    @rachanakan3 жыл бұрын

    Thank you so much! 💙

  • @psnZYKRON
    @psnZYKRON3 жыл бұрын

    I love this! So useful coming from a developer perspective Any chances you might do a similar video with Framer?

  • @_Blackwolf_01
    @_Blackwolf_013 жыл бұрын

    Your crash course are amazing thanks for adobe XD and figma.

  • @chetanyadav
    @chetanyadav3 жыл бұрын

    Thanks. Learned more than the Linkedin learning course.

  • @andysachs83
    @andysachs833 жыл бұрын

    I actually think is better design from mobile first and then desktop. You have more awareness about space and what's essential with a limited area like a mobile view and progressively expand the positioning of elements to a larger space like desktop.

  • @pastuh
    @pastuh3 жыл бұрын

    Nice result :) watched all. Now need to find part 2 how to 'extract' design

  • @zainabbalogun1744
    @zainabbalogun17442 жыл бұрын

    Was super helpful!

  • @jaz_ofalltrades
    @jaz_ofalltrades Жыл бұрын

    Thank you for this video!

  • @marynemiahp.v8351
    @marynemiahp.v83513 жыл бұрын

    Thank you so much . it helped a LOT

  • @loveladignon7073
    @loveladignon70732 жыл бұрын

    Thank you so much for this video! 😊

  • @GowriSeelam
    @GowriSeelam3 жыл бұрын

    Very Helpful Tutorial, Thanks.

  • @abhshkk
    @abhshkk3 жыл бұрын

    Thanks mate... You helped me a lot with this video :)

  • @milindkhadse556
    @milindkhadse5563 жыл бұрын

    Nice tutorial. This is very helpful your thoughts are awesome.

  • @idmahammaimad8992
    @idmahammaimad89923 жыл бұрын

    thank you. That was very informative. keep the good work :)

  • @learn3165
    @learn31653 жыл бұрын

    Thanks you very much for your free courses it really helps me a lot because I am a self taught learner, It would be great if you create more free courses on javascript and Ui design with figma

Келесі