Design/How to give design feedback

This page provides interested parties with a guide on how to give constructive feedback on Wikimedia Foundation Design. Parts of it may be generally good advice for how to give constructive design feedback, but this FAQ is tailored to working with staff designers in particular, since there are some exceptions to how design workflows for staff are, compared to all MediaWiki contributors.

Background
The Wikimedia Foundation has assembled a small design team with the goal of improving user experience across its various projects, with a current focus on editor engagement and retention on Wikipedia. This team will be experimenting with changes to core design assets and interaction patterns on the MediaWiki platform and measuring their impacts quantitatively.

Many of these experiments will involve applying established, modern web design patterns which are not yet in-use on the platform, whereas other ideas may be larger and more controversial to existing users. This guide is designed to provide users with a template for giving actionable feedback to the design team in order to help them discover issues with designs and iterate upon them accordingly.

Design process
WMF designers employ user-centered design when implementing their work. It may be helpful to illustrate this process to give users an idea of where designs came from. The details vary across projects based on their differing constraints, however we follow this general (idealized) pattern:


 * 1) Research: All of our design work begins with some form of research. This can be qualitative or quantitative, or may simply involve evaluating existing web patterns which may solve a particular problem.
 * 2) Ideation: Multiple, valid solutions to the problem are quickly sketched or prototyped. The number of ideas typically varies from 1-10.
 * 3) Selection: Of all ideas presented, one is selected for implementation. This process includes an analysis of tradeoffs with each design concept, as well as a basic heuristic analysis.
 * 4) Evaluation: Using qualitative or quantitative measurement, the chosen concept is evaluated with respect to use cases and general user satisfaction.
 * 5) Iteration: No design is perfect the first time. We repeat steps 1-4  based on the results of qualitative and quantitative analyses of an initial concept.

Again, this is an idealized process; rarely do constraints permit us to perfectly follow these steps. Users providing feedback to the design team will do so during Step 4: Evaluation. Your feedback will be used to drive additional research, ideation, and selection.

Guidelines
These are some general guidelines for providing useful design feedback:
 * Always connect your feedback to a specific use case or user goal.
 * Leave subjectivity at the door. Any criticism should include a rationale for how all users are affected; not just one. Try to avoid cognitive biases.
 * Provide as much context to your feedback as possible, including technical details and use-cases.
 * Provide references to design literature, data, or patterns that support your feedback. A list of design resources is provided on this page.
 * If possible and applicable, suggest alternative ideas when you disagree with a course of action.

Usability

 * Nielsen's 10 Heuristics - a popular, concise list of usability heuristics
 * Bruce Tognazzini's Heuristics - a larger collection of usability heuristics
 * Usability.gov - the US Government's collection of web usability principles

Design patterns

 * Dribbble - a design community with many user interface examples
 * UI Patterns - a collection of user interface patterns
 * pttrns - a collection of mobile user interface patterns
 * Mobile Patterns - another collection of mobile user interface patterns
 * Android Niceties - another collection of mobile user interface patterns, with a focus on Android

Typography

 * Thinking with Type by Ellen Lupton - a free, online book explaining the basics of typography
 * The Elements of Web Typography - another free, online book that covers the basics of web typography
 * Dyslexic.com: Fonts - a guide to typographic accessibility for dyslexics

Color Theory

 * Basic Color Theory Tutorial
 * Color Theory on Wikipedia