Page MenuHomePhabricator

Create typography prototype to share with communities
Closed, ResolvedPublic5 Estimated Story Points

Description

Background

We would like to test some ideas on updated font size and typography across different language communities

Prototype workflow

  1. Central notice sends you to a page with context and questions
  2. That page has a link to the prototype
  3. You play with the prototype and it shows you your params in real time
    1. Prototype has a link to the feedback page
  4. You can go back to the question page at any time and fill in the params you like

Value range

  • TBD

Acceptance criteria

  • Create prototype according to design spec
  • Prototype should be available in the following languages:

Chinese
Farsi Wikipedia
Korean Wikipedia
Japanese
Hebrew
French
Vietnamese
Russian
Georgian
Spanish
Serbian
Urdu
Arabic
Polish
English

Open questions

  • Do we want to build this prototype in production with a survey or have a separate prototype?

Event Timeline

ovasileva added subscribers: Jdrewniak, JScherer-WMF.

Change 953735 had a related patch set uploaded (by Jdrewniak; author: Jdrewniak):

[mediawiki/extensions/WikimediaEvents@master] [POC] prototype for Web Typography survey

https://gerrit.wikimedia.org/r/953735

Change 953739 had a related patch set uploaded (by Jdrewniak; author: Jdrewniak):

[mediawiki/skins/Vector@master] [POC] Web typography prototype survey

https://gerrit.wikimedia.org/r/953739

Test wiki created on Patch demo by JDrewniak (WMF) using patch(es) linked to this task:
https://patchdemo.wmflabs.org/wikis/0848da3f76/w

Test wiki created on Patch demo by JDrewniak (WMF) using patch(es) linked to this task:
https://patchdemo.wmflabs.org/wikis/d3832c4eeb/w

@JScherer-WMF that last patchdemo above: https://patchdemo.wmflabs.org/wikis/d3832c4eeb/wiki/Hot_dog
showcases the prototype idea as an interactive survey that persists across page-views as well.

I haven't thought through the design of this thing, just made up the following parameters as a POC: font-size, line-height and vertical-spacing.
Those parameters only affect the content-area, not the UI, and they don't affect the content width either. Those are all possibilities though.

ovasileva updated the task description. (Show Details)
ovasileva updated the task description. (Show Details)

Change 953735 abandoned by Jdrewniak:

[mediawiki/extensions/WikimediaEvents@master] [POC] prototype for Web Typography survey

Reason:

https://gerrit.wikimedia.org/r/953735

After speaking with @Jdlrobson earlier this week, we decided the best distribution channel for this prototype would be a gadget. Packaging this prototype as a gadget would have the following benefits:

  • Can be modified and deployed at any time (doesn't follow a weekly train schedule)
  • Any potential bugs would be very isolated (as opposed to skins & extension which are deployed everywhere)
  • Allows us to easily enable/disable the prototype for logged-in users (because gadgets can be enabled as a user preference)
  • Better reflects the temporary nature of this prototype.

With this approach, we can create a banner that includes some JS that enables the gadget, following the precedent of the Desktop Improvements suggestions banner.

To this end, I upload the prototype as a user script here: https://en.wikipedia.org/wiki/User:JDrewniak_(WMF)/TypographySurvey.js
which can be enabled by adding the following to a users common.js importScript( 'User:JDrewniak_(WMF)/TypographySurvey.js' );

In order to enable it as a gadget, we have to move it to the gadget namespace https://en.wikipedia.org/wiki/MediaWiki:Gadget-TypographySurvey.js
which requires interface admin access, and maybe some community outreach? cc: @sgrabarczuk

@ovasileva @sgrabarczuk When are we targeting to begin prototyping with the communities? A deadline will help me get T346058 and T346059 over the finish line.

@ovasileva @sgrabarczuk When are we targeting to begin prototyping with the communities? A deadline will help me get T346058 and T346059 over the finish line.

I'm hoping we can start potentially a week after the prototypes are wrapped up

@Jdrewniak

Here are the value ranges and increments for this

font-size: 14px - 24px
line-height: 14px - 36px
margin: 14px - 48px

Also: I wanted to confirm that the URL that gets ported over for the survey would also show what language the respondent is working in, as well as what article they were viewing when they submitted. Is that the case @Jdrewniak ?

Hi @Jdrewniak, Olga and I chatted about the results from T346059 this afternoon and there are a few copy changes we'd like to make to the prototype:

The learn more link has moved to the sub header, the header and italics have changed, and the primary CTA is a continue now.

Screenshot 2023-09-20 at 5.58.47 PM.png (714×772 px, 106 KB)

@ovasileva will create a follow up ticket for "Launch prototype to communities"

All done for prototype creation. Launching of the prototype will be tracked in T347208: Launch Community Prototype

Test wiki created on Patch demo by JDrewniak (WMF) using patch(es) linked to this task:
https://patchdemo.wmflabs.org/wikis/26982ac316/w

Test wiki on Patch demo by JDrewniak (WMF) using patch(es) linked to this task was deleted:

https://patchdemo.wmflabs.org/wikis/0848da3f76/w/

Test wiki on Patch demo by JDrewniak (WMF) using patch(es) linked to this task was deleted:

https://patchdemo.wmflabs.org/wikis/d3832c4eeb/w/

Test wiki on Patch demo by JDrewniak (WMF) using patch(es) linked to this task was deleted:

https://patchdemo.wmflabs.org/wikis/26982ac316/w/