Help with UI Design

Hey, so i have a small creativity problem when it comes to making uis or any other things, but mostly uis.
image
i need help on what details i could put into this ui and i am leaving it to the dev forum :fire:

any help appreciated.

3 Likes

Hi there.

Perhaps you can use another software in future such as Figma and Photoshop but since you’re only starting out I think it’ll be a more prudent use of your time to harness the UI tools on studio to understand the fundamentals.

Firstly, you can play around with the fonts and use UI Curves and Strokes this can create a rounded edge and a crisp looking border.

Next, you could incorporate UI Aspect Ratio and UITextSize constraints as if you’re utilizing the latter doing an X Button it will ensure your text inside the exit button is scaled accurately.

thanks! im not that much of a beginner, but i only work with frames, buttons, yada yada all the basic things. appreciate the help

Hi! So it looks okay but I can help you out.

  • Try adding more shades of color. Possibly make the shades of blue so the colors can go together.
  • Add some more shapes. This can boost your creativity instead of always using the same shape.
  • Like @Bohors said you should try some more fonts
  • Also try to make the UI the theme of your game for example, if you were making a candy simulator you would want candy themed UI
  • Lastly, add some symbols to it as you said you only do basic things and it can help you improve your design!

If you run out of ideas I always go to the Show Off Your UI Design

1 Like

colours, cant find some good blue colours that go well together for some reason
cant make shapes :confused: geniunely dont know how lol (what i want the most is to make a wedge) if you know an image id for a wedge shaped ui then please let me know.

i know how to use alot of the fonts.
i know how to theme ui, what im making right now is just to practice my ui skills

i shouldve noted im not a beginner lo

and thanks!

No problem! I will find a link for you right now.

One thing ive learned designing Ui like this


(ignore the blank space next to the announcement at the bottom, that UI disappears in gameplay unless someone is talking, and if so it loads an image of the character)

Biggest rules of thumb for UI are the 70-20-10 rule,
70% of the UI should be its main content color,
20% should be used to create separation (like the black background in this case),
10% should be colorful or bold, breathing some life into a static design

The biggest thing when learning UI is getting things to look professional. The biggest tip for that I can give is maintain consistency throughout the design, Getting elements to wrap together nicely when rounded like I did above has to do with a really simple rule of thumb, the outer corner should be the half radius the inner corner (15 inner, 30 outer, etc) this creates the cohesion that holds the design above together so well, also make sure to use padding and spacing, both of which in the above design are 10px, Padding helps maintain that 20% separation and tie together the seperate elements

1 Like

thanks for the tip. will keep the 70-20-10 rule in mind

Nevermind @LucidPolygon beat me to it

1 Like

Also to help you find your colors of choice, use a website like realtime colors. It lets you generate random color palate’s and see how they look on generic UI

I whipped up a dark pallate for you to use :smile:

1 Like

possibly a life saver on colours? tysm lol

1 Like