Opened 8 years ago

Closed 5 years ago

#7332 closed bug (fixed)

[ScreenSaver] increase window margins

Reported by: diver Owned by: jscipione
Priority: normal Milestone: R1
Component: Preferences/ScreenSaver Version: R1/Development
Keywords: Cc: mdisreali@…
Blocked By: Blocking:
Has a Patch: no Platform: All

Description

Current GUI:



Mockup:

Attachments (8)

screensaver_current.png (19.9 KB) - added by diver 8 years ago.
screensaver_mockup.png (20.1 KB) - added by diver 8 years ago.
screensaver_mockup_2.png (18.9 KB) - added by diver 8 years ago.
screensaver_mockup_3.png (20.0 KB) - added by diver 8 years ago.
screensaver_mockup_4.png (20.5 KB) - added by Disreali 8 years ago.
ScreenSaver_caffeine_mockup.png (6.0 KB) - added by deejam 8 years ago.
ScreenSaver_mockup_5.png (19.3 KB) - added by deejam 8 years ago.
Screen_Saver_Russian_Layout.png (26.1 KB) - added by jscipione 6 years ago.
Screenshot showing Russian translations after layout API conversion

Download all attachments as: .zip

Change History (26)

Changed 8 years ago by diver

Attachment: screensaver_current.png added

Changed 8 years ago by diver

Attachment: screensaver_mockup.png added

comment:1 Changed 8 years ago by diver

BTW, same thing should be done for JPEGTranslator and JPEG2000Translator.

comment:2 Changed 8 years ago by deejam

Looks great, diver! I wish I knew how to do mockups (I've tried).

I noted that the tab width is not wide enough in some translations, for example in Swedish. As displayed in the image below, the margins becomes to small.

The same applies to the list of available screensavers, it needs left and right margins.

comment:3 Changed 8 years ago by diver

Alternative mockup.

comment:4 in reply to:  2 Changed 8 years ago by diver

Replying to deejam:

Looks great, diver! I wish I knew how to do mockups (I've tried).

I use KolourPaint in KDE for this, It's a bit sad that I don't know how to do it in WonderBrush.

I noted that the tab width is not wide enough in some translations, for example in Swedish. As displayed in the image below, the margins becomes to small.

The same applies to the list of available screensavers, it needs left and right margins.

AFAIK these are known issues and are not related to this preflet only.

Changed 8 years ago by diver

Attachment: screensaver_mockup_2.png added

comment:5 Changed 8 years ago by axeld

The alternative mockup obviously leaves out functionality. I like the original version better, though, anyway. To improve its looks, I would rather remove the outer border completely.

comment:6 in reply to:  5 Changed 8 years ago by deejam

Replying to axeld:

The alternative mockup obviously leaves out functionality.

I can't see that it leaves out any functionality (about screensaver_mockup_2.png). What are you referring to?

comment:7 in reply to:  5 Changed 8 years ago by diver

Replying to axeld:

The alternative mockup obviously leaves out functionality. I like the original version better, though, anyway. To improve its looks, I would rather remove the outer border completely.

By original do you mean current gui?

Changed 8 years ago by diver

Attachment: screensaver_mockup_3.png added

comment:8 Changed 8 years ago by diver

Do you mean something like this?

comment:9 Changed 8 years ago by axeld

That's pretty much what I was thinking about, yes.

To deejam: the checkbox before "Run module" doesn't carry the meaning of the removed "Enable screen saver". Now that I'm looking, "Run module" isn't really the best description either; while technically correct, it's unnecessarily complicated.

comment:10 in reply to:  9 Changed 8 years ago by Disreali

Cc: mdisreali@… added

Replying to axeld:

That's pretty much what I was thinking about, yes.

To deejam: the checkbox before "Run module" doesn't carry the meaning of the removed "Enable screen saver". Now that I'm looking, "Run module" isn't really the best description either; while technically correct, it's unnecessarily complicated.

I would use the second mockup and replace the "Run Module" text with "Enable Screen Saver" or better yet "Run Screen Saver" That way, it should be obvious to the user that the screen saver will start after whatever the user set the time delay.

I would also suggest changing the "Fade" tab title to "Setting".

comment:11 Changed 8 years ago by Disreali

Based on diver's second mock up.

Changed 8 years ago by Disreali

Attachment: screensaver_mockup_4.png added

comment:12 Changed 8 years ago by humdinger

One could also just call it "Delay" and have the slider value start and end with "Off", disabling the "Turn off screen" and "Password lock" options.

comment:13 Changed 8 years ago by axeld

There are cases when you temporarily want to turn off the screen saver, for example, during a presentation. It would be quite annoying to manually restore the previous settings then each time; the checkbox there just makes sense, and shouldn't be spared.

To disraeli: as I already said to diver's effort: I don't like removing the "enable screen saver" box, the functionality is much clearer presented as it is now (disregarding the labels, maybe).

comment:14 in reply to:  13 Changed 8 years ago by deejam

Replying to axeld:

There are cases when you temporarily want to turn off the screen saver, for example, during a presentation. It would be quite annoying to manually restore the previous settings then each time; the checkbox there just makes sense, and shouldn't be spared.

I think it would be great to have a Desktop applet for that which enables/disables the screensaver with a single click.

This is my mockup. If Display Power Management is supported, a slider will be shown for that in the same way.

Changed 8 years ago by deejam

Changed 8 years ago by deejam

Attachment: ScreenSaver_mockup_5.png added

comment:15 in reply to:  2 Changed 6 years ago by jscipione

Replying to deejam:

I noted that the tab width is not wide enough in some translations, for example in Swedish. As displayed in the image below, the margins becomes to small.

The same applies to the list of available screensavers, it needs left and right margins.

I've converted the Screen Saver preflet to use the layout APIs in hrev46010 and made a number of subtle improvements. Although, I haven't fundamentally change the design as this ticket proposes to do, the layout APIs make it much easier to make these kinds of changes now if desired.

I just wanted to mention that I have made the tabs width variable so that it will adjust your Swedish translations and the screensaver list should also adjust to fit as well. Also, I made the tabs flush with the edge rather than being inset by a pixel like in screensaver mockup 3.

I also tested with font sizes from 8pt to 18pt and made many adjustments so that it would look nice at non-standard font-sizes. I even spent some time fixing up the Password popup window to layout responsively.

Here's an example screenshot I took in the Russian Locale while testing.

Screenshot showing Russian translations after layout API conversion

Changed 6 years ago by jscipione

Screenshot showing Russian translations after layout API conversion

comment:16 Changed 5 years ago by diver

Owner: changed from axeld to jscipione
Status: newassigned

Seems to be fixed.

comment:17 Changed 5 years ago by jscipione

There is a small amount of space to the left of the left-most tab, but, that is done purposely by the tab view control. So, the tabs are as flush to the windows' edge as can be. The rest of the changes proposed in this ticket such as removing the enable screen saver check box probably should get their own enhancement ticket. Maybe we can have a wiki page dedicated to screensaver UI improvements. Although, since screensaver basically works it is probably a low priority task.

comment:18 Changed 5 years ago by jscipione

Resolution: fixed
Status: assignedclosed

closing this ticket as the problem described by ticket is solved.

Note: See TracTickets for help on using tickets.