Patch: Improved notification preview

Rating: 
4.5
Your rating: None Average: 4.5 (8 votes)

Moves a bit enlarged icon inside the notification bubble and provides settings to customize notification preview's look and behavior.

You can determine

  • Style of the preview
  • Margin and corner radius (if selected style permits)
  • Maximum and minimum width
  • Duration which the preview is shown
  • What tapping  the preview and swiping it left, right and/or down does.

No more waiting for notifications to time-out out of the way or gathering useless notifications to the events view.

Currently, removing does not work with email notifications. It has probably something to do with notification's email address headers as normally the header is the app's name.

Requires Patchmanager.

You can help translate the patch to your own language here.

Donations are welcome:

Screenshots: 
Changelog: 

* Mon Oct 16 2017 0.4.1

  • Duration setting
  • Small fixes

* Fri Oct 13 2017 0.4

  • Settings page with lot of customation options
  • Bugfixes

* Tue Jul 25 2017 0.3

  • Soft corner only if it doesn't face the side of the screen
  • Notification preview's width is determined by the body text
  • Mimimum preview width is 80% of the portrait-screen-width
  • Maximum is full screen width

* Sat Jul 15 2017 0.2

  • Changed patch for overall notification preview improvement patch.
  • Portrait-screen-wide notification
  • Icon moved inside notification bubble and enlarged
  • Reduced the margins restricting preview texts a bit

* Sat Jul 15 2017 0.1

  • First build.

Comments

naytsyrhc's picture

I really love this patch. Notifications look so much better and as they should have looked from the beginning. Thanks a lot!

Ingvix's picture

You're very welcome.

olf's picture

Wow @Ingfx, the customisations "Patch: Improved notification preview" v0.4 provides are incredibly cool!

I almost had trouble to decide between the many choices it offers now, but even that is quite easy with the ability to preview the notification preview look with the top pulley in its settings entry.

Two suggestions came to my mind playing and enjoying it:

  1. IMHO its settings entry should be called "Notification preview" (instead of just "Notification"), as that is what it is all about.
  2. If it is technically feasible, a setting for the duration a notification preview is displayed would make your Patch even more perfect.

Thank you so much for this extremely useful and nice looking improvement of the SailfishOS GUI!

Ingvix's picture

I was sort of thinking that Notification could be the page's main subject in case there'd be some settings for notification in general by someone in the future or something like that. Though it might've been a bit too precautious of me. If that kind of case would present itself I could just update my patch to match it. So I guess I'll change the settings entry to Notification preview for the time being as you suggested.

The preview's duration setting can be implemented quite easily. I'll do it for the next release.

olf's picture

Kudos, as you created the 0.4.1 release incredibly quick and ... it's incredibly cool!

alina's picture

Very well implemented. However I prefer that the direction won't be important for the action, i.e. swiping to both left and right will do the same thing and we will have an additional swipe to top e.g. for deletion.

Ingvix's picture

I will see if I can implement optional swipe directions for different actions in the next release.

MoritzJT's picture

Could you give your patch a few options about width and what it derives from?

Best patch in a while! I disliked those non dismissable obstructions...

Ingvix's picture

Yes, settings are on to-do list.

olf's picture

This seems to be a small bug, when determining the width of a notification preview:
When the first ("title") line is longer than the second line (which is rarely the case), it is still truncated and "fades out" near the right edge. It looks, as if the width of a notification preview is solely calculated based on the second ("Details") line; but when the first line is longer, IMO its width should be used instead of the width of the second line.

Ingvix's picture

Yes, the width is currently only determined by the body which usually is the longer text. I can fix that in next release.

olf's picture

Thanks, that would be nice.
And take your time, as this is a really minor flaw (which rarely occurs).

naytsyrhc's picture

This is really a very nice improvement. For me the notifications now look more integrated and more "sailfish-like" than before. As if the look should have been like that from the beginning. I'd suggest to make something like a "pull request" on sailfish sources in order to get that into official system without patch. Well done and many thanks!

