^ Updated description with mocks.

This looks good! Love the expanded state.

I think the criteria are pretty clear, so I'm going to put into next step for team review/dev scoping.

Note that this includes a widget design, which is related, but will be scoped for development separately.

@JMinor – I put in "Currently trending" as the placeholder title in the notification for now, but we may want input from Comms...

Per our meeting @JMinor needs to refine the criteria to prevent vandalism and vulgarity.

Please use T117599 for B - Explore feed item, and T142761 for C - Widget

@RHo @JMinor there's somewhat of a restriction on how the UI is displayed after the user force touches the notification- the standard notification UI is displayed below and we have no control over it:

The green area is where we can place our custom view (it will be taller than that, this is just a placeholder). Let me know if/how you want to alter the design to accommodate this.

@RHo please update and put back in ready for dev.

@JoeWalsh – can we make the entire notification detail use a custom view? Akin to how iMessage works

I ask because I expect that the full news item text on 3D-touch would also be custom as well since we want to style any links in the text in Semibold – in the example below, the news item contains links to "Mayor of London" and "Michael Gove" as well as the main "Boris Johnson" article.

Having said that, if we do need to incorporate some portion of the initial notification, here is an alternate design.

@RHo our custom view can't handle any user interaction, the only interaction allowed is with the action list below the notification. Should the links still be bolded even if they aren't tappable?

@JoeWalsh - Yes, it's using the same visual cue as the cards in the 'In the news' widget to help reinforce the idea that there are multiple articles users can read about within one news item.

@RHo @JMinor a current limitation of the API for news is that we know all of the links in the blurb, but no indication of which is the most important. For example:

<!--Sep 28--> <a rel=\"mw:WikiLink\" href=\"./Nobel_Peace_Prize\" title=\"Nobel Peace Prize\" id=\"mwBA\">Nobel Peace Prize</a>-winning former <a rel=\"mw:WikiLink\" href=\"./President_of_Israel\" title=\"President of Israel\" id=\"mwBQ\">Israeli President</a> and <a rel=\"mw:WikiLink\" href=\"./Prime_Minister_of_Israel\" title=\"Prime Minister of Israel\" id=\"mwBg\">Prime Minister</a> <b id=\"mwBw\"><a rel=\"mw:WikiLink\" href=\"./Shimon_Peres\" title=\"Shimon Peres\" id=\"mwCA\">Shimon Peres</a></b> <i id=\"mwCQ\">(pictured)</i> dies at the age of 93.

Yields a list of articles containing Nobel Peace Prize, President of Israel, Prime Minister of Israel, and Shimon Peres. Should we show all of the articles in the list since we don't know which is the "most important"?

@RHo @JMinor one potential idea would be to cross reference the list with trending or view count - pick the top trending or most viewed article from the list.

@JoeWalsh +1 – I was going to suggest it should be the highest trending article in that news item.

@RHo - current screenshot:

I don't see any place to add icons to the action buttons (but will keep looking). I used the built in fonts that scale up and down the system setting rather than the fonts specified in the design - let me know if those look OK.

Hey @JoeWalsh - this is looking really close already!
As for the icons on the action buttons, this is available when you 3D touch for actions in other places such as on app icons or a place in Apple Maps, but may be is not an option in Notifications yet and isn't a dealbreaker, so wouldn't spend toooo much time looking for it.

Few very minor visual tweaks based on the WIP screenshot you posted:

