Add governance model to mediawiki
Closed, ResolvedPublic3 Estimated Story Points
Actions

Assigned To

Authored By

	ldelench_wmf
	Jan 24 2023, 9:48 PM

Description

Updates:

2023-02-27: We're a couple weeks past our timebox, but the updated https://www.mediawiki.org/wiki/Design_Systems_Team/Design_System_Governance_Model is ready for review.
2023-02-02: Decision: Let’s timebox this to Feb 9, 2023, knowing that we will iterate going forward. Future changes should be specced in a new task.
2023-01-31: Scope change: flowchart needs a redesign for clarity, and we will add explainer text to the flowchart section on the mediawiki page. Acceptance criteria updated.
2023-01-30: First draft is ready for review/edits https://www.mediawiki.org/wiki/Design_Systems_Team/Design_System_Governance_Model

As a contributor to the Wikimedia Design System, I want to access a publicly-viewable copy of the governance model flowchart without needing Figma access.

Resources

Initial governance model

Open questions:

Should we plan a training/Q&A session around the governance model? If so, should it be open to the public? Or WMF internal?

Design and documentation

New flowchart

Notion page with documentation

Governance model_new.png.zip577 KBDownload

Acceptance criteria:

The Governance model flowchart has been summarized and redesigned in Figma
A Notion page is created with the documentation to be updated in Mediawiki
- What is the Design System governance model?
- Guiding Principles
- Flowchart steps explanation
The Governance model flowchart and documentation have been added to a page within https://www.mediawiki.org/wiki/Design_Systems_Team.

Details

Due Date: Feb 10 2023, 4:59 AM

Related Objects
Search...

		Status	Subtype	Assigned	Task
		Open		None	T288710 Update library contribution guidelines to reflect Governance model
		Resolved		ldelench_wmf	T327822 Add governance model to mediawiki

Event Timeline

ldelench_wmf created this task.Jan 24 2023, 9:48 PM

Restricted Application triaged this task as High priority. · View Herald TranscriptJan 24 2023, 9:48 PM

Restricted Application added a subscriber: Aklapper. · View Herald Transcript

ldelench_wmf changed the task status from Open to In Progress.Jan 27 2023, 2:32 PM

ldelench_wmf moved this task from Committed to In Development on the Design-System-Team (Design-System-Sprint) board.

ldelench_wmf set the point value for this task to 1.

ldelench_wmf updated the task description. (Show Details)Jan 30 2023, 9:22 PM

Hello @Volker_E @bmartinezcalvo @Sarai-WMDE @RHo - the governance model page is ready for design review: https://www.mediawiki.org/wiki/Design_Systems_Team/Design_System_Governance_Model
Feel free to update the page directly, or share your suggestions as phabricator comments.

Note that adding the governance model to the Codex demo site (T288710) is not in-scope here, but I'm thinking it should match what we have in mediawiki.

In T327822#8572171, @ldelench_wmf wrote:

Hello @Volker_E @bmartinezcalvo @Sarai-WMDE @RHo - the governance model page is ready for design review: https://www.mediawiki.org/wiki/Design_Systems_Team/Design_System_Governance_Model
Feel free to update the page directly, or share your suggestions as phabricator comments.

Note that adding the governance model to the Codex demo site (T288710) is not in-scope here, but I'm thinking it should match what we have in mediawiki.

It looks good. I would update just 2 things:

I'm summarizing and redesigning a bit the Governance model to easily represent each step
Should we explain the flowchart steps by adding text in the Flowchart section?

In T327822#8574578, @bmartinezcalvo wrote:

In T327822#8572171, @ldelench_wmf wrote:

Hello @Volker_E @bmartinezcalvo @Sarai-WMDE @RHo - the governance model page is ready for design review: https://www.mediawiki.org/wiki/Design_Systems_Team/Design_System_Governance_Model
Feel free to update the page directly, or share your suggestions as phabricator comments.

