New overlay mode (Now ready for testing)

A forum for research and development of the user interface of FreeCAD
Forum rules
Be nice to others! Respect the FreeCAD code of conduct!
Post Reply
User avatar
OficineRobotica
Posts: 433
Joined: Thu Feb 21, 2019 8:17 am
Contact:

Re: New overlay mode (Now ready for testing)

Post by OficineRobotica »

Hello @realthunder, first of all thank you so much for the amount of work that you pour into Freecad. There are allot of people that have been waiting for the overlay interface for ages and the fun fact is that freecad/qt combo seem to already have all the tools necessary to do that. I realize that this needs some polishing but please, just PLEASE make so that this lands in trunk as soon as possible :D .

For this to happen, first run usability is key and there are some points to that(this might seem like superficial talk and a waste of time but it runs down to good design principles)
1- allot of times less is more
2- coders are power users and regular users are not most of the times. They might be overwhelmed by the amount of stuff that's happening on the screen.
3- contrast and readability of elements/text is what makes the difference between a beautiful interface and a unusable one.

You might have seen this in the glass module forum post but it all applies here too.

I really think that contrast and readability is the first thing that should be addressed. Especially on fully transparent panels text should behave like subtitles in movies where there is always an outline or shadow making it readable even if there are 3d elements underneath it. Unfortunately i discovered that styling qt text can't be done directly with a style sheet but it is available trough QGraphicsEffect and must be coded directly. qt DropShadowEffect Class or even better a simple text outline that ideally should be of the opposite color chosen for the text in the qss .

Also having the option of blurred panels would be just awesome. It would really make freecad look like a modern application.
Effects availble in QtGraphicalEffects
I don't know if a widget with transparent background and and blur applied would pick the pixels underneath it (i know that on desktop that is the compositor work) but even implementing it with transparent background->noise map(as target image)->qtblur would be awesome and could potentially give a result like this :
mokup3.png
mokup3.png (397.34 KiB) Viewed 2470 times

The less is more thing in my opinion is the most difficult part to tackle. Allot of small "paper cuts" issues and less panels opened by default should be looked into . In the current state of development for example(and in my humble opinion)

-transparent panels should not have an outline(it just ads to the confusion)

-the overlay controls should not disappear when the mouse is not over the panel header(as they are small, leaving them always visible is a nicer choice and does not add to the "blinking led" sensation when using the interface)

-if i have a combo view opened and change its overlay mode it opens all the possible panels(report view/property view/combo view/selection view) and cramps them in one vertical space with no visual separation between them. I think this is just something to be addressed in this early code and not a design issue.

-allot of overlaid elements unnecessary change appearance or even move when the mouse passes over. This adds to the blinking led sensation when using the interface. Again I think this is just a mater of fine tuning the style sheets more than a fundamental design flaw.

-ALT+click on the change panel dimension clashes with some window managers for moving the entire application window. Can that be changed with CTRL+SHIFT or CTRL+ALT ?

-the navigation cube should be aware of the space taken by the overlayed panels and should move accordingly. Right now it hides beneath them if the overlay is changed.
lessIsMore.jpg
lessIsMore.jpg (170.05 KiB) Viewed 2470 times
If there are things that i wrote that seem nonsense to you please just ignore them but I really hope and wish that this lands in trunk.
A really big THANK YOU for the time and dedication that you put into Freecad.
Check out my Youtube channel at: https://www.youtube.com/@OficineRobotica
User avatar
OficineRobotica
Posts: 433
Joined: Thu Feb 21, 2019 8:17 am
Contact:

Re: New overlay mode (Now ready for testing)

Post by OficineRobotica »

Given the subject of this thread I really think that this video is worthwhile watching. It makes some great points about interface design.
phpBB [video]
Check out my Youtube channel at: https://www.youtube.com/@OficineRobotica
tom
Posts: 165
Joined: Sun Mar 29, 2015 9:20 pm

Re: New overlay mode (Now ready for testing)