Ingvix's picture

The sharp corners are like that by design as said in the changelog. The round corners were the reason I didn't like it anchored to the right so I though I could make the corners facing the screen sides sharp so they seem attached to the sides.

I was thinking of making the remaining soft corner more round but did not end up doing it at least for this release. It's true that it would increase the distinctiveness from the others so you wouldn't think so easily what you just did, that part of the preview would be left out of the screen. And look better in general too. Maybe I try to create some setting for the next release so every one could make the preview just like they want to.

olf's picture

After using "Improved notification preview" for a while and reconsidering the layout options, I absolutely concur with your current (as of v0.3-1) design choices, especially WRT:

  • No "bubble style" (contrary to Jolla's original notification preview) by omitting the top and left spaces between notification preview and screen border; otherwise that consumes space, which is not available for the notification content, i.e. forcing a smaller font size (as in Jolla's original notification preview), being detrimental to the goal of improved readability.
  • The logical consequence of this is "Soft corner only if it doesn't face the side of the screen", as having all four corners "soft" / round would look awkward without a small spacing between preview and screen borders.

Thus the only remaining layout suggestion I still have is to make the single "soft corner" a bit "rounder" (i.e. to increase its radius), as you already considered.

Side note: While having a look at Jolla's original notification preview on somebody else's SailfishOS device a few days ago, the vast improvement in readability and much better look of your "Improved notification preview" (which I already gotten used to so much, that I only faintly remembered the original) became immediately apparent.
Kudos to you for this!

olf's picture

Oops, did not see this message from you until now (should have reloaded page in browser) and updated my last message below, meanwhile.

No, there is no need for a settings page, which needs efforts to create and maintain, while IMO being unnecessary for a small Patch / UI change like this.

Look, IMHO *this* discussion thread is defining the (one and only) settings for "Improved notification preview": Anyone can criticise your design decisions (like I did), discuss with you, try to convince you with reasonable arguments, ... but ultimately you decide (as "Improved notification preview" is your baby). This process sets the look & feel, and has IMO already resulted in a balanced design.

fravaccaro's picture

I don't want to sound rude, but why would there be no need for a settings page? You're ok with 0.3, I was ok with 0.2 (no, I don't like the new left-anchored design) and the author himself couldn't make up his mind between a couple of different design choices (namely landscape width, margins and corners).
So, assuming he's up for it (as I stated I'd be glad to help), the patch could only benefit from a settings page.

fravaccaro's picture

I'm not sure rounded corners would fit tho, assuming Ingvix wants to follow the remorse pop-up look

Ingvix's picture

I sort if like it with the round corners after all. I'm not really going fo the remorse pop-up look but just a more practical and aestetic on the side if possible. If I was enough experienced I could make a setting page so you can select your own look but maybe in the future.

fravaccaro's picture

Settings page is doable by using ConfigurationGroup. E.g. for the corner radius, instead of a fixed value you put the name of the dconf key which can be changed via a jolla-settings plugin (it is a pretty standard qml page installed in a specific path).

Ingvix's picture

I tried to use it before in another project but I couldn't figure out how to create a new dconf key for my needs. Guess I need to look again.

fravaccaro's picture

I don't know a lot but it works for my needs :) if you need any help you can pm me

fravaccaro's picture

The new look is lovely :) it resembles more the remorse pop-up, I like this coherence :)

olf's picture

Cool, an excellent UI improvement!

@Ingvx, your design choices are absolutely right, IMO: Rounded corners and *not*-full-screen-width in landscape orientation, to clearly distinguish notifications from UI elements with rectangular corners, which take the full screen width (e.g. remorse timers). Otherwise this would be confusing.
The improvements in detail of v0.2 (e.g. enlarged icon within the notification and smaller text margins) makes this Patch's look & feel just perfect (for me)!

