Show off your UI designs

A compact radio GUI.

image

14 Likes

I’m still confused. Is the UI bad or good :sweat_smile:

FIRST!? Excuse me!? No way that’s first, that’s so good!

2 Likes

What did you use to make them?

I remember learning UI design for the first time on this project, and I still do believe the results are quite stunning!

1 Like

Style: Cute, cartoony, feminine
Made in: Roblox Studio only


Here’s my experience’s “piano roll” UI, which slides up onto the screen when sitting in a “MusicSeat” (seat part with specific atttributes). Its keyboard layout is based on OpenMPT’s defaults (each octave goes across a row on a QWERTY keyboard) and as a result, there’s no awkward “hold shift to play a sharp note” stuff like what Royale High’s piano makes you do. (There’s also no delay between pressing a key and hearing the note since it’s partially client-side, but that’s off-topic here.)

I think I’ve outdone myself with how I made the piano keys look here; Nothing you’re seeing here is using images; It’s all UIGradient, UIStroke, and UICorner instances!

Why risk moderation when you can just make a detailed UI inside of Studio, after all?

3 Likes

I see this UI always when I finish a Boxing League match because I always win lol

Seriously, this UI is amazing!

1 Like

Chat UI for my client, made in about 40 minutes. (inspired by new TextChatService UI)

4 Likes

I…also made something like this!

CustomChatUI
Inspired by Apocalypse Rising 2’s UI and the new TextChatService UI :slight_smile:

This is for a new upcoming driving game owned by MyCatAteALego…if anyone wanted to know :slight_smile:

7 Likes

Recently came back into ROBLOX to create a horror game so I can pay off some debt, and my new favorite thing is to animate and create UI so far and this is what I’ve made for a new up and coming game.

5 Likes

In-game Join Group Prompt concept; made in Roblox Studio

11 Likes

can you put the note above the input key? i think that would do wonders here

1 Like

“Welcome to PreloadSerivce”
lol hate when a typo slips into the final product

Bruh, How did I never notice that 3 versions later

1 Like

omg don’t ask users for their phone number, password, and email what are you doing

1 Like

This is a concept and not live in any game and/or website. :smiling_face:

I decided to rework it :slight_smile:

2 Likes

made this today using node.js and the express package (it’s a working Discord-Roblox verification system)

9 Likes

This is really cool! How long did it take?

1 Like

It’s not anything detailed, but I’ve programmed tooltips into my experience. If any Gui element has a Tooltip attribute, a script that uses RenderStepped detects when it’s being hovered over, and shows the tooltip with its text inside it. Any text meant for it is expected to use <br/> for line breaks because TextService isn’t given any bounds so I have more control over that.
image
Also, to reduce work done on every frame, tooltips are only updated ever ¼ of a second. This would look choppy, so a tween is used to disguise that.

Here’s a video of the new tooltips! It shows how they animate appearing/disappearing, and even how they shift to the other side of where my cursor would be as I move near the bottom-right corner of the game window.

7 Likes