Comments (7)
Original user testing feedback
- A C d: βUsually they [people with autism] request larger font sizes, because then there is less text on the site that they are reading and they can cope with it better.
- A C d: positive towards alternative template and fonts as accessibility settings for people with visual impairments
from autspaces.
For community review
https://k6ej5a.axshare.com/#g=1&p=1-landing-page-presentation-tech-expanded-access-o&view=b&c=1
from autspaces.
Design Justification for accessibility menu panel
The menu covers a number of accessibility issues ie:
341 Colour Scheme Function, 343 Contrast Function, 344 Font Size Increase Feature etc
A accessibility interactive accessibility panel has been added to the right of the aims section on the landing page as blue arms outstretched icon with title currently shorted to Access - this should be present on all pages so that the accessibility panel features can be accessed at all time as required.
The accessibility menu will animate from the right to left as a scrollable overlay. The applied accessibility features can be activated and show to the left of the panel as the feature would be applied across the site.
The structure of the accessibility panel - Titled Accessibility Menu
The top of this will incorporate the language selector drop down component already designed and coded by dev on the left as place holder.
The help icon will activate the instructional overlay as previously wireframes.
The Accessibility menu consists of the current features within the 3 adjustment categories.The 3 Adjustments Categories are to be presented in accordions similar to the landing page and will cover the following adjustments.
- Navigation Adjustments
- Colour Adjustment
- Content Adjustment
Each of the features within these categories can be activated as demoed overlay and multiple functionality applied. This activation overlay provides a brief description of the features functions and show that is active.
Contents 1 - 3
- Navigation Adjustments
- Screen Reader
- Voice to Text
- Voice Commands (for consideration)
When navigation adjustments are selected the given adjustments functional UI is shown below as Screen Reader Link and ref to Nav Adjustments UI's Shown at the bottom of the panel menu for the other 2.
- Colour Adjustment
-
Custom Colour (change the site's colours) Background
-
Custom Colour Headings
-
Custom Colour Content
-
Background Preset Colours (Pastels, pink and community pastel colours)
-
Bright / High Contrast (changes sites brightness and contrast)
-
Dark / High Contrast (changes sites background to black with bright fonts as selected)
-
Contrast Mode (changes sites colours to contrasting colours as selection)
- Content Adjustment
-
Font Sizing (Increase & Decrease Font Size)
-
Line Spacing
-
Word Spacing
-
High Contrast / Low Luminance Text (add overlay button and active description)
Options X 4
High Contrast 1 (white background, black text)
High Contrast 2 (black background, yellow text)
Low Luminance 1 (black background, brown text)
Low Luminance 2 (light brown background, dark brown text) -
Magnifier (Increase & Decrease View Size) (add overlay button and active
description)
from autspaces.
Screen Grabs of Accessibility Panel for Dev
https://k6ej5a.axshare.com/#g=1&p=4-access-panel&view=b
Ref to Font Size +/-
from autspaces.
Definitely an important option for lots of users and I'm glad you've done this work on accesibility. Thanks @jiraslama and everyone else who pointed this out in feedback. Think this is ready to be added to the development board for the prototype.
from autspaces.
Please create links between the dev board and this one so they are connected. π β :)
from autspaces.
Made issue #369 to create an accessibility checklist that can be used for the MVP and going forward. Closing this along with other accessibility checklist items for now.
from autspaces.
Related Issues (20)
- Plan March Meet-Up session HOT 1
- [BUG]: labels of stories HOT 2
- [BUG]: Moderator can edit self/behalf of others field HOT 2
- [BUG]: submit buttons for moderate/share story invisible in dark mode
- Submit to 2024 EU Prize for CS HOT 2
- Send March Newsletter HOT 2
- Co-creating data sharing options
- Lower "visual noise" HOT 10
- [FEATURE]: Add 'Help' button on navigation bar HOT 1
- Run a mini workshop for the SSI CW 2024 HOT 1
- Send out April Newsletter HOT 3
- [BUG]: inconsistent user autistic identification between list and full page story
- Hello (Autistic) World - I'm Katmuss! HOT 5
- Non code - Update subscription mechanism
- Send May Newsletter HOT 4
- Plan June Meet-Up Session HOT 3
- Update Participant Information sheet
- Respond to Queries about Platform HOT 5
- Create a glossary for the AutSPACEs platform
- Update AutSPACEs page on Turing website
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. πππ
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google β€οΈ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from autspaces.