Consistency between Wikitext & Visual Editor

Concept edit

Create a more seamless transition between wikitext and visual editing modes. A user has to make an upfront decision about which mode to edit Wikipedia in and there is a drastic shift in layout and controls once you switch between wikitext and visual editing modes.

Control Panel & Layout edit

The two editing modes currently have very control panels that are inconsistent and split up across the page. The first idea is to create a more cohesive control panel where certain areas of the panel are fixed and others are fluid based on editing mode and a users last action. See the control panel mental model for a quickview. A more detailed spec explaining this is linked here also.

Media Settings Specification
Default Mode rules

Near term Design Solutions edit

Media Settings

Areas of Design with Challenges edit

States of the toolbar

Creating a toolbar that provides the ability to act on content easily but can be customized for a new user who needs help in the first 10 edits, or an advanced editor who does very specific tasks such as math editing. Also must think about in context controls.Terms of Service

The TOS will be accepted on a first Save. We want users to know what the TOS of contributing to Wikipedia are, it shouldnt be a dialogue that interrupts but doesn't inform.

Text Formatting

How might relevant controls be available if a user double clicks content. Is there a grouped standard formatting that I can apply if I select a bunch of sections and images to improve the layout?Inserting Links

What are some ways of providing context when a user links to a page? If a user selects something that should not be linked, is it in the culture of wikipedia to advice that this should not be linked.Inserting Images & Making Galleries

Images and galleries will allow us to take more control of page layout. Sizing & Aspect ratios should take into consideration layout of text that images will sit with.

Inserting Categories

Explain the purpose of tagging

We need to think about a less confusing taxonomy, currently any and all types of categorization, ranging from too broad to too specific can be entered by a user.

Insert Templates

Explain how Templates work & Provide Descriptions where possible.

Use a progressive disclosure model to think about

We need to think about a less confusing taxonomy, currently any and all types of categorization, ranging from too broad to too specific can be entered by a user.

Page Settings

Provide page settings that control the content but not the chrome. Audit any current settings that feel superfluous. (Indexing etc)

Default Editor Pattern edit

Default Edit Mode based on edit count and history


New Users - If a user has 0 edits, we default to visual editor.

Successfully using Wikitext - If a user previously switched to Wikitext editing and successfully saved their edits then default to Wikitext editing.

New but abandoned editing - If a user has less than 10 edits and abandoned wikitext editing, then default to visual editor

Anonymous Users - Anonymous editors default to wikitext editing.

Primary Operating Principles edit

  • One edit action - No upfront decision making between two edit actions
  • Point new users to visual editing but allow quick switching
  • No extra steps for key actions
  • Help orient me, don’t shuffle things
  • Frequent and Important actions will be easy to find
  • Show controls that listen to my actions

Secondary Principles edit

  • Support Users who work with very specific subject matter
  • Create spaces for the growth team to tie in their experiments

Some of the key areas covered in the spec edit

  • Positioning the switch state in the bar
  • First time UX
  • Rules for defaults and remembering modes
  • Detail the audit for any nested actions
  • Article Issues UX and legal concerns
  • Title positioning
  • Actions grouping for Wikitext Editor V1
  • Actions grouping for Visual Editor V1
  • First time Next and Save UX
  • Cancel and Preview positioning
  • Help
  • Edit Summary Details

Proposed Work Plan edit

-Start with a small non disruptive step of making the toolbar on the top consistent with visual editor. Lets leave out any elements that are currently at the bottom of wikitext editor and leave them there.

-Remove everything except Preview, Save and Cancel. Merge with Visual Editor.

-Introduce Getting Started