Page MenuHomePhabricator

Preview interface for link dialogue
Closed, ResolvedPublic8 Story Points

Description

As a new editor I want a simple way to link to the correct page and an easy way to view existing links.

Problem: The current link interface does not give users information about the page they are linking to, or a clear CTA to edit the link.


Dialogue shows title, page thumbnail, page title, wikidata description, redirect information, edit and remove buttons.

Title
Check animates in
Link icon and "Linked" shown after

Page thumbnail
50 x 50 pixels crop

Page Title
Bold and link blue color

Wikidata Description and Redirect
Small, #777 text

Edit button
Primary progressive

Remove button
Quiet

View click-through image prototype here: http://invis.io/NE24426R8

Event Timeline

KHammerstein raised the priority of this task from to Needs Triage.
KHammerstein updated the task description. (Show Details)
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptFeb 2 2015, 8:22 PM
KHammerstein set Security to None.

Why is there a spinner? Link application is instant.

Jdforrester-WMF triaged this task as High priority.Feb 2 2015, 9:34 PM
Jdforrester-WMF moved this task from To Triage to TR6: Visual diffs on the VisualEditor board.

True, and we still want it to feel fast.
But when we first tested the prototype, users were surprised by the instant result. Some people said "Did someone else already link this?" Because we're automatically linking for the user instead of having them type something in, we should tell them thats what we are doing.

Both James and I have talked through this with design before, and the approach we are going with is to show a notification in the link inspector that the link has been created successfully. Showing a bogus spinner to convince the user something is happening is a really bad UX pattern. Notifying the user that something has happened solves the problem in a superior way.

Please provide design work that reflects these conversations.

Could you provide an example or explain notification further?

Elitre added a subscriber: Elitre.Feb 11 2015, 8:49 PM

As a product decision, we decided to remove this as a blocker to the release, and instead focus on the citation improvements first before taking this on. Consequently, we decided to remove this from the Q3 blockers list at the triage meeting on 2015-02-11.

Blockers resolved; this is now "just" a question of getting the image and Wikidata description and filling it in. Potentially relatively easy.

Esanders moved this task from TR6: Visual diffs to Q4 on the VisualEditor board.May 5 2015, 12:27 PM
Jdforrester-WMF closed this task as Resolved.May 8 2015, 1:03 AM
Jdforrester-WMF assigned this task to Esanders.