Page MenuHomePhabricator

Newcomer tasks: Update guidance panel tips from using tabs to previous and next navigation buttons
Open, LowPublic



As observed by @PPham and shown below, when the help panel is narrow, the seventh tip wraps to the next line. Only one task type ("Add references") has seven tips.


Replace tips tabs with segmented previous and next buttons and pagination text.

Event Timeline

@RHo -- what do you recommend for this situation?

@MMiller_WMF - since this is an edge case, I think we should push for the same behaviour to occur as the minerva-tabs whereby tab that is over the width to result horizontal scroll like in the mobile site:

Current prod mobile tabs
Use for proposed short term fix

OTOH, we can also consider switching to the the stepper interaction that in an earlier design:

The reasons we didn't go with the above design was:

  1. To enable users to more quickly navigate across tips (for example go from tip 2 to 7) without having to repeatedly tap prev or next
  2. Discourage overloading what is meant to be a short, quick guide with too many tips.
  3. Using the tabs made it more noticeable that tips were auto-advancing (as each tab became active)
Proposal for amending to address the above issues:
Text input
  • Adding a either a text-input or dropdown option to change steps more quickly to address point 1
  • Add an animation for text to slide in and out when auto-advancing to make this change more overt to address point 3
  • This design means less potential for UI-issues if too many tips are created, but we should nevertheless provide instructions about limiting guidance quick tips to guide-content creators to address point 2

After the changes to width 360px on Desktop in T2558719, this issue is no longer happening.
However, pinging @MMiller_WMF in case we would like to proceed with one of the proposals in T255389#6224247 anyway to future-proof in case there are tasks in future which have >8 steps.

RHo renamed this task from Newcomer tasks: tips wrap in narrow panel to Newcomer tasks: Update guidance panel tips from using tabs to previous and next navigation buttons.Jan 28 2021, 3:01 PM
RHo updated the task description. (Show Details)
kostajh triaged this task as Low priority.