Figma Tutorial for Beginners

Поделиться
HTML-код
  • Опубликовано: 7 янв 2025

Комментарии •

  • @KevinStratvert
    @KevinStratvert  9 месяцев назад +21

    ⚡ Get Figma: psxid.figma.com/lqjg97licpry

  • @crazycatlady-overwatchpowe1111
    @crazycatlady-overwatchpowe1111 8 месяцев назад +66

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

    • @imnotbinarydragon
      @imnotbinarydragon 3 месяца назад +2

      Hello! Наистина ли ме разбираш?! Здрасти!

  • @liamlg1314
    @liamlg1314 8 месяцев назад +43

    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!!

  • @muzammilmunir6025
    @muzammilmunir6025 4 месяца назад +78

    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 ❤️❤️

    • @abhinavc4332
      @abhinavc4332 3 месяца назад +2

      what is a software engineer doing inside figma😂

    • @manavt2000
      @manavt2000 3 месяца назад

      @@abhinavc4332 learning design to create better products

    • @Abhi-Mithoo
      @Abhi-Mithoo 3 месяца назад

      @@abhinavc4332 Bruhhh :)

    • @Harsh-le3dg
      @Harsh-le3dg 2 месяца назад +1

      He is in Pakistan and trying to learn something else that itself is a big thing 😅

    • @schowz3494
      @schowz3494 2 месяца назад +7

      @@abhinavc4332 you are not gonna start a project with no designs????

  • @camilomoreno8203
    @camilomoreno8203 День назад +1

    I do not usually comment on RUclips, but I am taking the time to thank you and say how much I appriciate this video and its content, incredible creator!

  • @andyvaldez212
    @andyvaldez212 6 месяцев назад +31

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

  • @Devbep
    @Devbep 5 месяцев назад +15

    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.

  • @lumptoast
    @lumptoast Месяц назад +4

    Dude when it comes to instructing, you have a gift. You made this sooooo easy for me to understand. THANK YOU!!!

  • @promisenwanno5969
    @promisenwanno5969 8 месяцев назад +23

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

  • @AnishKutty-q1c
    @AnishKutty-q1c 3 месяца назад +1

    Crisp > Quick > Simple to understand. One of the finest tutorials I have come across. Thanks Kevin!

  • @scottyates9308
    @scottyates9308 6 месяцев назад +5

    Thanks!

  • @MichaelFiguresItOut
    @MichaelFiguresItOut 2 месяца назад +1

    This is exactly what I was looking for in trying to learn Figma to design an app. After I watched it I went back to add this comment and was confused. I thought the tutorial was 20 mins. That's how good it is! It felt much shorter than it really was but gave all info needed!

  • @n8tr0nweb3
    @n8tr0nweb3 5 месяцев назад +5

    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!

  • @PeartSoda
    @PeartSoda 2 месяца назад +1

    I've looked at a few demo videos about Figma, and this is by far the best one I've found. Thank you so much for your clarity and simplicity as you give this tutorial.

  • @murshidmoossa4921
    @murshidmoossa4921 5 месяцев назад +5

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

  • @EdsonNascimentoEN
    @EdsonNascimentoEN 8 месяцев назад +6

    Great tutorial Kevin - as always you rock.

  • @Atulwebdesigner
    @Atulwebdesigner 7 месяцев назад +11

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

  • @schowdhary051180
    @schowdhary051180 4 месяца назад +3

    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.

  • @archangel0137
    @archangel0137 9 месяцев назад +16

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

  • @Krishnabasak-et3cd
    @Krishnabasak-et3cd День назад

    Thanks I'm 21 years old and I do love creating art but I want to move something professional and I landed on your video it's helped me ❤

  • @mrs.nadiakay
    @mrs.nadiakay 2 месяца назад +1

    What a great tutorial video! I just started a new job which requires me to use Figma most of the time. I didn't have any experience with the software before. This video really helps a lot. Thanks so much!

  • @Donto-h3u
    @Donto-h3u 4 месяца назад +1

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

  • @melanyartz7565
    @melanyartz7565 9 месяцев назад +9

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

  • @kingking8407
    @kingking8407 Месяц назад +2

    Thanks, sir. You are a Brilliant Software engineer

  • @assahmalios4486
    @assahmalios4486 21 день назад

    Bro your contents are the best. It takes forever to cover topics in a semester but here, it took me only less than an hour to grasped your contents. RUclips university the best!!

  • @calabert
    @calabert Месяц назад +1

    Very grateful. You're a great teacher, explaining slowly and repeating. Thx!

  • @mferreira1231
    @mferreira1231 6 месяцев назад +2

    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!

  • @refaelPe
    @refaelPe 6 месяцев назад +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!

  • @NZbound2024
    @NZbound2024 3 месяца назад +2

    Excellent job with this. I have viewed a bunch of different training videos on Figma, and by far you do the best job. I am just looking for more from you on Figma. I don't see more in the play list or on a search. I really want to learn more than just the basics.

  • @otienooliver9557
    @otienooliver9557 9 месяцев назад +8

    From Kenya love what you are doing

  • @willwill1738
    @willwill1738 6 месяцев назад +5

    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!!!

  • @alexisk5978
    @alexisk5978 Месяц назад

    when I say, you are literally one of the greatest teachers ever! THANK YOU !!!

  • @ahamednafees9961
    @ahamednafees9961 18 дней назад

    Really extensive tutorial under 80 mins, as a web dev this gonna help me a lot

  • @Itsaxan
    @Itsaxan Месяц назад +1

    Took me like 5 tutorials to get to a good one, this is great. Thanks!

  • @facundofroschauer2750
    @facundofroschauer2750 2 месяца назад

    I rarely left comments, but this tutorial was absolutely brilliant. It would have saved me hours on my wireframing assignments if I would watch it before XD. Thanks a lot Kevin!

  • @HasnainChess
    @HasnainChess 9 месяцев назад +5

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

  • @rashinilakshika480
    @rashinilakshika480 5 дней назад

    I am a beginner to Figma... This video is more helpful to me💗. Please upload more videos about this..

  • @Rockerfeller26
    @Rockerfeller26 7 месяцев назад +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.

  • @Marlena-n2o
    @Marlena-n2o 2 месяца назад

    This is the best tutorial for Figma beginners like me. I got so much out of the video. Thank you so much. You’re a great instructor!

  • @vatalkswithlia2500
    @vatalkswithlia2500 20 дней назад

    Omg! I am from the Philippines and been watching your videos! This is super helpful! No need for me to enroll to an online course for figma, you explained everything very well!!! Thank You!

  • @luisafernandabautista2540
    @luisafernandabautista2540 4 месяца назад

    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 !!

  • @robpannoni9260
    @robpannoni9260 2 дня назад

    Excellent tutorial. Just the right level of detail for getting started. Subscribed.

  • @MOUSTAPHADIALLO-f7c
    @MOUSTAPHADIALLO-f7c 4 дня назад

    Thank you so much it's very well explained, you're one of the best guys in youtube, you deserve a subscription

  •  4 месяца назад +2

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

  • @quicker.z
    @quicker.z 2 месяца назад +1

    This is such a well designed tutorial! Thank you for sharing your design skills with us!

  • @chukwuemekandiukwu1220
    @chukwuemekandiukwu1220 2 месяца назад +1

    Thank you so much. You are the best teacher ever.

  • @davisopiyo1961
    @davisopiyo1961 Месяц назад +1

    Easy to understand & practise tutorial, thank you Kevin !

  • @theekg8445
    @theekg8445 8 месяцев назад +3

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

  • @sondosemaad8406
    @sondosemaad8406 4 месяца назад +2

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

  • @van_creative
    @van_creative 2 месяца назад

    Thank you, thank you! You're an excellent teacher. One of the best Figma tutorials I've seen

  • @John-hi8rd
    @John-hi8rd Месяц назад +1

    Thank you a lot for sharing this! Have a good day!

  • @carltonchen2692
    @carltonchen2692 4 месяца назад +2

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

  • @brittgardner3135
    @brittgardner3135 3 месяца назад +1

    Wow, that was so comprehensive and helpful. I needed to have a basic understanding of FIGMA and this was certainly the best video that I could have watched. Thank you!

  • @maameafia262
    @maameafia262 2 месяца назад

    Perfect video that contains all the necessary things to know in Figma! Helped me ALOT. Thanks a bunch.

  • @oseikwamejones9019
    @oseikwamejones9019 19 дней назад

    Thanks for this tutorial. I am confident in figma now. Except few UI changes, this content is top notch and easy to understand as well as follow.

  • @ma.lizaacosta3901
    @ma.lizaacosta3901 4 месяца назад

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

  • @fedhasayelmachew7510
    @fedhasayelmachew7510 6 месяцев назад +2

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

  • @Pazzzooo628
    @Pazzzooo628 20 дней назад

    please make another video like this like a part 2 or diving more into figma 😭 this video was too good . huge thank youuu

  • @KasiaMalad-md3td
    @KasiaMalad-md3td 7 месяцев назад +3

    The best ever tutorial. Thanks Kevin. Great job!

  • @ankurchauhan1151
    @ankurchauhan1151 Месяц назад +1

    extremely brilliant...❤ Love from India...

  • @ShayJohnson
    @ShayJohnson 9 часов назад

    Thank you so much for creating this video. It was definitely needed. Very helpful!

  • @karencohn5382
    @karencohn5382 7 месяцев назад +3

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

  • @SibabalweJantjies-zu8bg
    @SibabalweJantjies-zu8bg 6 месяцев назад +4

    Wow man, I'm impressed.

  • @his_seed_dena
    @his_seed_dena 15 дней назад

    This is sooo detailed and understandable... God bless you for such information and your time...

  • @pysco11
    @pysco11 6 месяцев назад +2

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

  • @KUSHQID
    @KUSHQID 6 месяцев назад +4

    I enjoyed every moment learning from this tutorial. Thankyou

  • @TonyReamer
    @TonyReamer 4 месяца назад +1

    Thank you for the training video. All has gone well until timestamp 1:07:23. I can create Prototype Interactions from the Location button to the Locations frame. Similarly, I can create an Interaction between the Cart button and the Cart frame. However, I'm unable to create an Interaction between the Home button and the Home screen frame. The Navigation pull down in the Interaction dialog box has Home screen greyed out and below a line. I've tried several online resources but have been unable to address this issue. Do you have any recommendations?

    • @brwasalih
      @brwasalih 3 месяца назад

      i have exactly the same issue

  • @kenzakisouda470
    @kenzakisouda470 2 месяца назад

    Definitely a great beginner tutorial for those who wants to get some comprehensive insight on how figma works.

  • @leishavignesh5917
    @leishavignesh5917 10 дней назад

    Great video my brother.. Appreciate your help on this! Best ever video!

  • @zaynabali5649
    @zaynabali5649 7 месяцев назад +3

    Greetings from Somalia🥰
    and really love your contents

  • @adinam7597
    @adinam7597 6 месяцев назад +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.

  • @HarshanH-u9u
    @HarshanH-u9u 6 месяцев назад +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.

  • @BarlasPehlivan
    @BarlasPehlivan 12 дней назад

    Perfect tutorial! Congratulations 🙌

  • @mohebadeeb.sharelife
    @mohebadeeb.sharelife 2 месяца назад

    38:07 Why did not you import your needed symbols from unsplash - for example?
    I mean, why do you draw every element?

  • @haimmadmon3531
    @haimmadmon3531 4 месяца назад +11

    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 🙂

  • @jewels9263
    @jewels9263 5 месяцев назад

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

  • @JamesClarke-j7r
    @JamesClarke-j7r 2 месяца назад

    Wow! Today I was the best day. thanks for the Education.. I have learn Something New..

  • @madinadaoud4477
    @madinadaoud4477 4 месяца назад

    Words can't describe my gratitude.

  • @mahasiswago
    @mahasiswago 6 месяцев назад +2

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

  • @laurapandjatcharam
    @laurapandjatcharam 4 месяца назад +1

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

  • @boaznire
    @boaznire 2 месяца назад

    You are an excelent teacher, thank you so much!!! I will recommand this video and your channel to my friends.

  • @VaibDesigner
    @VaibDesigner 7 месяцев назад +2

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

  • @jthrilla84
    @jthrilla84 24 дня назад

    This was the perfect tutorial for me! The only thing that really slowed me down was navigating around Figma since my layout was different from yours. Im pretty sure there's a way to move certain thing around in figma and of course learning the shortcuts over time. But overall, this tutorial was 10/10. Thanks!

  • @tyebapapry4153
    @tyebapapry4153 15 дней назад

    Thank u sooo much for teaching Figma this much easier way for us.

  • @NkeudumJessie
    @NkeudumJessie Месяц назад

    wow your too good sir my understanding of figma is well defined now🥰 sir.From Cameroon

  • @ShahdarShah
    @ShahdarShah 15 дней назад

    hey, that's a fantastic and concise intro to figma. thank you so much

  • @jesduke1
    @jesduke1 21 день назад

    Waw very rich content, this is exactly what i need to complete my end of sem project...thank you

  • @TusharS-p2n
    @TusharS-p2n 7 месяцев назад +4

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

  • @DataPunkStudios
    @DataPunkStudios 4 месяца назад +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 3 месяца назад

      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 3 месяца назад

      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!

  • @ImpureForce
    @ImpureForce 7 месяцев назад +2

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

  • @SolanaIV
    @SolanaIV 2 месяца назад

    you're the best I've watched so far man! Thank you!

  • @LethibeAgency
    @LethibeAgency 2 месяца назад

    You are an amazing, teacher!

  • @elenikappa149
    @elenikappa149 19 дней назад

    Excellent and I mean EXCELLENT video tutorial 😮

  • @krutivohra8985
    @krutivohra8985 6 месяцев назад +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.

  • @KtdmThan
    @KtdmThan 2 месяца назад

    Thank you so much for this amazing informed tutorial.

  • @Harihar129
    @Harihar129 2 месяца назад

    This is a great video to give a new user a headstart into the world of FIGMA. Very Userful! Thank you!

  • @HunterZolomon
    @HunterZolomon 3 месяца назад

    Very well done. Packed with info in just over an hour. Thanks!

  • @Eyan_Nla
    @Eyan_Nla Месяц назад

    Great video. Thanks Kevin! 🙌👏

  • @tibibara
    @tibibara 6 месяцев назад +2

    Great Tutorial Kevin, Thanks!

  • @Fatemeh_hp30
    @Fatemeh_hp30 22 дня назад

    Thank you so much! Your video really helped me; it kind of saved me