Note that adding the governance model to the Codex demo site (T288710) is not in-scope here, but I'm thinking it should match what we have in mediawiki.

It looks good. I would update just 2 things:

I'm summarizing and redesigning a bit the Governance model to easily represent each step

Should we explain the flowchart steps by adding text in the Flowchart section?

Agree with @bmartinezcalvo - especially for point 2 about a text version of the flowchart steps, maybe this would also help with translation to other languages later on.

bmartinezcalvo updated the task description. (Show Details)Jan 31 2023, 5:57 PM

bmartinezcalvo updated the task description. (Show Details)

Moving this task to In Design so I can redesign the flowchart and write in Notion the text we want to add as explanation for the flowchart.

ldelench_wmf updated the task description. (Show Details)Jan 31 2023, 9:49 PM

ldelench_wmf changed the point value for this task from 1 to 3.

bmartinezcalvo updated the task description. (Show Details)Feb 1 2023, 3:57 PM

bmartinezcalvo updated the task description. (Show Details)

ldelench_wmf updated the task description. (Show Details)Feb 3 2023, 4:37 PM

ldelench_wmf set Due Date to Feb 10 2023, 4:59 AM.

I've redesigned the Governance model's flowchart with the following:

Summarized steps to make the flowchart clearer
Moved descriptions below and enumerated each step and its description
Updated flowchart colors
Renamed the sections on top to represent the same structure as in our Contribution Guidelines (Report and validate, Research & prepare, Design + Hand-off...)
Removed acronymous (DS, DST...) and used the full name in order to avoid confusion

Also, I've explained each flowchart step in this Notion documentation so we can include it as description in Mediawiki. The steps have been described in a short way so they are easy to understand by users.

@RHo please check if both the flowchart and documentation make sense to you.

@KieranMcCann assigning this task to you so you can review visual aspects and make any necessary changes. I commented with @RHo on the idea to create an interactive Figma prototype with the flowchart but we finally decided to just add the flowchart image and text in Mediawiki since the governance model's users will not be all designers with access to Figma. So let's invest our time in creating a clear and easy flowchart image instead of prototyping it.

bmartinezcalvo updated the task description. (Show Details)Feb 8 2023, 10:10 AM

Thanks @bmartinezcalvo! I am happy for @KieranMcCann to proofread the documentation and check the flowchart as well as the visual aspects, and resolve accordingly.

Thanks @bmartinezcalvo!

Just to clarify that I was suggesting turning it into a Figma prototype which should be shareable without people needing Figma. But appreciate this is added work which is probably not a priority. Will proofread and check visual design shortly.

Note that the main public usage for the Governance Model is the static image on DST mw.org page.
We could link with a static one to the interactive prototype, but internally we've also agreed on not spending more time than necessary on this task right now. The whole redesign of the original Governance Model and amendments were not in the original task's scope. I like the interactive idea, I just don't think it's best use of our time right now. cc: @ldelench_wmf

I don't think we should spend time on an interactive prototype even in the long term for a few reasons:

This model may also change, having to maintain interactive prototype and static image where most people will look (plus the written version) is a lot of overhead
Main audience (developers and designers) will look at this on MW (and maybe Codex site in future), it seems unnecessary to take them offsite to a figma prototype.
esp. as the static version right now with the info underneath each section is IMO quite clear, and provides important info without being an extra hover/click away.

All good with me. Apologies if I confused things by suggesting it in the meeting the other day. I wasn’t advocating for doing it, it was more just general design feedback on ways we could simplify the diagram. Very happy just to go with the static option as it is.

I’ve reviewed the digram from a visual design perspective and think it looks good. I think removing the background colours has definitely made it simpler and clearer looking.

There are still a few comments in the Figma relating to the content so I’m presuming it’s not ready to be added to mediawiki?

In T327822#8613800, @KieranMcCann wrote:

