[Plugin] Sketch | A Figma-like UI Editor for Roblox Studio | v1.77

Folders could just replicate real Roblox Folder instances. I’m not sure how developers use Folders in their games though for UI.

They’re mostly used for organization to keep the hierarchy clean, especially when you have a lot of logic-related objects cluttering up the same space as visual elements. If they don’t support the canvas editing features, they might be redundant with the grouping logic you already have.

Good point. I’ll try and add support for Folders and make it work with Sketch’s editing features.

2 Likes

That would be a good move. It’ll make the hierarchy much easier to manage without adding extra visual clutter like frames do.

2 Likes

Amazing work, thank you for this!

1 Like

All scripts within gui objects vanished when i linked a screengui and edited one of the gui’s. (it prompted for script injection so i just accepted it)
Luckily version history exists and i managed to restore everything.

1 Like

I’m so sorry about that, I’ll try and get a fix out as soon as possible. Thank you so much for the report!

Pushed an update that should fix this. Thanks for the report.

thank you, this would be much appreciated.

There seems to be an issue where the plugin can sometimes erase tags and attributes that an object might have prior to linking. Could you add functionality to retain existing tags and attributes that dont conflict with the plugin?

i didn’t think of this at all, thanks for bringing it to my attention. will fix soon.

1 Like

Coming back to this after quite some time, could you please add UIGradients and the option to set an object’s AutomaticSize and SizeConstraint, as well as multiple UIStrokes?

Thanks! :grinning_face:

Great job on the plugin! It looks really good, and I could see myself using this a lot!
1 Like

Hey, there’s already support for UIGradients built into the latest version of the plugin! SizeConstraint is already implemented as part of v1.7 in the Layouts section. Multiple UIStrokes is a good idea, that will be implemented in v1.8!

Automatic Canvas size is implemented for ScrollingFrames, but I’ll also add AutomaticSize for the valid instances, thanks for the suggestion.

2 Likes

Version 1.75 - QoL Upgrades

Upgrades

  • New icons for all UI Objects
  • UIListLayout and UIGridLayout editing received a slight upgrade + smoother animations.
  • Better selection indicator for Layers tab.
  • You can now use your Middle Mouse Button (Scroll Wheel button) to click and drag for canvas panning.

Fixes

  • Changing Anchor Point no longer repositions your UI.
  • Scrolling over a ScrollingFrame no longer zooms the entire canvas.
  • Layout overlays refresh during movement, resizing, zooming, reordering, and property editing.
  • Cmd + Z no longer deletes your entire UI. Major bug fix.
  • Layout and Gradient actions are part of history.
  • User created tags and attributes are retained. Thanks to @joshjosh896 for bringing this to my attention.
  • Button interaction state is preserved. (Active, Interactable, Selectable, etc)

Please let me know if these fixes & upgrades have bugs or break something in your experiences. Thanks for using Sketch!

Now available on the Creator Store. Update the plugin to the latest version!

1 Like

Hey man, all in all this is a great update! I’m glad the AnchorPoint bug was fixed, as well as the Control/Command + Z bug deleting the entire UI.

There’s been a bug for quite a long time where changing the color of the background would reset BackgroundTransparency (I’m not sure if it does the same with text).
Also, when you try to close the color wheel on the gradient, it closes the entire gradient frame and sets it back to a solid color. That said, when you try to go back to gradient mode, all your colors reset.
Could you please look into that?
Thanks!

On another note I liked the old icons more. The new ones are fine, but look a bit cheap in my opinion, especially the Frames. Maybe you could add settings for that? Just a suggestion.
image

1 Like

Thanks for the report! I’ll be deploying a fix today. As for the icons, I’m not too fussed about it currently, maybe I’ll hire someone in the future to upgrade them. For now though, they get the point across, which the old icons did not.

Version 1.76 - Bug Fixes

Fixes

  • Fixed TextBox properties not replicating correctly, TextColor3 and PlaceholderColor3 to be exact.
  • Drop shadows no longer persist after removal.
  • UIStrokes now default to Contextual instead of Border.
  • Cmd/Ctrl + Scroll now zooms the canvas even when hovering over a ScrollingFrame.
  • Changing colours does not reset transparency.
  • Transparency and Opacity controls are synchronised.
  • Fixed gradient colour-wheel closing also closing the entire gradient editor.
  • Switching between Solid and Gradient preserves transparency, gradient colours, rotation and offset.
  • Added working GroupColor3 editing for CanvasGroup.

Thanks to @speedruner1414 for reporting some of these bugs.

Please let me know if these fixes & upgrades have bugs or break something in your experiences. Thanks for using Sketch!

Now available on the Creator Store. Update the plugin to the latest version!

2 Likes

Hello!

I noticed a bug with your plugin.
It seems like the UIGradient Transparency “NumberSequence” (I don’t know what this is called, sorry!) is not being accurately reflected over in Sketch.

Here is what it is supposed to look like for example:

And this is what it looks like in Sketch:

1 Like

Thanks for the report, I’ll try pushing a fix today! Could you give me steps to reproduce this bug please?

Version: Sketch v 1.76

Steps:

  1. Create a ScreenGui under StarterGui

  2. Make a Frame like normal (without using Sketch)

  3. Set the BackgroundColor3 to 0, 0, 0 and Size to 1, 0, 1, 0 for full screen

  4. Parent another Frame under the first Frame and add a UIGradient to it.
    This child frame’s BackgroundColor3 stays 255, 255, 255, set the size to 1, 0, 1, 0 as well.
    image

  5. For the UIGradient, click the three … to the right of “Transparency”

  6. Set the nodes to this: (5 nodes in total)

  7. Open up Sketch, and link the ScreenGui.

  8. You will see that the transparency nodes are not translating over.


Hope this helps! Thank you for the plugin, it has been helpful otherwise.

Note:
I’m sure I could get the same visual result in a much easier way, but this is how I have it right now and that’s how I came across this bug!

1 Like

Thank you so much, I’ll have an update pushed out by the end of today.

1 Like