== Overview
=== Goal
Add “On this Day” card to the feed as part of the overall goal of improving the feed’s ‘explorability’ by introducing new and fresher types of content.
=== Background
The ‘On this day’ card has been implemented on iOS since v5.6 of their app, and has been well-received by their users. Additionally, it has been requested via Android user feedback such as OTRS, as well as in the recent Android feed usage survey results (https://goo.gl/SAnzEq).
//Note: Further information regarding the iOS implementation may be found on T135769 //
=== How would we like users to solve this problem or discover this solution?
Users should notice the new type of card by a distinctive new visual design and contents of the card, whilst the card shell will be harmonious with the other existing card types.
=== How do we know we’ve been successful?
- Increase in daily opens based on users being interested in daily new content
- Higher PVs via On this Day
- Increase in installs due to attraction of fresh content
- User feedback via reviews
=== Mocks of proposed designs
==== Interaction flow
**Invision prototype: https://wikimedia.invisionapp.com/share/SKEE7H9CP **
//Redline mocks are shown tagged with "On this day" on Zeplin board https://zpl.io/GaRQKKV //
==== STEPS (QA required {icon check color=green})
# User opens the feed and sees On this day card.
# User swipes left over the inset article cards to view more associated articles for the featured event.
# User opens the On this day details view either by tapping on the On this day footer OR within the card itself (except for the inset article cards)
# Within the details view, user scrolls down to see more events (note the 'flexible space' collapses down, refer Material spec [[ https://material.io/guidelines/patterns/scrolling-techniques.html#scrolling-techniques-behavior | scrolling techniques ]])
# User scrolls a few of the inset article cards in events so they appear over the timeline illustration. User then scrolls to the bottom of the screen (whilst scrolling down, it is expected the horizontally scrolled article cards maintain their position). The user is able to tap on ‘back to top’ to quickly return to the top of the details screen.
====NOTES ON DESIGN:
**Feed card**
| Card {F10703188} | With inset article cards scrolled {F10703196} | Dark mode {F10765145}
- Entire card is tappable (either opening the details view, the individual articles or the overflow menu)
- Article links within the event text are highlighted by making the font-weight Roboto Medium
- The 'years elapsed' tag for the next event should be partially shown as a visual hint that there are more events.
- The 'featured' event is selected based on the logic applied in T169941
**Details screen**
| Initial view {F10703192} | Example on scroll {F10703199} | End of events {F10703203} | Dark mode {F10765147}
- Initially, **only historical events** from the endpoint should be shown.
- There is ideally an animation transition of the date header from the feed card to the details view (see prototype for example)
- The header in the top section of the details view is inside ‘flexible space’ that shrinks to the toolbar upon scroll.
- On scrolling, the top ‘years elapsed’ tag remains sticky until the following tag scrolls up to replace it by ‘bumping’ the top tag off-screen)
- Each set of inset article cards can be horizontally scrolled and maintains independent scroll position regardless of the vertical scroll
- there is a dark mode for this view
**Navigation when article opened from On this day**
- If the device ‘back’ button is tapped, the particular article tab is closed and user returns to the On this day details screen at the same scrollpoint in the screen.
====ENHANCEMENTS / V2 ‘ON THIS DAY' PROPOSALS
// To file as separate tasks //
[ ] Enable sharing of ‘On this day’ event content
- Proposal 1: Long press on text triggers share-a-fact card [file as separate ticket]
- Proposal 2: Long press on text triggers (copy) of text with link to OTD page
[ ] Enable secondary actions on articles within On this day
- Proposal 1: Long pressing on the inset article card allows users to take any action to save to reading list, share, and/or open a link preview
- Proposal 2: Add a small overflow on each inset article card to allow share or adding to a reading list
[ ] Allow the user to see all types OTD events (Births, Deaths, and Observances) in the details view along with historical events, through addition of a filter bar
[ ] Allow users to select other days to view from OTD details
- Proposed: Change date via a dropdown on the toolbar, with shortcut to current day (utilize pattern from Calendar)
[ ] Faster navigation through event details using the 'outline tool'
**//NOTE: Initial design explorations can be seen in the "Archive" section of the same Invision prototype//**
=== TO DO
[x] Integrate with the existing REST endpoint that provides on-this-day information.
[x] Designs for the On this day card on the feed, and the detailed view
[ ] Analytics for new On this Day events