HAX Design Library

Guideline 1

Make clear what the system can do

Help the user understand what the AI system is capable of doing.

Guideline 1 > Pattern 1A

Pattern 1A: Introductory blurb

Guideline 1 > Pattern 1A > Example

Pattern 1D: Demonstrate possible system inputs

Guideline 1 > Pattern 1D > Example

Bing | 1D: Demonstrate possible system inputs

Guideline 1 > Pattern 1E

Pattern 1E: Show a set of system outputs

Guideline 2

Make clear how well the system can do what it can do

Help the user understand how often the AI system may make mistakes.

Guideline 2 > Pattern 2A

Pattern 2A: Match the level of precision in UI communication with the system performance – Language

Guideline 2 > Pattern 2B

Pattern 2B: Match the level of precision in UI communication with the system performance – Numbers

Guideline 2 > Pattern 2B > Example

Uber Eats | 2B: Match UI communication precision with system performance — Numbers

Guideline 2 > Pattern 2C

Pattern 2C: Report system performance information

Guideline 2 > Pattern 2C > Example

Kayak | 2C: Report system performance information

Guideline 2 > Pattern 2D

Pattern 2D: Provide low performance alerts

Guideline 11

Make clear why the system did what it did

Enable the user to access an explanation of why the AI system behaved as it did.

Guideline 11 > Pattern 11A

Pattern 11A: Local explanations

Guideline 11 > Pattern 11B

Pattern 11B: Global explanations

Guideline 11 > Pattern 11B > Example

Instagram | 11B: Global explanations

Guideline 11 > Pattern 11C

Pattern 11C: Present properties of system outputs

Guideline 11 > Pattern 11D

Pattern 11D: Map system input attributes to system outputs

Guideline 11 > Pattern 11E

Pattern 11E: Map user behaviors to system outputs

Guideline 11 > Pattern 11F

Pattern 11F: Example-based explanations

Guideline 11 > Pattern 11G

Pattern 11G: “What if?” explanations

Guideline 16

Convey the consequences of user actions

Immediately update or convey how user actions will impact future behaviors of the AI system.

Guideline 16 > Pattern 16A

Pattern 16A: Feedforward: Convey the consequences of user actions before the user takes action

Guideline 16 > Pattern 16A > Example

Facebook | 16A: Feedforward: Convey the consequences of user actions before the user takes action

Guideline 16 > Pattern 16B

Pattern 16B: Feedback: Convey the consequences of user actions after the user takes action

Guideline 16 > Pattern 16C

Pattern 16C: Remind of consequences of a past action and ask for reconfirmation

Guideline 16 > Pattern 16D

Pattern 16D: Convey the consequences of user action in help and documentation

Guideline 16 > Pattern 16D > Example

Interactive collection of the 18 Guidelines for Human-AI Interaction, with design patterns for applying them and examples.