Liquid Glass & UI Blur with Editable Images

Help and Feedback Creations Feedback
,
1

hi!! ive been working on recreating macOS inside Roblox that is actually high quality, including having working liquid glass!

i didnt want the glass to just be transparency, gradients, or a fake outline like how others do it. i wanted the wallpaper behind it to genuinely bend and refract through the controls like it does in macOS

and i have done it!
check it out!!

image
image653Ă—385 40.6 KB

works with all graphics quality

you can also adjust the blur

with editable images, you can also create the glow and saturation effect like when you hold on a button in iOS!

the rounded corners needs some changes but i think it still looks really good right now

the limitations are:

  • only works on top of an image label (the wallpaper)
  • lag

edit: i think im going to scrap this project and remake ipad os instead, since i dont own a mac, but i do have an ipad, so itd be much easier for me

31 Likes
2

i’ve fixed the corners now its basically perfect

image
image300Ă—283 59.6 KB

11 Likes
3

holy tuff editable images is so amazing

2 Likes
4

whats the performance like on this? i know blurring algorithms can be really hard on performance
also looks good

3 Likes
5

Looks great ngl! Keep it up, I’d love to see how final product looks!

1 Like
6

In terms of lag, that issue is likely not even your fault. Roblox limits updates to EditableImages to 1 per frame, queing the other updates. It’s really just an unfortunate restriction that was made when EditableImages were in beta and a lot less performant than they are now.

If you want it to work outside of UI, you could do some funky stuff using raycasting to get the “color” of parts, though notably this wouldn’t work amazingly with textured meshes or materials.

1 Like
7

5 Likes
8

This is soooooooo coooooooooool!!

9

Liquid glass clock!

image
image1017Ă—577 76.1 KB

3 Likes
10

i managed to make it almost no lag (at least on my laptop)

  • it generates like a spritesheet for the buttons so the image generated is small
  • only generates once instead of generating new ones for every button
  • each button crops that image for the final result
  • ive also lowered the resolution of it and increased the blur/frost to compensate for it, so it looks normal
4 Likes
11

wicked :0

is this open source? i would be more than glad to help on this project.

2 Likes
12

Wow, this looks insanely amazing!

1 Like
14

is there any demo for it or not yet? since this looks very cool!

15

This is actually so cool. hope to see this become open source or usable one day!

16

not yet, i managed to make it work over other ui’s, but it is very laggy and thats the thing im trying to fix before selling it or making it open sourced cuz im lowkey giving up on making an OS simulator

image
image182Ă—178 27.6 KB