Post by tom »

realthunder wrote: Mon May 04, 2020 12:08 am Yes, I myself get confused sometimes too. That's why I differentiate the normal 'overlay mode' and the 'transparent mode'. In normal overlay mode, mouse over will make the panel opaque to avoid confusion. See the picture below for the button to toggle the mode. This would also be the answer to you next question.
I already use the normal overlay mode for the combo view, but the panel becomes still transparent as soon as the mouse leaves the panel:
asm3_overlay_transparency.gif
asm3_overlay_transparency.gif (892.86 KiB) Viewed 2417 times
realthunder
Veteran
Posts: 2190
Joined: Tue Jan 03, 2017 10:55 am

Re: New overlay mode (Now ready for testing)

Post by realthunder »

OficineRobotica wrote: Mon May 04, 2020 8:48 am Hello @realthunder, first of all thank you so much for the amount of work that you pour into Freecad. There are allot of people that have been waiting for the overlay interface for ages and the fun fact is that freecad/qt combo seem to already have all the tools necessary to do that. I realize that this needs some polishing but please, just PLEASE make so that this lands in trunk as soon as possible :D .
Thanks for the suggestions. User feedback is always welcome.

New image updated. I have exposed overlay stylesheet setting to preference page. User can add their own stylesheet just like the main stylesheet. Put the overlay stylesheet at

OSX = /Users/[YOUR_USER_NAME]/Library/Preferences/FreeCAD/Gui/Stylesheets/overlay/
WINDOWS = C:/[INSTALLATION_PATH]/FreeCAD/data/Gui/Stylesheets/overlay
LINUX = /home/[YOUR_USER_NAME]/.FreeCAD/Gui/Stylesheets/overlay

I also added stylesheet for 3D view menu. It is now transparent as well. To customize the menu stylesheet, instead of 'overlay', put it under direction 'menu'.

My pre-built comes with two built-in styles, 'Light' and 'Dark'. The default setting 'Auto' will auto pick a style depending on the main FreeCAD style.
Screenshot from 2020-05-12 21-11-28.png
Screenshot from 2020-05-12 21-11-28.png (62.46 KiB) Viewed 2331 times
Screenshot from 2020-05-12 21-32-31.png
Screenshot from 2020-05-12 21-32-31.png (128.93 KiB) Viewed 2331 times
Screenshot from 2020-05-12 21-32-55.png
Screenshot from 2020-05-12 21-32-55.png (131.37 KiB) Viewed 2331 times
Also having the option of blurred panels would be just awesome. It would really make freecad look like a modern application.
Haven't tried it. But I don't think blurring is a good idea. Because it obscure the 3D view, which IMO defeats the purpose of the overlay mode.

-transparent panels should not have an outline(it just ads to the confusion)
I have added translucent background to avoid confusion.

-the overlay controls should not disappear when the mouse is not over the panel header(as they are small, leaving them always visible is a nicer choice and does not add to the "blinking led" sensation when using the interface)
I added that effect on purpose. Because the overlay control is located at unconventional place. If two docking panel is shown at the same time. it is not always clear which control belongs to which panel. And reason the control is located at those place is to reduce movement when resizing the panel.

-if i have a combo view opened and change its overlay mode it opens all the possible panels(report view/property view/combo view/selection view) and cramps them in one vertical space with no visual separation between them. I think this is just something to be addressed in this early code and not a design issue.
You can use the tab button to select one panel exclusively, or use the splitter dragger to interactively resize the panel. The drag indicator may not be obvious due to transparency.

-allot of overlaid elements unnecessary change appearance or even move when the mouse passes over. This adds to the blinking led sensation when using the interface. Again I think this is just a mater of fine tuning the style sheets more than a fundamental design flaw.
If you choose to activate the transparent mode (The 'eye' icon of the overlay control), there shall be no visual change with mouse overing.

