Figma Tutorial for Beginners (2024)

Sdílet
Vložit
  • čas přidán 13. 09. 2024

Komentáře • 228

  • @KevinStratvert
    @KevinStratvert  Před 5 měsíci +6

    ⚡ Get Figma: psxid.figma.com/lqjg97licpry

  • @muzammilmunir6025
    @muzammilmunir6025 Před 19 dny +9

    Hello, I’m a software engineer from Pakistan. Since many days I was thinking to learn about figma, your single tutorial is enough for me from basics to advanced. You teach it very well and amazingly easy. Thanks ❤️❤️

  • @Devbep
    @Devbep Před měsícem +9

    This was 100% worth watching all the way through, I have been watching other videos / tutorials and kept getting lost and usually staring at my own blank frame wondering what or how to get started you covered everything EXTREMELY well.
    One thing I will add is I hope to learn more about the "libraries" options and even "how to centralize components and styles" as it may get messy or confusing for example on a large project, if not maintained / organized in a centralized place.
    Maintaining and organization has been 90% of my current struggle with design, knowing what needs to be consistently applied globally and where and how to update those easily. Most of my projects have started out as a single-use component with custom styling then expanded to repeated usage and styling. That could have all been avoided if planned early on but its now too messy and too large to easily fix without massive refactoring since I did not plan ahead the layout and design before actually creating the project in code. Now I have started templating more of my repeating components and styles and even pages which has INSANELY simplified the process.
    Overall thank you for the high quality and very well edited and explained course. This is invaluable to anyone new to figma like myself and an amazing starting point for getting comfortable, although it was a basic layout/design of an app and not something more expansive like a website design I think that would have just made it more complicating to actually understanding the fundamentals needed for that next step.
    **(I will comeback and update just leave a reply if you're curious to remind me after learning more)**
    I hope this overview is not missing any important or key info that is crucial to beginners like: "How to layout and design scrollable content" as that seems uncovered and not explained at all. "Dev Mode" (Code toggle "" top right seemed interesting but uncovered), I realized it's paywalled. Not a problem for my intentions, as this is mainly just for reference / planning. Not for development it seems the dev mode is not mature enough *yet* to take a **whole figma project** and create code like React JSX with Styling consistently, without requiring heavily refactoring most of the code by hand as I have been but it's looking like it may be viable in the near future.
    I am curious how AI like Claude being so good at understanding images and coding might be very helpful when doing things like creating components from the exported PNG images as I have had quite amazing results in other instances so that will be very cool to test and experiment with possibly removing some of the mundane code that is required for components and templates
    **Personal disclaimer / info below for anyone who is interested / thinks I should just do it myself without AI (Feel free to ignore past this if you don't care)**
    I personally understand how to code in many languages including JS/TS/JSX and create and style components, it would just be a nice way to quickly get some foundational boilerplate out of the way and save time on mundane repetitive tasks and experiment with capabilities.
    - I DO NOT recommend this approach to others, especially if you do not understand how to write components. At minimum you should understand what the code does fully, unless purely for learning.
    - It's not perfect and does require knowing what the code is actually doing and usually how to prompt properly to get the correct output. If you don't you will most likely waste more time debugging and fixing issues this way, than if you just learned and coded it yourself as you will end up with something you can't understand.
    - At the same time this IS a great way to learn, by trial and error in a **safe dev environment** using AI as your teacher getting first hand experience by testing and getting personalized explanations compared to reading docs that are very generalized and not easy to understand.
    - Needless to say it's very dangerous in production to do this, you should be able to explain the code you are using including everything it does before deploying it publicly or you may end up with problems if you review the code and question anything its best to check docs and also ask AI about it and get informed fully and double check it. Think of this as if a expert was asking you why you have this code is the best way to think of it.

  • @crazycatlady-overwatchpowe1111
    @crazycatlady-overwatchpowe1111 Před 5 měsíci +23

    Hello from a Bulgarian girl, who lives in Belgium!
    You explain it amazingly and in very much detail! Thank you for your content!

  • @murshidmoossa4921
    @murshidmoossa4921 Před měsícem +5

    The way you explain things are amazing. Each seconds are worth. Thank you Kevin.

  • @promisenwanno5969
    @promisenwanno5969 Před 4 měsíci +19

    Excellent delivery of knowledge - not a second was a waste. Thank you!

  • @andyvaldez212
    @andyvaldez212 Před 2 měsíci +15

    Kevin this was by far the best simplest and straight forward crash course I've taken on Figma... highly appreciated sir

  • @Atulwebdesigner
    @Atulwebdesigner Před 3 měsíci +8

    As a web designer, I am trying to master Figma. This tutorial really helped. Thanks for sharing Kevin 🌟✨

  • @n8tr0nweb3
    @n8tr0nweb3 Před 2 měsíci +3

    Kevin, I can't even beginning to tell you how perfect this video is. Thank you from the bottom of my heart. You are my hero! Easy sub!

  • @refaelPe
    @refaelPe Před 2 měsíci +2

    This is the best video I've seen on Pygma, and your ability to explain, the eloquence and clarity of the explanation, you wow
    Thanks!

  • @Rockerfeller26
    @Rockerfeller26 Před 3 měsíci +2

    I think figma is an incredible resource if you learn to use it wisely. Your video provided me so much insight. For a complex interface like this, you broke it down nicely. Keep up the good work.

  • @schowdhary051180
    @schowdhary051180 Před 12 dny +1

    As always, Kevin did a fab job of simplifying the tool usage. I highly recommend it as the first place to begin if you are new to Figma.

  • @DataPunkStudios
    @DataPunkStudios Před 11 dny +2

    thanks for the tutorial, it was a really good walk through. only issue I had was getting the auto layout set up properly, but the issue I had was the button scaling when you re-type the words in, it scales with the text. It did not. I could not find a fix online for it, so ill look into it later. Its not a big deal, more of a preference to have it work, and after watching that part over and over, and trying a method of fill instead of creating a rectangle and linking it to the text, both ways did not work. Either way, this was super helpful and gave me a lot more confidence to learn more about figma in general, so thank you. here is a like and a subscribe!

    • @AnnaOsei
      @AnnaOsei Před 2 dny

      yes that happened to me too. ive had to use the text by itself and made it a frame. then filled in the background and curve the edges so it looks like a button and then pressed auto layout .

    • @kreshnikjusufi3127
      @kreshnikjusufi3127 Před dnem

      i kinda had the same problem, I have a different (new) version of Figma I guess.. anyway I found out how to do it: select the Frame and in the Auto layout width & height select the "hug contents" in the dropdown options.. hope it helps!

  • @theekg8445
    @theekg8445 Před 4 měsíci +3

    This was the best lesson I’ve ever had, wish I could show you what I made with you, thank you so much ❤

  • @haimmadmon3531
    @haimmadmon3531 Před měsícem +5

    The tutorial is very good but some of the explanations are not matching the current version of the elements in Figma. Something else, it was helpful for new students if you could share your the images u used it this tutorial. Thank you Kevin 🙂

  • @KasiaMalad-md3td
    @KasiaMalad-md3td Před 3 měsíci +3

    The best ever tutorial. Thanks Kevin. Great job!

  • @adinam7597
    @adinam7597 Před 2 měsíci +1

    Thanks for this awesome tutorial. It covers a lot and I like that you keep saying all your actions including shortcuts, makes it so much easier to remember.

  •  Před 21 dnem +1

    Awesome tutorial! It's basic but very comprehensive. Great work!

  • @willwill1738
    @willwill1738 Před 2 měsíci +4

    Love your teaching, many thanks. My suggestion: know many videos are for beginners, but I think it is about time for you to create some more in depth, intermediate and higher tutorials. Of course, your usual style - concise, engaging and down to earth. Thanks a lot!!!

  • @melanyartz7565
    @melanyartz7565 Před 5 měsíci +6

    Thank you for the tutorial, It was really easy to follow. Your explanations were gratifying. Keep going!

  • @samuel001ify
    @samuel001ify Před 4 dny

    Wow!!! It's amazing how you teach and make it look so easy. Thank you🤓

  • @liamlg1314
    @liamlg1314 Před 5 měsíci +29

    I watched your microsoft access video but am too lazy to get back to it, so I am commenting here instead. I just want to say Thank you. I have been on the internet for a while and every tutorial I find is long, complicated and frustrating. I have seen a couple of your videos now and honestly these tutorials are incredible, it's like somebody has read my mind for how tutorials should be, I am annoyed I am only finding you now. Thank you so much!!

  • @HarshanH-u9u
    @HarshanH-u9u Před 2 měsíci +1

    Kevin this is the great video about the figma basics thanks a lot you explained all necessary things without wasting a time and with no lag.

  • @ma.lizaacosta3901
    @ma.lizaacosta3901 Před 8 dny

    I have tried 3 figma tutorials, and yours is the best and easy to use. Thank you!

  • @sondosemaad8406
    @sondosemaad8406 Před 21 dnem +1

    This is very helpful and clear, thanks for your great explanation.

  • @HasnainChess
    @HasnainChess Před 5 měsíci +5

    Amazing, that was quite helpful now I know the Figma too. Thanks to you man

  • @lostbear1600
    @lostbear1600 Před 11 dny

    Thank you ! Thinking about learning Figma soon and this is so informative and useful !

  • @yamaikaguyachi
    @yamaikaguyachi Před 3 měsíci +4

    can you upload more advance of this tutorial?
    btw thank youuu !

  • @connydrivemark
    @connydrivemark Před 20 dny +1

    Wow! Excellent video 👏🏻

  • @zuxu4n
    @zuxu4n Před 29 dny +1

    Amazingly structured video

  • @laurapandjatcharam
    @laurapandjatcharam Před 23 dny +1

    Ohhh génial! Ca m'a trop aidé, merci bcp pour les tips et méthodologie! 🔥🔥🔥

  • @otienooliver9557
    @otienooliver9557 Před 5 měsíci +7

    From Kenya love what you are doing

  • @mahasiswago
    @mahasiswago Před 2 měsíci +2

    thank you very much kevin, this video really helps new users understand figma. god bless you 👍🙏

  • @luisafernandabautista2540

    Kevin..I didn't know you until an hour ago hahha... I'm just another beginner joining here... and I'm so happy bz I understood almost 97% of this tutorial , the speed, the way how u explained was amazin for me, and also improving my English (listening) as well... I tried each thing you did in the tuto and learnt A LOT !!! Best regards !!

  • @ImpureForce
    @ImpureForce Před 4 měsíci +2

    Thank you so much for this very helpful tutorial. Well-organised, good speed, nice cadence of speech, basics covered. 👏👌

  • @jewels9263
    @jewels9263 Před měsícem

    I subbed in the first 60 sec. in appreciation for how slowly and clearly you were speaking!❣

  • @KUSHQID
    @KUSHQID Před 2 měsíci +3

    I enjoyed every moment learning from this tutorial. Thankyou

  • @carltonchen2692
    @carltonchen2692 Před 25 dny +1

    This is also very helpful to me, thank you so much.

  • @TusharS-p2n
    @TusharS-p2n Před 3 měsíci +4

    Thanku very much!!!!!!!!!! for your such adorable guidance 🥰🥰🥰

  • @anuragkothari199
    @anuragkothari199 Před měsícem +1

    It was very very very helpful.. Thank you

  • @RatedDonald13
    @RatedDonald13 Před měsícem +1

    Beautifully explained.

  • @krutivohra8985
    @krutivohra8985 Před 2 měsíci +1

    This was really good...Thank you so much. i am a beginner and I needed something that showed the most current version of Figma and how to use the features.

  • @toguentertainment
    @toguentertainment Před 4 měsíci +2

    hi..i am from indonesia. thank for your tutorial. you are amazing tutor sir

  • @VaibDesigner
    @VaibDesigner Před 3 měsíci +2

    I am new in designing , Excellent tutorial. Thank you.

  • @joebee3438
    @joebee3438 Před 4 měsíci +3

    What happens after that, how do you get it to the App Store, does it cost? Can you do a Part 2 Video for this? (You are just amazing!! - just too good👍) - Await your feedback!!

  • @wealthwave-fy9sg
    @wealthwave-fy9sg Před 4 měsíci +1

    Amazing tutorial. Thank you for taking the time to make quality content for others to learn. I am very glad I found your channel. Keep up the good work. 👏👏

  • @EdsonNascimentoEN
    @EdsonNascimentoEN Před 5 měsíci +4

    Great tutorial Kevin - as always you rock.

  • @SibabalweJantjies-zu8bg
    @SibabalweJantjies-zu8bg Před 2 měsíci +3

    Wow man, I'm impressed.

  • @iamace1607
    @iamace1607 Před měsícem

    You made Figma very easy to learn. Thanks Kelvin. You are a great man

  • @archangel0137
    @archangel0137 Před 5 měsíci +15

    I've been looking to learn Figma. Glad I stumbled across it!

  • @tibibara
    @tibibara Před 2 měsíci +2

    Great Tutorial Kevin, Thanks!

  • @sayyedashfak1463
    @sayyedashfak1463 Před 3 měsíci +2

    Thanks Kevin. Such a Good Tutorial.

  • @Moon-oz3mu
    @Moon-oz3mu Před 8 dny

    you are gifted guy !!! thank you

  • @dragonflyOfficial
    @dragonflyOfficial Před měsícem

    Amazing tutorial for beginners ! Thanks so much Kevin!

  • @karencohn5382
    @karencohn5382 Před 3 měsíci +2

    Great tutorial! I'm ready to get started on Figma!

  • @mferreira1231
    @mferreira1231 Před 2 měsíci +1

    This is an incredible crash course. It does get you ready to start using figma from the first click. With enough hours of research and this video as basis you can really start making complex designs. Thank you for your effort Kevin!

  • @zaynabali5649
    @zaynabali5649 Před 3 měsíci +2

    Greetings from Somalia🥰
    and really love your contents

  • @madinadaoud4477
    @madinadaoud4477 Před 15 dny

    Words can't describe my gratitude.

  • @fedhasayelmachew7510
    @fedhasayelmachew7510 Před 2 měsíci +1

    Thank you very much, it is very helpful plus the way you explain is so special!

  • @danovenchjean9710
    @danovenchjean9710 Před 3 měsíci +2

    Just what I needed

  • @inebrahim162
    @inebrahim162 Před 4 měsíci +2

    Great Tutorial, I want to learn more about figma, Please make more videos.

  • @NoCodeFilmmaker
    @NoCodeFilmmaker Před 2 měsíci +1

    Also, just curious, in your thumbnail A/B testing, which one performed better for you? The one with the yellow background, or the one with the white background?

  • @dejohnandree
    @dejohnandree Před měsícem +1

    Just subscribed, this video was what I needed to get started. Question, is it okay to do random projects to build a portfolio?

  • @robertpaluchowski8522
    @robertpaluchowski8522 Před 2 měsíci +2

    Hi, great tutorial. Thanks

  • @pysco11
    @pysco11 Před 2 měsíci +1

    Wonderful content crafted by a mastermind. Thank you so very much sir. Thank you!

  • @erictimothy7347
    @erictimothy7347 Před 2 měsíci +2

    Thanks bro. this is so helpful

  • @user-hs2ih7pk3b
    @user-hs2ih7pk3b Před 2 měsíci +1

    How it is possible to explain like this, Love it!! Simplicity with creativity.

  • @scottyates9308
    @scottyates9308 Před 2 měsíci +2

    Hello Kevin, I watched the Figma tutorial, and it was just what I needed. Thank you. Your presentation approach is great, and it was well worth my time.

  • @karjedav
    @karjedav Před 3 měsíci +2

    Excellent tutorial. Thank you.

  • @jaybeatz8084
    @jaybeatz8084 Před měsícem

    thanks bro! this was explained the right way. Your teaching style is 💯

  • @JL-fj5iz
    @JL-fj5iz Před měsícem

    This is very easy to follow. Good job Kevin!

  • @iamalfofficial
    @iamalfofficial Před 3 měsíci +2

    Oh my God I missed this, Ill Sign up under your link🙂

  • @lucaspatterson890
    @lucaspatterson890 Před 3 měsíci +2

    I'm having trouble with newly added images, frames, vectors, etc. popping into the original frame, instead above the previous layer. So I have to keep dragging the new layer above everything else I've already done. (hope that made sense)

  • @Donto-h3u
    @Donto-h3u Před 22 dny

    Thank you Kevin, your Tutorials are informative and amazing as usual, keep up the good work.

  • @BezumniyElochnik
    @BezumniyElochnik Před 4 měsíci +2

    Thank you very much for this tutorial! However, if I create "scroll to action" to Rectangle 1 on Home button it doesn't work on Locations and Cart. Maybe someone had the same issue? I had to change it manually to "navigate to" on Locations and Cart.

  • @russellei
    @russellei Před 2 měsíci +1

    thankss

  • @zainabbasmerchant9650
    @zainabbasmerchant9650 Před 2 měsíci +2

    Amazing. Thanks a lot

  • @excellencedove
    @excellencedove Před 3 měsíci +2

    Thanks so much, this was helpful

  • @AgusRiady
    @AgusRiady Před měsícem

    I can tell that you are not a designer from the KCC example app 😀
    But you are an amazing tutor! I get a lot of understanding about how to use Figma from this video compared to other Figma tutorials that I've seen before.
    Keep up the good work! 😊

  • @sathwik9661
    @sathwik9661 Před 3 měsíci +2

    Thank you bruh🙌🏼🙌🏼

  • @VICTORGITAU-do5oh
    @VICTORGITAU-do5oh Před 3 měsíci +2

    damn bro you're a lifesaver, thanks...really

  • @AbuAbdellah-rm1kj
    @AbuAbdellah-rm1kj Před 22 hodinami

    Thanks so much

  • @Victoriamcgruder
    @Victoriamcgruder Před 4 měsíci +2

    Great teaching style!

  • @FredRamses-ov9jg
    @FredRamses-ov9jg Před 2 měsíci +1

    what a beast, great work man!!

  • @SADEGEORGE
    @SADEGEORGE Před 3 měsíci +2

    Well explained! thank you

  • @murshidmoossa4921
    @murshidmoossa4921 Před měsícem +1

    Could you please also make a detailed video about Auto-layout and Style guides?

  • @scottyates9308
    @scottyates9308 Před 2 měsíci +2

    Thanks!

  • @mansoormasoudifard8624
    @mansoormasoudifard8624 Před 4 měsíci +2

    I learned so many things. thank you.

  • @BrantK147
    @BrantK147 Před 17 dny

    Great quick intro. Thanks!

  • @maggievitality9627
    @maggievitality9627 Před 4 měsíci +3

    Thank you

  • @saftbrain
    @saftbrain Před 5 měsíci +5

    You should make a video about how to use Ligma...

  • @naqvi2373
    @naqvi2373 Před 20 dny

    You Should rename the video title as " Free Figma Crash Course for Begineers " Wow.. Mind blowing
    keep it up man , subscribing ...
    please make more video for Figma
    Thankyou for your contents ..

  • @RicoMinovo
    @RicoMinovo Před měsícem

    Exceptionally well done. Thank you.

  • @hendyboy
    @hendyboy Před 4 měsíci +2

    Thank you so much sir for helping 🙏👍🇮🇳👏👏👏

  • @nimblerich
    @nimblerich Před měsícem

    Great overview of the basics! Thanks so much!

  • @NiyoushaAlerasoul
    @NiyoushaAlerasoul Před měsícem

    It was fantastic Kevin, words cant describe this tutorial.
    Thankss alot and one question, is there any specific course you have for Figma so I can sign up and participate in ?

  • @dumbignorantfool2353
    @dumbignorantfool2353 Před 25 dny

    Thank you!

  • @francesd26
    @francesd26 Před 4 měsíci +2

    How can I have access to the photos you used in this course?

  • @NauticalStrings
    @NauticalStrings Před 5 měsíci +2

    Hi Kevin, i have a question about the Google Sheet, I have a dropbox with Monday to Sunday, next to that i have a ''Label'' with the name ''Hours'' and next to that i have a ''Formula'' cell where i should see the Hours, Monday is 1 hour, Tuesday 2 hours and that up to Sunday 7 Hours, so when i click in the dropbox on Monday i want to see 1 hour in the ''Formula'' cell next to the Label ''Hours'', if i click on Tuesday 1 want to see ''2 Hours'', what video do i need to look at to learn how ?

  • @gadmugambi
    @gadmugambi Před měsícem +1

    Thanks a lot brother