It is proposed to redesign the login screen

[TOMATO-ONE]

I propose to change the design of the xrdp login screen.

As discussed in #2274 for the next major version, I think it is a good idea to change the design of the login screen if it involves a big leap.
This is because the login screen is the first thing most people see, so a change in design would be a strong signal of a big leap forward.

In the past, xrdp has changed the login screen for major leaps forward.
For the sake of discussion, here are the login screens from previous versions of xrdp.

Version 0.6.

Note: I think this is inspired by Windows NT Server 4.0 Terminal Server Edition.

Version 0.9

Note: The colour scheme is similar to that of Windows XP/2003.

[TOMATO-ONE]

I have two ideas.

Idea one.
Change the logo and colour scheme to Windows 10/2016 style.

Advantages: less work as you only need to change the default values in xrdp.ini
Challenge: preparing a logo that can be redistributed under the Apache-2.0 licence

Idea two.
Enable --with-imlib2 introduced in #1962 by default for a Windows spotlight-like login screen.

Advantages: visually impressive big change
Disadvantage: requires imlib2, so dependencies require more libraries by default.
Challenge: preparing redistributable background images under Apache-2.0 licence
　　　Need a mechanism to switch background images periodically to make it more Spotlight-like

[TOMATO-ONE]

DRAFT PROPOSAL for idea one

Colour scheme from mstsc.exe for Windows 10 and RDP login screen without background image.

xrdp.ini

;
; colors used by windows in RGB format
;
#blue=009cb5
blue=0078d7
#grey=dedede
grey=e1e1e1
#black=000000
#dark_grey=808080
dark_grey=b4b4b4
#blue=08246b
#dark_blue=08246b
dark_blue=0078d7
#white=ffffff

; top level window background color in RGB format
#ls_top_window_bg_color=009cb5
ls_top_window_bg_color=1c4f84

; login screen background color in RGB format
#ls_bg_color=dedede
ls_bg_color=f0f0f0

I wanted to change the logo as well, but I have no graphic design background myself...

[TOMATO-ONE]

DRAFT PROPOSAL for idea two

You need xrdp built with --with-imlib2 added to the configure option.

xrdp.ini

; optional background image filename. BMP format is always supported,
; but other formats will be supported if xrdp is build with imlib2
; The transform can be one of the following:-
;     none  : No transformation. Image is placed in bottom-right corner
;             of the screen.
;     scale : Image is scaled to the screen size. The image aspect
;             ratio is not preserved.
;     zoom  : Image is scaled to the screen size. The image aspect
;             ratio is preserved by clipping the image.
ls_background_image=<path to custom bacground image:>
ls_background_transform=zoom

Background image borrowed from unsplash.com.
Photographed by Artem Pechenkin.
https://unsplash.com/photos/MPb_BQJNXv0

Background image borrowed from unsplash.com.
Photographed by Marek Piwnicki.
https://unsplash.com/photos/lzSkFeVbUts

This time, the xrdp.ini is edited each time.
To get closer to Windows spootlight, a regular update method is required.
A possible method is to use cron to periodically replace the background image file.

[matt335672]

Thanks for this @TOMATO-ONE

I'm away for a week or so. When I get back I'll give you my thoughts on the above. Hopefully others will comment too.

[matt335672]

Hi @TOMATO-ONE

Sorry about the delay.

My thoughts so far:-

1. Idea 1 - I personally think that's a good idea. I haven't looked at Windows 11 yet (all my hardware is too old!), but that's worth checking out too. I'll try to get a VM set up to checkout the colour(s). I don't have the skills to edit the logo either I'm afraid.
2. Idea 2 - There's a summary of Windows Spotlight on Wikipedia. Thoughts on this:-
   1. Downloading images from the internet isn't a great idea, as the login screen is rendered as root. I think it is prudent for the system manager to retain full control over XRDP images.
   2. Switching images periodically is probably a bit of work and there's not a lot of benefit as the login screen shouldn't be up for long periods of time. In fact, for security reasons, we should probably time the login screen out if there's no activity on it for some time. Picking a random image from a directory when the login screen is invoked would be pretty simple to do however, or we could use an ini file with a list of images in it that the system manager could add to. Providing a skeleton file with explanatory comments is probably enough. Distributing our own images makes the product larger and in many situations people don't use the login screen anyway.

Those are my initial thoughts. Let me know what you think.

[TOMATO-ONE]

welcome back @matt335672

Thank you for your reply.

1. idea 1.
   　I will also check what happens in Windows 11.

2. idea 2.
   　As you point out, I also thought it would be better to stop getting images directly from the internet for security reasons.
   　Not only Microsoft Spotlit, but also Google Chromebooks, Amazon FireTV screensavers and other similar mechanisms are possible because the respective companies can guarantee their security.

