phetsims / a11y-research

a repository to track PhETs research into accessibility, or "a11y" for short
MIT License
3 stars 0 forks source link

A11y Sims Page - Mobile A11y icon? #142

Closed terracoda closed 4 years ago

terracoda commented 5 years ago

We just published Ohm's Law with mobile A11y. Do we need an icon for that?

Tagging @emily-phet, @amanda-phet, @arouinfar, @oliver-phet.

arouinfar commented 5 years ago

@terracoda @emily-phet I suspect that mobile a11y features are different enough that it would merit its own icon. I'll add an item to the website meeting agenda.

At minimum we should update the Ohm's Law listing on https://phet.colorado.edu/en/accessibility/prototypes

@terracoda and/or @emily-phet can you also confirm if that list is otherwise up-to-date?

amanda-phet commented 5 years ago

What are mobile a11y features?

On Wed, Jun 26, 2019, 5:21 PM Amy Rouinfar notifications@github.com wrote:

@terracoda https://github.com/terracoda @emily-phet https://github.com/emily-phet I suspect that mobile a11y features are different enough that it would merit its own icon. I'll add an item to the website meeting agenda.

At minimum we should update the Ohm's Law listing on https://phet.colorado.edu/en/accessibility/prototypes

@terracoda https://github.com/terracoda and/or @emily-phet https://github.com/emily-phet can you also confirm if that list is otherwise up-to-date?

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/phetsims/a11y-research/issues/142?email_source=notifications&email_token=AB35G5GH5J4A7WEVPCNKZATP4PMWFA5CNFSM4H3O532KYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGODYU3L4Q#issuecomment-506050034, or mute the thread https://github.com/notifications/unsubscribe-auth/AB35G5HOG2Q4AZLG4IWYEZTP4PMWFANCNFSM4H3O532A .

arouinfar commented 5 years ago

What are mobile a11y features?

I think that means pinch-to-zoom and compatible with mobile VoiceOver, but it would be good to confirm. @terracoda?

emily-phet commented 5 years ago

Thanks for asking! What we're referring to as "mobile a11y" in this case is: descriptions accessible from mobile devices. On non-mobile devices there is usually a physical keyboard or some other non-touch based option for navigating the screen reader. On mobile devices, screen readers use a different paradigm for input (so to speak). It takes additional development effort and approaches to ensure that the description is accessible via traditional (non-touch) input methods and also by mobile touch methods. @terracoda and @jessegreenberg to speak to this more eloquently, but that's the big picture idea.

Visual display features, such as pinch-to-zoom, are not included in what we're referring to here as 'mobile a11y', though that will progress further in the coming months.

terracoda commented 5 years ago

@emily-phet, you explain it correctly, in our original accessibility investigations, we explored keyboard accessibility only. The accessible interactions like the accessible content are off the actual screen, so our solution was not then also accessible on touch devices with a screen reader activated.

"Mobile A11y" specifically means non-visual access on a mobile/touch device. Sims without "Mobile A11y" are already accessible on a mobile/touch device.

I consider "mobile a11y" in a similar category to alternative input, though in our case we have 2 distinct categories.

I'm wondering if we can just add a mobile phone icon to the keyboard icon when mobile a11y is present.

[keyboard icon]+[mobile phone icon]

Just an idea.

amanda-phet commented 5 years ago

I agree, a phone icons makes sense, and we will have that legend at the top of the sims page to explain what it means.

On Thu, Jun 27, 2019, 7:01 AM Taliesin L. Smith notifications@github.com wrote:

@emily-phet https://github.com/emily-phet, you explain it correctly, in our original accessibility investigations, we explored keyboard accessibility only. The accessible interactions like the accessible content is off the actual screen, so our solution was not then also accessible on touch devices with a screen reader activated.

"Mobile A11y" specifically means non-visual access on a mobile/touch device. Sims without "Mobile A11y" are already accessible on a mobile/touch device.

I consider "mobile a11y" in a similar category to alternative input, though in our case we have 2 distinct categories.

I'm wondering if we can just add a mobile phone icon to the keyboard icon when mobile a11y is present.

[keyboard icon]+[mobile phone icon]

Just an idea.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/phetsims/a11y-research/issues/142?email_source=notifications&email_token=AB35G5CDHFOK73UPYJ4HC2TP4SMZNA5CNFSM4H3O532KYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGODYWYO7I#issuecomment-506300285, or mute the thread https://github.com/notifications/unsubscribe-auth/AB35G5BRPGEA33LKO23J6R3P4SMZNANCNFSM4H3O532A .

oliver-phet commented 5 years ago

Here's a first pass at an icon for this: mobile_accessibility-icons Thoughts @emily-phet @terracoda ?

emily-phet commented 5 years ago

Nice! Maybe flip phone to be horizontal (tablet style), with the icon for dynamic descriptions in the middle? Then scaled down so the entire thing is the same size as the icons already on the accessibility page.

terracoda commented 5 years ago

Nice Oliver! And I like @emily-phet 's suggestions, too....sideways and dynamic descriptions icon.

oliver-phet commented 5 years ago

So, the images on the website are currently 100px wide by 116px tall, so a portrait orientation fit a little better. Here's a landscape view with a scaled-down dynamic description icon: accessibility-icons

Here's an example with a few icons in context. I think we initially went with the green icon color to differentiate it from the others: accessibility-page-test

amanda-phet commented 5 years ago

We also didn't fill the bubble since we thought it could include either simple or dynamic descriptions.

terracoda commented 5 years ago

@amanda-phet, I like that idea. Fill the mobile a11y icon with the 1 of three icons:

Nice idea!

terracoda commented 4 years ago

@amanda-phet, considering more recent comments in #898, we might not need the plain-lines icon for simple description.

terracoda commented 4 years ago

@amanda-phet,we might not need to do what was suggested https://github.com/phetsims/a11y-research/issues/142#issuecomment-510914109

amanda-phet commented 4 years ago

Since the icon has been designed and deployed, can this issue be closed?

terracoda commented 4 years ago

@amanda-phet shared new icon designs in https://github.com/phetsims/website/issues/951#issuecomment-569821242

We'll continue discussing design as needed in the website repo.

Closing this issue.

terracoda commented 4 years ago

I'll add that doing https://github.com/phetsims/a11y-research/issues/142#issuecomment-510914109 might be a little too granular for the website needs.

At some point all sims will have Zoom enabled fro touch devices, so we may not need to have an icon explicitly for that. And we no longer call out "Simple Description".