Next Gen Studio UI Preview is here! [Beta]

Different project/release and the junk placeholder text is a known issue (all unrelated to Next Gen UI)

3 Likes

Yes that’s why we called this a “Preview” — lots of work to do to make it as fully functional as the old UI so we want to make sure we’ve got the fundamental elements stabilized. This includes overall layout, controls, where stuff is, etc.

Thanks for the feedback!

We have only just started tweaking the padding and overall layout. What you see currently was our very first quick pass. We will keep massaging and iterating little bits at a time.

For default tabs, at a minimum, you will be able to hide them and use only custom toolbars. But it’s possible you can modify them further… it just brings up tricky issues with how we resolve your customized default tab with changes that we want to make to those tabs as well. For that reason, I think we will at least start with the ability to hide individual system/default tabs.

Plugin actions/tools will absolutely be able to be added to one or more other toolbars. Our original design did away with the “Plugins” tab completely but it was too much work to support alongside the old UI which depends on it.

The shortcut keys system needs a complete overhaul as badly as the UI system did. It’s on our radar but another mountain of work. We want Studio to be more keyboard navigation friendly in the long run. It’s a question of if that should be handled down at the engine level or at the Studio level.

The play test controls are getting a lot of attention from our design team right now. As you probably noticed what is there now is incomplete and awkward. We should have a much improved UI there over the coming weeks. We still need to discuss customization there.

6 Likes

While the new icons are nice, I think that having many of the UI-elements use a uniform colour scheme makes navigation a bit slower.

When all these elements are the same colour they start to bunch up and become harder to quickly navigate through.

I think it would be easier if for example: the move tools were colour coded, so you would just click the blue icon to move, red to resize, and etc.

While a minor change I think it would make navigating the UI more inntiuiative, Since identfying a colour is easier and quicker than an icon or label.

image

Having icon colours setup like above makes it much quicker to identify what youre looking for, and while I understand the current colour code seems to be based on catagory, I think adding further colour coding to more of the commonly used buttons would be a beneficial change.

8 Likes

Will switching between tabs get some sort of small animation? For example, instead of the new one snapping in instantly, it could play a little switch animation (similiar to how desktop switching works on macOS).

I personally would really love animations like this; they give the UI a nicer feel and make it much friendlier.

3 Likes

Interesting!

I say interesting because there is a very purposeful color coding scheme happening here. For example is the UI related tools have a dominant “pink/purple” color (scripting tools are blue, avatar tools orange, etc.) . This color system will also apply to Explorer icons too, eventually.

That’s why everything on the UI tab appears to be the same color.

The common tools like Select/Move/Scale have a very light, neutral color they share. Is your feedback these just need a more prominent color?

4 Likes

Maybe! I love little micro-interactions like that (as long as they don’t slow anything down)

Certainly more possible in the Luau based UI than we could ever reasonably do with C++/Qt. But first we need to get the fundamentals in place.

4 Likes

would you rather be stuck with a ui that was made years ago that would never change or get used to a new ui that matches the new ui design standards or smth? the studio ui that everyone is used to looks outdated as frick because of source sans font and almost no rounded corners in sight. this is a well needed change for roblox studio imo. trust me, you will get used to it over time.

1 Like

Where are the Team Test Configurations? I can’t find them

Just tried it out, its sick! It’s way better than what we had for all of those years, it looks more modern.

Thanks Roblox!

1 Like

does this mean all of Studio’s icons be redesigned too?

uniform icon colors for a specific category?

welcome back short lived 2022 studio icons

My feedback is that the colour seperation should be per individual tools, rather than entire catagories.

Edited:

Compared to the original:
image

To reitterate, these icons start to bunch together when they all share the same colour, I believe this is most apparent on the UI menu.

image

All of these icons have similar general shapes, and so having them all be a uniform colour makes it harder to tell them apart.

When edited to have differing colours:

It becomes much easier to distinguish the different options. Optimally you want ui navigation to be as quick and intuitive as possible, and having easily distinguishable tools is helpful in achieving that.

In my opinion, the colour coding based on catagory is redunant, as each tool is already seperated in their own catagory windows. Making it so the colour coding seperates individual tools in a catagory would be much more convenient and intuitive for developers.

Overall though, I think the new UI design feels much more modern - definitely an improvement. I just believe the colour coding should be reconsidered.

6 Likes

Multiplayer and team test controls haven’t made it over yet. We are actively working on this but in the meantime you’ll need to switch out of the Preview Beta.

Yes all icons in Studio will be updated over time.

I like both color concepts and believe that there is no perfect solution for everyone.
For some, it makes sense to group similar things together with one color. For others, it is more intuitive or vivid to have icons in the same category distinguished by color.

Is it possible to have all these new Studio icons use some sort of new technique to make the “accent” color customizable? This would work perfectly with my request to add custom Studio themes. However, that sounds like a lot of work.

This is technically possible by overlaying two layers and having one of them be a custom color.

Just sharing my thoughts on this.

3 Likes

Dropdown buttons, such as Insert, Constraint, script:
I would like to see the dropdown buttons open the dropdown on click, instead of preforming an action immediately.

Tabs and Playtest Buttons:
Preferably, in my opinion, I would like to see the tab and play test buttons being merged together in one section.

I also would preferably want tabs positioned at the left.

What is your opinion:

  • Tab Positioned on the Left; Playtest Buttons Positioned Center
  • Tab Positioned on the Center; Playtest Buttons Positioned Left
  • Don’t merge

0 voters

That would be more possible if we had vector/svg icons. Currently we are limited to rasterized icons by the engine. :expressionless:

11 Likes

Not sure if it’s been reported but on light mode, the top bar buttons become too dark on click
image
Also game settings button seems to be completely gone? I’ve been missing that.

Go to File → Game Settings is just below Publish to Roblox & Download a copy

I’m not sure if this was said, but when I have many plugins, they go off the screen and I can no longer access them. I preferred the old scrolling plugin menu and enjoyed when the plugin manager was just 1 button to click, and not in a dropdown. However, the rest looks really clean, and I hope to see how this ends up!

Suggestion: Add movement to the plugin menu, so you could put more useful plugins in a specific place, and less useful ones farther away, like currently the dropdown.