Accessibility - Ethereum for LITERALLY everyone!

Transcript

um i'm sacha tanase i have 10 years of design experience i have been the head of design of is that's the ethereum data analytics platform and now i am leading design research at keep network and at keep network we have the user love as our core values so this is why today my talk is about accessibility and inclusive design so today i'm going to tell you a bit about design inclusive design and accessibility i will give you a brief idea about some

types of impairments some issues that ethereum might have in terms of accessibility and how we can address them and of course a cheat sheet so you can check it for your product if you want to make it accessible so we cannot talk about accessibility without talking about inclusive design so what's inclusive design actually this is a design approach that ensures that places like this building or venues and experiences online and offline are accessible to all people and it's

agnostic to age disability and background so it basically benefits everyone accessibility should actually be a byproduct of inclusive design so there is no exact definition for it but we should regard it as a set of rules for digital or analog products which should comply sorry for that yeah so if you want to your product to comply and be inclusive to all of your users you have to follow this set of rules so um this is just like a accessibility mantra no one should be

left out integration and equal experience should be for everyone so today i'm going to talk only about three types of impairment visual impairments motor and dexterity and color deficit vision so what are visual impairments well visual impairments can take the form of astigmatism cataract farsightedness nearsightedness partial blindness and total blindness and if you will live long enough you will definitely experience at least one type of visual impairment i do have astigmatism so

i'm also impaired globally in 2020 there were at least 2.2 billion people who are visually impaired 235 million have mild to severe visual impairments and 39 million people are believed to be totally blind and unfortunately by 2050 this number will grow to 150 million due to computer literacy so what's color vision deficiency you might actually know it by color blindness and people who are color blind do

have clear vision but unfortunately they cannot distinct make a distinction between shades of orange yellow and browns and sometimes they might take black for reds and reds for blacks and this is a genetic disorder and it's incurable so there are 300 million people suffering for from color blindness just to make it less abstract this is the entire population of the united states of america and the incidence is in men is one out of eight and the incidence in women is one out of 200. so let's see the world through through the color

blind people's lens this is trichromacy this is normal vision um but this is this is how someone with blue cone monochromatic sees the world and this is um monochromacy this is a very rare uh way of seeing the world but we have to think of that as well uh this is green blind this is red blind this is blue blind so apparently the keep dashboard actually scores very well on the accessibility score for for uh color blindness so now i would like

to tell you a bit about motor dexterity and impairment because if you are working in tech and ethereum you might have at least once experienced it i'm talking about carpal tunnel syndrome i had it both in both of my hands and it's motor desterity translates to the inability of operating a conventional input such as a keyboard or a mouse and it's usually tied to the loss of the functionality of one limb it can be permanent or temporary and you would ask me okay whatever but we're at an ethereum

conference why are we talking about accessibility well that's because we actually need to make ethereum more inclusive and be more open to all of the array of users so this is not necessarily statistically relevant but it's a light snapshot of uh our crypt the crypto users and ethereum users so i have ran this poll on twitter and 50 of the respondents have answered that they are colorblind and 20 are blind so we actually need to address their issues so basically this is this is an iconic image of ethereum an iconic database of

ethereum and it's very beautiful a very beautiful candlestick chart with green and red but look what happens if you have blue cone monochromacy you basically cannot understand anything from it you can't really see the the other line so it's not really working and doesn't give you anything so what can we do for these users well first of all we could um check all the time if our color schemes are colorblind compliant i am using a third-party plugin called color blindy it was built by the colorblind association and actually we can try to avoid this

color schemes green and red is the mostly brutal on the color blind eyes and uh well of course about this slide my colleague doug who is the head of product and also colorblind said well this slide hurts my brain so let's avoid that um and what what can we do for um visually impaired users where first of all we can make sure that we make our content scalable for mobile devices uh and also if your dap is native make sure you have font size that just features for our blind users

we should necessarily and totally allow and provide alt text because the only way they are interacting with our dapps and our products is through a screen reader and the screen reader provides the only information you have in your alt text so if you do not provide anything they will not find any information about it so they're basically helpless so what can we do for blind users and charts and data visualization this seems to be the final frontier and uh there are two solutions you can provide all of the information in the chart

under the form of a table but this has some shortcomings and is not a dynamic experience so there is another solution created by high charts which which is called sonification and it's basically bringing life to the chart with the use of sound so what what does this is that it uses a musical scale and every value from the chart will get a musical note so if the value of the chart is lower you you will get a low pitched note if the value of the chart is higher

you will get a high pitched note and if there is a juxtaposition in in the chart the screen reader will make a polyphonic sound that was a video that it doesn't work so what can we do for people who are motor and have motor and dexterity impairments well um we need to make sure that all of the content is accessible and accessible on keyboard only by keyboard only which means they can use the shift tab keys and also for input space

enter so they basically can can work out their way only by by the keyboard but also we need to um use our hover effects and keyboard focus indicators for the users this work in a way like a visual breadcrumb so we've learned about types of impairments we've learned about accessibility issues that the ethereum might have and how we can address them and now i would like to show you a very short checklist that you may run through your product and to make your product more accessible so check the contrast between the

foreground and the background check the font height 16 pixels it's the minimum height 20 points ensure images and icons have alternative text for the screen readers allow content scaling for mobile browsers and text to zoom only ensure buttons and links have descriptive text and this is also you need to ensure that by looking at your code you need to ensure that there as well make sure forms control have descriptive labels verify that all the content is accessible only by using the keyboard

and provide keyboard focus indicators provide closed captions and transcripts for media for the people who have auditory impairments and there are some tools and standards that you might want to check there is color blindly which is a third-party plugin for your browser and that's checking your content for color deficit vision you can use wave which is actually running a quick quick accessibility test and it's based on wc ag standard you can make use of high charge to provide solidification

to your charts and you can use screen readers like jaws nvda and voiceover to check if all of your content has alternative text and these are two standards you might want to check the web content accessibility guidelines and section 508 these are under form of rules and laws in the united states and from now on your products need to be accessible through anyone and i know that accessibility is a lot to digest i know that it may be daunting

for your team but if you break down everything in small tasks and you try to address them each sprint you will actually make your product more accessible and help a lot of users and accessibility doesn't only concern designers it actually concerns developers product managers ceos because all of the users have to have the right to address and use their products so yeah that's it thank you 1.2

do you have any questions hi sasha thank you very much for uh the amazing and important uh presentation um so my question is in today's world of this uh beautiful ecosystem um as we know 95 maybe 99 of the effort and resources goes into the engineering and then maybe five percent goes to like the higher level ui design so how how how would you recommend uh that a person who wants to

push this philosophy in their you know organization goes to their like stakeholders for example the ceo that you mentioned and and and uh you know helps adapt you know these important uh aspects so i think um they need to to bring an example with which the ceo might empathize so basically running a set of images through just like i did for for showing showcasing how uh colorblind people are saying also uh exact numbers and stats could also be useful so if you go there and you you're telling him that

or her 300 million people are suffering from that maybe it's important and also with some surveys numbers are very very effective in in this case so um i think that that would be a way uh to to do that and probably a very healthy ux culture will also include accessibility so basically if you're embracing ux people who are designers and ux designers will try to evangelize and teach the team about this thank you you've been you've been uh talking about this

for for some time now do you see improvement in this area yeah cool thank you thank you so thank you very much i think it's everything for the questions you