Matthew-Moore240 commented 4 years ago

This issue helps tracks the big picture progress of the description design, description implementation, and implementation of alternative input. Sound and adaptive features are incorporated only at a high-level here, though could be added as we move forward and learn more.

A11y Features

Checked features are being worked on for this sim

[x] Alternative Input - (Started: 3/30/20 ) (Completed: Dec 18, 2020)
- [x] Mobile A11y included
- [x] Pan & Zoom included
[x] Interactive Description - (Started: 4/8/20 ) (Completed: Dec 18, 2020 with #322) (RC 1 started Jan 26, 2021) (Published 1.0.0 March 26, 2021)
[x] Sonification - (Started:4/7/20 ) (Completed: )
[x] Tangible - (Started: 4/6/20) (Completed: )
[x] Voicing - (Started: ) (Completed: )

A11y Design

[x] Multimodal Features folder created in PhET Sim Design folder. Sub-folders (Description and Sound) created as needed.
[x] Interactive Description Design doc created in April 8. 2020. Link to Interactive Description Design Doc.
[x] This is a multi-screen sim! (all screens described in a single Interactive Description design document)

A11y Design Prep

[x] Main Sim Design reviewed for learning goals
(N/A) Teaching materials reviewed
[x] Reviewed model properties with Responsible Developer or A11y Developer
- For this sim, I assume model properties were created and reviewed in tandem during the design process
[x] Identify visual enhancements that deviate from model (e.g. "hollywooding")
- For this sim, hollywooding was determined as needed (e.g. fitness value). Issues near the bottom of the screen, and with Lock Ratio were things I remember.

Interactive Descriptions - Design

Interactive Descriptions

## PDOM **Checked items have PDOM structures identified & determined** - [x] Dynamic objects that warrant their own name and description in the Play Area, see [Heading Outline & Focus Order](https://docs.google.com/document/d/1HJvvGWYaUv9tlat9S7omQQVng8fGB4FuUhTEM1qx1z8/edit#heading=h.rm6k5cnbj102) - [x] All interactive objects and their PhET types (e.g., sliders, buttons, etc.), see [State Descriptions](https://docs.google.com/document/d/1HJvvGWYaUv9tlat9S7omQQVng8fGB4FuUhTEM1qx1z8/edit#heading=h.4qwnshvocwsz) - [x] New interaction types (i.e., new PDOM components or patterns) in this sims, or check: - First accessible PhET accordion box - Custom bi-manual interaction with no "grab button" - Lock Ratio checkbox - addresses mobile VO limitation where bi-manual operation is not possible - Platform specific help text for custom interactions and mobile VO limitations ## [State Descriptions](https://docs.google.com/document/d/1HJvvGWYaUv9tlat9S7omQQVng8fGB4FuUhTEM1qx1z8/edit#heading=h.4qwnshvocwsz) ### Static State Descriptions **Checked items drafted & ready for implementation** - [x] Static screen summary - [x] Initial sim-specific interaction hint (place in own paragraph) - [x] Headings for objects/groups in Play Area - [x] Labels for interactive elements - [x] Heading outline & Focus Order - [x] Help text for interactive elements ### [Dynamic State Descriptions](https://docs.google.com/document/d/1HJvvGWYaUv9tlat9S7omQQVng8fGB4FuUhTEM1qx1z8/edit#heading=h.m96bq8cv9p9v) **Checked items completed in design document** - [x] PDOM section of Design Doc contains 1 clear example of each dynamic description - [x] Dynamic screen summary (i.e., brief state-of-the-sim) - Interesting, this sim only has one classic dynamic description, the dynamic part of the screen summary. Though much more complicated, this sim is similar in dynamic-state-description structure to John Travoltage and Friction. - [x] Added a dynamic description of the hands (see issue #322) which provides distance and position, the sliders and both hands provide proximity to ratio. - [x] Dynamic parameters (scales and approximate ranges) for dynamic objects ready - [x] Special case parameters or phrases identified (dynamic screen summary, dynamic states) - [x] #318, design description for dynamic screen summary for My Challenge values when My Challenge is open. ## [Responsive Descriptions for UI Components](https://docs.google.com/document/d/1HJvvGWYaUv9tlat9S7omQQVng8fGB4FuUhTEM1qx1z8/edit#heading=h.98o3mi6fdpfw) **Checked items drafted & ready for implementation** - Lots of iteration occurred between interviews, e.g. #196, #203 - [x] Tick Mark Options - context responses for new selections (object responses are built-in) - [x] Challenge Ratio combobox - context responses for a new challenge (object responses are built-in) - [x] My Challenge accordion box - context response for communicating current values for the challenge (when accordion is opened) - context for successful hiding of the values - [x] Left and Right number spinners - object responses for changing single value & combined challenge values - context response for communicating hands proximity to the actual challenge ## [Responsive Descriptions for Hand Interactions](https://docs.google.com/document/d/1HJvvGWYaUv9tlat9S7omQQVng8fGB4FuUhTEM1qx1z8/edit#heading=h.ym5u0y2c0uow) **Checked items drafted & ready for implementation** ### Parameters, Scales & Ranges - Tables (or lists) outlining dynamic parameters (scales & ranges) for each sim concept created - [x] [Proximity to Ratio](https://docs.google.com/document/d/1HJvvGWYaUv9tlat9S7omQQVng8fGB4FuUhTEM1qx1z8/edit#heading=h.v24owms95lch) - [x] [Distance between the hands](https://docs.google.com/document/d/1HJvvGWYaUv9tlat9S7omQQVng8fGB4FuUhTEM1qx1z8/edit#heading=h.d35ie15dw694) - [x] [Hand Position for sliders - qualitative](https://docs.google.com/document/d/1HJvvGWYaUv9tlat9S7omQQVng8fGB4FuUhTEM1qx1z8/edit#heading=h.5flakihbyw43) - [x] [Hand Position for Both Hands - qualitative](https://docs.google.com/document/d/1HJvvGWYaUv9tlat9S7omQQVng8fGB4FuUhTEM1qx1z8/edit#heading=h.c9wem8ke1pju) - [x] [Hand Position Quantitative](https://docs.google.com/document/d/1HJvvGWYaUv9tlat9S7omQQVng8fGB4FuUhTEM1qx1z8/edit#heading=h.13rijcgoq7os) - [x] [Between tick marks](https://docs.google.com/document/d/1HJvvGWYaUv9tlat9S7omQQVng8fGB4FuUhTEM1qx1z8/edit#heading=h.ot2xn171wor4) when tick marks are present - several iterations - [x] verification around 0 mark may need some tweaking ### Complex Context Responses - By Interaction - [x] Context responses for Single Hand Interactions - implemented & iterated - See tables in the section [New Walk Throughs with New Parameters](https://docs.google.com/document/d/1HJvvGWYaUv9tlat9S7omQQVng8fGB4FuUhTEM1qx1z8/edit#heading=h.ajbrfbcqskxd) for final iterations of object and context responses for all hand interactions. - [x] [Table: Both Hands CWT](https://docs.google.com/document/d/1HJvvGWYaUv9tlat9S7omQQVng8fGB4FuUhTEM1qx1z8/edit#heading=h.j01dg7fai4u8) - [x] [Table: Sliders CWT](https://docs.google.com/document/d/1HJvvGWYaUv9tlat9S7omQQVng8fGB4FuUhTEM1qx1z8/edit#heading=h.h9fasrtn6h6) - moving individual hands - [x] [Table: Design flip with distance progress](https://docs.google.com/document/d/1HJvvGWYaUv9tlat9S7omQQVng8fGB4FuUhTEM1qx1z8/edit#heading=h.hq2zvuiwvq6f) (No Tick Marks, Tick Marks, Numbered Tick Marks)

Interactive Descriptions - Implementation

Interactive Descriptions - verification check list

## State Descriptions ### 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 - [x] Initial sim-specific interaction hint provided in own paragraph - [x] Keyboard Shortcuts interaction hint (PART OF COMMON CODE) ### Static State Descriptions (Play Area) - [x] Sim-specific H3's for sim objects (or none for this sim) - [x] Interactions are accessible (i.e., have accessible names, keyboard accessible) - [x] Help text for interactive objects ### Static Descriptions (Control Area) - [x] Sim-specific H3s for Control Area (or none for this sim) - [x] Interactions are accessible (i.e., names, keyboard accessible) - On mobile VoiceOver, Both Hands interaction is not possible. Platform-dependent help text in place to re-direct learner's attention back to individual hands or to the Lock Ratio check box (on Create Screen). - [x] Help text for checkboxes (Lock Ratio checkbox) - [x] May need iteration, see https://github.com/phetsims/ratio-and-proportion/issues/312 - [x] Reset All button ### Sim Resources - [x] Keyboard Shortcuts dialog completed - [x] Keyboard Shortcuts dialog accessible - one outstanding issue see [#254](https://github.com/phetsims/ratio-and-proportion/issues/254) - [x] Keyboard Shortcuts button added - [x] Mute Sound button (added when sound is added to main sim repo) - [x] Sim Screen buttons - focus issue when loading screen from Sim Resources - see #282 ### Dynamic State Descriptions **Dynamic Screen Summary** - [x] Phrases work with all parameters - [x] Capitalization verified (just need to double check "Challenge Ratio" and "Both Hands" in state descriptions) - [x] Punctuation verified (haven't noticed any issues recently (dec 15)) - [x] #318, description of My Challenge values in dynamic screen summary when My Challenge is open. **Play Area Object Descriptions** - [x] Dynamic description of hands added to Play Area, see issue #322 ## Responsive Descriptions ### Object Responses **Left/Right Hand sliders (aria-valuetext)** - [x] Object values and ranges for proximity to ratio verified for all slider interactions - [x] Increases/decreases verified - [x] Steps verified, n/a for proximity to ratio - [x] Interaction shortcuts verified - [x] Shift Key - [x] Home/End keys - [x] Pg Up/Down **Both Hands (aria live region)** - [x] Object values and ranges for proximity to ratio verified for Both Hands interaction - [x] Increases/decreases verified - [x] Steps verified, n/a for proximity to ratio - [x] Interaction shortcuts verified - [x] Shift Key - [x] 0-9 keys **Lock Ratio on (aria live region)** - [x] All interactions use Both hand responses when Lock Ratio is checked **Challenge Ratio Option - Combobox (screen 1)** - [x] Values and ranges verified - [x] Increases/decreases verified - [x] Steps verified - n/a as there are only 3 options - [x] Interaction shortcuts verified (e.g., Home/End keys work out of the box) - [x] Mobile A11y - I can change options using double taps and swipes on mobile VoiceOver **My Challenge Number Spinners (screen 2)** - [x] button opens options - correct responses - [x] arrow keys move through options - correct responses - [x] enter on option, selects option and closes list - responses - [x] Interaction shortcuts verified (e.g., Home/End keys toggle between first and last option) **Tick Mark Options Radio Group** - [x] Correct group semantics - [x] Correct radio button names - [x] Correct responses on selecting a radio button - [x] No help text **Ranges Combobox** - [x] button opens options - correct responses - [x] arrow keys move through options - correct responses - [x] enter on option, selects option and closes list - responses - [x] Interaction shortcuts verified (e.g., Home/End keys toggle between first and last option) **Lock Ratio checkbox** - [x] Space key checks the checkbox - [x] Checkbox correctly disabled when hands not at challenge ratio - Context responses for Lock Ratio (are somewhat complicated) - [x] Simple case responses (locking and unlocking ratio when hands are at challenge) working fine - [x] Edge case response - when hands get knocked out of ratio, see issue #227 - [x] Re-opened #227 - Added edge 3 - [x] "Go beyond edge" responses when lock ratio is checked, and a learner tries to explore beyond the min/max allowed value - see issue #247 ### Context Responses for Hand Interactions - Noting here that all interactions work, but there are rounding and min value issues #279, #275, #323 that we are still working through - We will consider updated ranges for describing between tick marks after all other issues, or for next publication, see #298. **Individual Hands (Left and Right Hand sliders)** - [x] Qualitative distance & distance progress strings working in context responses - Hand position (3 views) strings working in context responses: - [x] Qualitative hand position (No Tick Marks) - [x] Quantitative hand position (Tick Marks) - [x] Quantitative hand position (Numbered Tick Marks) **Both Hands** - [x] Qualitative distance & distance progress strings working in context responses - Hand position (3 views) strings working in context responses: - [x] Qualitative hand position (No Tick Marks) - [x] Quantitative hand position (Tick Marks) - [x] Quantitative hand position (Numbered Tick Marks) **Mobile A11y** - [ ] All interactions verified using iOS VoiceOver, see scenery issue - [x] Mobile A11y - "Go beyond edge" responses working for both the bottom and top of the screen, see issue #332 - [ ] Mobile A11y - I can change options using double taps and swipes on mobile VoiceOver

Other A11y ToDo's

Maintain Accessible Sims page

[x] Use website admin page (or create issue) to add sim to to A11y Sims page once there is a working prototype
[x] Update link to prototype from time to time
- [x] At Dev Testing - need sim description see #260
- [x] At RC Testing
- [x] At publication - for needed accessories see #259

Issues created for Accessory Materials

[x] Create issue to update Teacher tips, see #295
[x] Create issue to create Sound feature video, see #294
[x] Create issue to create general sim video, see #293

Check Credits Create issues for ensuring credits are added

[x] Issue https://github.com/phetsims/ratio-and-proportion/issues/268 will verify A11y team credits
[x] Issue https://github.com/phetsims/ratio-and-proportion/issues/285 will QA team credits

Once Evaluation begins

[x] Ensure interviews are recorded to this sim's interview spreadsheet

During QA or just after publication

[x] Clean and polish up Interactive Description design doc
[x] List out successes & challenges from this sim (e.g., found focus issues for iOS)
- See pre-post mortem notes https://docs.google.com/document/d/12cRFYVDCMXIkW07N9QhQpr15k_coBglcJ5uEBB7yjc4/edit

zepumph commented 4 years ago

@Matthew-Moore240 as you are working on descriptions, I wanted to remind/let you know that the most recent dynamic-phrase-building tool is available at https://phetsims.github.io/a11y-research/js/phrase-builder/.

brettfiedler commented 2 years ago

Just checking - is this complete and should be closed?

zepumph commented 2 years ago

Seems like it!

terracoda commented 2 years ago

There are 2 mobile a11y items are not checked off, but I think that’s just a glitch. The sim got through QA.

phetsims / ratio-and-proportion

Interactive Description Implementation #11