Article Feedback Tool v5 Video Overview from MediaWiki.org
Article Feedback Tool v5
Date: 2012
Client: Wikipedia/The Wikimedia Foundation
Employer: OmniTI Inc.
Skills & Tech: UI/UX Design, A/B Testing, HTML/CSS, Javascript, PHP

Update 2017:
This project was discontinued in 2014 to make way for Wikipedia's new collaboration tool, Flow. AFT5 archive and documentation available on MediaWiki.org: https://www.mediawiki.org/wiki/Article_feedback/Version_5
Project Background:
Wikipedia is the sixth-most-visited website in the world, with tens of millions of visitors per day, and one of the most engaged communities of contributors and editors on the web. The Wikimedia Foundation, who owns and manages the site, has a staunch philosophy of openness and inclusiveness, allowing nearly all of the articles on the site to be edited by guests and and registered users alike. The Wikimedia Foundation came to OmniTI to do a complete overhaul of the current feedback engine, Article Feedback Tool v4 (AFT4), and to bring it up to the new Article Feedback Tool v5 (AF5).

Screenshots:

The Article Feedback Tool Loads at the bottom of the page. There is an explanatory tooltip to answer quick questions.
Feedback is first gathered as boolean value to create a low entry threshold for feedback submitters.
Users may then leave additional, optional comments.
Confirmation of feedback receipt with an additional call to action and links to view other feedback.
Feedback aggregation page. 
Additional Notes:
Article Feedback Form:
The AF5 form was designed to integrate seamlessly with Wikipedia’s aesthetics, using a simple box structure and color palette consisting of light grays and blues. During the prototypal phase, five initial form options were created and put into testing: a 5 star rating; comments that could be tagged as “Suggestion,” “Question,” “Problem,” or “Praise;” a “Did you find what you were looking for?” yes/no query to the user; and a Call to Action to edit the article.

After multiple rounds of testing, it was determined that the option that received the most user engagement was the “Did you find what you were looking for?” query followed by an optional comment field.

Feedback Aggregation Page:
The AF5 feedback aggregation page is designed to convey large volumes of data without overwhelming the user. Standard filters (relevant/all comments) and sorting options allow users to quickly find the feedback they’re looking for. Users may vote on the relevance of given feedback or flag it as abusive/non-constructive. Moderators have the ability to hide comments that have been successively flagged.

Both projects were front-end developed by means of XHTML, CSS2 with some CSS3 progressive enhancements (shadows, rounded corners, etc.), and some PHP. All programming was done in accordance with Wikimedia guidelines; versioning was initially handled with Apache Subversion and later moved over to Git. Bug tracking was handled via Bugzilla.

You may also like

qPad Sales Slick
Graphic DesignIcon DesignPrint Design
2010 Senior Exit Exhibition Print & Digital Campaign
Graphic DesignIllustrationPrint Design
Smithsonian Institution Logos
BrandingGraphic DesignTypography
Nicholas Jenson: Prototypographer
Graphic DesignPrint DesignTypography
Quotient Inc. DrupalCon 2017
Web DesignWeb DevelopmentBranding
Copyright & Wrong presented by AIGA-UMBC
Graphic DesignIllustrationPrint Design
Quotient Sales Apps
Graphic DesignPrint DesignTypography
Smithsonian Global Genome Initiative
Web DesignWeb DevelopmentGraphic Design
National Geographic TV Work
Print DesignMotion Graphics
Scene Title Cards for "On the Verge" @ REP Stage
Print DesignSet Design
Back to Top