Merge pull request #435 from 18F/lsgitter-patch-1

Create interface-audit.md

_data/categories.yml

@@ -20,6 +20,7 @@
     - Content audit
     - Design hypothesis
     - Design principles
+    - Interface audit
     - Journey mapping
     - Mental modeling
     - Personas

_methods/interface-audit.md

@@ -0,0 +1,45 @@
+---
+layout: card
+title: Interface audit
+permalink: /decide/interface-audit/
+redirect_from:
+  - /interface-audit/
+description: A listing and analysis of all the components, design patterns, and interface features of an existing website (including typography, color, graphics/illustration/icons)
+
+category: Decide
+what: A listing and analysis of all the components, design patterns, and interface features of an existing website (including typography, color, graphics/illustration/icons)
+why: To identify components that need to be revised in new versions of a website to create consistency and fill gaps. Interface audits can also help you establish and document a design system for a website. 
+timeRequired: Depends on scope of audit (how many pages, how many contributors, etc)
+---
+
+## How to do it
+
+An interface audit can be conducted by an individual or in a group setting. Either way, the steps are as follows:
+1. Identify the website and take screenshots of all the pages you want to audit
+1. Create a checklist of aspects you want to audit on each page—for example typography, header and body copy styles, use of color, buttons, icons, etc.
+1. For each page, take notes on each aspect on your checklist.
+1. Once all pages have been audited, compare notes and identify inconsistencies (e.g., headers are inconsistently formatted, sometimes bolded, sometimes italicized).
+1. Decide how to resolve any inconsistencies by choosing one of the existing approaches found on the site (e.g., make all headers bold) or designing a new solution (e.g., make all headers a different color).
+
+*Note: It’s helpful to involve developers, who will be able to advise on the feasibility of potential solutions.*
+
+
+
+
+<section class="method--section method--section--additional-resources" markdown="1">
+
+## Additional resources
+- [Conducting an Interface Inventory](https://bradfrost.com/blog/post/conducting-an-interface-inventory/), including sample interface inventory categories for a checklist. Brad Frost.
+- [Interface Inventory](https://bradfrost.com/blog/post/interface-inventory/). Brad Frost.
+- [Design Systems Sprint 1: The Interface Inventory](https://medium.com/@marcintreder/design-systems-sprint-1-the-interface-inventory-1f78d376e49a). Marcin Treder.
+
+
+
+</section>
+
+<section class="method--section method--section--government-considerations" markdown="1" >
+
+## Applied in government research
+
+No PRA implications. No information is collected from members of the public.
+</section>