　I also agree with your concern that the archive size would be huge if images were included.

　I found the method of randomly selecting images from the directory to be simple and good.

[metalefty]

Hi, it sounds a good idea if we introduce new look.

What about replacing xrdp logo on login dialog? The current one is also cool, I like the atom-like picture but it is jaggy and not scalable.

This one is an unofficial one which I created years ago. I used it at xrdp users' group Japan. I own vector version of this logo. I think it suits modern UI like flat-design or material-design.

[TOMATO-ONE]

@metalefty
Thank you for providing the logo.

I was wondering about the logo in xrdp user's group Japan.
I understood that you grant redistribution under Apatch-License 2.0.

I will also make a design proposal for the login screen based on this logo.

[Samoangtagey]

@metalefty
I really like this logo :-)

@TOMATO-ONE
I like that idea, but I would prefer the Idea 1. I am using xrdp a lot and honestly a clean background causes less traffic. I know today high bandwidth is almost everywhere available, but sadly just almost. I'm using a very clean desktop with no wallpaper, just a background color, to keep it simple. Putting wallpapers would just cause a higher load.

Besides that it looks really good. For a local desktop i would like such wallpapers, but we are talking about remote ;-) therefor, causing less traffic is better in my opinion :-)

[TOMATO-ONE]

@Samoangtagey
Thanks for your comments, we appreciate your feedback.

As you point out, setting a background image on the login screen increases the amount of data transfer and makes it take longer to display.

I too would have preferred idea 1 as the default.

As for idea 2, I would like to realise it as an option.
I wanted to be able to realise it, for example, with an additional package in the distribution.

[matt335672]

@Samoangtagey makes a good point about bandwidth. I think the default should be low bandwidth so as not to discourage new users with poor performance.

Putting the above together, I get this. It's a test build so there's some funnies in it I've just noticed like an upper-case 'P' for password:-

It's a great logo!

Thoughts:-

• We'd need to provide the logo in both .bmp and scalable varieties, so that we can fall back to .bmp if xrdp isn't built with imlib2.
• We ship the above as a default (low bandwidth), but provide tools for users on LANs to configure more interesting backdrops. This would include providing multiple-image support.

Comments?

[TOMATO-ONE]

I agree with your idea that the default should be a simple login screen.

I will try to adjust the aspect ratio of the logo as it seems to be changing.

[TOMATO-ONE]

I have tried adjusting the parameters in the logo section of xrdp.ini so that the aspect ratio of the metalefty's logo is maintained.

;
; colors used by windows in RGB format
;

blue=0078d7
grey=e1e1e1
dark_grey=b4b4b4
dark_blue=0078d7

;
; configure login screen
;

; top level window background color in RGB format
ls_top_window_bg_color=1c4f84

; width and height of login screen
;
; When the sans-10.fv1 font is selected, these values are in pixels.
; For other fonts, these values (and other size values) will be scaled
; appropriately to preserve the proportions of the login screen.
;
; The default height allows for about 5 fields to be comfortably displayed
; above the buttons at the bottom. To display more fields, make <ls_height>
; larger, and also increase <ls_btn_ok_y_pos> and <ls_btn_cancel_y_pos>
; below
;
ls_width=350
#ls_height=430
ls_height=358

; login screen background color in RGB format
ls_bg_color=f0f0f0

; optional background image filename. BMP format is always supported,
; but other formats will be supported if xrdp is build with imlib2
; The transform can be one of the following:-
;     none  : No transformation. Image is placed in bottom-right corner
;             of the screen.
;     scale : Image is scaled to the screen size. The image aspect
;             ratio is not preserved.
;     zoom  : Image is scaled to the screen size. The image aspect
;             ratio is preserved by clipping the image.
#ls_background_image=
#ls_background_transform=none

; logo
; full path to file or file in shared folder. BMP format is always supported,
; but other formats will be supported if xrdp is build with imlib2
; For transform values, see 'ls_background_transform'. The logo width and
; logo height are ignored for a transform of 'none'.
#ls_logo_filename=/usr/local/share/xrdp/logo_xrdp_1.bmp
ls_logo_filename=/usr/local/share/xrdp/logo_xrdp_2.png

ls_logo_transform=scale
ls_logo_width=248
ls_logo_height=108
#ls_logo_x_pos=55
#ls_logo_y_pos=50
ls_logo_x_pos=51
ls_logo_y_pos=30

; for positioning labels such as username, password etc
ls_label_x_pos=30
ls_label_width=68

; for positioning text and combo boxes next to above labels
ls_input_x_pos=110
ls_input_width=210

; y pos for first label and combo box
#ls_input_y_pos=220
ls_input_y_pos=158

