Bring back the Loading Splash Screen to give Fluxer more personality

(#1408) Feature Under consideration desktop ui

1mo agoby RexSystem originally by @comfy-deer on GitHub

Current problem

Currently, the current version of Fluxer Canary has completely removed the Loading Screen boring-fluxer Meanwhile, this remains on the old Fluxer Stable client. (And I get it, it's the outdated client that hasn't received updates) But it did add that wonderful space-themed background to encourage trying Canary! try-canary-today stable-fluxer And even the wonderful Mobile App! (shoutout to the mobile devs!) Even the little Toast/pop-up message has the animated logo and moveable starry background! It's so good! mobile_splash mobile_post-splash It's so simple, yet it has such whimsy. Such personality. It was perfect! But now we have nothing but a boring husk, just because it "loads so much faster." It feels so... incomplete. Very sterile and corporate. I don't like it, and I believe I am not alone in this sentiment. And thus, I propose this GitHub Discussion post!

Proposed change

Screenshot Mockups to be provided below in Additional Information I have several suggestions that could work. And I'm allowing commenters on this post to pitch in for their desired perfect Loading Splash Screen. I am but one random fellow deer that enjoys using Fluxer, after all. ^^ This would add so much more personality and professional completeness to Fluxer as a platform. It's much too jarring to just load in with nothing but that skeleton template. Focusing too much on the function factor and ignoring the form (The UX matters). And self-hosters could take advantage in further personalizing their own instances of the Fluxer app! An option to also allow a customizable logo would add a lot to really truly make Fluxer/self-hosted version a wonderful chat app to use/host! It would be so much more complete, even if it means waiting a femtosecond longer. Much less jarring to give Fluxer more personality. ---

Details

Mockup 1, Simply add the pulsing logo back in the center

I still have to wait a few seconds to have the app load. I'd like to see some proper loading feedback. It otherwise just feels jarring to just have a skeleton loader.

Mockup 2, and in turn, Mockup 3: Convert the "Upgrade to Canary" to the Loading Screen backdrop

This adds the lovely space-themed background. At the center, it could be the floating loading screen (based on something The Blind Bard has mentioned, and even something Hampus himself has hinted of some form of loading, except it was simply a logo that was floating up and down).

Mockup 4, add the animated Toast from the Mobile app!

Simple, overlayed on the very top. Actually, I'd this to also accompany any time Fluxer has an issue with connecting, rather than being presented in the upper banner. It's much more elegant (and the logo gets to stick around with its animated glory)

Mockup 5, recreate the Mobile devs' splash screen into Desktop/Web!

This would fix the style discrepancy between the mobile app. Not sure how to translate this sort of code to Desktop, but if I did, I'd probably take time to do it like this. imo, it's the best that Fluxer has become after it was introduced to the mobile app.

Mockup 1, Simply add the pulsing logo back in the center

loading_image

Mockup 2, Convert the "Upgrade to Canary" to the Loading Screen backdrop (color logo)

loading_image_2

Mockup 3, Convert the "Upgrade to Canary" to the Loading Screen backdrop (white logo)

loading_image_3

Mockup 4, add the animated Toast from the Mobile app!

loading_image_4

Mockup 5, recreate the Mobile devs' splash screen into Desktop/Web!

loading_image_5 loading_image_5_transition loading_image_5_end

646696058-7a9cc845-0220-46c2-9585-ff09f1977d88.png
1920×1080 | 173 kB
646701684-4c569983-ff59-4a12-86b6-d7dd612a58a3.png
1717×965 | 192 kB
646698101-19dd145c-8d43-44d9-b46d-496532402e1c.png
1920×1080 | 26 kB
646697025-85bf4e24-b907-46ee-aaec-22185348efb4.jpg
1179×2556 | 2.0 MB
646697026-e79295bd-744f-4429-a3f4-c4342b4178d0.jpg
1179×2556 | 363 kB
646693632-2a259cee-5dd0-45f8-9763-9f163ba887c8.png
1920×1080 | 157 kB
646693645-caab9a75-8c7a-4bbc-a621-26d71cfbef89.png
1717×965 | 176 kB
646693653-370c7b63-41ab-45ec-b131-8653a081cb82.png
1717×965 | 178 kB
646693658-0e251362-faab-4050-ae1d-71ab79581b46.png
1920×1080 | 582 kB
646693668-883304cc-6a36-4868-a2fb-b52356972839.png
1920×1080 | 495 kB
646693674-ced9e8c3-dae2-4907-8ec7-ce70f8b6190c.png
1920×1080 | 410 kB
646693680-6f013013-2eab-4d81-a247-385fe0e9506a.png
1920×1080 | 425 kB

7 comments

RexSystem 1 vote 1mo ago originally by @xfalc0 on GitHub

I'm personally a fan of Mockup 5, as it brings continuity between the desktop app and the mobile app. I strongly support the idea to bring back loading splash screens and loading screen quotes back to the desktop client. While it may certainly not contribute to optimizing the app per say, adding personality to the app adds to its general user experience. The Fluxer project is open source and is heavily backed by its active community. I think adding back quotes is a great way to recognize the people who have contributed to the project's success. Furthermore, considering that Fluxer is self-hostable, giving instance operators the ability to add quotes by the communities that they serve helps personalize those instances to their communities. Should instance operators not care to show loading screen quotes for moderation reasons or other, then it should be toggle-able from the admin panel. Looking further ahead and down the line towards federation, should quotes be re-implemented, the instance that the user account originates from should be the instance that dictates the behavior of the feature.

Permalink

RexSystem 1 vote 1mo ago originally by @AvaLilac on GitHub

I miss the loading screen a lot, I understand the skeleton reason, although I think the loading screen should be brought back. and the skeleton by itself just looks bad. Mockup 5 is BY far my favorite, and i think this should 100% be implemented into the client. Along with mockup 4 Making this faster is okay, But the skeleton is not only boring by itself. But it honestly feels sluggish even though its faster, Loading screen exactly like mockup 5, Is exactly the way to go. still have the skeleton and load times. yet the loading screen is still there which gets rid of that sluggish feeling, This is 100% needed for the client

Permalink

RexSystem 1 vote 1mo ago originally by @sarthaksinha363 on GitHub

I agree with this post and personally am a fan of Mockup 5 aswell. No splash screen really makes me feel like something core is missing from the app even if it is faster (I honestly did not notice the difference in speed personally) it just makes it feel a bit... incomplete and generic without the splash screen

Permalink

RexSystem 1 vote 1mo ago originally by @vkyfox on GitHub

I didn't have any strong opinions on the matter, but I do agree that it can be jarring, even upsetting, to be greeted with emptiness, especially if loading takes a while; especially for the least techs literate among us whom might miss the fact that this is a temporary loading state, and may worry that they "lost their fluxer". I think any of those mockups look good, i like the idea of having a similar identity between mobile and desktop so i would say 5 is my favourite. One thing though is, I never noticed this skeleton myelf as the app does indeed load lightning-fast! A neat idea could then be to have the desktop client save loading times internally and choose behaviour according to last known load speed? Like sub 1s keep the current behaviour else display the loading? I feel like doing this on desktop as opposed to mobile would mean you generally have the same connexion and specs, so similar loading times, but it might create some inconsistencies on laptops that use a lot of different wifis? Not sure.

Permalink

RexSystem 1 vote 1mo ago originally by @TheBlindBard1978 on GitHub

Mockup 5 would be nice, considering it'd correlate with the mobile app and the desktop client!