Page MenuHomePhabricator

As a user, I want to see more about this article and related articles in the article footer
Closed, ResolvedPublic3 Story Points

Description

After end of article, show Related Articles and About this Article

Design
See pholio mock!
Related articles section uses same spec as explore feed. Difference: Section title outside of card instead of inside.
70 pt padding before section title.

About this article
This card will be a great way to hold miscellaneous items, and will be useful to the reader.

  • Read in [x] languages will open article language switcher
  • Edited [x] days ago will open article history
  • Page issues will open a new modal with page issues
  • Similar pages will open a new modal with disambiguation text.

Languages, Page issues and Similar Pages only appear if they contain items. Edit history will always appear.

(If we ever decide to add talk pages that could also be included here!)

Event Timeline

KHammerstein raised the priority of this task from to Needs Triage.
KHammerstein updated the task description. (Show Details)
KHammerstein added a subscriber: KHammerstein.
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptAug 14 2015, 10:01 PM

@KHammerstein we never actually discussed about having large cards in the read more section an individual article.

There are a few issues that need worked out here before we can move forward:

  1. The style of these cards is much to similar in style to the card itself. This makes them seem as important (and possibly part of) the main content of the article… instead of ancillary content - which is what we should be communicating
  2. The amount of information on the card seems like a lot. Unlike previews, the user hasn't communicated that they are looking for more information. So I am not sure we should be showing them this level of detail.
  3. The actual cards are large/visual. A large more visual presentation of read more was actually a/b tested against the simple list and found to be less effective.

We have to find a way to communicate to users the this is different content from the main article by making the design different. The design of the items should make them clear that these are subordinate to the article currently being read. Can you put together something that makes these less prominent?

Let me know if you would like to discus any of the points above.

Fjalapeno set Security to None.
Fjalapeno moved this task from Needs Triage to Product Backlog on the Wikipedia-iOS-App-Backlog board.
Fjalapeno moved this task from Product Backlog to Needs Design on the Wikipedia-iOS-App-Backlog board.

@Fjalapeno

  1. Good point, I've heard this from others too and will work on the visual design to make these distinct.
  2. This is the same style of card in the explore feed, and both styles are meant to show you related to articles to what you've read. The information is shown to encourage you to explore, even though you haven't been intentionally looking for it. Do you think those in the explore feed have too much info also?
  3. I didn't realize. Can you link me to the a/b test?

We can go with the smaller titles that just have image + title if it works better.

@KHammerstein

  1. I think it works well on the feed. The user are looking for something interesting here. So I think the extra information is warranted and makes sense.
  1. I don't know where the numbers are unfortunately… this was a while back before I was doing PM - I just remember hearing it and being a little surprised. Dan Garry had ran this experiment on Android - you may be able to ask him.

@KHammerstein I think the alternate designs are better! The only change I would make would be to include the save icon as well.

In my opinion a user should be able to save anything they are looking at without having to "open it" first. This will encourage more users to save things for later - and remove friction throughout the UI.

KHammerstein renamed this task from Restyle read more items to the card design to Restyle read more items and footer.Sep 25 2015, 10:49 PM
JMinor added a subscriber: JMinor.Sep 28 2015, 9:45 PM

Is this still valid? Seems like some of this was subsumed in the "feed reskin" task, but not other parts?

JMinor closed this task as Resolved.Oct 13 2015, 8:41 PM
KHammerstein renamed this task from Restyle read more items and footer to Restyle read more items and footer .Oct 23 2015, 12:35 AM
KHammerstein reopened this task as Open.
KHammerstein updated the task description. (Show Details)
JMinor renamed this task from Restyle read more items and footer to As a user, I want to see more about this article and related articles in the article footer .Oct 23 2015, 5:56 PM
JMinor triaged this task as Normal priority.
JMinor added a project: iOS-app-v5-beta.

This is looking really good. I like combining all the "meta" page stuff into a single footer, and demoting page issues and similar pages to the end of the article.

I think we need to mock up or at least describe what happens on taps of any of the about page elements.

Nirzar added a subscriber: Nirzar.Nov 16 2015, 1:36 AM

Use Language icon that is already there in xcode
and here are the rest of the icons.

We also need to update the table of contents to add this section and make the styling distinct from content sections. See M117: Contents for a visual mock up.

Mhurd claimed this task.Dec 15 2015, 7:13 PM

We also need to update the table of contents to add this section and make the styling distinct from content sections. See M117: Contents for a visual mock up.

Mhurd added a comment.EditedDec 17 2015, 10:14 PM

@Nirzar @KHammerstein

Please provide consistently sized icons. The icons from above are inconsistently sized:

similar pages: 23x23

warnings: 28x24

edit history: 27x25

language: 28x24

Here you go, all of them on 30x30 canvas. it should work now :)

JMinor awarded a token.Feb 6 2016, 1:09 AM

Great work on moving all this to the footer. It makes a really big difference in top-of-article design, and looks so much more mobiley.

I tend to agree we should be using smaller cards for related articles, but in general so glad this got done.

JMinor closed this task as Resolved.Feb 6 2016, 1:09 AM