View source for Design

''Main page: [https://design.wikimedia.org/ design.wikimedia.org]''
[[File:Design-at-wikimedia-foundation.png|frameless|380x380px]]{{clear}}

== Statement of Purpose ==
<blockquote>At Wikimedia, we design with and for curious humans who rely on trustworthy content.

We as a design team work with a global community of humans who come from different experiences and places, with different goals. We are ever-evolving, learning, and growing. We remain open to change and feedback.

When making design decisions, we are guided by our principles. We use these guidelines to hold ourselves and each other accountable. We invite the broader community to engage with our design work on the basis of our Design Principles.</blockquote>

== Design Principles ==
===Design with Others===
We collaborate with others through means of inclusion of ideas, research sessions, and working as openly as possible.
* Is this design the outcome of collaboration?
* Did we listen to and learn from people with different backgrounds and perspectives?
* Have we learned from the target audience that their needs are met?

===For Curious Humans===
We welcome and consider a universal audience, striving to remove barriers to accessing knowledge which satisfies human curiosity.
* Is this design accessible, inclusive, and equitable?
* Does this idea encourage or allow for adaptability based on the preference of the person using it?
* Is there opportunity for wonder in the experience?

===Trustworthy===
We design to enable the sharing and greater understanding of trustworthy knowledge, while maintaining the integrity of people's privacy.
* Are we minimizing the data we collect about people in both our design solution and the process to create it?
* Are we communicating information explicitly and honestly?
* Does this design help users confidently access and share well-sourced, reliable knowledge?

===Content First===
We aim for content to be at the center of Wikimedia projects, and to facilitate its comprehension and use.
* Is this design prioritizing the most contextually important information?
* Is the content presented in a way that supports clear understanding?
* Does this design help make it easy to learn from, improve, and spread content?


Read more about the [[Design/Statement of purpose|background for this work]].

== About the team ==
The product design team has over 500 years of combined [[w:user experience design|user experience design]] and research, engineering, [[w:information architecture|information architecture]], [[w:Human–computer interaction|HCI]], [[w:Graphic designer|visual design]], and [[w:User experience design#Usability|usability]] experience.  

===Product Design===
<gallery heights="150" mode="nolines" style="line-height:100%;">
File:Ho, Rita January 2017.jpg|[[m:User:RHo_(WMF)|Rita Ho<br><small>Director of Design</small>]]
File:Giner, Pau April 2014.jpg|[[User:Pginer-WMF|Pau Giner<br><small>Principal User Experience Designer</small>]]
File:LiMadeo, Carolyn 2016.jpg|[[User:CMadeo (WMF)|Carolyn Li-Madeo <br><small>Design Group Manager</small>]]
File:Joyprofile.jpg|[[User:JSengupta-WMF|Joydeep Sengupta <small>Design Group Manager</small>]]
</gallery><gallery heights="150" mode="nolines" style="line-height:120%;">
File:Wikimedia Foundation office camera shy.png|[[foundation:User:SGautam_(WMF)|Sudhanshu Gautam<br><small>Lead User Experience Designer</small>]]
File:Wikimedia Foundation office camera shy.png|[[User:NAyoub (WMF)|Nicolas Ayoub<br><small>Design Group Manager</small>]]
File:Wikimedia Foundation office camera shy.png|[[User:AAlhazwani (WMF)|Amin Al Hazwani<br><small>Lead User Experience Designer</small>]]
File:Wikimedia Foundation office camera shy.png|[[User:SPatel (WMF)|Sneha Patel<br><small>Lead UX Designer</small>]]
</gallery><gallery heights="150" mode="nolines" style="line-height:120%;">
File:Wikimedia Foundation office camera shy.png|[[User:BMartinezCalvo (WMF)|Bárbara Martínez<br><small>Senior UX Designer</small>]]
File:JSchererWMF.jpg|[[User:JScherer-WMF|Justin Scherer]] <br> <small>[[User:JScherer-WMF|Lead UX Designer]]</small>
File:Wikimedia Foundation office camera shy.png|[[User:KColeman-WMF|Katie Coleman]] <br> <small>[[User:KColeman-WMF|Lead UX Designer]]</small>
File:Gregory Onyeahialam (WMF).jpg|[[User:GOnyeahialam (WMF)|Gregory Onyeahialam<br><small>Senior User Experience Designer</small>]]
File:Wikimedia Foundation office camera shy.png|[[User:JFernandez-WMF|Julieta Fernández <sub>User Experience Designer</sub>]]
File:Wikimedia Foundation office camera shy.png|[[User:OTichonova (WMF)|Olga Tichonova <sub>Senior User Experience Designer</sub>]]
File:Derek Torsani yellow hat.jpg|[[User:DTorsani-WMF|Derek Torsani <br><small>Lead Visual Designer</small>]]
File:Sarah Chekfa.png|[[m:User:SChekfa-WMF|Sarah Chekfa<br><small>User Experience Designer</small>]]
File:Wikimedia Foundation office camera shy.png|[[m:User:SSanchez-WMF|Sarai Sanchez<br><small>Lead User Experience Designer</small>]]
File:Profile-picture-tais.jpg|[[m:User:TLessa-WMF|Taís Lessa<br><small>Lead UX Designer</small>]]
File:Ruthodonoghue.jpg|[[m:User:ROdonoghue-WMF|Ruth O'Donoghue<br><small>Senior UX Designer</small>]]
</gallery>

===UX Research===
The Product Design team works closely with UX Research. More info on their team page [[Wikimedia Research/UX Research|here]].
<gallery heights="75" mode="nolines" style="line-height:120%;">
File:DebraKumar-photo.jpg|[[metawiki:User:DKumar-WMF|Debra Kumar<br/><small>Manager, UX Research</small>]]
File:Bethanyg.png|[[User:BGerdemann_(WMF)|Bethany Gerdemann<br/><small>Program Manager</small>]]
File:Asikin-Garmager, Eli Jan 2020.jpg|[[User:EAsikingarmager_(WMF)|Eli Asikin-Garmager<br/><small>Principal UX Researcher</small>]]
File:Michaelraish2021.jpg|[[User:MRaish_(WMF)|Michael Raish<br/><small>Lead UX Researcher</small>]]
File:Daisy Chen-2.jpg|[[foundation:User:Dchen (WMF)|Daisy Chen<br /><small>Lead UX Researcher</small>]]
File:Lo Claudia Dec 2018.jpg|[[User:CLo (WMF)|Claudia Lo<br /><small>Senior UX Researcher</small>]]
</gallery>

==Process ==
=== How to get involved and work with us ===
We welcome help in many ways, but we have limited time and have priorities based on the Foundation's roadmap to focus on. We want to make sure we foster an environment where community designers can contribute to the projects as well as developers. 

A few ways to help out by volunteering your time:
* '''Review, create or contribute to Phabricator design tasks''' with one of the following tags:
** [[phab:tag/design|Design]] – for issues or requests related to design in Wikimedia movement projects
** [[phab:tag/design-research|Design-Research]] – for UX research requests
** [[phab:tag/codex|Codex, Design System for Wikimedia]] – including our default user interface library based on Vue.js (intended to replace [[phab:tag/ooui|OOUI]]), our design tokens and icons collection
*** [[phab:tag/ooui|OOUI]] – our former default user interface library (2015-2022, maintained and improved, but without new feature development)
** [[phab:tag/accessibility|Accessibility]] – for all tasks that are meant to make our interface more accessible and inclusive
** [[phab:tag/mediawiki-interface|MediaWiki-Interface]]
* Learn about the [https://design.wikimedia.org/style-guide/design-principles.html Wikimedia design principles] and [[Wikimedia Foundation Design/How to give design feedback|how to give design feedback]]

==Projects ==
=== Product teams ===
Many ''(but not all)'' of our cross-disciplinary product teams have a UX designer embedded into the team, where they focus on the User Experience (UX) for the team. Here's a list of the teams in which designers are currently working.
{| class="wikitable"
|+
!Team
!Description
!Designer
!Area of focus
|-
|[[Reading/Web|'''Reader Experience (formerly Web team)''']]
|Focuses on the reading experience on web.
|[[User:SPatel (WMF)|Sneha Patel]]
| rowspan="5" |'''Consumers'''
''area managed by [[User:CMadeo (WMF)|Carolyn Li-Madeo]]''
|-
|[[Reading/Web|'''Reader Growth (formerly Web team)''']]
|Focuses initiatives to attract new readers to Wikipedia.
|[[User:JScherer-WMF|Justin Scherer]]
|-
|[[Wikimedia Apps/Team/Android|'''Android''']]
|The [[Wikimedia Apps/Team/Android|Android team]] focuses on building inclusive mobile-first experiences, equitably filling knowledge gaps and increasing quality contributions to Wikipedia.
|[[User:SChekfa-WMF|Sarah Chekfa]]
|-
|[[Wikimedia Apps/Team/iOS|'''iOS''']]
|The [[Wikimedia Apps/Team/iOS|iOS team]] focuses on building mobile first inclusive, consistent, and permeable features to make editing, reading, and participating on Wikipedia intuitive for iOS app users.
|[[m:User:TLessa-WMF|Taís Lessa]]
|-
|'''[[Future Audiences]]'''
|The Future Audiences Team is in charge of exploring strategies to expand beyond our existing audiences of readers/users and contributors, in an effort to truly reach everyone in the world as the "essential infrastructure of the ecosystem of free knowledge."
|Maryyann Crichton
|-
|[[Editing team|'''Editing''']]
|The [[Editing team]] work on products for editing—generally across MediaWiki, and the suite of [[Editor|editors]] including [[VisualEditor]], as well as initiatives that facilitate more productive contributions (such as [[Talk pages project|On-wiki collaboration]] and [[Edit check|Edit Check]]). 
|[[User:NAyoub (WMF)|Nicolas Ayoub]] and [[User:BMartinezCalvo (WMF)|Bárbara Martínez]]
| rowspan="4" |'''Contributors'''
''area managed by [[User:NAyoub (WMF)|Nicolas Ayoub]], with [[User:AAlhazwani (WMF)|Amin Al Hazwani]]''
|-
|'''[[Growth]]'''
|The [[Growth|Growth team]] focuses on features to encourage activation and retention of new editors on Wikipedia and other Wikimedia projects.
|[[User:AAlhazwani (WMF)|Amin Al Hazwani]]
|-
|[[Moderator Tools|'''Moderator Tools''']]
|The [[Moderator Tools]] team focuses on content moderation needs and processes, including page protection, deletion, reporting, and recent changes patrolling.
|[[User:OTichonova (WMF)|Olga Tichonova]]
|-
|[[metawiki:Campaigns/Foundation_Product_Team|'''Connection''']]
|The [[metawiki:Campaigns/Foundation_Product_Team|Connection team]] is focused on building tools to help [[foundationsite:wikipedia20/wikimedia-campaigns/|campaign and event organizers]] effectively engage participants as successful editors and retain them as contributors on Wikimedia projects.
|[[User:JFernandez-WMF|Julieta Fernandez]]
|-
|'''[[Wikimedia Language and Product Localization|Language and Product Localization]]'''
|The [[Wikimedia Language and Product Localization|Language and Product Localization team]] focuses on reducing barriers to access and share knowledge. Main focus is to reduce knowledge gaps across languages with [[Content translation|content]] and [[Content translation/Section translation|section]] translation. This team was created as the union of the former [[Inuka team|Inuka]] and [[Wikimedia Language engineering|Language]] teams.
|[[User:Pginer-WMF|Pau Giner]] and [[foundation:User:SGautam_(WMF)|Sudhanshu Gautam]]
| rowspan="4" |'''Languages, Content Growth, and Communities'''
''area managed by'' ''[[User:JSengupta-WMF|Joydeep Sengupta]], with [[User:Pginer-WMF|Pau Giner]]'' 
|-
|[[Abstract Wikipedia team|'''Abstract Wikipedia''']]
|The [[Abstract Wikipedia team|Abstract Wikipedia team]] is focused on building [[:en:Wikifunctions|Wikifunctions]] and Abstract Wikipedia, both efforts towards a multilingual Wikipedia where more people can share more knowledge in more languages.
|[[metawiki:User:GOnyeahialam_(WMF)|Gregory Onyeahialam]]
|-
|[[metawiki:Community_Tech|'''Community Tech''']]
|The [[metawiki:Community_Tech|Community Tech team]] is focused on equity and community impact, building and improving curation and moderation tools crowdsourced from experienced users through the [[metawiki:Community_Wishlist_Survey|Community Wishlist Survey]].
|[[metawiki:User:ROdonoghue-WMF|Ruth O'Donoghue]]
|-
|'''[[Product Safety and Integrity]]'''
|The [[Product Safety and Integrity]] team focuses on features to increase digital and physical safety and security on the Wikimedia projects.
|[[User:KColeman-WMF|Katie Coleman]] (''interim coverage by [[phab:p/KieranMcCann-WMF/|Kieran McCann]]),'' with support from [[metawiki:User:ROdonoghue-WMF|Ruth O'Donoghue]]
|-
|[[Codex/Steering Committee|'''Codex Design System Steering Committee''']]
|The Codex Steering Committee is composed of a lead designer, an engineering manager, and a principal engineer with a constant degree of commitment dedicated to stewarding [[Codex]], the Wikimedia design system. The committee reviews design system priorities and coordinate design and engineering resourcing. The Codex Steering Committee was formed as a successor to the [[Design System Team]].
| colspan="2" |[[User:DTorsani-WMF|Derek Torsani]]
|-
|'''[[MediaWiki Engineering Group|MediaWiki]] & [[Data Platform Engineering|Data Platform]]'''
|The [[MediaWiki Engineering Group]] specializes in working with MediaWiki and various parts of its core software, whilst the [[Data Platform Engineering|Data Platform Engineering team]] comprises data teams and systems from across the Product and Technology department with a goal to deliver end-to-end data capabilities for data producers and consumers.  
| colspan="2" |[[metawiki:User:SSanchez-WMF|Sarai Sanchez]]
|}

==Design resources==
{{update|reason=[[Codex]] style guide replaced Wikimedia Design [[Design/Living style guide|Style Guide]].}}
Our resources for majority of our work are public and in open source projects. Have a look at the '''[https://doc.wikimedia.org/codex/latest/style-guide/overview.html Wikimedia Design Style Guide]''' (on [https://github.com/wikimedia/WikimediaUI-Style-Guide Github]) and its [https://design.wikimedia.org/style-guide/resources.html Resources section].<br>
When designing with us bear in mind our [[Design best practices]].

All our graphics assets are licensed under open licenses (but note that many of the logos are [[:foundation:Trademark policy|trademarked]]). All our user interface development is public in open source projects.
* [[Design/Typography|Typography, collection of topics around typography and the Typography Refresh 2014]]
* [https://design.wikimedia.org/style-guide/visual-style_icons.html Visual Style: Icons] 

=== Reach out or stay up-to-date ===
* Read our [https://design.wikimedia.org/blog Design blog]
* Find out more about [[Design/Research|User Research]]

===Archived, obsolete resources===
For historical context:
* [[phab:tag/wikimedia_design_style_guide|Wikimedia-Design-Style-Guide]], the predecessor of Codex
* [[Design/Wikicons|Iconography]] (redirects to the archived [[Design/WikiFont|WikiFont]])
* [[Wikimedia Foundation Design/Agora Control Library|mediawiki.ui]] - User interface library (CSS class based approach, archived as superseded by [[OOUI]])
* [[c:File:Livingstyleguide.pdf|Living style guide]] (archived PDF, the website {{color|grey|<nowiki>http://livingstyleguide.wmflabs.org/</nowiki>}} is defunct)
* [[Design/Design Review|Design Critique]]
* [[Wikimedia Foundation Design/Process|Design Team Roles]]
* Help with [[Micro Design Improvements]] (obsolete)
* Follow [https://twitter.com/WikimediaDesign @WikimediaDesign on Twitter]
* Join the [https://lists.wikimedia.org/mailman/listinfo/design Design mailing list]
* Join the [[m:IRC/Channels#wikimedia-design|#wikimedia-design IRC channel]]

== Design Fellow Alumni ==
<gallery heights="105" mode="packed">
File:Liu, YuFei April 2014.jpg|[http://www.yufeiliustudio.com YuFei Liu <br><small>Visual Design Fellow, 2014</small>]
File:Nguyen, Michelle 2015.jpg|[http://michellemeng.com Michelle Nguyen <br><small>Visual Design Fellow, 2015</small>]
File:Gus oenning.jpg|[http://www.gusoenning.com/ Gus Oenning <br><small>Visual Design Fellow, 2015</small>]
File:WMFhiring.svg|[https://jobs.wikimedia.org/ Jobs page]|link=https://jobs.wikimedia.org/
</gallery>[[Category:Design| ]]
[[Category:Design team| ]]
[[Category:Wikimedia Foundation teams internals]]