But as horizontal space in these transient notification bubbles is usually too scarce (i.e. the lower text line much too long to fit into the notification bubble, so the second line starts scrolling after a moment, but then the notification already vanishes, making it impossible to read the full text), I am thinking about ways to enlarge this space.
If it is technically possible to use different notification bubble widths for portrait and landscape orientation, I suggest letting the notification bubble always start in the upper left corner of the screen (in both, portrait and landscape orientation), but while using the full screen width in portrait, only use >=75% of the screen width in landscape orientation (note, it has to be at least 75% to provide more space even on screens with 4:3 aspect ratio).
If this is technically impossible, then this Patch is basically "final" in its current look (as of v0.2), IMO. :)

Ingvix's picture

I believe it can be done but why 75% and not full landscape screen width? And I feel that if it doesn't fill the whole width it would look prettier in the center, especially now that the icon is located inside the bubble and does not work as a certain kind of visual anchor which would make it work for the notification to start from the left corner. As the preview is more symmetrical now, it feels more natural it to be in the center of the screen.

olf's picture

True, so go for the full screen width of the notification bubbles in portrait *and* landscape orientation, as this provides a consistent look & feel for both orientations (as you correctly pointed out) and fully utilises the available horizontal space (as @fravaccaro already suggested, but with rounded corners).
Yes, that would create a lot of empty space on the right side within the bubble for very short notifications, but IMO the ability to read the text of long notifications outweighs this by far.
BTW, on my Jolla 1 phone under SailfishOS 2.1.0.11, the notification bubbles are not exactly centered with v0.2, but slightly shifted to the right in landscape orientation.

Thinking about it (and imagining how that looks), this is clearly better than the current somewhat centered look in landscape orientation (as of v0.2) and the original off-center, anchored in the upper left screen corner look (which I suggested to bring back in landscape orientation).

Ingvix's picture

I checked the case on my old Jolla1 and the preview was right in the middle in landscape mode. See my screenshot here. Could it be that your eyes just played a trick on you there?

I was also wondering if it'd be good idea if in landscape mode the notification preview would be as wide as needed for the text to be fully visible, maximum width of course being the maximum landscape width. Minimum could be the portrait width. This would overcome the aestetic problem when the preview width would be the screen width in landscape mode and and notification text would be short and there'd be a lot of empty space which would look a bit ugly.

olf's picture

a. Well in your screenshot the notification bubble (= notification preview) is obviously (literally!) centered, but on my two Jolla 1 phones not (slightly shifted to the right). But I have tons of Patches installed.

b. Oh, that sounds perfect, if variable width notification bubbles are easily feasible.  I originally considered this being more complicated than necessary.
But then please anchor the notification bubbles in the upper left screen corner (again), as they otherwise would be "jumping" in width (depending on the actual text length) to the left and right side, each time a notification bubble appears.  This way the left edge of the notification bubbles (with the icon and header text) would still always be at a fixed position.

And this visual scheme (i.e. anchoring and horizontal layout of the notification bubbles) is generic enough to be applicable to both, portrait and landscape orientation (so no separate code paths are needed, only the actual screen width as upper limit of the notification bubble width). :)

Ingvix's picture

I sort of like it better in the center but I guess I can make two releases of it. One emerging from the side and other from the center. Though it's currently a bit impractical if installed from an app where you can only install the latest release but I have high hopes that Storeman app would later allow to choose which version or release to download and install. For your convenience I can make the side emerging one the latest so it can be installed straight from the app.

olf's picture

Sounds like a good plan.

Note, that IMO the proper way to handle two different versions of a software in a single repository is to give them different names (e.g. "Better notification preview - centered" & "Better notification preview - left-aligned") and to make their RPMs conflict with each other; AFAIK there is nothing Storeman can do better than Warehouse here, as they both are just GUI front-ends for rpm / pkcon.

Pages