Why does your application need accessibility
Convenient navigation, an intuitive interface, placing an order in a couple of clicks - every day we simplify the life of customers of our applications, taking into account their wishes and pains. Due to the lack of necessary analytics in this process, we are missing out on the requests of a large category of potential users with health restrictions who are unable to use mobile services simply because you are not destined or focus on accessibility issues. How to make your application comfortable for people with visual impairments, says Dodo Pizza employees in decoding the new release of AppsCast .
Alexei Kudryavtsev: Today we are talking about the availability of mobile applications with two guests from Dodo Pizza at once - Mikhail Rubanov ( akaDuality ) and Armen Khatayan. Guys, tell us more about yourself.
Mikhail Rubanov: I am the iOS programmer of our main pizza ordering application. My goal is to develop the front-end part of the service, achieving technical excellence, which is impossible without VoiceOver support and the implementation of application availability.
Armen Khatayan: For me, the topic of Accessibility is especially close, since I lost my sight while studying at a technical university.
An interesting story came out with Dodo Pizza. The guys released the CMAN game, available in a telegram, according to the results of which I managed to come to the company office to talk with the developers, and after I was invited for an interview. Now I deal with accessibility issues, testing universal access, drawing up test plans, collecting shortcomings, as well as technical support for users.
Alexei Kudryavtsev: Let's first determine what accessibility is.
Mikhail Rubanov: There are different types of accessibility. We need to play many games with two hands, and if you hurt your hand, the game ceases to be available. An extreme case is a loss of hearing, vision, and mobility. For such situations, adaptation of the application is possible.
Alexei Kudryavtsev: How much does this differ from usability?
Alexey Kudryavtsev: For people with what limitations do you need to adapt applications?
Armen Khatayan: Constraints are divided into functional and mental. Functional impairment of vision, hearing, mobility. The mental ones imply a violation of the psyche, the ability to adequately perceive the world. The solutions for these two categories of restrictions are completely different.
Mikhail Rubanov: I will give a couple of examples. VoiceOver can be suitable for both the blind and people with impaired motor skills, as, for example, Stalingulag or Stephen Hawking. In this case, VoiceOver helps you focus on specific elements, activate them and interact with the entire application using a special device.
Another example. One of our pizzerias in Chelyabinsk employs people with hearing impairments. In our workflow, the voice assistant voices the receipt of a new pizza on the tracker, but this sound signal is not available for such employees and, in order not to miss the order, they have to spend more time on the tablet. For them, an excellent solution to the problem is a light bulb that turns on when the order appears.
About cognitive issues. During the release of iOS 7, the background on the desktop began to move according to the accelerometer and many wrote that they were motion sick. Then there was a motion setting, which allows you to reduce the movement of the screen, including the number of animations. This is useful, for example, for epilepsy sufferers.
Alexei Kudryavtsev: What problems do people experience with applications?
Armen Khatayan: There are a lot of problems. Often in the application buttons are not signed and you have to poke at random, check what it is. The situation is simplified if the button has a background image, then VoiceOver inherits its name and, knowing English, you can guess the purpose of the element.
The button may not be available at all. If a developer catches a click on some View, for example, a picture, and processes the click, then with my VoiceOver I can’t click on it.
Mikhail Rubanov: When trying to make a messenger and position the beginning of the dialogue at the bottom of the screen, collections and tables are often turned upside down, and then cells are turned back. It would seem that everything works, but with such an operation in VoiceOver the scroll gesture is turned upside down.
It happens that, to display a new screen, instead of implementing transition using controllers, they add a View, but they do not hang firstResponder on it. As a result, View is completely inaccessible and, since it is impossible to focus on it, the entire script closes.
Alexei Kudryavtsev: Is the situation with the availability of applications in the market improving? Is there more of them?
Armen Khatayan: I think so.
Alexei Kudryavtsev: How is this issue regulated in other countries and in Russia?
Armen Khatayan: In the same America there is Web Content Accessibility Guidelines , which helps to develop products accessible. In Russia, this is still advisory in nature, but it is felt that both society and the state are trying to make the lives of people with disabilities more accessible. For example, recently there was news that we had a paddock for people in wheelchairs equipped with a lift.
Alexei Kudryavtsev: How did work on accessibility begin in Dodo Pizza?
Mikhail Rubanov: A year ago, Sberbank adapted its application and began to promote this idea to the masses. They were visited by Anatoly Popko, a blind man who popularizes the idea that there is no better time to be blind than now, because a smartphone has become a better source of help. I watched the video with his participation and realized that although I can make good interfaces, my decisions do not work for a certain number of people.
Daniil Popov: A cool analogy with crash rate. When we have half a percent of users suffering from crashes, we take care of this, and when half a percent cannot use the application at all, we don’t even know about it.
Mikhail Rubanov: There is a problem of general analytics, since there are no pure statistics on how many blind people are in general in Russia and the CIS. You can independently calculate the number of users who have VoiceOver enabled on devices. There is an isVoiceOverRunning method in the UIAccessibility class, which can be set to run the application.
Alexei Kudryavtsev: How much did you adapt the application before you managed to sell the idea to the management?
Mikhail Rubanov: It helped that the topic of accessibility coincides with the values of the company: “Pizza is a holiday”, “Pizza for everyone”. The idea impressed the developers, the product and did not take much time and money.
The implementation plan can be quite simple: get the main scenario and see what the reaction will be. The blind have a strong community, there are groups where they discuss applications and interaction with them. We did not announce our adaptation through release notes, people in social networks themselves began to write about the application, information was distributed via word of mouth. This is the money.
Armen Khatayan: Initially, accessibility is perceived as charity. It is necessary to allocate time and resources and it is not clear what benefit this will bring. Then comes the understanding that money from blind users is exactly the same as from sighted ones.
Daniil Popov: Let's deal with the technical component. What is VoiceOver and how does it work?
Armen Khatayan: VoiceOver provides visual information in audio format. He voices the meta-information that is on the interface elements and, possibly, even graphically inaccessible.
There are several ways to enable VoiceOver. The easiest way is to ask Siri about it with the phrase “Siri, turn on VoiceOver.” You can activate it through the setting in the Accessibility item and by triple pressing the Home button or the lock button (on older devices where the Home button is not) VoiceOver will turn on or off. After switching on, the way to control the device changes: with a single touch of the screen, what is located on this part of the screen is voiced; by double-clicking an element is activated (clicking on a button or other target action); To scroll, you need to use three fingers.
Daniil Popov: Do you use accessibility in the Android version of the application? And how much features match between platforms?
Armen Khatayan: Android has its own accessibility services. TalkBack is responsible for vision. The functionality is identical to VoiceOver, although it happens that in Android some feature works better than in iOS. So far, there is not enough time for our Android application, but soon we will begin to adapt.
Daniil Popov: Often there is a situation in an application that some interface elements are blocked because values are not entered in the input fields. How does VoiceOver let the visually impaired user know that the button is locked and another action needs to be taken to unlock it?
Mikhail Rubanov: There is an Accessibility Traits Collection in iOS - several settings that allow you to change the way you interact with an element. You can sign each element with its name, value and put down one of the properties. There is a value of selected to handle lists, or disabled to indicate an inaccessible item. There is an interesting adjustable trait that applies to various sliders, steppers, when you can swipe up / down to change the value of an element and it will talk again.
There is an option to directly enable interaction, for example, a panel on which you can draw in order to leave a signature on a check in a restaurant. There are several settings for multimedia: after pressing the button, the sound or movie starts playing immediately, and VoiceOver should turn off until it starts interacting with the screen again.
Alexei Kudryavtsev: You said that working with accessibility changes consciousness and is not as simple as you might seem at first glance. What should the developer face when immersing himself in the process?
Mikhail Rubanov: If we talk about the difficulties of working with VoiceOver, then we found that some elements need to be spoken out. For example, the appearance of a pop-up message in the application (not a standard push, but a panel message about placing an order) needs to be discussed through post accessibility notification. We are faced with the fact that when you click a button, VoiceOver interrupts our text and pronounces the name of the button. We solved the problem: wrapping everything in dispatch after, moved it for 100 milliseconds and independently killed VoiceOver.
The main difficulty is that in trying to find a solution you are trying to find it on the Internet, but the methods that others offer almost always do not work.
We cleaned the application itself from crutches. When working with accessibility, it is important to show controllers correctly. As I mentioned earlier, in some projects, when creating a new screen, they simply added a new View to the hierarchy, not making sure that firstResponder worked correctly. As a result, VoiceOver did not see her. We redid it to a normal controller and everything was repaired right away.
Our design system has controls for changing the size, quantity, and before they were divided into several buttons. For example, the quantity stepper was issued with the buttons “minus”, “plus”, the quantity and the total price for the goods. We combined everything into one control. Now you can increase the quantity with a vertical swipe, and immediately a new price will be revealed. This control is used in several places of the application, so one solution was able to improve several screens at once.
Daniil Popov: On Instagram, most of the application is tied to images. How does VoiceOver work with this content?
Mikhail Rubanov: Instagram suggests uploading a photo to make a signature for the blind. In addition, the service has already evolved from just showing photos in the story, accompanied by pictures. Plus now you can use video with sound there. The iPhone is also trying to recognize photos and faces, reports what is in the picture, how clear it is.
Technology is evolving. On Netflix, for example, you can watch movies with special subtitles that additionally tell what is happening on the screen.
Daniil Popov: How to maintain a balance? For ordinary users, I want to show a maximum of beautiful animations with smooth transitions, 3D effects, but I also want people with visual impairments to be able to fully use the application.
Mikhail Rubanov: If we talk about resource optimization, many methods in iOS pass the animated parameter . You can rely on it or set it yourself, for example, turn off animation through isVoiceOverRunning. At the same time, you can gash feature, test, come up with a workaround. VoiceOver has many different technologies that allow you to adapt content. There is even the ability to control the intonation of the voice acting voice. You just need to learn the framework.
Daniil Popov: I don’t really like the option of poking at each button on the screen. Facebook has dozens of these buttons, and the process turns into a mockery. Are there more convenient mechanisms?
Armen Khatayan: The interface for the blind user is radically different from the graphical one. VoiceOver has the ability to learn the interface in two ways: sequentially and at random. If studied sequentially, the cursor moves through each element as they are specified in the hierarchy. Swipe right moves to the next element, swipe left - to the previous one. With swipe to the right, you can completely tread the entire interface and understand where something is not available.
Alternatively, you can simply drive around the screen and see where what is located. In my experience, most blind people use sequential navigation, as it’s more convenient.
On Facebook, for example, there is a news feed with publications, each of which has buttons like, share, photos, links. Facebook made each post a separate item. Everything related to the actions with this publication is made in the custom action. Swipe to the right deletes a cell or message, vertical swipes can select this action. In publications, vertical swipes help you navigate through all actions: put a reaction, share, see detailed information.
Mikhail Rubanov: On the technical side, VoiceOver does not go across business features, but even helps to understand how to make them. For example, many are moving to a design system where all controls are minimized and only they are used. Working on basic controls allows you to ensure the availability of most screens. Sawing crutches in case of transitions and showing controllers correctly provides VoiceOver support and makes the application cleaner.
Testing the application is easy. Choose a successful script and try to walk on it. You will see a huge number of problems. By adapting one complete successful scenario, you will solve most of the problems. Scenarios of errors and non-standard behavior will remain, and the consultation of a person who specializes in this is already needed.
Armen helped us in this and, although we were sure that our application was well adapted, he convinced us.
Armen Khatayan: Yes, a person who is faced with restrictions in his daily life will tell much more about this.
Mikhail Rubanov: A technical writer, if there is one, can easily handle this issue at the company.
By the way, Apple at WWDC showed a chip in MacOS, when you can work with the operating system using voice: ask her to show all the signatures on the screen, number and say which one needs to be adapted. If your application already works with VoiceOver, then the innovation will start automatically after recompilation. Unfortunately, so far it only works in America and with English.
Alexei Kudryavtsev: What tools besides VoiceOver help people with other health restrictions use applications?
Mikhail Rubanov: There is DymanicType that allows you to set the font size. This develops the competence of the iOS developer in writing controls, because when they told the control that it could increase 3-4 times, you need to come up with other solutions and instead of horizontally scroll the cells, make a drop-down list and adapt it.
There are such options as reduse transparency or reduce motion - adaptations for people with visual impairments or those who are cradled, but we have not reached them yet. In the direction of other technologies, we also have not dug yet.
Alexei Kudryavtsev: How good is Apple's Accessibility API? Are there any flaws in it?
Mikhail Rubanov: She is pretty cool and made me pump in writing controls and transitions. There is a rather complicated debug, because if your buttons are unavailable or their order has become different, then you can fix it only by guessing how it works. It helped me that I imagined how I myself wrote such a technology if I had a hierarchy of views with views and the ability to extract a label from them.
Alexei Kudryavtsev: Developers often have difficulty building the right hierarchy. How do you deal with this?
Mikhail Rubanov: Many elements can be generalized. If you don’t adapt the application at all, then you will start switching between the author of the application, the text, then on each button, and Facebook has reduced it to two options for swiping.
To make such an action, you need to specify the name and selector that you call, put actions in an array and pass VoiceOver.
In the case of Dodo Pizza, in the menu cells there is a picture of pizza, name, ingredients, price and the buy button - this can be summarized so that the entire cell is selected to voice all the information at a time. In the label, the name and price are announced, in accessibility value - composition. No need to delve inside the controls. Summarize until it becomes obvious to you that you need to split.
The problems are all typical and poorly covered. To work with the hierarchy, you can set accessibility elements and manage. It is important to understand that containers for different elements themselves are not controls. A cell is a container that, with isAccessibilityElement == false, will switch over all the controls inside the cell itself. And with isAccessibilityElement == true, VoiceOver will ask all the necessary parameters for the cell itself. The developer’s skill and ability to develop from simple to complex elements are important here.
Alexei Kudryavtsev: How to set up practices in the company so that it does not fall apart, works well and is convenient?
Mikhail Rubanov: You need a person in the team who understands the importance of the issue and can go through the main application scenarios, adapt, immerse yourself in the framework. If the whole team starts to do this, then it will encounter difficulties and spend extra time discussing. It was easier for me alone.
When the part of the application is ready, it’s worthwhile to talk about accessibility issues for designers, programmers, product and see their reaction.
After a certain adaptation process, it became easy for me to give accessibility tasks to other developers. There was no resistance inside the platform. Difficulties happen with other platforms: Android or the site, because they are limited in resources by the number of developers, but it is enough to infect one, show the problem and how to solve it.
When Armen first launched our site, he asked why there was nothing on it at all. He saw a blank screen and at the bottom of the signature “button”, “button”, “button”. It turned out that at that time the site had a banner leaflet with stocks, which occupied two-thirds of the page, and the pizza itself was lower. The “button” signatures belonged to the transition points to individual banner blocks.
Daniil Popov: I took the time to adapt flow to accessibility. How can I make sure in the future that no one broke this flow? Is it possible to write tests or record the result?
Armen Khatayan: We need to attract people who are professionally engaged in this and conduct regression, or to turn on VoiceOver ourselves and push through the changes.
Daniil Popov: Are there any frameworks for testing VoiceOver in the application?
Mikhail Rubanov: I have not seen a separate framework, but standard UI tests work here, only they have a different purpose. If you completely break VoiceOver, then the controls will not be available in UI tests. All properties that you set as accessibility value, accessibility label are available from unit tests. It can be automated. We had a case where accessibility broke the UI test and had to add #if UITEST or real production.
Alexei Kudryavtsev: Is it worth trying to optimize accessibility without an assistant with restrictions?
Armen Khatayan: Visually, this may look convenient, but in everyday life it will turn out to be completely different from what is needed. For example, in the Russian localization of VoiceOver, the word folder is read out, and then its name. When I swipe the column of folders, I hear “folder, folder, folder ...” instead of its name. Such small details can be recognized only when you really use the application.
Mikhail Rubanov: You can start on your own. The problem is easily recognized, just turn on VoiceOver, figure out its navigation and try to use the application. It will "scream" in those places where it is necessary to correct. You will immediately want to do this, since you will see your brainchild from the ugly side.
Daniil Popov: Where can I see examples of applications with good accessibility?
Mikhail Rubanov: First, open the documentation for the UIAccessibility.h file and get familiar with the tools. There are several of these files; they differ in complexity. It’s worth reading the Apple’s document on accessibility adaptation: all the main problems are analyzed there by name, convenience of controls, grouping and generalization. The document is not exhaustive, but suitable for starting.
Alexei Kudryavtsev: What WWDC sessions should you look at on the topic of accessibility?
Mikhail Rubanov: Everything that contains the word accessibility. They are short, and in the basic lecture fully reveal the capabilities of the framework.
Alexei Kudryavtsev: What about books, articles?
Armen Khatayan: I can advise Applevis : a lot of blind people gather there and talk about their problems, there are articles with code examples .
When you implement any functionality, the question arises, who will use it and where to find such users. For this, groups on social networks are suitable, for example, “ Accessible Environment ” - you can talk about your application and ask for help with testing.
Here are the tips from me. First of all, sign the controls and verify this. Then group so that there are not many. Correct those situations when the application does not work at all. If you feel that you have enough knowledge, then make the service convenient.
Alexei Kudryavtsev: Today we are talking about the availability of mobile applications with two guests from Dodo Pizza at once - Mikhail Rubanov ( akaDuality ) and Armen Khatayan. Guys, tell us more about yourself.
Mikhail Rubanov: I am the iOS programmer of our main pizza ordering application. My goal is to develop the front-end part of the service, achieving technical excellence, which is impossible without VoiceOver support and the implementation of application availability.
Armen Khatayan: For me, the topic of Accessibility is especially close, since I lost my sight while studying at a technical university.
At some point, I realized that if people are not trying to improve the situation with the availability of applications, then you need to popularize this issue yourself and help in solving it.I began to get acquainted with various applications, test them and send the found defects to the company.
An interesting story came out with Dodo Pizza. The guys released the CMAN game, available in a telegram, according to the results of which I managed to come to the company office to talk with the developers, and after I was invited for an interview. Now I deal with accessibility issues, testing universal access, drawing up test plans, collecting shortcomings, as well as technical support for users.
Accessibility Introduction
Alexei Kudryavtsev: Let's first determine what accessibility is.
Mikhail Rubanov: There are different types of accessibility. We need to play many games with two hands, and if you hurt your hand, the game ceases to be available. An extreme case is a loss of hearing, vision, and mobility. For such situations, adaptation of the application is possible.
Alexei Kudryavtsev: How much does this differ from usability?
Armen Khatayan: Usability is usability of the interface. Accessibility - the ability to use the interface if there are restrictions. Inside accessibility may be usability.Mikhail Rubanov: There are several stages of application adaptation. The first stage assumes that the application is broken everywhere and you can only go in and start the script again. After a little adaptation, you can go through the application to the target action, while the execution of the action is possible, but the process itself is inconvenient. The last stage is the adaptation of the most targeted action, taking into account comfort and speed of use.
Alexey Kudryavtsev: For people with what limitations do you need to adapt applications?
Armen Khatayan: Constraints are divided into functional and mental. Functional impairment of vision, hearing, mobility. The mental ones imply a violation of the psyche, the ability to adequately perceive the world. The solutions for these two categories of restrictions are completely different.
Mikhail Rubanov: I will give a couple of examples. VoiceOver can be suitable for both the blind and people with impaired motor skills, as, for example, Stalingulag or Stephen Hawking. In this case, VoiceOver helps you focus on specific elements, activate them and interact with the entire application using a special device.
Another example. One of our pizzerias in Chelyabinsk employs people with hearing impairments. In our workflow, the voice assistant voices the receipt of a new pizza on the tracker, but this sound signal is not available for such employees and, in order not to miss the order, they have to spend more time on the tablet. For them, an excellent solution to the problem is a light bulb that turns on when the order appears.
About cognitive issues. During the release of iOS 7, the background on the desktop began to move according to the accelerometer and many wrote that they were motion sick. Then there was a motion setting, which allows you to reduce the movement of the screen, including the number of animations. This is useful, for example, for epilepsy sufferers.
Application Availability Issues
Alexei Kudryavtsev: What problems do people experience with applications?
Armen Khatayan: There are a lot of problems. Often in the application buttons are not signed and you have to poke at random, check what it is. The situation is simplified if the button has a background image, then VoiceOver inherits its name and, knowing English, you can guess the purpose of the element.
The button may not be available at all. If a developer catches a click on some View, for example, a picture, and processes the click, then with my VoiceOver I can’t click on it.
Mikhail Rubanov: When trying to make a messenger and position the beginning of the dialogue at the bottom of the screen, collections and tables are often turned upside down, and then cells are turned back. It would seem that everything works, but with such an operation in VoiceOver the scroll gesture is turned upside down.
It happens that, to display a new screen, instead of implementing transition using controllers, they add a View, but they do not hang firstResponder on it. As a result, View is completely inaccessible and, since it is impossible to focus on it, the entire script closes.
Alexei Kudryavtsev: Is the situation with the availability of applications in the market improving? Is there more of them?
Armen Khatayan: I think so.
In order to make available applications more, you need either users who ask about it, or developers whose culture already has an understanding that part of the development time should be spent on accessibility.In the USA, for example, there is The Americans with Disabilities Act (ADA) , according to which all companies, especially giant corporations like Google and Facebook, are obliged to create products taking into account the availability for all categories. Failure to comply with this law allows Americans to sue companies.
Alexei Kudryavtsev: How is this issue regulated in other countries and in Russia?
Armen Khatayan: In the same America there is Web Content Accessibility Guidelines , which helps to develop products accessible. In Russia, this is still advisory in nature, but it is felt that both society and the state are trying to make the lives of people with disabilities more accessible. For example, recently there was news that we had a paddock for people in wheelchairs equipped with a lift.
Prerequisites for Adapting Applications
Alexei Kudryavtsev: How did work on accessibility begin in Dodo Pizza?
Mikhail Rubanov: A year ago, Sberbank adapted its application and began to promote this idea to the masses. They were visited by Anatoly Popko, a blind man who popularizes the idea that there is no better time to be blind than now, because a smartphone has become a better source of help. I watched the video with his participation and realized that although I can make good interfaces, my decisions do not work for a certain number of people.
When we see a crash rate of 98%, we are very worried about people who can’t place an order. At the same time, there are people who cannot use our application at all, but no one gives analytics about it.Self-esteem was wounded, and I went to understand the framework. It turned out that there are few materials on the topic and they are written superficially. I buried myself, on Fridays in the evening for a couple of hours I walked around the application, tried to fix something. Started with simple things - made captions to buttons with pictures, finished with screens that were not available. After a month of immersion, I prepared a presentation about accessibility, which our products saw, realized the problem and gave a green light to the free development of technology, adaptation of the framework. Three months ago Armen appeared in our team and this greatly helped to improve the application.
Daniil Popov: A cool analogy with crash rate. When we have half a percent of users suffering from crashes, we take care of this, and when half a percent cannot use the application at all, we don’t even know about it.
The conclusion is logical: think about all categories of people who could potentially use your application.Alexei Kudryavtsev: Do you have analytics on the number of such users?
Mikhail Rubanov: There is a problem of general analytics, since there are no pure statistics on how many blind people are in general in Russia and the CIS. You can independently calculate the number of users who have VoiceOver enabled on devices. There is an isVoiceOverRunning method in the UIAccessibility class, which can be set to run the application.
Alexei Kudryavtsev: How much did you adapt the application before you managed to sell the idea to the management?
Mikhail Rubanov: It helped that the topic of accessibility coincides with the values of the company: “Pizza is a holiday”, “Pizza for everyone”. The idea impressed the developers, the product and did not take much time and money.
The implementation plan can be quite simple: get the main scenario and see what the reaction will be. The blind have a strong community, there are groups where they discuss applications and interaction with them. We did not announce our adaptation through release notes, people in social networks themselves began to write about the application, information was distributed via word of mouth. This is the money.
Armen Khatayan: Initially, accessibility is perceived as charity. It is necessary to allocate time and resources and it is not clear what benefit this will bring. Then comes the understanding that money from blind users is exactly the same as from sighted ones.
It doesn't matter who buys pizza, it is important to give the opportunity to do so.
Interaction with VoiceOver
Daniil Popov: Let's deal with the technical component. What is VoiceOver and how does it work?
Armen Khatayan: VoiceOver provides visual information in audio format. He voices the meta-information that is on the interface elements and, possibly, even graphically inaccessible.
There are several ways to enable VoiceOver. The easiest way is to ask Siri about it with the phrase “Siri, turn on VoiceOver.” You can activate it through the setting in the Accessibility item and by triple pressing the Home button or the lock button (on older devices where the Home button is not) VoiceOver will turn on or off. After switching on, the way to control the device changes: with a single touch of the screen, what is located on this part of the screen is voiced; by double-clicking an element is activated (clicking on a button or other target action); To scroll, you need to use three fingers.
Daniil Popov: Do you use accessibility in the Android version of the application? And how much features match between platforms?
Armen Khatayan: Android has its own accessibility services. TalkBack is responsible for vision. The functionality is identical to VoiceOver, although it happens that in Android some feature works better than in iOS. So far, there is not enough time for our Android application, but soon we will begin to adapt.
Daniil Popov: Often there is a situation in an application that some interface elements are blocked because values are not entered in the input fields. How does VoiceOver let the visually impaired user know that the button is locked and another action needs to be taken to unlock it?
Mikhail Rubanov: There is an Accessibility Traits Collection in iOS - several settings that allow you to change the way you interact with an element. You can sign each element with its name, value and put down one of the properties. There is a value of selected to handle lists, or disabled to indicate an inaccessible item. There is an interesting adjustable trait that applies to various sliders, steppers, when you can swipe up / down to change the value of an element and it will talk again.
There is an option to directly enable interaction, for example, a panel on which you can draw in order to leave a signature on a check in a restaurant. There are several settings for multimedia: after pressing the button, the sound or movie starts playing immediately, and VoiceOver should turn off until it starts interacting with the screen again.
No need to fence crutches: set the setting and the system itself will say everything with the right intonation.
Features of working with VoiceOver
Alexei Kudryavtsev: You said that working with accessibility changes consciousness and is not as simple as you might seem at first glance. What should the developer face when immersing himself in the process?
Mikhail Rubanov: If we talk about the difficulties of working with VoiceOver, then we found that some elements need to be spoken out. For example, the appearance of a pop-up message in the application (not a standard push, but a panel message about placing an order) needs to be discussed through post accessibility notification. We are faced with the fact that when you click a button, VoiceOver interrupts our text and pronounces the name of the button. We solved the problem: wrapping everything in dispatch after, moved it for 100 milliseconds and independently killed VoiceOver.
The main difficulty is that in trying to find a solution you are trying to find it on the Internet, but the methods that others offer almost always do not work.
We cleaned the application itself from crutches. When working with accessibility, it is important to show controllers correctly. As I mentioned earlier, in some projects, when creating a new screen, they simply added a new View to the hierarchy, not making sure that firstResponder worked correctly. As a result, VoiceOver did not see her. We redid it to a normal controller and everything was repaired right away.
Our design system has controls for changing the size, quantity, and before they were divided into several buttons. For example, the quantity stepper was issued with the buttons “minus”, “plus”, the quantity and the total price for the goods. We combined everything into one control. Now you can increase the quantity with a vertical swipe, and immediately a new price will be revealed. This control is used in several places of the application, so one solution was able to improve several screens at once.
Daniil Popov: On Instagram, most of the application is tied to images. How does VoiceOver work with this content?
Mikhail Rubanov: Instagram suggests uploading a photo to make a signature for the blind. In addition, the service has already evolved from just showing photos in the story, accompanied by pictures. Plus now you can use video with sound there. The iPhone is also trying to recognize photos and faces, reports what is in the picture, how clear it is.
Technology is evolving. On Netflix, for example, you can watch movies with special subtitles that additionally tell what is happening on the screen.
Daniil Popov: How to maintain a balance? For ordinary users, I want to show a maximum of beautiful animations with smooth transitions, 3D effects, but I also want people with visual impairments to be able to fully use the application.
Mikhail Rubanov: If we talk about resource optimization, many methods in iOS pass the animated parameter . You can rely on it or set it yourself, for example, turn off animation through isVoiceOverRunning. At the same time, you can gash feature, test, come up with a workaround. VoiceOver has many different technologies that allow you to adapt content. There is even the ability to control the intonation of the voice acting voice. You just need to learn the framework.
Daniil Popov: I don’t really like the option of poking at each button on the screen. Facebook has dozens of these buttons, and the process turns into a mockery. Are there more convenient mechanisms?
Armen Khatayan: The interface for the blind user is radically different from the graphical one. VoiceOver has the ability to learn the interface in two ways: sequentially and at random. If studied sequentially, the cursor moves through each element as they are specified in the hierarchy. Swipe right moves to the next element, swipe left - to the previous one. With swipe to the right, you can completely tread the entire interface and understand where something is not available.
Alternatively, you can simply drive around the screen and see where what is located. In my experience, most blind people use sequential navigation, as it’s more convenient.
On Facebook, for example, there is a news feed with publications, each of which has buttons like, share, photos, links. Facebook made each post a separate item. Everything related to the actions with this publication is made in the custom action. Swipe to the right deletes a cell or message, vertical swipes can select this action. In publications, vertical swipes help you navigate through all actions: put a reaction, share, see detailed information.
Mikhail Rubanov: On the technical side, VoiceOver does not go across business features, but even helps to understand how to make them. For example, many are moving to a design system where all controls are minimized and only they are used. Working on basic controls allows you to ensure the availability of most screens. Sawing crutches in case of transitions and showing controllers correctly provides VoiceOver support and makes the application cleaner.
Testing the application is easy. Choose a successful script and try to walk on it. You will see a huge number of problems. By adapting one complete successful scenario, you will solve most of the problems. Scenarios of errors and non-standard behavior will remain, and the consultation of a person who specializes in this is already needed.
Armen helped us in this and, although we were sure that our application was well adapted, he convinced us.
Armen Khatayan: Yes, a person who is faced with restrictions in his daily life will tell much more about this.
VoiceOver has functionality that can help you get closer to blind people. You need to tap on the screen three times and it will turn off. In such a simple way, you can more easily understand the blind.When adapting, it is important to adhere to certain rules in the appointment of signatures. If this is a button, you do not need to repeat that it is a button. There should only be an action that the button performs. For example, “create a note” instead of “create a new note”. Before you add a label, consider whether it really reflects its essence.
Mikhail Rubanov: A technical writer, if there is one, can easily handle this issue at the company.
By the way, Apple at WWDC showed a chip in MacOS, when you can work with the operating system using voice: ask her to show all the signatures on the screen, number and say which one needs to be adapted. If your application already works with VoiceOver, then the innovation will start automatically after recompilation. Unfortunately, so far it only works in America and with English.
Alexei Kudryavtsev: What tools besides VoiceOver help people with other health restrictions use applications?
Mikhail Rubanov: There is DymanicType that allows you to set the font size. This develops the competence of the iOS developer in writing controls, because when they told the control that it could increase 3-4 times, you need to come up with other solutions and instead of horizontally scroll the cells, make a drop-down list and adapt it.
There are such options as reduse transparency or reduce motion - adaptations for people with visual impairments or those who are cradled, but we have not reached them yet. In the direction of other technologies, we also have not dug yet.
Alexei Kudryavtsev: How good is Apple's Accessibility API? Are there any flaws in it?
Mikhail Rubanov: She is pretty cool and made me pump in writing controls and transitions. There is a rather complicated debug, because if your buttons are unavailable or their order has become different, then you can fix it only by guessing how it works. It helped me that I imagined how I myself wrote such a technology if I had a hierarchy of views with views and the ability to extract a label from them.
Alexei Kudryavtsev: Developers often have difficulty building the right hierarchy. How do you deal with this?
Mikhail Rubanov: Many elements can be generalized. If you don’t adapt the application at all, then you will start switching between the author of the application, the text, then on each button, and Facebook has reduced it to two options for swiping.
To make such an action, you need to specify the name and selector that you call, put actions in an array and pass VoiceOver.
In the case of Dodo Pizza, in the menu cells there is a picture of pizza, name, ingredients, price and the buy button - this can be summarized so that the entire cell is selected to voice all the information at a time. In the label, the name and price are announced, in accessibility value - composition. No need to delve inside the controls. Summarize until it becomes obvious to you that you need to split.
The problems are all typical and poorly covered. To work with the hierarchy, you can set accessibility elements and manage. It is important to understand that containers for different elements themselves are not controls. A cell is a container that, with isAccessibilityElement == false, will switch over all the controls inside the cell itself. And with isAccessibilityElement == true, VoiceOver will ask all the necessary parameters for the cell itself. The developer’s skill and ability to develop from simple to complex elements are important here.
How to start applying Accessibility?
Alexei Kudryavtsev: How to set up practices in the company so that it does not fall apart, works well and is convenient?
Mikhail Rubanov: You need a person in the team who understands the importance of the issue and can go through the main application scenarios, adapt, immerse yourself in the framework. If the whole team starts to do this, then it will encounter difficulties and spend extra time discussing. It was easier for me alone.
When the part of the application is ready, it’s worthwhile to talk about accessibility issues for designers, programmers, product and see their reaction.
After a certain adaptation process, it became easy for me to give accessibility tasks to other developers. There was no resistance inside the platform. Difficulties happen with other platforms: Android or the site, because they are limited in resources by the number of developers, but it is enough to infect one, show the problem and how to solve it.
When Armen first launched our site, he asked why there was nothing on it at all. He saw a blank screen and at the bottom of the signature “button”, “button”, “button”. It turned out that at that time the site had a banner leaflet with stocks, which occupied two-thirds of the page, and the pizza itself was lower. The “button” signatures belonged to the transition points to individual banner blocks.
Daniil Popov: I took the time to adapt flow to accessibility. How can I make sure in the future that no one broke this flow? Is it possible to write tests or record the result?
Armen Khatayan: We need to attract people who are professionally engaged in this and conduct regression, or to turn on VoiceOver ourselves and push through the changes.
Daniil Popov: Are there any frameworks for testing VoiceOver in the application?
Mikhail Rubanov: I have not seen a separate framework, but standard UI tests work here, only they have a different purpose. If you completely break VoiceOver, then the controls will not be available in UI tests. All properties that you set as accessibility value, accessibility label are available from unit tests. It can be automated. We had a case where accessibility broke the UI test and had to add #if UITEST or real production.
Alexei Kudryavtsev: Is it worth trying to optimize accessibility without an assistant with restrictions?
Armen Khatayan: Visually, this may look convenient, but in everyday life it will turn out to be completely different from what is needed. For example, in the Russian localization of VoiceOver, the word folder is read out, and then its name. When I swipe the column of folders, I hear “folder, folder, folder ...” instead of its name. Such small details can be recognized only when you really use the application.
Mikhail Rubanov: You can start on your own. The problem is easily recognized, just turn on VoiceOver, figure out its navigation and try to use the application. It will "scream" in those places where it is necessary to correct. You will immediately want to do this, since you will see your brainchild from the ugly side.
Best practices
Daniil Popov: Where can I see examples of applications with good accessibility?
Mikhail Rubanov: First, open the documentation for the UIAccessibility.h file and get familiar with the tools. There are several of these files; they differ in complexity. It’s worth reading the Apple’s document on accessibility adaptation: all the main problems are analyzed there by name, convenience of controls, grouping and generalization. The document is not exhaustive, but suitable for starting.
Alexei Kudryavtsev: What WWDC sessions should you look at on the topic of accessibility?
Mikhail Rubanov: Everything that contains the word accessibility. They are short, and in the basic lecture fully reveal the capabilities of the framework.
Alexei Kudryavtsev: What about books, articles?
Armen Khatayan: I can advise Applevis : a lot of blind people gather there and talk about their problems, there are articles with code examples .
When you implement any functionality, the question arises, who will use it and where to find such users. For this, groups on social networks are suitable, for example, “ Accessible Environment ” - you can talk about your application and ask for help with testing.
I'll give you some more tips. If you really want to tackle accessibility, start small: look at the Accessibility Inspector in Xcode, it will show which elements are not signed and what is not available.Mikhail Rubanov: Accessibility is an interesting framework due to the unusual set of problems that it solves. Its implementation will help to better understand how iOS works and what underlies the interface. This is a separate development branch of the developer, requiring time to master.
Secondly, try to take a few minutes of accessibility when implementing new functionality.
Third, tell your colleagues about accessibility until you get into the habit of paying a little attention to this issue in every sprint.
Here are the tips from me. First of all, sign the controls and verify this. Then group so that there are not many. Correct those situations when the application does not work at all. If you feel that you have enough knowledge, then make the service convenient.
If after reading this article, you have discovered a new world, then be sure to go on October 21-22 to St. Petersburg on AppsConf. IOS developer Anton Silyuk promises to pick up the topic of accessibility and talk about the practice of using accessibility in working on the Juno application.
AppsCast releases every two weeks on Wednesdays, and if you prefer the audio version to the text version, subscribe to us in SoundCloud , like and discuss topics in our chat .
All Articles