Reading/Web/デスクトップ版の改善/リポジトリ/ウィキの外装の歴史
このページは、ウィキメディアのサイト用の外装について開発史を記録するものです。 現存もしくは過去の外装を網羅するのではなく、影響が大きく重要なものを取り上げます。 ウィキメディア運動で使わない外装はたくさんありますが、ここには含めません。 それぞれの節ごとに、実現しようとした目標、結果、その後への影響を、コミュニティがその努力を平均してどう評価したか示しました。それぞれの取り組みを文脈に応じて見比べるため、リンクを添えてあります。
2002年:最初にあったStandard(Classic)

目標:まず、どこかを始点にするほかないですね。(^_^)
結果:これは、外装が導入される前の、MediaWikiの最初の外観です。これはPhase II softwareの外観に似ており、そのPhase IIはUseModの見た目を踏襲していました。
影響:現在も存続するサイドバーと、(左横書き言語では)左上にあるサイトロゴ。面白いことに、検索ボックスはベクターと同じく右上隅にあります(モノブックでは検索ボックスがサイドバー内に移動させられています)。
リンク:
2003年:ケルンブルー

目標:
結果:バージョン1.31までMediaWikiに同梱されていました。2003年から現在まで、ウィキメディアのウィキで利用可能です。
影響:2019年に利用者の個人設定から非表示になりましたが(phab:T223824)、まだ使用できます。
リンク:
2004年:モノブックの幕開け