; OK button
ls_btn_ok_x_pos=142
#ls_btn_ok_y_pos=370
ls_btn_ok_y_pos=308
ls_btn_ok_width=85
ls_btn_ok_height=30

; Cancel button
ls_btn_cancel_x_pos=237
#ls_btn_cancel_y_pos=370
ls_btn_cancel_y_pos=308
ls_btn_cancel_width=85
ls_btn_cancel_height=30

[TOMATO-ONE]

You can use the png image attached by metalefy.
Attached is a bmp file with adapted background colour for builds without the with-imlib2 option.
logo_xrdp_1.zip

[TOMATO-ONE]

The above parameters are the result of an hour or so of trial and error.
I have no knowledge of UI design.
If you have any suggestions, even small ones, please let me know.

[matt335672]

The aspect ratio is a good point - I missed it completely, so I think my knowledge of UI design is less than yours!

[matt335672]

Also, here's the scaled one for higher-res screens which is what would happen with #2341

That's not using a scalable logo, but even so it looks pretty good.

[TOMATO-ONE]

I have also tried your build in hidpi mode.

[metalefty]

I'll upload the logo on GitHub later.

[Samoangtagey]

@matt335672 I think this looks really nice and fits to actual used styles :-)

[matt335672]

For reference, the Win10 RDP login screen looks like this (background colour = 0x003057) :-

And the Win 11 RDP login screen looks like this (background colour = 0x000000) :-

It's not something a lot of people will see as you have to disable NLA to get to it.

For the Win 10 password screen background I get a background colour of 0x003157(?) For Win 11 I get 0x000000.

I got the background colour numbers from snapshotting a VM screen image into the GIMP.

@TOMATO-ONE - your background colour is 0x1c4f84. I think it looks pretty good, but I just wondered where you got it from. Am I missing a Windows screen somewhere? I don't have a server installation available.

[Samoangtagey]

I like it. The blue tone comes pretty intense, but not too intense. I'd say keep it that way :-)

[TOMATO-ONE]

Thank you.

Once @metalefty uploads the vector image, I will generate a new logo png/bmp image based on it.
I would then like to make a Pull request.

[matt335672]

I'm happy with either blue - it's just good to have some traceability as to where it comes from.

[metalefty]

Here it is: https://github.com/metalefty/xrdp-logo

[TOMATO-ONE]

@metalefty

Thank you for providing the vector data logo.
I will install inkspace on my PC and process it.
As a matter of fact, I have little experience in handling vector data, so please give me some time.

[TOMATO-ONE]

It's been a while.

I am preparing a Pull request.

I am wondering about image files to add to archive.
Could you please give me some advice?

My idea is to attach the following five image files

1. a logo file in bmp format for a standard-size logins screen, with the background colour set to #f0f0f0
2. png format logo file for standard size login screens with background colour set to transparent colour
3. bmp format logo file for HiDPI login screen with background colour set to #f0f0f0 (enlarged 1.8x)
4. png format logo file for HiDPI login screen with background colour set to transparent (enlarged 1.8 times).
5. SVG format vector logo file for users to generate bitmap data of any size.

The total of the five files amounts to 355 Kbytes.
Do you think it is unnecessary to attach a png file with a transparent background colour for xrdp with imlib2 enabled?

[matt335672]

Hi @TOMATO-ONE

I don't think you should assume that the logos will be sized for only the 10 point and 18 point font, as the users now have the capability to create their own fonts. Just let xrdp or imlib2 handle the scaling for you - xrdp has basic scaling code built-in if it's not built with imlib2.

I think you only need two files:-

1. A bmp file for non-imlib2 builds.
2. A transparent png file for imlib2 builds.

In xrdp.ini, constrain the logo with:-

ls_logo_transform=scale
ls_logo_width=240
ls_logo_height=140

Within the code, if ls_logo_filename is null, you can do something like this in xrdp/xrdp_login_wnd.c :-

        /* if logo image not specified, use default */
        if (globals->ls_logo_filename[0] == 0)
        {
#ifdef USE_IMLIB2
            g_snprintf(globals->ls_logo_filename, 255, XRDP_SHARE_PATH "/xrdp_logo.png");
#else
            g_snprintf(globals->ls_logo_filename, 255, XRDP_SHARE_PATH "/xrdp_logo.bmp");
#if
        }

If you want to include metalefty's .svg file too that's fine, but we can't load it directly at the moment. Alternatively you could add a README.logo which links to metalefty's repo.

Use whatever size logo works best when it's scaled up or down.

Does that sound reasonable, or have I missed something?

[TOMATO-ONE]

@matt335672
Thank you.

I shall add 500 x 220 pixel bmp and png image files.
For svg vector image files, a README.logo should be added.

[TOMATO-ONE]

PR #2366 proposed.