Page MenuHomePhabricator

[Epic] Visual design & layout refinements
Closed, ResolvedPublic

Description

Description

The final stage of the project will be visual design and small layout/spacing refinements. (https://www.mediawiki.org/wiki/Reading/Web/Desktop_Improvements/Features/Visual_Refinements)

Goals
  1. use visual design to further our general project goals (e.g. welcoming experience, content primary, simple/clear/accessible, distinctively Wikipedia)
  2. review all the various states of the interface at various screen sizes and make any final decisions that we previously deferred
Constraints
  • We are not changing structural elements of the interface
  • We are keeping with the legacy of form following function... a visually simple/restrained/minimal interface
  • We are not creating a radically different look (i.e. should feel evolutionary, not revolutionary)
  • We are keeping in mind the potential upcoming navigation restructuring work and making sure that whatever we do at this stage sets us up for that
Starting point

The starting point for this work is the current, minimally styled version of Vector 2022:

image.png (1×2 px, 1 MB)

Related Objects

StatusSubtypeAssignedTask
ResolvedJdlrobson
Resolvedovasileva
ResolvedNone
Resolved alexhollender_WMF
Duplicate alexhollender_WMF
ResolvedBUG REPORTJdlrobson
ResolvedJdlrobson
Resolvedovasileva
DuplicateNone
DuplicateNone
ResolvedLGoto
Resolvedovasileva
Resolvedovasileva
ResolvedBUG REPORTNone
Duplicate alexhollender_WMF
Resolvedovasileva
Resolvedovasileva
ResolvedJdlrobson
ResolvedJdlrobson
Resolvedovasileva
Resolvedovasileva
DuplicateNone
ResolvedDAbad
Resolvedovasileva
ResolvedBUG REPORTovasileva
ResolvedEdtadros
DeclinedNone
Resolvedovasileva
Resolvedovasileva
Resolvedovasileva
Resolvedovasileva
Resolvedovasileva
Resolvedovasileva
Resolvedovasileva
ResolvedBUG REPORTovasileva
Resolvedovasileva

Event Timeline

There are a very large number of changes, so older changes are hidden. Show Older Changes

@ovasileva how do you feel about splitting out a new epic : Visual refinements part 3 for all the remaining sub tasks that are not in the backlog? Is there anything in the backlog that should be moved into the sprint board and be part of this epic?

In sprint board (keep associated with this task):
T316609: Language button should never wrap in sticky header
T315261: [Visual refinement] Improve alignment of icon buttons in header, page content & stickyheader
T316032: [Visual refinements] Bold active section in ToC (Part 2!)
T315615: [Visual refinements] Align language button with edge of page header
T314330: [Visual refinements] Stop TOC from jumping when sticky header appears (logged-in only)

In backlog (split out into a new epic for a later date):
T314328: [Visual refinements] Decrease height of sticky header
T314419: [Visual refinements] Increase offset for headings when clicking TOC links
T314323: [Visual refinements] Standardize icon buttons & links (Vector 2022)
T313735: Make "new message" alert a floating element
T313828: Typography: Apply consistent font sizes across Vector 2022
T254055: Typography: Increase base font-size for Vector 2022
T312594: TypeaheadSearch: search input should expand width when menu opens
T316950: [Visual refinements] Reduce height of article toolbar
T315611: Hide sticky header at 720px wide window
T315609: [Visual refinements] Fix language button styling
T314487: [Visual refinements] Decrease (or remove) min-width on User menu
T306744: Sticky header doesn't show the page title if PAGEBANNER is used
T304330: ToC: micro-interactions
T299080: Third party Vector installs should look different from Wikimedia deployed
T303086: [Design spike] Identify states that the layout needs to respond to

@ovasileva how do you feel about splitting out a new epic : Visual refinements part 3 for all the remaining sub tasks that are not in the backlog? Is there anything in the backlog that should be moved into the sprint board and be part of this epic?

Yup, this is already on my to-do list :)

The current epic will reflect the blockers to the deployment, all of which are already on the board

All remaining tasks are now in doing or beyond. I'll update this as things move through the board.

In doing:
T314330: [Visual refinements] Stop TOC from jumping when sticky header appears (logged-in only)
T315261: [Visual refinement] Improve alignment of icon buttons in header, page content & stickyheader

In QA:
T316964: [Regression, Visual refinements] When main menu is collapsed table of contents jumps on page load

In sign off:
T313060: [Visual refinements] Table of contents overlaps the footer or page boundary depending on article length
T315615: [Visual refinements] Align language button with edge of page header

Jdlrobson reassigned this task from Edtadros to ovasileva.
Jdlrobson moved this task from Code Review to QA on the Web-Team-Backlog (Kanbanana-2022-23-Q1) board.
Jdlrobson moved this task from QA to QA in Prod on the Web-Team-Backlog (Kanbanana-2022-23-Q1) board.
Jdlrobson added a subscriber: Edtadros.

All tickets are now in QA.

All tasks are now completed. Resolving!