How to create Roblox Guis using Figma!

Поділитися
Вставка
  • Опубліковано 26 січ 2025

КОМЕНТАРІ •

  • @ChrisisRoblox
    @ChrisisRoblox 10 місяців тому +27

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

    • @MonzterDEV
      @MonzterDEV  10 місяців тому +3

      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 8 місяців тому +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 6 місяців тому +5

    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!

  • @seraphin0_
    @seraphin0_ 25 днів тому

    Man you are a blessed guy, thank you for this tutorial, I use Figma for a lot of things and then I started using Roblox Studio to create some projects, you just saved me time!

  • @BossGamingYT-Live
    @BossGamingYT-Live 10 місяців тому +6

    LOVE your content
    Thanks for this website!!!

    • @MonzterDEV
      @MonzterDEV  10 місяців тому +2

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

    • @Neoxa7
      @Neoxa7 10 місяців тому +1

      thanks for the plugin bro not website

  • @nightxzz2
    @nightxzz2 10 місяців тому +5

    nice video, i appreciate your content!

    • @MonzterDEV
      @MonzterDEV  10 місяців тому +1

      Glad you enjoy it!

  • @supervermillion6729
    @supervermillion6729 4 дні тому

    Goated material, thank you

  • @ElixerHD
    @ElixerHD 2 місяці тому +1

    Nice Video bro!

  • @ki_rxaa
    @ki_rxaa 23 хвилини тому +1

    when i export my ui looks all weird and the font is weird too

  • @user-tonnum-51s
    @user-tonnum-51s 9 місяців тому +4

    so helpful thanks! :D

  • @pun9052
    @pun9052 Місяць тому

    good to know. i used to create gui in paint3d and then put the png in my game and then create gui over it using the png as a reference

  • @musembifamily1318
    @musembifamily1318 10 місяців тому +2

    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  10 місяців тому

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

    • @TypicalGameDeveloper
      @TypicalGameDeveloper 9 місяців тому

      @@MonzterDEV Don't

  • @nevyinnincymedia6032
    @nevyinnincymedia6032 День тому +1

    Bro your extenstion is not working it shows plain white

  • @Cactus-d5f
    @Cactus-d5f 10 місяців тому +1

    Wow rly amazing!!!!!

  • @nanPichi
    @nanPichi 2 місяці тому +2

    Can you teach us how to do it using Ligma?

  • @atlathic
    @atlathic 2 місяці тому +1

    hey, so i am currently using it, works amazing, but when i try to export it, it says multiple fills r selected meanwhile i only selected the frame. how do i fix this? also, i want to use a scrolling tab but idk how to do that aswell.

  • @qwertystone
    @qwertystone 3 місяці тому +2

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

  • @NoLifeGuyFR
    @NoLifeGuyFR 10 місяців тому +1

    ty for the video :)

  • @Mazen4Gamer
    @Mazen4Gamer 5 місяців тому +1

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

  • @55screations
    @55screations 15 днів тому

    i need help ik im a bit late but when i put my ui into roblox stuido it becomes to big and idk how to fix it.

  • @Levi_CG
    @Levi_CG 15 днів тому

    what if i accidentally deleted figma basics file...

  • @Tir5d.Turtle
    @Tir5d.Turtle 7 днів тому

    does it use scale or offset for sizes and positions?

  • @OverThere95
    @OverThere95 10 місяців тому +1

    are u gonna continue the obby tutorial series?

    • @MonzterDEV
      @MonzterDEV  10 місяців тому +1

      Yup! Every Friday :D

    • @OverThere95
      @OverThere95 10 місяців тому +1

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

  • @cheetahrbx4575
    @cheetahrbx4575 10 місяців тому +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  10 місяців тому

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

    • @IceWinder
      @IceWinder 9 місяців тому +2

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

  • @beemoRBX
    @beemoRBX 4 місяці тому

    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

  • @eugenioiii398
    @eugenioiii398 Місяць тому

    what should be the rize of the Frame 1280x720 or 1980x1080p

  • @Ollie-j6l
    @Ollie-j6l 3 місяці тому

    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.

  • @BadKD
    @BadKD 6 місяців тому

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

  • @pomarotte2678
    @pomarotte2678 8 місяців тому

    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.

  • @amara7734
    @amara7734 6 місяців тому

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

  • @-Less-
    @-Less- 9 місяців тому

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

  • @Lolgys
    @Lolgys 6 місяців тому +3

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

    • @Ollie-j6l
      @Ollie-j6l 3 місяці тому

      Make sure its in a screenGUI

    • @Lolgys
      @Lolgys 3 місяці тому

      @@Ollie-j6l It is

    • @VoxBolt
      @VoxBolt 2 місяці тому

      Same

    • @VoxBolt
      @VoxBolt 2 місяці тому

      Not works for me too

  • @mariamkuku6508
    @mariamkuku6508 2 місяці тому +1

    WHAT'S THE PLUGIN HOW DO U SEE THAT PLUGIN THE ROBLOX PLUGIN

  • @Cryvr2
    @Cryvr2 25 днів тому

    For Some reason my GUI does not pop up on the screen in Roblox studio

  • @musembifamily1318
    @musembifamily1318 10 місяців тому

    6:32 how did he insert that image

    • @MonzterDEV
      @MonzterDEV  10 місяців тому

      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.

  • @DevOriginalLukas
    @DevOriginalLukas 4 місяці тому +3

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

  • @amara7734
    @amara7734 6 місяців тому

    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.

  • @user-tonnum-51s
    @user-tonnum-51s 9 місяців тому

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

  • @kaizoku4005
    @kaizoku4005 4 місяці тому

    Your plugin doesn't work. fix it?

  • @Forlornicus
    @Forlornicus 10 місяців тому +34

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

    • @MonzterDEV
      @MonzterDEV  10 місяців тому +10

      Whatever works!

    • @itsLozCS
      @itsLozCS 4 місяці тому +3

      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 4 місяці тому +1

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

    • @Phantom_Blox
      @Phantom_Blox 2 місяці тому +1

      @@Forlornicuswell it’s those who are not experienced will think a certain platform or language is “harder” than other platform or languages lol

    • @EvanPilb
      @EvanPilb 2 місяці тому

      @@Forlornicus developing isn't about which method is harder

  • @lukqaz
    @lukqaz 10 місяців тому +1

    Yay

  • @armaangaminguk
    @armaangaminguk 5 місяців тому

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

    • @MonzterDEV
      @MonzterDEV  5 місяців тому

      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 4 місяці тому

      ​@@MonzterDEVDon't mention the KING.

    • @naianimator
      @naianimator 4 місяці тому

      @@MonzterDEV But isnt easier to work with photoshop?

  • @Lyricaluxe
    @Lyricaluxe 2 місяці тому

    Figma litterly used robloxs ui corner and UI stroke it's easier to add those on roblox

  • @ByronsAGod
    @ByronsAGod 10 місяців тому

    Goated

  • @S33KZ112
    @S33KZ112 4 місяці тому

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

  • @DevV1ktor
    @DevV1ktor 10 місяців тому +3

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

    • @RyanEXElol
      @RyanEXElol 10 місяців тому

      I will, but what is your discord username?

    • @MonzterDEV
      @MonzterDEV  10 місяців тому +1

      Thanks!!

    • @DevV1ktor
      @DevV1ktor 10 місяців тому

      @@MonzterDEV No problem! 🔥

    • @DevV1ktor
      @DevV1ktor 10 місяців тому

      @@RyanEXElol I meant it for the UA-cam comment 😭

  • @Blood_Streams
    @Blood_Streams 10 місяців тому

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

    • @MonzterDEV
      @MonzterDEV  10 місяців тому

      I'll have to check it out!

  • @Neoxa7
    @Neoxa7 10 місяців тому

    Hey can you make an Prophunt game tutorial

    • @MonzterDEV
      @MonzterDEV  10 місяців тому

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

  • @MrSythcemen
    @MrSythcemen 4 місяці тому

    how i get the plugin ?

  • @Bing3107
    @Bing3107 10 місяців тому

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

    • @MonzterDEV
      @MonzterDEV  10 місяців тому

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

    • @Bing3107
      @Bing3107 10 місяців тому

      @@MonzterDEV Try your best if you can

  • @BuraksMemesVlogsAndAnimeツ
    @BuraksMemesVlogsAndAnimeツ 10 місяців тому

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

  • @Luxex1
    @Luxex1 9 місяців тому

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

  • @ShortyJustin
    @ShortyJustin 10 місяців тому

    love you

  • @ThatFATbannana
    @ThatFATbannana 5 місяців тому

    it says undefined.

  • @BossGamingYT-Live
    @BossGamingYT-Live 10 місяців тому

    11:55 What happened???

  • @VidVisions
    @VidVisions 5 місяців тому

    Are you good at building? I really want help

    • @MonzterDEV
      @MonzterDEV  5 місяців тому +1

      Not in the slightest 😭🤣

  • @Flairex
    @Flairex 6 місяців тому

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

  • @duhv2
    @duhv2 10 місяців тому

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

    • @MonzterDEV
      @MonzterDEV  10 місяців тому +1

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

    • @duhv2
      @duhv2 10 місяців тому

      @@MonzterDEV its okay, btw i love your vids

  • @ice-waterrrr
    @ice-waterrrr 3 місяці тому

    figma deez

  • @ChikmenComments
    @ChikmenComments 10 місяців тому

    pls make sword fighting sim next!!!

    • @MonzterDEV
      @MonzterDEV  10 місяців тому

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

    • @ChikmenComments
      @ChikmenComments 10 місяців тому

      @@MonzterDEV oh, it’s alr!

  • @Pro123-xg7gw
    @Pro123-xg7gw 7 місяців тому

    Cool

  • @Boomirangle
    @Boomirangle 4 місяці тому

    using sigma 🤓👆

  • @queueuof
    @queueuof 4 місяці тому

    erm what the figma

  • @djstankwank
    @djstankwank 2 місяці тому

    what the figma

  • @LET655
    @LET655 7 місяців тому

    Sigma

  • @hugosnipurr1841
    @hugosnipurr1841 10 місяців тому +1

    Ya

  • @MaurickIsCool
    @MaurickIsCool 6 місяців тому +1

    At this point just learn Roblox studio its way easier.

    • @Vo3pal
      @Vo3pal 3 місяці тому

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

  • @verachez5319
    @verachez5319 6 місяців тому

    is it free

  • @chxrry_blossomz
    @chxrry_blossomz 8 місяців тому

    figma ❌
    sigma ❌
    ligma ✅

  • @alanafarah
    @alanafarah 4 місяці тому

    “Buhns”

  • @jexeryt
    @jexeryt 5 місяців тому

    Figma? More like Ligma

  • @boblox_studio_dev
    @boblox_studio_dev 9 місяців тому

    figma balls
    (the rot consumes)

  • @Jsino_6651
    @Jsino_6651 18 днів тому

    I dont like these guis because they look childish, every 2nd game has it.

  • @KittyGamingsArt
    @KittyGamingsArt 5 місяців тому

    L FIGMA LLLLLLLLLL

  • @LucasDoorsBlox
    @LucasDoorsBlox 9 місяців тому

    just one letter a way to spell sigma

  • @LunaMoon_32
    @LunaMoon_32 23 дні тому

    All that effort and it still looks ugly

    • @nathanjosh-t7y
      @nathanjosh-t7y 22 дні тому

      u have to practice:) u can make easy good ui if
      u suck at scripting

  • @Cortex_ieu
    @Cortex_ieu 8 місяців тому +1

    you are bad with UI's.