Page MenuHomePhabricator

Interaction Timeline V1: Header & footer
Closed, ResolvedPublic2 Story Points

Description

Problem to solve

By providing a header and footer 'chrome' for the Interaction Timeline, we can better situate users within the tool. Improving the fit and finish of the page container will allow us to provide some necessary information that is current missing, and will give the entire tool a more trustworthy presentation.


Acceptance criteria

  • The Timeline's header should be styled per the wireframe
    • Background color #F6F6F6
    • Bottom border same as text color
    • Add ~10px padding above tool title
    • Tool name and link to "This feature is in early testing. Learn more & leave feedback!" should stay on the top row
    • Second row should have subtitle "Chronologic history for two users on pages where they have both made edits."
  • The footer should be styled per the wireframe
  • Neither are fixed

Wireframe

Event Timeline

Blocked by design

thoughts on this?

@SPoore @CSindersWMF @dbarratt @dmaza — I've made a very simple header/footer wireframe to illustrate how we can make a few small tweaks to give it a more standard chrome. Your thoughts?

For the footer, should we provide any other links?

dmaza added a comment.Dec 5 2017, 7:28 PM

For the footer, should we provide any other links?

Yes to all. And also a link to our AHT IRC channel

I'm not sure I agree with including the IRC channel...

What about this for the links?

It's beautiful and perfect and we shouldn't change anything from Trevor's designs!

ps don't include the IRC channel. Let's not do that to our users.

dmaza added a comment.Dec 6 2017, 4:04 PM

Last mock-up looks great. The only reason I suggested the IRC channel was because it might be quick to answer questions about how it works or maybe someone reporting something wrong with it idk. Not a strong opinion on it but since we have it we might as well use it.

We've talked recently about killing the Anti-Harassment IRC channel and just using CommTech, so I wouldn't want to put a permanent link and forget to update it in the future.

In T182153: Interaction Timeline: In-feature description of how the Timeline works I proposed a different variation of the header which explains the timeline. I prefer this one as it solves both problems (chrome + product explanation) in a simple manner.

TBolliger updated the task description. (Show Details)Dec 6 2017, 5:08 PM
TBolliger removed TBolliger as the assignee of this task.Dec 14 2017, 1:53 AM
TBolliger updated the task description. (Show Details)
TBolliger set the point value for this task to 2.

Trevor to update the mockup before dev.

TBolliger updated the task description. (Show Details)EditedJan 16 2018, 9:23 PM

Updated mockup:

dbarratt claimed this task.Feb 20 2018, 5:57 PM
dbarratt moved this task from Ready to In progress on the Anti-Harassment (AHT Sprint 15) board.

Uhh.. I'll let you know when T181568 is merged (I'll probs need to make adjustments to this ticket)

TBolliger changed the task status from Open to Stalled.Feb 26 2018, 5:25 PM

OK sounds good. Marking as blocked until '568 is complete

@TBolliger This was merged first, so we'll do it the other way 'round. :)

🎉

It really ties the room together. Good work!