モノブックは、ページヘッダーの背景にある本の白黒写真にちなんで名付けられました。
目標:MediaWiki に「外装をつける」という概念を持ち込み、閲覧者にとってもっと明白で整理されたデザインに最新化すること。
結果:
影響:特に長期で活動している編集者により、今でも積極的に使用されている外装です。
- 2004年8月11日のMediaWiki バージョン1.3.0(Release notes/1.3#1.3.0)で初めて導入されました。
- 開発についての議論は m:Layout design document で、フィードバックは m:MediaWiki 1.3 comments and bug reports/Archive で行われました。
- 2018年時点で、モノブックをレスポンシブにするためのコミュニティ主導の活動 phab:T195625 が行われています。
リンク:
2008年:モダン

目標:Toolserverウィキで使うための、モノブックから派生した外装。
結果:バージョン1.30までMediaWikiに同梱されていました。2008年から現在まで、ウィキメディアのウィキで利用可能です。
影響:ケルンブルーと同じく、ゾンビのような外装です。サポートや使用はほとんどありませんが、それでも残っています。
リンク:
2008年:Rubyによる最初のモバイル版フロントエンド
目標:最初のモバイル向けゲートウェイは、ハプトン・キャトリン(Hampton Catlin、HamlとSassの作者)によって、Rubyで書かれました。
結果:モバイル形式のサイトが作られました。
影響:最終的にMobileFrontendへと進化しました。
リンク:
2009年:Wikipedia利便性計画
目標:「この取り組みの目的は、利用者の行動研究に基づいて基本となるソフトウェアを改善することによって、新規参加者にとってのウィキペディアの使い心地を計測可能な範囲で改善し、一般の人の参加の障壁となるものを減らすことです。」
結果:ベクター
影響:ベクター
リンク:
2010年:初のWMF主導の外装、ベクター
目標:利便性計画から得たことの実装。
結果:ユーザーインターフェースを変えるための、最大規模のWMF主導の計画のひとつとなりました。
影響:好き嫌いは別として、非常に多くのコード変更が行われた結果、簡単に改修できなくなってしまいました。
- たぶん、あなたはそんな外装でこのページを見ているでしょう。
リンク:
- https://usability.wikimedia.org/ などの場所で、1年以上かけ、何十ページにもわたって計画・議論されました。
- Deployed to Wikimedia wikis in April and May 2010
- wmfblog:2010/03/25/the-change-in-interface-is-coming/
- wmfblog:2010/05/01/the-change-in-interface-is-coming-part-2/
- wmfblog:2010/05/13/a-new-look-for-wikipedia/
- Enwiki: /Archive_1, /Archive_2, /Archive_3 and Wikipedia:Requests for comment/May 2010 skin change
- Of note, "Wikimedia Commons is planned to be switched over first, and English and other language Wikipedias, and our sister projects will follow as our development and operations teams are ready"
- m:Vector
- Skin:ベクター
2011: "Mobile site rewrite" – MobileFrontend
In 2010, Ethan Marcotte wrote one of the first essays on "Responsive Web Design" and coined the term. RWD is "an approach to web design that makes web pages render well on a variety of devices and window or screen sizes." See also a Wikipedia article about RWD.
目標:
Outcomes:
Legacy:
リンク:
2012: Athena
Goals: A prototype created by designer Brandon Harris to re-think the mobile site for contributors. You should watch the video linked on the project page for more context.
Outcomes: A first go at a unified, responsive, "mobile-first" skin for both desktop and mobile.
Legacy: General positive feelings, but never turned into a production skin.
リンク:
2013: VectorBeta Beta features feature
Goals: The VectorBeta extension was the first implementation of Beta features for the Vector skin.
Outcomes: Enabled users to test typography experiments, compact personal tools, and fixed header.
Legacy: Evolved into the current Beta features. This became a frequently (but inconsistency) used way of allowing desktop users to try out new features before making them available to all.
リンク:
2013: Turning off outdated skins
Goals:
Outcomes: Five skins without active maintainers were turned off on Wikimedia sites.
Legacy:
リンク:
2014: Winter is coming
Goals: A set of modules for experimenting with changes. Currently six of which are used as examples thought to be good ideas by the driver of the project, Brandon Harris (Jorm)
Outcomes: Jorm left the Foundation and the project stopped.
Legacy:
リンク:
2014: Typography refresh
Goals: Updates to Wikimedia's default typography, aiming to improve the readability, consistency, availability, and accessibility.
Outcomes: Was initially a beta feature that logged-in users could opt into. When deployed, not all items from the Beta feature were carried over. During development, the project added many little changes with some technical issues. Product teams did not wait long enough to see if users would get used to changes. Other non-typography-related changes were included (thumbnail appearance, fix-width content, removing numbering from Table of Contents). Some font changes were problematic, they did not work in some languages, particularly in Indic languages things were broken. One small wiki was blank as the font variant didn't exist for that language. Insufficient documentation was a problem throughout.
Legacy: Some frustration, with some improvements.
リンク:
- Extension:VectorBeta (pre-archiving diff)
- The typography refresh was one of several initiatives inside the VectorBeta extension along with a fixed header and compact personal tools.
- 文字体裁の改新
2015: Timeless
Goals: A single responsive skin for MediaWiki based on Winter
Outcomes: First truly volunteer-created and supported skin that got deployed on Wikimedia wikis since skins were split off from MediaWiki core
Legacy:
- Community-built skin
- Included with MediaWiki since version 1.31
- Currently available across Wikimedia projects as an opt-in skin
- Was discussed and voted by the French Wiktionary community as a potential replacement default skin but the actual configuration change was blocked by the Wikimedia Foundation
リンク:
2016: Minerva Neue
Goals: Historically, the mobile skin was not a real skin and there was a preconception that MobileFrontend was being built in bad faith and Wikimedia centric. Splitting out the Minerva skin was a passion project to show that it was something that could be used outside the mobile universe and maybe in the future a usable desktop experience.
Outcomes:
Legacy: Minerva skin decoupled from MobileFrontend
リンク:
2018: Advanced mobile contributions
Goals: Adding a feature set with more contributor-focused capabilities to the mobile web experience
Outcomes:
Legacy:
- Page issues
- Opt-in interface
- User menu
- Special: page updates
- What's next for MobileFrontend
リンク:
2019: Desktop Improvements
Skin:
Notes for future initiatives
This is mostly advice to anyone developing a new interface for Wikimedia projects. From a community perspective by way of Community Relations.
- Remember, the contents of the sidebar (a collection of links and tool curated by the community) is inconsistent across projects. Don't depend on it for anything resembling consistency. (E.g. meta: / w:he: / w:zh: / voy:ru: / mw: / etc.)
- The Foundation, as an organization leading recent efforts, has changed drastically since Vector was developed. In 2010 one could describe the Foundation as small teams, loosely affiliated.
- Keep in mind the impact any changes to the interface (skins) will have on editor recruiting rates – particularly initiatives across the Foundation to grow medium-size wikis in emerging communities.
- Don't hide the edit button.
- Don't say you want to make a "simple" interface, but do say you want to make the interface "clearer".
- With a broad stroke, power-editors don't want simplification. They are more focused on their workflows and not concerned with the complexity. To them, mastery of the interface is a sign of competence and commitment. They want more advanced tools (search, filters, quick actions (AWB, Huggle, Twinkle)), not less. You can sell them on a "clearer" interface, by also making their powerful tools more easily accessed and utilized - Progressive Disclosure designs, with an emphasis on how it will also help users who want even higher-density content/interfaces.
- If you want to present on-boarding documentation, this needs to be created with the community, not for them.
- Communicate everything, early and simply.
Statistics and example links
As of May 2019 there are six skins installed on Wikimedia sites.
- Vector (default on desktop; supported by the WMF) – example
- Cologne Blue (volunteer-supported) – example
- MinervaNeue (default on mobile; supported by the WMF) – example
- Modern (volunteer-supported) – example
- MonoBook (originally WMF supported, and now volunteer-supported) – example
- Timeless (volunteer-supported, partly via a WMF grant) - example
Statistics (phab tasks):