UIGradient [LIVE]

I’ve been hyped for this ever since I saw the API diff. Great stuff!

Is there any plan to support multiple gradients per object? Or perhaps radial gradients?

9 Likes

WOAH, This sounds so cool and epic!

I saw the new instance created but I couldn’t figure out how to get it working. To anyone else confused, make sure to enable it under the beta tab.

Is there a possible ETA on when this will be fully released onto the client?

10 Likes

Awesome update, it’ll defiently allow gradient based user-interfaces to be made much easier!

Screenshot_1601

84 Likes

I enabled the feature in studio and this popped up… :neutral_face:


(For real though, this is a great! Can’t wait til it gets out of beta)

125 Likes

After years, it’s finally here. The long awaited GRADIENT! Finally, we can make animated rainbow guis!

15 Likes

Really, great to hear about this feature. I wonder how I’ve been living all those years without gradients!

Here are some of my observations:

  1. It think it is confusing to have the gradient with the same icon as the layout objects. I would really like if it was different and more recognizable.
    28 PM
  2. We can drag the color nodes outside the range, which doesn’t affect anything when you release the mouse, though it feels weird to just be able to do it.
    21 PM
  3. My color palette window appears behind the gradient window which is a little annoying. :smile:

Overall, I’m really happy to see this feature! Though I feel like the UI could be improved. Maybe it’s too hard to select the little triangles to move the colors for example. I feel like they are a little too small.
I’m used to using Affinity Designer, for example, where the UI is more friendly… but I guess it isn’t fair to compare Roblox to a graphical software. So anyhow, thanks for this feature, that’s a good way to start December! :yum:

Here is what the UI looks in Affinity Designer:
11 PM

33 Likes

WOW! :astonished: Awesome update (as many can see with the number of likes this topic has).

Just one feature that I think should be added along with this: radial gradients with configurable centers.


Linear gradients can get quite … linear and too boring. Therefore, radial gradients spice up the world of color blending and would open us up to a wide array of choices (i.e.center in the top left, top right, center, etc.).

This is based on Google Drawings, which I used before this update was added. Instead of just the five radial gradient choices for where to place the center, it would be better if we can instead use numbers to position the center (like XY coordinates).

Nevertheless, this is an awesome update and it warms my heart to see these quality UI updates getting pushed out. Keep it up Roblox :roblox_light: :roblox: :+1:!

110 Likes

This is so cool. This is easily my favourite update of 2019. Thank you Roblox!

9 Likes

Awesome to finally be able to do this! Would there be any possibility to extend this into full on images (images such as textures being rendered inside of text, other images, etc)?

3 Likes

Next in line: masks. :upside_down_face:

8 Likes

I love this feature! Heres a gif of a rainbow i wrote in about 5 minutes

88 Likes

This is a really nice update, wanted to make some gradient based UIs in roblox without the need of external programs for a while. This also will allow us to create easier rainbow name tags without crazy hacks/long scripts, thanks for this update :+1:

5 Likes

UDim2?

7 Likes

This was the feature in Roblox that I never knew I wanted.

@DeveloperColton Love the way you did the buttons!
@TheCarbyneUniverse I agree, it would be awesome if we could make radial gradients too!

Really excited about this update. It’s cool seeing what people have made! I think it has two great uses:

  1. Non animated (ie shadows, gradient backgrounds, etc)
  2. Animations (ie text fade in, buttons, etc)

Another thing I figured out is that it will make glowing and animated glowing objects much easier to create in Roblox. This significantly reduces the time it takes to make a fake gradient or workaround and opens the door to new possibilities :smiley:

Haven’t made anything super cool yet (will post later) but here’s a quick example of animated glowing stuff

Static image if the video won't load

image

110 Likes

A very needed update for awhile.
This unlocks a new door so people won’t need external programs to do just a simple gradient on a UI Object they have.
It will also make the Gui easier to manipulate the color instead of switching images a single time, or multiple times depending on the little animation that most players would have to wait for all those images to load in.

I haven’t got a huge look into this, but from @EpicWalnut5’s images above I’d love to work with this in the future!

Also with @gui110’s suggestion I would love to see a bit more variety in icons used for all the UI layout objects (maybe show what it does, but just don’t get too detailed)

That’s it, Cheers! :heart:

9 Likes

@Maximum_ADHD mentioned this on Twitter not too long ago but it also works with ViewportFrames! Which is a very nice touch indeed.

60 Likes

We finally got the iOS 7 update

50 Likes

Here’s a concept I made in about 5 minutes for some inspiration! Wall shading!

Another great update! Can’t wait for it to go live in the in-game engine! Can’t wait to start using this.

39 Likes

This looks amazing, Roblox just started to work really hard on really needed features.

We got moving grass, player list GUI redesign, new insert object window, shadow map lighting, and now gradient colors for UI, this is amazing job Roblox. Keep it up. I still can’t wait to rounded corners GUI feature to be added, and that would be great, since we would started to use less often design softwares for every GUI element.

9 Likes

You can use Stelrex’s Plugin “Roundify” for now if you need rounded corners real quick. It’s fully customizable and works really well. Occasionally, you’ll get some pretty wonky results though, so maybe be on the look out for a better one.

6 Likes