The GenderMag Design Catalog
This website shows evidence-based examples of designs that have been made more inclusive using The GenderMag Method. The changes are described in terms of the GenderMag cognitive facets Link to a page that explains the facets. If you would like to contribute your own pre- and post-GenderMag designs to this website, please email us at gendermag.method@gmail.com.
Add category labels: Categorizing issues with color-coded labels helps users avoid spending time on issues that don't fit their skill level
Problem

The issue list for this open source project doesn't allow users to easily parse through the issues and confidently select one that fits their skill level.

Attitude Toward Risk: A risk averse user doesn't want to waste time working on an issue that doesn't match their skill level.

Also affects users with: comprehensive information processing style, task-oriented motivations, low computer self-efficacy
Solution

Categorizing issues by color-coded labels allows users to map the skills needed for each issue.

Attitude Toward Risk: With this solution, a risk averse user can clearly identify the issue that best matches their skillset, and move forward without wasting time. This doesn't hinder a risk-tolerant user since they wouldn't have experienced this pain point.

Categorizing issues by color-coded labels also helps users with: comprehensive information processing style, task-oriented motivations, low computer self-efficacy

Evidence: This redesign was validated in a user study (to appear).

Break down lists: Categorizing items in a list helps users find items faster
Problem

List isn't categorized enough and there's no structure to the information.

Attitude Toward Risk: A risk averse user wants to clearly locate the publication they are looking for instead of wasting time reading the entire page.

Also affects users with: comprehensive information processing style, task-oriented motivations
Solution

Organizing the publications by category allows users to see all of the subtopics that can be found on the page.

Attitude Toward Risk: With this solution, a risk averse user can identify the category they're looking for and avoid wasting time reading the full page. This doesn't hinder a risk-tolerant user since they wouldn't have experienced the problem.

Organizing the publications by category also helps users with: comprehensive information processing style, task-oriented motivations

Evidence: This redesign was created by a researcher with 2 to 3 years of GenderMag experience

Demolish textwalls: Changing block of texts into encapsulated boxes helps users spend less time finding the correct information
Problem

More than the necessary information is provided, and it is not easily digestible.

Attitude Toward Risk: A risk averse user doesn't want to be overwhelmed with information, and waste time reading the entire page.

Also affects users with: comprehensive information processing style, task-oriented motivations
Solution

Adding the "Learn more..." hyperlink gives users the freedom to choose whether or not they want to view more information,

Attitude Toward Risk: With this solution, a risk averse user isn't forced to read the full page - which could be a waste of time. This doesn't hinder a risk-tolerant user since they wouldn't have experienced this pain point.

Encapsulating large chunks of information this way also benefits users with: comprehensive information processing style, task-oriented motivations

Evidence: This redesign was created by a researcher with 2 to 3 years of GenderMag experience

Organize persistently: Cohesively organized instructions help task-motivated users move forward
Problem

Instructions for each OS were in different locations in the project

Motivations: A task-oriented user doesn't explore around to gather up all the necessary instructions. If the instructions they need aren't organized cohesively they may abandon the task.

Also affects users with: low computer self efficacy, risk aversion, process-oriented learning style
Solution

Added and organized instructions all in one place for all OS setups.

Motivations: This allows task-motivated users to find exactly what they need but allows technology-motivated users to explore as much as they want.

Better organization can also help users with: low computer self efficacy, risk aversion, process-oriented learning style

Evidence: This redesign was validated in a user study (to appear).

Richen details : Detailed survey choices help risk-averse user move forward
Problem

The third choice does not indicate that graduate courses are part of the Computer Science or Electrical & Computer Engineering dept.

Attitude Towards Risk: A risk-averse user may abandon the survey all together if they do not see an option that fits their specific task. They don't want to waste time on something that may not actually help them reach their end goal.

Also affects users with: low computer self-efficacy, comprehensive information processing style
Solution

The third choice now specifies "CS & ECE".

Attitude Towards Risk: This solution empowers a risk-averse user to comfortably move forward knowing they are on the right track. It also doesn't hurt a risk-tolerant user.

Adding more detail also helps users with: low computer self-efficacy, comprehensive information processing style

Evidence: This redesign was created for the OSU Curriculum Proposal Form using GenderMag moments.

Enhance tooltips: Expandable, pinnable tooltips help users get and re-combine info while keeping context
Problem

To get help, users have to either leave their context (visit the dictionary) or open a tooltip that disappears once they clicked elsewhere. Users can't compare two definitions side-by-side.

Information Processing Style: Users are only allowed to see a tiny piece of documentation (a transient tooltip) or a huge amount (the dictionary). Comprehensive information processors want the in-between option: All and only the information they need to complete their task.

Solution

Tooltips stay open and can be moved anywhere on the screen, such as next to other open tooltips.

Information Processing Style: Users who favor a comprehensive information processing style can expand and pin tooltips (like the ‘for’ tooltip shown in the screenshot) so they can learn about and compare programming commands in a convenient way and at any time.

Evidence: A Principled Evaluation for a Principled Idea Garden, Will Jernigan, Amber Horvath, Michael Lee, Margaret Burnett, Taylor Cuilty, Sandeep Kuttal, Anicia Peters, Irwin Kwan, Faezeh Bahmani, Amy Ko, IEEE Symposium on Visual Languages and Human-Centric Computing, October 2015, 235-243.

Explain why: Hints can create clear paths for task-oriented users
Problem

This single sentence provides little information of what a user can expect if they click "Contribute.md".