-ALT+click on the change panel dimension clashes with some window managers for moving the entire application window. Can that be changed with CTRL+SHIFT or CTRL+ALT ?
Fixed already. Now you can use either CTRL or ALT.

-the navigation cube should be aware of the space taken by the overlayed panels and should move accordingly. Right now it hides beneath them if the overlay is changed.
Fixed. The overlay will leave space for navigation cube.
Try Assembly3 with my custom build of FreeCAD at here.
And if you'd like to show your support, you can donate through patreon, liberapay, or paypal
realthunder
Veteran
Posts: 2190
Joined: Tue Jan 03, 2017 10:55 am

Re: New overlay mode (Now ready for testing)

Post by realthunder »

tom wrote: Mon May 04, 2020 11:10 pm I already use the normal overlay mode for the combo view, but the panel becomes still transparent as soon as the mouse leaves the panel:
It is fixed. Please try with the latest image.
Try Assembly3 with my custom build of FreeCAD at here.
And if you'd like to show your support, you can donate through patreon, liberapay, or paypal
carlopav
Veteran
Posts: 2062
Joined: Mon Dec 31, 2018 1:49 pm
Location: Venice, Italy

Re: New overlay mode (Now ready for testing)

Post by carlopav »

nice you added the viewprovider context menu to the 3dview context menu!
follow my experiments on BIM modelling for architecture design
User avatar
adrianinsaval
Veteran
Posts: 5551
Joined: Thu Apr 05, 2018 5:15 pm

Re: New overlay mode (Now ready for testing)

Post by adrianinsaval »

This just keeps getting better :)
tom
Posts: 165
Joined: Sun Mar 29, 2015 9:20 pm

Re: New overlay mode (Now ready for testing)

Post by tom »

realthunder wrote: Tue May 12, 2020 2:09 pm It is fixed. Please try with the latest image.
I can confirm that it is fixed. Thank you for that work.
User avatar
pablogil
Posts: 882
Joined: Wed Nov 26, 2014 3:19 pm
Location: Badajoz (Spain)
Contact:

Re: New overlay mode (Now ready for testing)

Post by pablogil »

Hi @realthunder,

There it goes my proposal for the stylesheets. For now I have just tweaked them for Dark-blue stylesheet but I would be so easy to replicate to the othe ones.

Cheers
Attachments
overlay_qss.zip
(2.84 KiB) Downloaded 62 times
Dark and Light stylesheets v2.0 to theme your FreeCAD UI, more information here
realthunder
Veteran
Posts: 2190
Joined: Tue Jan 03, 2017 10:55 am

Re: New overlay mode (Now ready for testing)

Post by realthunder »

Image updated.

You can now click through the overlay by holding the 'ALT' key. For those using Ubuntu or maybe other Linux distro that has system override of 'ALT', you can temporary bypass it by holding the 'Super' key together with 'ALT'. I have no choice because all the other modifier key is used up, CTRL for multi-second, SHIFT for hidden line selection. This function is new, so it may have unexpected conflict with existing function. I have add a dock overlay option so that you can disable it.

BTW, there is also a new option which I added a while back, called 'Activate on hover` which is default. When you disable it, then the auto hidden dock window will be activated by click rather than mouse hover.
Screenshot from 2020-05-16 13-23-48.png
Screenshot from 2020-05-16 13-23-48.png (93.82 KiB) Viewed 2107 times
mouse-through.gif
mouse-through.gif (399.35 KiB) Viewed 2107 times
pablogil wrote: Thu May 14, 2020 3:47 pm There it goes my proposal for the stylesheets. For now I have just tweaked them for Dark-blue stylesheet but I would be so easy to replicate to the othe ones.
Thanks. I have merged yours into my fork. The buttons now displayed correctly. With the latest image, you can select the overlay stylesheet in preference. User defined stylesheet can be put in directory Gui/Stylesheet/overlay.
Try Assembly3 with my custom build of FreeCAD at here.
And if you'd like to show your support, you can donate through patreon, liberapay, or paypal
Post Reply