• Add 5pt space between the news item text and the widget header.
• Add 5pt space between the news item text and the top divider line of the main article.
• News item text should start on the LHS where the the divider lines start (width of this paragraph is the same as the article divider lines)
• Can we make the article divider lines 0.5pt and either rgba (0,0,0,0.2) (or else #cccccc if opacity is not possible) ?
• Article thumbnail should be slightly smaller than the current mock (48x48pt)
• Article thumb and text should have padding (15pt, 10pt) per below:

• Can the graph grid lines also be made 0.5pt thick?
• The actual trend line should be 2pt thick in this larger chart 
• The text for # of readers is a slightly larger font-size, using SF UI Display 28pt

@RHo - Updated

For the # of readers, I picked the closest built-in font that automatically scales when system text size changes. I can up it to SF UI Display 28 pt but we'll lose the auto-scaling. Let me know if that's fine.

Should the gridlines on the Top Read widget be 0.5pt as well (they are also 1)

Updated screenshot:

@JoeWalsh – ah let's keep it to the system scaleable font size then for now.
And yes, please update the Top read widgets as well – including the color!

Also also, more of a question for @JMinor, but are we fine to show 'readers' after the number? It's not strictly necessary, and removing it can mitigate potential translation issues.

@RHo @JoeWalsh - please remove "readers", in addition to localization needs, its also inaccurate, as this number is the number of page views, not unique users. If we want to use some text I'd suggest "views".

@RHo @JMinor also, if the number goes over 1 million should we switch to MM (same question for 1 billion and B)?

@JoeWalsh @JMinor

TL:DR; I'd suggest using single 'm' for million, and 'b' for billion.

I think 'MM' to express million is used more in specific finance/accounting contexts [1] derived from latin 'mille mille', where a single M denotes one thousand. Since we are using abbreviations that appear to be instead based off the SI [2] where k=kilo for one thousand, I would suggest using m=mega for one million.

[1] https://en.wikipedia.org/wiki/Million
[2] https://en.wikipedia.org/wiki/International_System_of_Units

We're already getting pushback from TWN about translation of "k" thousands symbol.

Adding new unit symbols is only going to make things harder for translators.

Recommend no new unit symbols until internationalization issues are addressed.

@RHo @Mhurd @JMinor I added the ability to 'opt-out' of the k, m and b style suffixes. Here's what it looks like on the top read widget:

and on the in the news notification:

The instructions for the translators are as follows:

$1k - $1 is replaced with a number represented in thousands. In English the letter 'k' is commonly used after a number to indicate that number is in 'thousands'. So the letter 'k' should be changed to a character or short string indicating thousands. For example 500,000 would become 500k. If there is no simple translation for this in the target language, make the translation $1 with no other characters and the full number will be shown.

@RHo could I have the asset for the icon shown in the notification here?

Also, is that to be shown only when there isn't an image for the article or always?

Thanks

hey @JoeWalsh - let's use this for all trending news items.

I've popped it in the assets section of the Zeplin – as a whole icon, and as separate trend up arrow and white circle.
https://zpl.io/TUmHF

Note it is smaller than the earlier mock after s/w Nirzar who noted that the size for image thumbs is restricted in notifications.

@RHo it looks like we can only attach a JPEG which means no transparency. Have you seen an app that has an image with transparency as in the mock? Maybe i'm missing something

@reets here's how they crop it (we can adjust the crop rect):

Related info from developers having the same notification image cropping issues:

https://forums.developer.apple.com/thread/51849
https://littlebitesofcocoa.com/261-rich-notifications
http://www.openradar.me/27708976

@RHo @JMinor so after fighting with this image API some more, we can't reliably crop to faces. (see related bugs and other developers having issues with crop rects in my previous comment). This results in either cropping way too close to the face or missing it entirely:

Should I only show an image if there's no face detected? Should I continue to try to hack around it? The next thing to try would be to render out an image with a blank padded area around it. It would work (and we could use the same strategy on the icon) but if Apple actually fixed the issue, users could see a blank white or black frame around the image.

hi @JoeWalsh – if it is not hard to show the thumbnail only for images with no face detected then that seems the best workaround for now,
else my preference is to not show the image thumbnail on the notification if it involves too much hacking to get it working semi-properly, esp. if it's likely that this will be fixed/updated by Apple at some point.

Just to clarify, if notifications do not have a thumbnail the text goes across the full width of the notification container:

@RHo sounds good. Also, that's correct, if there's no image, the text goes the full width.

@JMinor how frequently do we expect these criteria supposed to find a notification-worthy article? In the past 30 days, the only article in the top read on the day before it was "in the news" was Hurricane Matthew.

@JoeWalsh I expected the frequency to be 3-5 per week (not daily, but also not 1 in 30 days).

Based on my "hand done" version:
https://docs.google.com/spreadsheets/d/1s9K37-9d6vDcOYn7l5DR4f9zRruud2KKRjtYkHqfesU/edit#gid=1641789501

Can you check the period from July 7 - Aug 6 with the real implementation and compare to the spreadsheet? If it turns out we just have a quiet period we may need to expand or reconsider criteria (perhaps summing all the articles linked in an item?).

@JMinor the issue on my end was thinking that the news endpoint provided old content (it doesn't, only returns the current date: https://phabricator.wikimedia.org/T139481)

@JMinor is there a particular time we should prefer in that 8 AM to 9 PM window? The sooner the better? Aim for between 5 and 9 PM?

[edit] Nevermind - just saw the "as soon as they're detected" line - I guess the only question left is what happens if it's detected while the user is using the app? Discard the notification?

@JoeWalsh I'd say "as soon as possible" for version 1. In the analytics ticket I asked that we pass the local time of push as a value on the send event. I'm hoping between qualitative feedback and that we can determine if we should be more of an "evening edition" or a "wake me up with this" type of content.

Is there a particular time or time interval where the in the news items are polled for? Pageviews only update once a day, but my understanding is in the news is pushed when editors choose to update it. But I know that is proxied/cached by MCS.

@RHo I noticed Apple's iTunes Connect dashboard (and various headlines around the web) use capitalized suffixes for numbers - otherwise the lowercase m is a bit ambiguous (minutes, meters, etc). I'd like to propose a switch to capitalized suffixes.

Before:

After:

Agreed @JoeWalsh - looks good 👍

This is in with Corey's code review for feed changes.

Need a tweak to push a notification.

Tweak and test split off into its own ticket.

@JoeWalsh – just noticed (actually Nirzar pointed this out) that the the 3D touch view of the notification is showing 2 lines of the article extract instead of the wikidata description.
Also would be good to update the font-size for the number of readers to 28pt (which incidentally matches the size of the built-in Title 1), and have that number baseline aligned to the chart.

Expected:

Actual

updated - using built in Title 1 font and the Wikidata description on only one line:

Thanks @JoeWalsh - any chance that number can be moved down ~2pt as well so the baseline matches the bottom of the graph x-axis? 😬

@RHo updated - let me know how it looks

@JoeWalsh – perfect, cheers.

@JMinor quick question about scheduling logic - with the new logic that tries to force a notification every three days, should we also limit the notifications to the first news item? For example, if users get an notification today about the first item, then no new news story is added in the next three days, they would get a notification about the second story (which is potentially over 3 days old).