Design System Team/Resources

Welcome to our collection of helpful resources about the Wikimedia Design System, the Design System Team (DST), Codex, and front-end technology. These resources may be useful to you if you are onboarding, or just need a refresher.

This page is NOT for individual pieces without context (e.g., single Phabricator tasks, notes, discussion threads).

Please contribute to this page as you discover more!

🌠 = good overviews if you don't have time for all of it

General resources

Description	Link	Category	Access
Codex demo site: Using Codex Contributing Design Tokens Components Icons 🌠	doc.wikimedia.org/codex/latest/	Guide	Public
DST MediaWiki page: Mission/Vision Work Streams Team Members 🌠	Design System Team	Guide	Public
DST Phabricator workboard	https://phabricator.wikimedia.org/project/board/5858/	Task tracking	Public
DST release timeline	Design System Team/Release Timeline	History	Public
DST norms	Design System Team/Norms	Guide	Public
DST processes	Design System Team/Team Processes	Guide	Public
Design System Governance Model	Design System Team/Design System Governance Model	Guide	Public
Vue and Codex for non-Developers	Design System Team/Vue and Codex for non-Developers
History of user-interface libraries and frameworks in MediaWiki 🌠	Design System Team/History of user-interface libraries and frameworks in MediaWiki	History	Public
Front-end standards group	Front-end standards group	Guide	Public
Codex Manual Testing Guidelines	Manual testing guidelines	Guide	Public
DST testing environments	Design System Team/Test environments	Guide	Public

For designers

Description	Link	Category	Access
Codex design library in Figma	https://www.figma.com/file/KoDuJMadWBXtsOtzGS4134/%E2%9D%96-Codex-components?node-id=1891%3A4420&t=OosUjj5MSFfqIu8w-0	Guide	Public
Wikimedia Design Style Guide	https://design.wikimedia.org/style-guide/	Guide	Public

For developers

Description	Link	Category	Access
Codex codebase	https://gerrit.wikimedia.org/r/admin/repos/design/codex	Repo	Public
Using Codex in MediaWiki	Codex	Guide	Public
Compatibility	Compatibility	Guide	Public
Using Vue.js in MediaWiki	Vue.js	Guide	Public
Vue.js official documentation	https://vuejs.org/guide/introduction.html	Guide	Public
Vue Mastery tutorials	https://www.vuemastery.com/	Training	Public

Articles

Description	Link	Category	Access
Diff post 2022 - Creating the Wikimedia Design System	https://diff.wikimedia.org/2022/12/22/creating-the-wikimedia-design-system/	History	Public
Tech blog Sept 2021: Summit on present & future Vue.js user-interface library and the design system at the Wikimedia Foundation	https://techblog.wikimedia.org/2021/09/23/summit-on-present-future-vue-js-user-interface-library-and-the-design-system-at-the-wikimedia-foundation/	History	Public
Tech blog Jan 2021: 2020: The Year in Vue	https://techblog.wikimedia.org/2021/01/22/2020-the-year-in-vue/	History	Public

Planning and presentations

Description	Link	Category	Access
DST Roadmap - 2022-23	https://miro.com/app/board/uXjVOka6mI4=/	Guide	Public
Design System Product Deep Dive - Aug 2022 🌠	https://docs.google.com/presentation/d/16v8cl7qPIDhgvM-kReJJDayPRYSmB3j5zagAkYKS1Os/edit#slide=id.g1171d73bf25_1_318	Deck	Public
DST OKRs - Aug 2022 draft	https://docs.google.com/document/d/1yvqFkNtUbbjYi4G48x9oFLxUjK5FZ3oLSLqDm7E54qM/edit	History	DST
Front-end Pathways -May 2022	https://miro.com/app/board/uXjVO5llKW0=/	History	Public
Design System Product Deep Dive - Feb 2022	https://docs.google.com/presentation/d/1T8bF35ezJzSGcfLlFmLeVfVe1zFKZCy55BfHd1bgLSs/edit#slide=id.g1171d73bf25_1_318	History	WMF staff
Vue.js Developer Summit - 2021	Design System Team/Vue.js Developer Summit 2021	History	Public
Demo tool evaluation - 2021	https://docs.google.com/presentation/d/1WqIvBvUv8fI7i4l1ID-zKOfmbfi1nbODL_7Y1T3Rtto/edit#slide=id.p	Deck/History	Public
Wikimedia Design System Governance Model flowchart	Design System Team/Design System Governance Model	Guide	Public
DST shared Google Drive	https://drive.google.com/drive/folders/0AL-RvziklGTLUk9PVA	File sharing	DST