Guidelines
RoleS
Research, copy writing, visual design, accessible design, human factors
context
Full-time Interaction Designer at Resideo (Oct ‘20 - Feb ‘20)
Problem
Resideo’s design team needs to meet and understand existing usability and accessibility guidelines, so users of all abilities can seamlessly use our products.
Outcome
After advocating for the inclusion of accessibility, I designed a book of research and design heuristics, contextualizing the examples to Resideo’s products.
How can we empower and equip Resideo’s design team to create more usable and inclusive products?
content writing
My team of three began by conducting secondary research of existing usability heuristics and accessibility guidelines, particularly highlighting the Nielsen Norman Group’s Usability Heuristics for UI Design, Gerhardt-Powals’ Cognitive Engineering Principles, the 13 Display Design Principles, and, in my case, the Web Content Accessibility Guidelines (WCAG 2.1).
After determining which heuristics were relevant to Resideo’s product domain, we used a spreadsheet to write new definitions, as well as list products that could exemplify each guideline.
InVision Board
As the visual design lead for the project, I used InVision to aggregate effective examples of guideline and/or book designs. Doing so allowed me to explore potential ways of presenting the information in a user-friendly, digestible way,
Illustrations
I used Adobe Illustrator (as well as Adobe XD) to create illustrations of users, products, and more. Ultimately, these visuals would supplement text to more clearly exemplify ways in which each guideline has been/can be successfully met.
Document design
Using Figma and Adobe XD, I created a template for a guideline page, incorporating a designated space for a title, reference number, general definition, detailed description, and citation, as well as an open area for any examples. While the template allowed me to drive consistency across pages, I allowed flexibility for the illustrations, considering their variable sizes.
review
After using the template to design most of the pages, I printed out the first draft to share with the team and get feedback. Researchers and designers left comments and suggestions on how to enhance the overall understandability of the resource.
Putting it all together
My process was iterative—after making the recommended edits, I again collaborated with my team until we were confident about the result. Our final version had three sections: 10 Usability Heuristics for UI Design, 8 Human Factors Heuristics, and 10 Accessibility Guidelines. Below are some finished pages.