BabylonJS / Editor

Community managed visual editor for Babylon.js
http://editor.babylonjs.com/
813 stars 232 forks source link

GUI is blurred #266

Closed lanrosta closed 2 years ago

lanrosta commented 3 years ago

I don't see any way to turn this off in Preferences. Is there a way to turn off the blurring of the Editor's GUI? I do not like this feature at all. It's really annoying and makes using the editor harder than it should be. Whoever thought this feature was a good idea, really needs to rethink the reasoning behind it. How is this possibly useful in any way? Often, the blurring won't go away when I hover or click in the area I need to work with.

julien-moreau commented 3 years ago

Hey @lanrosta good to have feedbacks!

But I'm not sure to understand the "blurring Editor's GUI", can you be more explicit? Some elements of the GUI is unfocused?

lanrosta commented 3 years ago

I'm surprised you are not seeing the same as I am on this. Basically, when I move my mouse over a section of a panel, it will (usually) refocus the blurred UI text in that section, and then blur all other UI text that is not part of that section that the mouse is over. Sometimes it does not refocus and I can barely read the UI text that I am trying to work with. This is on Windows 10 64bit OS Build 19041.867.

lanrosta commented 3 years ago

Here is a screenshot. Unfortunately, when I use the screenshot tool, it also removes focus of the section I am hovering over, so the screen shot shows all the UI text is blurry. So, this should give you an idea on what the UI looks like for any UI text I am not hovering over: https://prnt.sc/10tza8h

lanrosta commented 3 years ago

And if it helps with debugging, I am using an nVidia GeForce GTX 1080 Ti video card (hdmi cable). I've never had any other applications have this blurred text in the UI before, only this one.

lanrosta commented 3 years ago

Any word on this? I'd love to be able to use this software, but the blurry UI text is a deal-breaker for me.

julien-moreau commented 3 years ago

Hi @lanrosta sorry for the delay I was on a hard bug related to skeletons in the Editor. It is now fixed and I can focus on your issue :)

I tested the Editor on some Mac and PC. Unfortunately I still can't reproduce so I have just NO idea of what is happening here =O. Anyway, I have some ideas:

For now I have found these issues interesting:

I will read more on these issues right now and will try some fixes that I'll deploy for you to test

julien-moreau commented 3 years ago

Hi @lanrosta,

I have created a build here: http://editor.babylonjs.com/electron/preview/BabylonJS%20Editor%20Setup%204.0.0-rc.2.exe Can you try it and tell me if you still experience the blurred UI ? Thanks!

I'm still investigating but it's hard as I can't reproduce :'(

lanrosta commented 3 years ago

Same issue persists with this one too.

Thank you, Joseph

-------Original Message------- From: Julien Moreau-Mathis @.> To: BabylonJS/Editor @.> Cc: Joseph Ralston @.>, Mention @.> Subject: Re: [BabylonJS/Editor] Don't like the blurred GUI (#266) Sent: Apr 05 '21 07:57

Hi @lanrosta,

I have created a build here: http://editor.babylonjs.com/electron/preview/BabylonJS%20Editor%20Setup%204.0.0-rc.2.exe Can you try it and tell me if you still experience the blurred UI ? Thanks!

I'm still investigating but it's hard as I can't reproduce :'(

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or unsubscribe.

julien-moreau commented 3 years ago

Hi @lanrosta, I have reproduced!!!! The problem is that I have reproduced by modifying the configuration of my graphics card (RTX 2060).

In my Nvidia control panel, I have activated "image smoothing" and I can reproduce exactly your issue: image

In your Nvidia control panel, can you try to deactivate image smoothing and see if it solves your problem? For me, it is the first parameter (in french unfortunately) here: image

In this screenshot it is activated, try to deactivate it like me so the text is not blurry anymore :)

I observe that VSCode (which is based on Electron as well) is not impacted by this behavior, I'm digging to understand why

lanrosta commented 3 years ago

I tried the nvidia settings change you mentioned above and it did not change anything. It was still blurry. However, I decided to a different nvidia driver (The Studio driver version, instead of the Game driver version I was using). I also made this settings change (https://prnt.sc/11crfz0). I set the scaling mode to 'No Scaling', and I checked the 'Override the scaling mode set by games and programs'. And that seemed to clear things up for me. I can now use the app. Yay!

julien-moreau commented 3 years ago

@lanrosta that's excellent !! I'm still sorry that I don't have any solution for now :( I'm keeping this issue opened until I find a good reason/solution to close it.

Basically, what I can read on internet is that Fonts Rendering and Window is not the big love, I see a lot of problems of "blurried text" on Electron and Chrome for Windows users.

What i'm looking for is the reason why it is happening and if there is something we can do. The only solution I found was to disable hardware acceleration for Electron but here we can't else WebGL will not be available ahah.

lanrosta commented 3 years ago

My guess is it has something to do with Scaling. This is not the kind of thing I would expect you to have to debug or worry about. What sucks is that this is an issue with the underlying framework(s) you are using, and that is where it needs to be fixed by those developers, and not yourself.

Thanks for working diligently to try though. It did help me resolve the problem.

Thank you, Joseph

-------Original Message------- From: Julien Moreau-Mathis @.> To: BabylonJS/Editor @.> Cc: Joseph Ralston @.>, Mention @.> Subject: Re: [BabylonJS/Editor] GUI is blurred (#266) Sent: Apr 16 '21 11:09

@lanrosta that's excellent !! I'm still sorry that I don't have any solution for now :( I'm keeping this issue opened until I find a good reason/solution to close it.

Basically, what I can read on internet is that Fonts Rendering and Window is not the big love, I see a lot of problems of "blurried text" on Electron and Chrome for Windows users.

What i'm looking for is the reason why it is happening and if there is something we can do. The only solution I found was to disable hardware acceleration for Electron but here we can't else WebGL will not be available ahah.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or unsubscribe.

julien-moreau commented 2 years ago

@lanrosta you are right and still found no definitive information on internet on how I can fix it on my side. This is definitely an issue for Electron.

I'll add your tip in the documentation in case this issue re-happens

julien-moreau commented 2 years ago

@lanrosta just added your tip in the documentation of the Editor is found no official solution :( Hope you are still having fun!

abhilashca commented 10 months ago

@julien-moreau I too had the same issue.

Below are the spec: Windows 11 Pro MSI Stealth 15 A13V NVIDIA GeForce RTX 4050 Laptop GPU

This is how it looks in editor. image

While running image

image

I installed Studio version of driver and set scaling to No Scaling, but the issue still persists. :(

abhilashca commented 10 months ago

@julien-moreau I have another observation. When the GUI is blurred and if I take production build. Then the deployed build is also having similar rendering issue.

I tried with v4.6 of the editor where I do not have any rendering issues but unfortunately it uses BJS 5.

Can you please let us know your machine configuration you are using?