29. 앱의 접근성 개선

앱의 접근성 개선

접근성 테스트

접근성 테스트  |  Android Developers

위의 페이지를 참고하여 앱의 접근성을 개선해보자

 

개요

앱에 시각, 청각적으로 문제없이 접근할 수 있는 사람도 있지만 그렇지 않은 사람들도 있다

이들이 앱에 더 잘 접근할 수 있게 접근성을 개선해보자

 

우선 PlayStore에서 Android Accessibility Suite라는 어플을 다운 받아야 하는데

가상기기를 어떻게 만들었냐에 따라 에뮬레이터에서 PlayStore를 못 찾을 수도 있다

 

이렇게 PlayStore 기호가 있는 profile을 가지고 만든 가상기기에서만 PlayStore에 접근할 수 있다

 

없으면 그냥 하나 더 만들어주자 나도 없어서 만들었음

 

만들어진 가상기기를 통해 에뮬레이터를 실행시킨 뒤 PlayStore에 들어가 로그인을 해주자

 

로그인이 끝났다면 Android Accessibility Suite를 검색해서 설치해주자

 

참고로 앱 설치시 pending이라는 글자만 뜨고 멈춰있으면

와이파이를 끄고 다시 설치 시도를 해보자

 

 

TalkBack - 시각 대신 청각

TalkBack은 시각적인 정보를 청각적인 정보로 바꿔준다

 

에뮬레이터에서 설정 -> Accessibility에 들어가면

TalkBack이라는 옵션이 있다 

우선 에뮬레이터의 볼륨을 최대로 올려놓고

Use TalkBack 항목을 체크해주면 바로 TalkBack이 활성화 된다

 

가장 기본적인 조작법은

그냥 터치->UI 선택, 해당 UI에 대한 설명을 읽어줌

더블 터치->실행

좌우 스와이프->이전, 다음 UI 선택

 

그럼 이제 Android Accessibility Suite에게 통화권한을 줄거냐는 알림창에서

allow 버튼을 터치해 음성을 들어보고 더블 터치해서 allow 버튼을 실행해주자

 

터치, 더블터치, 좌우 스와이프를 통해 에뮬레이터를 탐색해보자

 

참고로 바탕화면에서 모든 앱을 보려면 평소에는 위로 스와이프하면 됐지만

TalkBack을 쓰면 3개의 손가락으로 터치를 해야한다

그런데 우리는 에뮬레이터로 돌리고 있어서 불가능한 조작이다

이럴 때 바탕화면에 있는 구글 어시스턴트의 키보드 입력모드를 이용하면 원하는 앱에 접근할 수 있다

 

TalkBack을 사용종료하려면 아까 켰던 것처럼 끄면 된다

 

Switch Access - 조작의 간편화

설정->Accessibility 화면에서 밑으로 내려보면 Switch Access라는 기능이 있다

Switch Access는 수동조작이 불편한 사람들을 위한 기능으로, 버튼 두 개 만으로 휴대폰 조작이 가능하게 만들어준다

 

기본적으로 켜려고 하면

USB나 블루투스 기반의 버튼 두개로 된 장치를 연결하라고 하는데

우리는 그런 장치가 없고 에뮬레이터에 연결도 힘들기 때문에 볼륨키로 조작이 가능하게 설정을 해줘야 한다

 

아래에 있는 Settings->Assign switches for scanning에 들어간다

Next에 들어간 뒤 volume down 버튼을 누른다

Select에 들어간 뒤 volumne up 버튼을 누른다

이제 volume down 버튼으로 메뉴를 탐색한 다음 select 버튼을 통해 실행을 해줄 수 있게 된다.

 

참고로 volume up, down 키는 저기 위에 있다

 

Switch Access 기능을 이용할 때에는 기존에 조작하던 터치 방식도 가능하기 때문에

개발하는 입장에서 편하게 진행할 수 있다

 

UI 접근성 개선을 위한 추가적인 정보

contentDescription

위에서 살펴본 TalkBack 기능을 위해서는

우리가 그동안 Image 컴포저블을 이용할 때 항상 null을 넘겨주었던

contentDescription 속성의 값을 잘 설정해줘야 한다

 

최소터치영역

Material Design에 있는 컴포저블들(ex IconButton)은

최소 터치영역으로 48dp x 48dp를 가진다

 

색상대비

UI를 구성할 때 서로 구분이 되지 않는 색을 이용하면 접근성이 떨어진다

다음 웹페이지를 이용하여 얼마나 색상의 대비가 뚜렷한지를 수치로 확인할 수 있다

https://webaim.org/resources/contrastchecker/

WebAIM: Contrast Checker