I’ve reviewed the digram from a visual design perspective and think it looks good. I think removing the background colours has definitely made it simpler and clearer looking.

There are still a few comments in the Figma relating to the content so I’m presuming it’s not ready to be added to mediawiki?

Thank you @KieranMcCann. I've solved mostly of the comments in Figma and Notion. Since the visual styles are ok and the comments were solved I think the flowchart and documentation are completed and they can be updated in Mediawiki. So moving the task to Ready for development. If we need to update something more please move the task again.

bmartinezcalvo updated the task description. (Show Details)Feb 15 2023, 2:48 PM

bmartinezcalvo updated the task description. (Show Details)Feb 16 2023, 6:16 PM

Have provided a few more comments about unification and terminology containment from initial governance model, which we've talked about and agreed to persist in this version in yesterday's DS design sync.

ldelench_wmf merged a task: T313942: Governance & Guidelines: Design System Component Management Guidelines v1.Feb 17 2023, 10:18 PM

ldelench_wmf mentioned this in T313943: Governance & Guidelines: Design System Component Creation Guidelines v1.

ldelench_wmf added a subscriber: • DAbad.

egardner moved this task from Inbox to Codex Adoption on the Codex board.Feb 22 2023, 12:37 AM

ldelench_wmf claimed this task.Feb 27 2023, 2:15 PM

ldelench_wmf moved this task from Ready for Development to In Development on the Design-System-Team (Design-System-Sprint) board.

ldelench_wmf updated the task description. (Show Details)Feb 27 2023, 2:59 PM

ldelench_wmf updated the task description. (Show Details)

New governance model & copy looks great, thanks everyone! Pushing to Product sign-off for @CCiufo-WMF's eyes on this iteration: https://www.mediawiki.org/wiki/Design_Systems_Team/Design_System_Governance_Model

@ldelench_wmf in Notion I created some text blocks as callouts since they were relevant on those sections. If in Mediawiki we cannot create something similar, I would remove the ℹ️ icon and I would leave just the text (since the emoticons are not too common on wikis).

E.g. Take a look at the full documentation on how to design system components.


Callout in Notion	Just the ℹ️ icon in Mediawiki

Thank you @bmartinezcalvo for this suggestion! I updated these to info templates for now; there may be a prettier way to do it that I'm not aware of:

@ldelench_wmf @bmartinezcalvo a question here before resolving: the governance model feels pretty Codex-specific. I would argue it might make more sense to live here. Curious to get others' thoughts.

Interesting point @CCiufo-WMF, I assume the original location idea came from a team perspective. In the sense of how would I work with the Design System Team. But I think I see your point and would also move it underneath Codex and still link from the “Introductory Links” section to it.

In T327822#8653240, @CCiufo-WMF wrote:

@ldelench_wmf @bmartinezcalvo a question here before resolving: the governance model feels pretty Codex-specific. I would argue it might make more sense to live here. Curious to get others' thoughts.

In order to keep the governance model in both MediaWiki sections, we could add the Design System > Governance model link in that Codex section.

Given that the Codex documentation on-wiki is specifically technical documentation, let's keep this where it is for now. Once T324228 is kicked off, I think it's worthwhile revisiting the Codex project page to be more than just "how to use Codex in MW".

CCiufo-WMF mentioned this in T329123: List of DSG resources to move over (Information Architecture questions).Feb 28 2023, 9:49 PM

CCiufo-WMF closed this task as Resolved.Feb 28 2023, 10:08 PM

	F36875030: Screenshot 2023-02-27 at 1.30.02 PM.png
	Feb 27 2023, 6:32 PM

	F36874872: Captura de Pantalla 2023-02-27 a las 17.32.21.png
	Feb 27 2023, 4:34 PM

	F36874867: Captura de Pantalla 2023-02-27 a las 17.32.09.png
	Feb 27 2023, 4:34 PM

Add governance model to mediawikiClosed, ResolvedPublic3 Estimated Story PointsActions