How To Create A Table in Figma Easily With Auto-Layout. Simple Responsive Auto-Layout Table.

แชร์
ฝัง
  • เผยแพร่เมื่อ 26 ม.ค. 2025

ความคิดเห็น • 69

  • @besim3916
    @besim3916 ปีที่แล้ว +12

    Thanks so much. One recommendation: often times you use keyboard shortcuts without mentioning it. There are some screen recording software that automatically shows what keys you press so that you don't have to mention it. I'm still new in Figma so if those shortcuts would show up on the screen as you talk that would help a lot.

    • @femijohn
      @femijohn  11 หลายเดือนก่อน +3

      Thank you so much for this. I will be conscious of this next time I am making a video. I appreciate you.

  • @hannahmaccamoo
    @hannahmaccamoo ปีที่แล้ว +2

    Your tutorials are brilliant - so clear and easy to follow. Much better than any of the tutorials coming from Figma themselves. You've got me out of a couple of tricky situations, thank you! You should have sooooo many more likes :-)

    • @femijohn
      @femijohn  ปีที่แล้ว

      Glad you like them! I am so happy to hear this. 😊

  • @bashirmoruf4949
    @bashirmoruf4949 ปีที่แล้ว +2

    This is beginner's friendly having watched various video on responsive table. Kudos!!

    • @femijohn
      @femijohn  ปีที่แล้ว

      You're Welcome

  • @ferdausalamsyah1600
    @ferdausalamsyah1600 2 หลายเดือนก่อน

    Wow this is very nice trick....
    creating Head and body component is nice.. i am doing manual all this time... and very effort when changing the style 😂
    Thanks for sharing

  • @elenamikhaylova5086
    @elenamikhaylova5086 8 หลายเดือนก่อน +1

    this is exactly what i needed, thank you! soooo informative and helpful. I'm new to Figma and I feel like i learned so much in this short video

    • @femijohn
      @femijohn  7 หลายเดือนก่อน

      Glad it was helpful!

  • @annisaautami
    @annisaautami 8 วันที่ผ่านมา

    this is very helpful! thank you so much

  • @tomashudolin7197
    @tomashudolin7197 ปีที่แล้ว +2

    What shortcut did you press at the begining before creating the component from table header? Because after that the padding was also set. Thank you.

  • @ademuyiwaoluwanifemi7273
    @ademuyiwaoluwanifemi7273 ปีที่แล้ว +1

    Femi You are the man !!!.. Great tutorial. Thank you for doing this

    • @femijohn
      @femijohn  ปีที่แล้ว

      You're Welcome

  • @תמרתבור
    @תמרתבור ปีที่แล้ว +2

    I couldn copy and paste the row as you did in 09:01.
    Even in your template i couldnt replexate what you did... it doesnt paste each cell under the frame i copied it from but puts them all outside of the frames in one level

    • @sheilaudobong3095
      @sheilaudobong3095 ปีที่แล้ว

      exactly me too @thefemijohn

    • @vladislavkolpakov8066
      @vladislavkolpakov8066 ปีที่แล้ว

      @thefemijohn yaeh, dude, how did you do that?

    • @MANUMS-ej5tn
      @MANUMS-ej5tn 7 หลายเดือนก่อน

      cmd + D would do the trick. As its auto layout, it would paste right below the row

  • @vladislavkolpakov8066
    @vladislavkolpakov8066 ปีที่แล้ว +2

    Mate, how did you paste the row in 09:01? I insert it somewhere into the table itself, and not exactly below. How did you do that?

    • @ratunahrisa4590
      @ratunahrisa4590 11 หลายเดือนก่อน

      I'm not sure, but perhaps ctrl+D (duplicate)? because it is inside auto layout so it is going underneath right away

  • @sunnytheys
    @sunnytheys ปีที่แล้ว

    Hi there! Your video helped me out a lot!! Thank you so much!! :D
    Commenting to boost the algorithm!! :)

  • @taiwoakinkunmi3445
    @taiwoakinkunmi3445 หลายเดือนก่อน

    Great Video,...Thank You !

  • @aniebietoluwa
    @aniebietoluwa ปีที่แล้ว +1

    Impressive video! You made it look effortless. Inspired to try it out myself! Well done
    🙌

    • @femijohn
      @femijohn  ปีที่แล้ว

      Thank. Please let me know if it was easy to implement

  • @TheChefAine
    @TheChefAine ปีที่แล้ว +1

    Thank you for this! I watched it to the end😊. Very helpful

    • @femijohn
      @femijohn  ปีที่แล้ว

      I’m glad! ❤️

  • @boby7616
    @boby7616 หลายเดือนก่อน +1

    Thank you puja kamu sangat membantu

  • @aarthypalanivelu6393
    @aarthypalanivelu6393 6 หลายเดือนก่อน

    Thanks It really helped, If we want to align both header and table data in a same imaginary line how can we do that? Rightnow data is centered, How can we make it left aligned with fill container setting?

  • @vermaankit429
    @vermaankit429 6 หลายเดือนก่อน +2

    How are you dragging the table head into a frame. I see some arrows are coming when you are pulling from some frame

    • @Notaprogolfer
      @Notaprogolfer 3 หลายเดือนก่อน

      press down on alt.

  • @PuspitaB-v9t
    @PuspitaB-v9t 4 หลายเดือนก่อน +1

    Thank you so much for the video..

    • @femijohn
      @femijohn  4 หลายเดือนก่อน

      You are most welcome

  • @annak7905
    @annak7905 2 หลายเดือนก่อน +1

    Thank You!!!

    • @femijohn
      @femijohn  2 หลายเดือนก่อน

      You're welcome!

  • @uiuxclinic
    @uiuxclinic ปีที่แล้ว +1

    This was very helpful. thank you!

    • @femijohn
      @femijohn  ปีที่แล้ว

      You’re welcome

  • @PaulJaredBrooksTop50
    @PaulJaredBrooksTop50 ปีที่แล้ว +1

    Great stuff, thanks so much!

    • @femijohn
      @femijohn  ปีที่แล้ว

      Glad it was helpful!

  • @darrenjonathan3923
    @darrenjonathan3923 ปีที่แล้ว +1

    when i copied the table head and put it outside the frame, why the cell style options doesnt appear?

  • @DeanWentzel
    @DeanWentzel ปีที่แล้ว

    You made my day, how easy was that to make, tx

    • @femijohn
      @femijohn  11 หลายเดือนก่อน

      You're welcome

  • @stepanbersin5516
    @stepanbersin5516 ปีที่แล้ว

    Hey, nice work. But how you merge columns for one row and same to rows?

  • @valuevolt
    @valuevolt 3 หลายเดือนก่อน

    Thank you for this video

  • @kishorekumarseenivasan
    @kishorekumarseenivasan 7 หลายเดือนก่อน +1

    hey kudos to you bro 👏

    • @femijohn
      @femijohn  7 หลายเดือนก่อน

      Thanks 🙏

  • @zandyy277
    @zandyy277 11 หลายเดือนก่อน

    So good bro, can tou Tutorials make how to add user in then tablet, manage user

  • @umangapokharel0908
    @umangapokharel0908 8 หลายเดือนก่อน +1

    this is what i am looking for

  • @matthewolukoju1246
    @matthewolukoju1246 ปีที่แล้ว +1

    This is an interesting approach, but how do you solve the interaction issue. Hover, pressing and selected state in this case.

    • @femijohn
      @femijohn  ปีที่แล้ว +1

      Good question, I actually use a different approach when trying to achieve that. For this you only use the actual button

    • @_matthewola
      @_matthewola ปีที่แล้ว

      Interesting! @@femijohn

  • @dong3599
    @dong3599 ปีที่แล้ว +1

    3:24 How to shot cut bring-in

    • @Prhaizze
      @Prhaizze 27 วันที่ผ่านมา

      Hold the options/alt key and drag.

  • @TheRealHouji
    @TheRealHouji 11 หลายเดือนก่อน

    where's the link for the icon?

  • @revihasbi682
    @revihasbi682 3 หลายเดือนก่อน +1

    its good, until you fill the table with longer text,

    • @femijohn
      @femijohn  3 หลายเดือนก่อน

      When you setup your first row or colums. set the width to hug content. that way it expands as the text grows. As set the entire table frame to hug content. 👍🏼

  • @bobbyaxelrod7983
    @bobbyaxelrod7983 ปีที่แล้ว +3

    You use keyboard shortcuts but never mention

  • @MorayoEgbayelo
    @MorayoEgbayelo ปีที่แล้ว +1

    How did you add the icons?

  • @jedrowe3943
    @jedrowe3943 6 หลายเดือนก่อน +1

    Great video :)

    • @femijohn
      @femijohn  6 หลายเดือนก่อน

      Glad you enjoyed it

  • @catthepink5298
    @catthepink5298 4 หลายเดือนก่อน

    tks bro

  • @hussnainraza4483
    @hussnainraza4483 3 หลายเดือนก่อน

    Bro ____ 💝

  • @joyceshaba1104
    @joyceshaba1104 7 หลายเดือนก่อน +1

    Longtime femi 😁

    • @femijohn
      @femijohn  7 หลายเดือนก่อน

      😅 How’ve you been?

  • @AS-sp7kx
    @AS-sp7kx 6 หลายเดือนก่อน +1

    Nice!

    • @femijohn
      @femijohn  6 หลายเดือนก่อน

      Thank you

  • @Goguma-z
    @Goguma-z ปีที่แล้ว +3

    this is quite difficult

  • @ahmedmahdy9702
    @ahmedmahdy9702 ปีที่แล้ว

    Thank you

    • @femijohn
      @femijohn  ปีที่แล้ว

      You’re welcome 🙏