Motivations: A task-oriented user prefers a workflow that doesn't require exploration to complete their task. If they don't see a clear path, they may abandon the task.

Also affects users with: comprehensive information processing style, risk aversion
Solution

The sentence with the contributing guidelines link now has hints that provides users with more information about what they can find in the 'contribute.md' file.

Motivations: A task-oriented user now knows what to expect if they click on the contributing guidelines link and doesn't need to explore in order to complete their task. Also, this solution allows a technology-motivated user to purposefully explore a piece of software by knowing where potential paths lead.

Adding hints to create a clear path can also help users with: comprehensive information processing style, risk aversion

Evidence: This redesign was validated in a user study (to appear).

Leverage hover: Hover-over drop-down menus help users avoid wasting time
Problem

The tabs provide no additional information about the contents of the page, and forces users to view the page before knowing its contents.

Attitude Toward Risk: A risk averse user wants to clearly locate the tab with the information they are looking for instead of wasting time clicking around.

Also affects users with: task-oriented motivations, comprehensive information processing style
Solution

Incorporating hover drop-down menus allows users to see all of the sub-topics that can be found on that page.

Attitude Toward Risk: With this solution, a risk averse user knows exactly what information is under each tab and avoids wasting time clicking around. This doens't hinder a risk-tolerant user since they wouldn't have experienced the problem.

Hover drop down menus also help users with: task-oriented motivations, comprehensive information processing style

Evidence: This redesign was created by a researcher with 2 to 3 years of GenderMag experience

Clarify expectations : Providing clear expectations and examples helps increase user confidence while answering questions
Problem

Fields were marked with titles, but did not include examples or clarifications of the expectations for input.

Computer Self-Efficacy: Users with low computer self efficacy blame themselves for not knowing exactly how to answer each question.

Also affects users with: risk aversion, comprehensive information processing style
Solution

Added stars to required fields, clarifying statements ('please state if it will be required or recommended'), and an example ('eg math placement test').

Computer Self-Efficacy: Users with low computer self efficacy now feel confident moving forward knowing that they're inputting correct information. Additionally a user with high CSE won't be frustrated with the survey since they'll receive fewer feedback errors.

Providing clear examples and expectations also helps users with: risk aversion, comprehensive information processing style

Evidence: This redesign was created for the OSU Curriculum Proposal Form using GenderMag Moments.

Don't be vague : Providing more context helps increase user confidence when making decisions
Problem

Title is vague and the lack of a description makes this issue difficult to guage.

Information Processing Style: A comprehensive newcomer needs enough detail to select an issue that fits their skill level; this further impacts their decision to contribute.

Also affects users with: low computer self efficacy
Solution

A more detailed title and description were added to provide context for the issue in the project.

Information Processing Style: By providing more information about the issue, a comprehensive newcomer is more inclined to contribute as they can easily decide if it's in their skill level. This solution doesn't hinder a selective newcomer who prefers lists with bolded key words over text blocks.

Providing more context can also help users with: low computer self-efficacy

Evidence: This redesign was validated in a user study (to appear).

Tell the future : Providing more contextual information helps comprehensive info. processors maked educated decisions
Problem

There was no information about what each link lead to and who the personas represent.

Information processing style: A comprehensive information processor needs more information in order to make a decision of how to move forward.

Also affects users with: task-oriented motivations, risk aversion
Solution

Now there are separate sections for each persona which include a paragraph description and two types of forms to choose from.

Information processing style: A user with a comprehensive information processing style now is given plenty of information in order to make an educated decision. This also doesn't hurt selective information processors since they can just choose one of the persona form options (in blue) rather than read the information before.

Providing more contextual information also helps users with: task-oriented motivations, risk aversion

Evidence: This redesign was created by a researcher with 2 to 3 years of GenderMag experience

Prevent false connections: Removing contradicting information helps increase user confidence
Problem

The original table seems contradictory since the "Rank" filter is bolded but the numbers on the right side don't seem to be in order. However, the numbers on the right are actually the number of publications for each university and doesn't affect the rank.

Computer Self-Efficacy: A user with low computer self-efficacy blames themselves for not understanding why the "Rank" filter doesn't match the ordering of the numbers on the right. This would either cause them to spend more time attempting to understand it or abandon the task worried that they did something incorrectly.

Also affects users with: task-oriented motivation, risk aversion, comprehensive information processing style, process-oriented learning style
Solution

The numbers on the right side of the table were removed.

Computer Self-Efficacy: Now a user with low computer self-efficacy isn't confused by the inconsistency between filters and numbers and can confidently proceed. This solution also doesn't hurt users with high computer self-efficacy.

Removing contradicting information can also help users with: task-oriented motivation, risk aversion, comprehensive information processing style, process-oriented learning style

Evidence: This redesign was created by Vorvoreanu et al. and validated through a user study.

Break into bullets: Step-by-step instructions benefit selective information processors
Problem

There are no step-by-step instructions or directions to the "issue list".

Information Processing Style: A user with selective information processing style wants to clearly locate the required information without be overwhelmed by extra text.

Also affects users with: task-oriented motivations, low computer self-efficacy
Solution

Numbered step-by-step instructions were added as well as a direct link to the "issue list".

Information Processing Style: This solution directs users with selective information processing style to a list of instructions instead of a paragraph. The "issue list" is hyperlinked and doesn't require additional navigation. This also doesn't prevent tinkerers from learning through exploration.

Incorporating numbered lists and hyperlinks also help users with: task-oriented motivations, low computer self-efficacy

Evidence: This redesign was validated in a user study (to appear).