Page MenuHomePhabricator

Newcomer tasks: tips wrap in narrow panel
Open, Needs TriagePublic

Description

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.

Event Timeline

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

RHo added a comment.Jun 15 2020, 2:42 PM

@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
Dropdown
  • 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
RHo assigned this task to MMiller_WMF.Tue, Jul 28, 3:17 PM

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.