How to create Roblox Guis using Figma!

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

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

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

    I was using figma to make roblox UI's but i got no idea this plugin exists, lov u🙏😭

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

      I'm happy to hear someone else has already been using Figma! I feel like it's quite uncommon. Hope the plugin helps!

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

    Good to see Figma getting a shoutout. I am happy you're making your own version of the plugin. For more complex GUIs, there's a lot of fixing you'll need to do to your exported UI with the old plugin. Keep it up!!

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

    I always created Ui's in Roblox and asked myself how other Uis could look so good just in the same programm. But Figma helps me a lot now everything is so much easier, adding gradient, depth, glow and stuff. Thank you for this video since it helped me a lot!

  • @BossGamingYT-Live
    @BossGamingYT-Live 7 месяцев назад +6

    LOVE your content
    Thanks for this website!!!

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

      I'm happy to hear! :D Hope you enjoy it!

    • @Neoxa7
      @Neoxa7 7 месяцев назад +1

      thanks for the plugin bro not website

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

    nice video, i appreciate your content!

    • @MonzterDEV
      @MonzterDEV  7 месяцев назад +1

      Glad you enjoy it!

  • @user-tonnum-51s
    @user-tonnum-51s 6 месяцев назад +4

    so helpful thanks! :D

  • @musembifamily1318
    @musembifamily1318 7 месяцев назад +1

    i have looked so much and i have never seen a good figma tutorial and also you should have named complete begginer guide to figma

    • @MonzterDEV
      @MonzterDEV  7 месяцев назад

      I'm happy to hear!! I plan on creating a short series on creating UIs with Figma eventually!

    • @TypicalGameDeveloper
      @TypicalGameDeveloper 6 месяцев назад

      @@MonzterDEV Don't

  • @Mr_cactus871
    @Mr_cactus871 7 месяцев назад +1

    Wow rly amazing!!!!!

  • @JdjdjdJdjsjsj-h6k
    @JdjdjdJdjsjsj-h6k 7 месяцев назад +1

    ty for the video :)

  • @Ollie-j6l
    @Ollie-j6l 4 дня назад

    Bro i need some serious help. It completely messed up my UI forcing me to delete all of the UIstrokes and there was no drop shadows that i made. My UI looked professional in figma but complete trash in studio. Please help.

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

    I haven’t used figma, but from what I see, if you’d like to make more advanced GUI/Logos I think it’s better to use photopea or photoshop.

    • @MonzterDEV
      @MonzterDEV  7 месяцев назад

      I'd say that those tools server a different purpose, but either works

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

      Wrong. Figma is the industry standard for UI design. Source: professional game designer

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

    Hello! im having hard time to understand you are putting shadows and design on your button how you do it? i tried to make a shadow for my buttons

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

    help when i download the screen gui it did look upside down when i paste it in studio

  • @DevOriginalLukas
    @DevOriginalLukas Месяц назад +3

    Figma is the best free tool to make gui (in my opinion)

  • @byronsagod2208
    @byronsagod2208 7 месяцев назад

    Goated

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

    idk why but when i import it to roblox studio it doesn't appears

    • @Ollie-j6l
      @Ollie-j6l 4 дня назад

      Make sure its in a screenGUI

    • @Lolgys
      @Lolgys 4 дня назад

      @@Ollie-j6l It is

  • @lukqaz
    @lukqaz 7 месяцев назад +1

    Yay

  • @Forlornicus
    @Forlornicus 7 месяцев назад +23

    sorry but im gonna keep using roblox ui its way quicker for me

    • @MonzterDEV
      @MonzterDEV  7 месяцев назад +6

      Whatever works!

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

      You can def plan a layout for your UI way better with Figma / Photoshop. It's way easier to make a design by dragging and dropping rather than making a design on the platform itself imo, similar to web design, it's annoying to code a design and plan that at the same time rather than designing a layout first then code what you made

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

      @@itsLozCS i dont use roblox anymore i make software and program stuff roblox is too easy

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

    ok cool, when are u making a game with personality.

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

    considering all the sizes are offsets, is there a way to autoscale for different devices withought a module?

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

    Second comment and I get alot more. I saw you on the figma to roblox plugin page in the forums so I wanted to ask you directly because I'm stuck. I used several images in figma for backgrounds and such and I would like to know how to import the images as well. As of now, when I attempt to import, it gets the general shapes and colors and works perfectly for frames without images, but for images they simply dont upload. On the forums i saw something about uploading assets via opencloud api and i don't know how to do that.
    Any help would be appreciated alot. Thanks.

  • @Blood_Streams
    @Blood_Streams 7 месяцев назад

    Lunacy is also very good and it's very similar to figma

    • @MonzterDEV
      @MonzterDEV  7 месяцев назад

      I'll have to check it out!

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

    hi, thank you for updating the plugin! Any idea why, if you use components in Figma. The plugin will import them on Roblox as an image with the URL "undefined" instead of a frame and without its children elements? Also, if you detach the instance before using the plugin, it will work fine. Thank you again! :)
    Edit: Here is a quick workaround I found, I found a Figma plugin called "DETACH THEM ALL" to detach all the component in the selected frame and its children. So I use it, then export my design, then I Ctrl+z to make the frames components again. Also, if I forget to Ctrl+z right away, there is a plugin named “Reattach instances” to do it.

  • @OverThere95
    @OverThere95 7 месяцев назад +1

    are u gonna continue the obby tutorial series?

    • @MonzterDEV
      @MonzterDEV  7 месяцев назад +1

      Yup! Every Friday :D

    • @OverThere95
      @OverThere95 7 месяцев назад +1

      @@MonzterDEV nice! i'm so excited for this series!

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

    Cartoon Guis are massively trash talked by most of the dev community lmao
    But this is a good tutorial

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

    Can you link the module you talked about in the video that makes the UI appear the same for all platforms?

  • @ShortyJustin
    @ShortyJustin 7 месяцев назад

    love you

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

    AYYYYYYY FIGMA!!! AMAZING VIDEO (PING ME 👀👀👀👀)

    • @RyanEXElol
      @RyanEXElol 7 месяцев назад

      I will, but what is your discord username?

    • @MonzterDEV
      @MonzterDEV  7 месяцев назад

      Thanks!!

    • @DevV1ktor
      @DevV1ktor 7 месяцев назад

      @@MonzterDEV No problem! 🔥

    • @DevV1ktor
      @DevV1ktor 7 месяцев назад

      @@RyanEXElol I meant it for the RUclips comment 😭

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

    Your plugin doesn't work. fix it?

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

    What is better? Photoshop/Photopea or Figma (I prefer Photoshop/Photopea but it's just an opinion)

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

      I prefer Photopea, even over Photoshop for image work like Thumbnails, but Figma is absolutely king for UI design (both for Roblox or website design).

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

      ​@@MonzterDEVDon't mention the KING.

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

      @@MonzterDEV But isnt easier to work with photoshop?

  • @-Less-
    @-Less- 6 месяцев назад

    Would you be able to import a looped animation into Roblox studios?

  • @user-tonnum-51s
    @user-tonnum-51s 6 месяцев назад

    but how to get that plugin: "figma to roblox fork"?

  • @Pro123-xg7gw
    @Pro123-xg7gw 4 месяца назад

    Cool

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

    whats figma!!! i just use studio and make stuff like this sure it takes an extra hour 😭

  • @ice-waterrrr
    @ice-waterrrr Месяц назад

    figma deez

  • @BuraksMemesVlogsAndAnimeツ
    @BuraksMemesVlogsAndAnimeツ 7 месяцев назад

    I wanna show a major mistake making Guis:
    Someone putting arrow instead of ‘’’’.
    Some putting cross instead of ‘’X’’ or ‘’x’’.

  • @hugosnipurr1841
    @hugosnipurr1841 7 месяцев назад +1

    Ya

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

    using sigma 🤓👆

  • @ChikmenComments
    @ChikmenComments 7 месяцев назад

    pls make sword fighting sim next!!!

    • @MonzterDEV
      @MonzterDEV  7 месяцев назад

      Hey, I don't have plans of that, sorry!

    • @ChikmenComments
      @ChikmenComments 7 месяцев назад

      @@MonzterDEV oh, it’s alr!

  • @Luxex1
    @Luxex1 6 месяцев назад

    Can i ask why my guis is invisible? In roblox studio

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

    how i get the plugin ?

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

    Sigma

  • @Bing3107
    @Bing3107 7 месяцев назад

    Hey would it will be cool if you make a game like strongman simulator by the gang gaming?

    • @MonzterDEV
      @MonzterDEV  7 месяцев назад

      Hey, I don't have plans of that, sorry!

    • @Bing3107
      @Bing3107 7 месяцев назад

      @@MonzterDEV Try your best if you can

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

    Are you good at building? I really want help

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

      Not in the slightest 😭🤣

  • @Neoxa7
    @Neoxa7 7 месяцев назад

    Hey can you make an Prophunt game tutorial

    • @MonzterDEV
      @MonzterDEV  7 месяцев назад

      Hey, I don't have plans of that, sorry!

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

    At this point just learn Roblox studio its way easier.

    • @Vo3pal
      @Vo3pal День назад

      Not as good as roblox, figma allows more creativity than roblox

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

    figma ❌
    sigma ❌
    ligma ✅

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

    it says undefined.

  • @musembifamily1318
    @musembifamily1318 7 месяцев назад

    6:32 how did he insert that image

    • @MonzterDEV
      @MonzterDEV  7 месяцев назад

      You can copy and paste the image into the Guis frame. Look under the Fill property and it has the color displayed. The image will be put under the Fill property.

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

    erm what the figma

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

    Figma? More like Ligma

  • @duhv2
    @duhv2 7 месяцев назад

    hey!. can you make a tutorial make a bee swarm simulator game?

    • @MonzterDEV
      @MonzterDEV  7 месяцев назад +1

      Hey, I don't have plans of that, sorry!

    • @duhv2
      @duhv2 7 месяцев назад

      @@MonzterDEV its okay, btw i love your vids

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

    “Buhns”

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

    is it free

  • @BossGamingYT-Live
    @BossGamingYT-Live 7 месяцев назад

    11:55 What happened???

  • @ima_monkeh
    @ima_monkeh 7 месяцев назад

    How do u make a scrolling guide in figma?

    • @MonzterDEV
      @MonzterDEV  7 месяцев назад

      I usually make a 'fake' scrolling frame. Basically, just add a vertical line to represent the scroll bar and then create a container frame beside it and store all my usual stuff in there.

    • @ima_monkeh
      @ima_monkeh 7 месяцев назад +1

      Ok thank you for helping 🤗

  • @boblox_studio_dev
    @boblox_studio_dev 6 месяцев назад

    figma balls
    (the rot consumes)

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

    L FIGMA LLLLLLLLLL

  • @LucasDoorsBlox
    @LucasDoorsBlox 6 месяцев назад

    just one letter a way to spell sigma

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

    you are bad with UI's.