Interactive Description Design Checklist

[terracoda]

Inclusive Features

• Alternative Input - (Started: Feb 22, 2022) (Completed: )
• Interactive Description - (Started: Feb 22, 2022) (Completed: )
  • Mobile A11y included - (Started: ??) (Completed: )
• Sonification - (Prior to ID, see sound design doc)
• Voicing (Prior to ID, see voicing design doc)

Design Tasks

• Multimodal Features folder created in PhET Sim Design folder. Sub-folders (Interactive Desciption, Sound and Sonification, Voicing) created as needed. Description design doc created in Interactive Description sub-folder (Date: Feb 22, 2022)
• Link to Quadrilateral: Interactive Description

Interactive Description - Design

State Descriptions for PDOM

Checked State Descriptions are ready for Implementation

• All interactive objects and their interaction types are defined (e.g., buttons, etc.)
• Corners and Sides are custom movable objects, trying one-step grab/drag interaction, like RaP Both Hands

State Descriptions

Static State Descriptions

• Heading Outline (Sign Posts) &
• Navigation Order (Interaction Points/ Tab Order)
• Static screen summary
• Initial sim-specific interaction hint (Dynamic)
• Headings for objects/groups in Play Area
• Names & interaction types for interactive objects
• Help text for interactive objects

Dynamic State Descriptions

• Dynamic screen summary (i.e., brief state-of-the-sim)
• Dynamic states for identified dynamic objects (can add list to this issue)
• Dynamic parameters (scales and approximate ranges) for dynamic objects ready
• Special case parameters or phrases for dynamic state descriptions identified (can add list)

Responsive Descriptions

Checked Responsives Descriptions are ready for Implementation

### [Object Responses](url to section design doc) **[Qualitative Scales & Parameters](link to section in design doc)** - Tables (or lists) outlining dynamic parameters (scales & ranges) for each sim concept created - [ ] Scale determined for __CONCEPT 1__ : __OBJECT 1__ - [ ] Scale determined for __CONCEPT 2__ : __OBJECT 2__

[Context Responses](url to section design doc)

[Complex Context Responses - By Interaction](link to design doc)

• List out different objects/concepts as needed
  • Context responses for OBJECT 1
  • Context responses for OBJECT 2

Simple Context Responses (notes in State Descriptions & PDOM)

Checked items ready for implementation

• Context responses for items in Control Area
• Common code responses (e.g., Reset All, Mute Sound) verified

[Description Design Testing](url to section design doc)

• Brief cognitive walkthrough document's the sim's main interaction (highly recommended)

Interactive Description - Implementation

State Descriptions

Checked State Descriptions items verified by designer

### Static State Descriptions (Screen Summary) - [x] H1 for sim title - [x] Tab order correct - [x] Sim Regions & H2 Headings (Play Area, Control Area, Sim Resources) - [x] Static part of screen summary - [ ] Initial sim-specific interaction hint provided in own paragraph - [x] Keyboard Shortcuts interaction hint (PART OF COMMON CODE)

Static State Descriptions (Play Area)

• Sim-specific H3's for sim objects (or none for this sim)
• Interactions are accessible (i.e., have accessible names, keyboard accessible)
• Help text for interactive objects

Static Descriptions (Control Area)

• Sim-specific H3s for Control Area (or none for this sim)
• Interactions are accessible (i.e., names, keyboard accessible)
• Help text for checkboxes
• Reset All button

Sim Resources (Sim Resources)

• Keyboard Shortcuts dialog completed
  • Keyboard Shortcuts dialog accessible
  • Keyboard Shortcuts button added
• All Audio button (added when sound is added to main sim repo)

Dynamic State Descriptions

Add or remove details as needed
Dynamic Screen Summary

• Phrases work with all parameters
• Capitalization verified
• Punctuation verified
• Edge cases verified

Play Area Dynamic State Descriptions for Objects

• Phrases work with all parameters
• Capitalization verified
• Punctuation verified
• Edge cases verified

Responsive Descriptions

Checked Responsive Descriptions items verified by designer

### Object Responses (often aria-valuetext) **Name interactive objects and details as needed** **Add or remove interactive object details as needed** **OBJECT Response 1** - [ ] Qualitative scales for comparing side-length verified (same as voicing) - [ ] Quantitative scales for comparative corner size verified (same as voicing) - [ ] Increases/decreases verified - [ ] Steps verified - [ ] Interaction shortcuts verified (e.g., Home/End keys when appropriate)

Complex Context Responses (often aria-live regions)

Name Context Responses and details as needed

(e.g., GFLB: Responses described force changes specific to changing distance or changing mass; Molarity: Responses described changes to solution concentration specific to Solute Amount changes, Solution Volume changes, and Solute changes)

Add or remove context details as needed
CONTEXT Response 1: OBJECT 1 Increase

• Shared name (between designer and developer) for the context

Simple Context Responses (Sim options)

List sim options to verify (e.g., checkboxes in Control Area)

• Checking/unchecking alerts, verified

Other A11y ToDo's

Checked items completed

**Maintain [Accessible Sims page](https://phet.colorado.edu/en/accessibility/prototypes)** - [ ] Use website admin page (or create issue) to add sim to to A11y Sims page once there is a working prototype - [ ] Update link to prototype from time to time - [ ] At Dev Testing - [ ] At RC Testing - [ ] At publication

Accessory Materials

• Create issue to update Teacher tips
• Create issue to create Sound feature videos
• Create issues to document new or improved design patterns

Other Features & Items (e.g., Mobile A11y features?)

• List items as needed

Check Credits

• Verified A11y team additions: (add names here)
• Create issue with verified a11y team member additions

Once Evaluation begins

• Ensure interviews are recorded to the sim's interview spreadsheet

During QA or just after publication

• Clean and polish up Interactive Description design doc
• List out main design challenges (if any and if necessary)
• List out lessons learned from this sim (e.g., found focus issues for iOS)
• Suggest improvements to THIS issue template

Housekeeping notes (e.g., significant changes to Checklist (optional)