Mobile Voice Web Browser for the Low Vision

저시력자를 위한 모바일 보이스 웹 브라우저 개발

Abstract

The web has become indispensable in all of our daily lives. We communicate, study and get information with others through the web. This behavior also continues in the smart phone environment. The biggest problem is that the small display screen of a smart phone degrades the accuracy in selecting or manipulating content for people with low vision. To compensate for this, voice guidance services that combine touch and voice, such as VoiceOver and Talkback, are currently provided to smart phone devices. However, restrictions arise in GUI, TTS control problems, and content expansion and selection. In addition, unnecessary content is also output by voice, which causes fatigue for low vision people to use. In this study, we propose a mobile web browser interface that selects and enlarges a desired area from web browsers and contents, or outputs it as a voice so that people with low vision can easily use the mobile web browser. In this paper, we propose a context selective focusing function that enables selection for each element of web content. In addition, we intend to develop a mobile voice web browser that can enlarge the selected content or output it by voice.

1. 서론

웹은 우리의 모든 일상생활에서 빠질 수 없는 존재가 되었다. 우리는 웹을 통하여 내가 아닌 다른 사람들과 소통하며, 공부하고, 정보를 얻는다[1,2]. 국내 등록장애인은 약 252,957명이며 이 중 약 62%에 해당하는 157,506명이 저시력인이다[3]. 저시력은 콘텐트 렌즈 또는 안경, 수술적 처지, 약물 치료 등에도 불구하고 일상생활에 불편함과 어려움을 겪을 정도로 잔존 시력이 나오지 않는 상태를 의미한다[4]. 저시력인은 웹 스크린 리더의 한 종류인 보이스몬과 같은 특수 목적의 보조기기의 도움을 받아 컴퓨터 화면을 확대해 웹을 탐색할 수 있다[5,6]. 하지만 스크린 리더 서비스는 대부분 PC 환경에서 제공되고 있어, 스마트폰 환경에서는 사용에 불편함이 발생한다. 스마트폰의 작은 디스플레이 화면은 저시력인이 콘텐츠를 선택하거나 조작하는데 정확도를 저하한다는 점이 가장 큰 문제이다. 이를 보완하기 위해 현재 스마트폰 기기에는 VoiceOver[7], Talkback[8]과 같은 터치와 음성이 결합한 음성 안내 서비스를 제공하고 있지만, GUI, TTS 제어 문제를 비롯해서 콘텐츠의 확대 및 선택 등에서 한계가 있으며, 불필요한 콘텐츠까지 음성으로 출력해주기에 저시력인이 사용하기에 피로감이 유발된다.

본 연구에서는 저시력인이 쉽게 모바일 웹 브라우저를 사용할 수 있도록 웹 브라우저 및 콘텐츠에서 원하는 영역만을 선택하여 확대하거나 음성으로 출력하는 모바일 웹 브라우저 인터페이스를 제안한다. 본 논문에서는 저시력인이 작은 브라우저의 메뉴와 콘텐츠를 빠르게 접근하여 조작할 수 있는 선택적 포커싱 방법을 제시한다. 선택적 포커싱 기능은 모바일 보이스 웹 브라우저에서 확대 및 음성 출력이라는 특성 기술을 적용하여 사용자가 선택한 콘텐츠의 영역만을 확대 및 음성 출력해주는 기능이다. 또한, 제안하는 인터페이스는 선택적 포커싱 기능의 확대 및 음성 출력 기능을 구현하고 선택적 포커싱 기능의 효과에 대한 사용성 평가를 진행한다.

2. 관련 연구

2.1 웹 접근성 & 모바일 웹 접근성

한국 웹 접근성 인증 평가원에 따르면 웹 접근성(web accessibility)은 장애인이나 고령자분들이 웹사이트에서 제공하는 정보를 비장애인과 동등하게 접근하고 이용할 수 있도록 보장하는 것이다[9]. 이는 모든 사람이 장애에 구애 없이 정보를 얻고 공유할 수 있는 것을 말한다. 웹은 현대사회에서 교육, 전자상거래, 정보 교환 등 생활 전반에서 매우 중요한 부분을 차지한다. 따라서 웹 접근성 준수는 모든 사람에게 동등한 기회를 제공할 수 있기에 필요하다. 웹 접근성 준수의 고려 사항에는 시각, 청각, 이동성, 인지 등이 있다. 이 중 시각의 경우는: 실명, 색각 이상, 다양한 형태의 저시력을 포함한 시각장애를 말한다. 이러한 웹 접근성 준수는 국가정보화 기본법 제32조(장애인·고령자 등의 정보 접근 및 이용 보장)과 장애인차별금지법(2008년 4월 11일 시행) 제 21조(정보통신 의사소통에서의 정당한 편의 제공의무)에 명시되어 있는 것처럼 법적 의무사항에 해당한다[9].

한국 웹 접근성 인증 평가원에서는 모바일 접근성(Mobile Accessibility)을「국가정보화기본법」에 따라 모바일 애플리케이션 서비스 제공자가 장애인과 고령자가 비장애인과 동등하게 모바일 애플리케이션 콘텐츠에 접근할 수 있도록 콘텐츠 제작할 때 준수해야 하는 것으로 정의한다[10]. 모바일 웹 접근성이 중요한 이유는 현대사회에서 거의 모든 저시력인들은 스마트폰을 사용하고 있고 그 중 50%는 태블릿 또한 사용할 정도로 모바일 사용량이 매우 높기 때문이다.

2.2 기존 서비스

대부분의 시각장애인을 위한 기기 제어 인터페이스 연구는 스크린 리더 방식으로 진행되고 있다. 보이스몬은 홈페이지의 실시간 텍스트 음성변환, 글자 및 화면확대, 음성 돋보기, 고대비, 색상 반전, 하이라이트, 포커스 기능 등 종합적인 접근성 기능을 제공하는 PC기반의 서비스이다. 보이스몬은 설치가 쉽고 다양한 형태의 웹 콘텐츠의 음성지원이 가능하며 다국어 음성 변환을 지원한다는 장점이 있지만, 모바일 환경에서 적응이 어렵고 메뉴 구조와 위치를 파악하기 어렵다[4].

VoiceOver[7], Talkback[8]은 모바일 기반의 IOS와 안드로이드에서 제공하고 있는 접근성 기능이다. 이 기능들은 스크린 리더 방식과 터치를 결합한 음성 안내 및 제어 방식으로 제공되는 가장 일반적인 방식으로 터치하여 컨트롤을 활성하여 손끝에 닿은 디스플레이의 정보 음성 출력, 더블탭 기능으로 실행한다. 또한, 입력하고자 하는 문자를 찾을 때까지 화면을 터치하거나 스와이프하여 원하는 문자 찾고, 더블탭으로 찾은 문자를 입력한다. 이 기능들은 모든 스마트폰에 내장되어 있지만, 낭독되고 있는 영역과 해당 콘텐츠의 파악이 어렵고, 전체 낭독 사용 시 불필요한 부분까지 낭독하며 싱글 단락 단위의 선택 낭독만 가능하다. 또한, 복잡한 구조를 가진 컨텍스트에서는 단락 선택을 위한 터치 횟수가 많이 증가하고, 일시 정지 등 TTS의 제어가 불가하다는 등의 단점으로 인해 사용성이 저하된다.

3. 시스템 설계

3.1 시스템 목표 및 개요

본 시스템은 작은 화면에서 콘텐츠 선택 및 조작 불편, 불필요한 콘텐츠까지 음성 출력 등 TTS 제어의 불편함을 해결하는 선택적 포커싱 기능이 적용된 모바일 보이스 웹 브라우저 인터페이스를 설계하였다[11]. 선택적 포커싱 기능은 본 연구의 핵심 기능으로 저시력자가 웹 콘텐츠 내에서 필요로 하는 영역만을 골라서 터치한 순서대로 음성 출력해주는 기능이다. 또한, 작은 브라우저 메뉴 조작과 콘텐츠 조작 기능에 빠르게 접근할 수 있도록 개인화 확대 메뉴를 설계하고, 콘텐츠의 요소별 다중 선택이 가능하게 하여 선택된 콘텐츠를 확대 디스플레이 하거나 음성으로 출력 및 제어할 수 있도록 설계하였다.

3.2 시스템 주요 기능 설계

본 인터페이스의 기능은 메뉴 및 기능의 확대 재구성 기능, 컨텐스트의 선택적 포커싱 기능, 사용자 선택적 확대 및 음성 기능을 제공한다. 기능별 자세히 살펴보면 다음과 같다.

첫 번째로 기능의 특징으로 메뉴 기능의 확대 재구성이다. 이 기능은 웹 브라우저 메뉴 및 기능을 확대하여 제공한다. 해당 기능으로는 웹 페이지 탐색에 가장 많이 사용되는 뒤로 가기, 앞으로 가기, 홈으로 가기, 웹 페이지 전환 기능이 포함된다.

두 번째, 확대 및 음성 출력을 위해서 사용자가 원하는 콘텐츠를 자유롭게 선택할 수 있도록 선택적 포커싱 기능을 설계하였으며, 이 기능을 실행하는 환경을 선택 모드라 정의하였다. 이 기능은 저시력인이 웹 페이지에서 원하는 영역만을 선택하여 확대하여 읽거나, 음성으로 듣기 위한 콘텐츠 선택 기능이다. 기존의 돋보기 기능에는 포인터의 이동 영역 반경으로 콘텐츠를 확대하여 보여줬다면, 본 연구에서는 콘텐츠의 내용에 접근하여 문장 또는 단락 단위로 원하는 부분만을 골라서 선택할 수 있도록 선택의 폭을 확장하였다. 선택 모드를 실행 후, 사용자가 원하는 영역을 개별 또는 다중 선택할 수 있으며, 콘텐츠를 선택한 순서로 확대 또는 음성 출력할 수 있도록 하였다. 따라서 사용자는 원하는 영역을 커스텀할 수 있다. 또한, 선택된 영역은 노란색의 배경색을 지정하여 선택 여부를 직관적으로 알 수 있도록 하였다.

마지막으로 선택된 영역은 사용자의 요구에 따라 음성/확대/확대음성 모드로 사용할 수 있다. 확대 기능은 선택된 콘텐츠의 크기를 최대 400%까지 확대하여 디스플레이하며, 콘텐츠 배경색으로 노란색이 디스플레이 되어 저시력인의 콘텐츠 식별력을 향상시켰다. 음성 기능은 선택된 콘텐츠를 음성으로 출력할 수 있도록 설계하였다. 음성 기능에는 TTS 제어기능을 추가하여 재생, 일시 정지, 정지 기능을 기본으로 제공하며, 반복 재생 횟수 및 재생 속도를 설정할 수 있도록 하여 기존의 인터페이스들과 차별화하였다.

3.3 시스템 구성

3.3.1 시스템 구성도

본 서비스는 Fig. 1에 나타난 것처럼 사용자가 안드로이드 기기를 통해 보이스 웹 브라우저에 접속하면 확대된 메뉴와 컨텍스트의 선택적 확대 및 음성 서비스를 사용할 수 있다. 본 프로그램은 안드로이드 환경에서 구현되었다. 브라우저는 웹킷 엔진을 이용하였으며, 개발에 필요한 API는 모두 구글에서 제공하는 API로 구현하였다. 마지막으로 개발 단계와 사용자 테스트 진행 시 사용된 데모 도구는 갤럭시 Tab을 이용하였으며, 시스템을 ‘보이스 브라우저’라고 정의하였다.

Fig. 1. Overall System.

3.3.2 전체 흐름도

보이스웹 브라우저 시스템의 전체 흐름도는 다음 Fig. 2와 같다. 네비게이션 메뉴와 즐겨찾기, 사용자 설정, 컨텍스트의 포커싱 기능으로 각각 분리하여 흐름도를 작성하였다. 기본 웹페이지 화면에서 브라우저 기본 메뉴를 누르면 메뉴 항목이 화면에 나타나고 각 메뉴 아이콘을 터치하면 해당 기능이 실행된다.

Fig. 2, System Flow Chart.

4. 시스템 구현 및 결과

4.1 개발 및 실행 환경

본 서비스는 안드로이드 스튜디오를 개발도구로 하여 Java, Javascript, HTML5, CSS 언어로 작성된다. 또한, 음성 서비스는 TTS(Text to Speech)로 제공한다. 구현된 웹 브라우저에서 DOM에 접근하여 웹 콘텐츠의 구조를 분석하고, 콘텐츠의 개별 요소 및 범위 지정이 가능하도록 하였다. 선택된 콘텐츠는 CSS 처리 과정과 음성 합성 엔진과의 연동으로 확대 및 음성 출력 되도록 구현하였다.

보이스브라우저 어플리케이션을 실행시키면, 기본 페이지로 숙명여자대학교의 홈페이지가 실행된다. 보이스브라우저의 기능을 사용하기 위해서는 개인화 확대 메뉴를 실행한다. 개인화 확대 메뉴는 화면의 오른쪽 하단에 파란색의 원형 모양으로 디스플레이 된다. 개인화 확대 메뉴를 터치하면 모서리가 둥근 사각형의 진회색의 배경색을 가진 네모 박스가 디스플레이 되며, 사각형 박스 안에는 흰색 바탕의 큰 원형의 아이콘 메뉴들이 나타난다. 아이콘 메뉴는 선택 모드 메뉴, 즐겨찾기, 뒤로 가기, 홈으로, 앞으로 가기이다. 선택적 포커싱 기능을 사용하기위해서는 선택 모드 메뉴를 터치한다. 진회색의 사각 박스는 사라지고 처음 개인화 확대 메뉴를 실행 했던 웹 페이지 화면이 나타난다. 화면에서 원하는 영역을 터치하면 터치한 영역에 노란색의 배경색이 표시된다. 원하는 만큼의 터치 후 오른쪽 하단의 개인화 메뉴를 다시 터치하면 진회색의 사각 박스가 실행되고 박스 안에는 확대 모드, 음성 모드를 선택할 수 있도록 메뉴가 보여진다. 원하는 모드를 선택하고 OK 버튼을 터치 선택한 영역을 확대하여 보거나 음성으로 들을 수 있다. 어플리케이션의 종료는 스마트폰의 뒤로가기 버튼을 두 번 터치로 종료한다. Fig. 3은 선택적 포커싱 기능 사용 방법을 보여주는 UI 화면이다.

Fig. 3. UI of Selective Focusing Function. (a) Selection Mode (b) Select Sentences or Paragraphs / Deselect when Retouching (c) Select Magnification or Voice Mode (d) Magnification Mode (e) Voice Mode.

4.2 선택적 포커싱 기능

콘텐츠의 선택적 포커싱 기능은 다음과 같이 구현되었다. WebViewClient에서 페이지 로드 완료 시 앱에서 정의한 자바스크립트 코드를 웹 페이지에 추가 삽입한다. 웹 콘텐츠의 원하는 영역을 선택하기 위한 선택 모드 실행 시, JS의 initChoice 함수를 통해 웹 페이지에 Single Tap, Double Tap 터치 이벤트를 추가한다. 해당 페이지에서 터치 이벤트가 발생한 특정영역 위에 존재하는 컨텍스트를 선택하기 위해 페이지 이동이 발생하는 ‘a’ 태그와 ‘input’ 태그를 비활성화한다. 화면 터치 시 터치 영역의 태그가 유효한지 검사한다. 태그 유효성 검사는 해당 태그가 컨텍스트인지 판단하는 것으로, 컨텍스트라고 판단되는 태그는 ‘p', 'h*', 'ul', 'td' 등이 있다. 유효성 검사에 통과한 태그는 터치 액션이 Single Tap인지 Double Tap인지에 따라 작업이 달라진다.

문장 단위의 선택은 Single Tap으로 수행되면 이 경우, 선택한 태그를 target으로 작업한다. 먼저 해당 태그가 이미 선택한 영역인지 검사한다. 선택하지 않은 태그라면 JS의 객체 배열과 JavascriptInterface에 정의한 객체 클래스에 추가하고 하이라이트 스타일을 적용한다. 선택한 태그라면 JS의 객체배열과 Java의 객체 클래스에서 삭제하고 스타일 속성을 삭제한다.

단락 선택은 Double Tap으로 수행되고, 이 경우 선택한 태그의 부모/조부모를 target으로 작업한다. count 변수를 두어 parentElement를 찾은 횟수를 확인한다. count = 0일 경우 부모 태그를 찾은 적이 없으므로, target을 선택한 태그의 parentElement로 바꾸고 선택 여부 조사를 한다. 선택 여부 조사 후 추가 삭제 작업은 SingleTap과 같다. 부모 태그를 parentTag 변수에 저장하고 count 변수를 +1 한다. count = 1일 경우 부모 태그를 추가한 상태이므로, target을 parentTag의 parentElement로 바꾸고 선택 여부 조사를 한다. 선택하지 않은 태그라면 기존의 추가된 부모 태그를 삭제하고 현재 target인 조부모 태그를 추가한다. parentTag에 조부모 태그를 저장하고 count 변수를 +1 한다. count = 2일 경우 조부모 태그까지 찾은 상태이므로, JS의 객체 배열과 Java의 객체 클래스에서 해당 조부모 태그를 삭제하고 parentTag와 count 변수를 null로 초기화한다.

Fig. 4. Selective Focusing Function Process.

다음 Fig. 5는 선택적 포커싱 기능의 실행 화면이다.

Fig. 5. Screenshot of Selective Focusing Function.

4.3 확대 모드 및 음성 모드 기능

확대 모드 실행 시, 선택 모드에서 추가한 이벤트 리스너를 삭제하고 zoom(확대모드) 또는 zoomtts(확대음성모드)를 매개변수로 JS의 startZoom 함수를 호출한다. JS의 객체 배열의 데이터를 dovument.write 하고, 전달 받은 모드가 zoomtts라면 음성 모드를 실행한다.

음성 모드 실행 시, 선택 모드에서 추가한 이벤트 리스너를 삭제한다. JS의 객체 배열을 매개변수로 JavascriptInterface의 speech 함수를 호출한다. speech 함수에서 띄어쓰기 부분에서 자연스럽게 끊어 읽을 수 있도록 휴지기 처리를 한다. 처리된 문장을 TTS speak()한다. 다음 Fig. 6는 확대 모드 및 음성 모드의 실행 화면이다.

Fig. 6. Screenshot of Magnification and Audion Output Function.

4.4 모드 재선택 및 취소 기능

모드 재선택(back)은 이전에 선택한 컨텍스트가 유지된 상태에서 선택이 수정 가능해야 한다. 이는 음성/확대(확대음성)에 따라 작업이 다르다. 음성 모드에서 back하는 경우, 페이지 이동이 없기 때문에 JS의 객체 배열과 하이라이팅 스타일이 유지된 상태이다. 따라서 initChoice 함수를 실행하고 음성합성객체가 남아있다면 실행을 중지하고 메모리에서 제거한다.

확대 모드에서 back하는 경우, document,write으로 인해 페이지가 달라졌기 때문에 JS의 객체 배열이 사라진 상태이다. reload()를 해 원래 페이지로 돌아가고 리로드 완료 시 JS의 backZoom 함수를 호출한다. 이때, JavascriptInterface에 저장한 객체 클래스를 불러와 JS의 객체 배열에 추가하고, 하이라이트 스타일을 적용한다. 세팅이 완료되면 initChoice 함수를 실행하고 음성합성 객체가 남아있다면 실행을 중지하고 메모리에서 제거한다.

모드 취소(cancel)는 선택한 모든 데이터가 삭제되고 초기화되어야 한다. 우선 음성합성 객체가 남아있다면 실행을 중지하고 메모리에서 제거한다. 선택모드에서 추가한 이벤트 리스너를 삭제하고 a태그와 input 태그를 활성화한다. JS의 객체 배열의 모든 태그의 스타일을 removeProperty하고, parenTag와 count, JS의 객체 배열, Java의 객체 클래스를 모두 삭제한다.

5. 사용성 평가

5.1 평가 목표

본 서비스는 저시력자가 읽기 영역과 읽기 순서를 선택 및 제어하여 확대 및 음성 출력하는 멀티모달 인터페이스를 제공하고자 한다. 따라서 본 평가는 모바일 웹 보이스 브라우저 환경에서 저시력자가 콘텐츠를 읽을 때, 기존의 서비스와 비교하여 선택적 포커싱 기능의 효과를 확인하기 위함이다. 선택적 포커싱 기능의 효과를 확인하기 위한 지표는 다음과 같다.

첫 번째 측정항목은 에러율이다. 원하는 영역을 얼마나 정확하게 선택했는지 측정하는 항목으로, 주어진 태스크를 완료하기까지의 시도 횟수를 측정하였다. 제시된 태스크의 영역을 한 번의 시도로 재생할 경우에는 시도 횟수를 0으로 설정하였으며, 두 번째 시도부터 횟수를 셈 하였다. 이때, 재시도로 인정하는 범위는 잘못된 문장 또는 단락을 선택한 경우와 더불어, 제시 문장 선택 시, 해당 문장이 포함된 문단을 선택할 경우, 해당 문단을 포함하여 다른 문단까지 선택한 경우 등을 재시도 횟수 측정에 포함하였다. 두 번째 측정항목은 성공효율이다. 성공효율은 태스크에서 제시된 영역의 마지막 문장의 음성 출력이 종료되는 시점까지의 소요 시간을 측정하여 원하는 부분을 선택하여 음성 출력하기까지 시간이 얼마나 단축 되었는지 소요 시간을 비교한다. 마지막으로 피로도 감소를 확인하였다. 피로도 감소는 태스크 완료 후 영역 선택 기능, 작업시간, 피로도 감소 등 세 가지 항목에 대한 5점 척도의 주관적 만족도를 측정하였다.

5.2 측정 방법

평가 방법은 다음과 같다. 안드로이드의 톡백(Talkback) 서비스와 제안 인터페이스인 보이스브라우저를 대상으로 비교 평가를 진행한다. 평가에 참여하는 피평가자는 저시력자 10으로 구성하였지만, 실제로 평가에 참여한 피평가자는 본 시스템 사용의 경험이 없는 근시 시력을 가진 20대 일반 사용자 10인으로 구성되었다. 근시 시력을 가진 피평가자들은 안경과 렌즈를 벗고 실험에 참여하였다.

평가에 사용된 태스크는 콘텐츠 복잡도와 선택 개수 조합으로 구성하였다. 콘텐츠의 복잡도는 웹 페이지에 포함된 콘텐츠의 배치 밀도, 개수 등에 따라 간단, 중간, 복잡으로 분류하였다. 영역 선택 개수는 2개(문장 1개, 단락 1개), 4개(문장 2개, 단락 2개), 6개(문장 3개, 단락 3개)이다. 영역 선택은 콘텐츠의 순서대로 선택하지 않고, 본문에서 랜덤하게 선택되도록 사전에 설정하여 안내하였다. 실험은 제시된 영역을 선택 후 음성 출력까지를 태스크의 완료라고 정의하였다. 태스크를 성공하기까지의 수행시간과 시도 횟수 측정하고 이때, 관찰자는 평가자가 영역 선택이 완료되면 즉시 정확한지 잘못되었는지 알려주어 다시 선택할 수 있도록 유도하였다. 태스크의 순서는 랜덤하게 제시하며, 각 2회 진행 후 평균을 계산하였다. 실험 진행은 각 인터페이스와 시나리오 및 태스크에 대한 충분한 설명 및 안내 후 본 서비스를 사용하기 전 기존 서비스인 톡백으로 전체 낭독 기능을 사용하게 하였다.

5.3 실험 결과 및 분석

총 10명의 피실험자를 대상으로 톡백과 보이스브라우저 각각에 대하여 실험을 진행한 후, 수행시간, 재시도 횟수를 측정하여 평균을 구하였다. 또한, 보이스브라우저와 톡백 간의 실험 결과가 차이가 있는지 없는지에 대하여 두 변수의 평균이 차이가 있는지를 검증하는 독립 표본 T검증을 추가로 진행하였다. T검증을 위해 “두 모집단 간에 유의미한 차이가 없다”라는 귀무가설을 설정하였다. 실험 결과는 다음 Table 1과 같다.

Table 1. Result of Vocie Browser and Talkback Comparison Experiment

선택적 포커싱 기능의 효과 확인을 위해 콘텐츠 복잡도와 영역 선택 개수에 따라 분류하여 분석하고, 두 시스템 간의 만족도 평가를 분석하였다. 콘텐츠 복잡도에 따라 보이스브라우저와 톡백의 에러율과 수행시간을 비교한 결과, 보이스브라우저가 톡백보다 복잡도 ‘간단’에서 에러율이 약 85% 감소하고, 수행시간 1.36배 빠르게 완료하였으며, 복잡도 ‘보통’에서 에러율 약 84%, 수행 시간 1.34배, 복잡도 ‘복잡’에서 에러율 약 47%, 수행시간 1.48배 빠르게 수행되었다. 전체 평균 에러율 71% 감소하였으며, 수행시간은 평균 1.4배 빠르게 소요됨을 확인하였다. 에러율과 수행 시간에 대한 두 인터페이스 간 T검증 결과 유의미한 차이가 있음을 확인하였다(p<0.05, p= 에러율 0.042, 수행시간 0.025). Fig. 7과 Fig. 8은 콘텐츠 복잡도 별 에러율과 수행시간의 그래프이다.

Fig. 7. Error Rate by Content Complexity.

Fig. 8. Execution Time by Content Complexity.

두 번째로 선택 영역 개수에 따라 분석한 결과, 보이스브라우저가 톡백보다 ‘2개’선택할 경우 에러율 약 75%, 수행시간 1.3배 빠르게 수행되었으며, ‘4개 선택할 경우 에러율 42% 감소, 1.2배, ’6개‘ 선택할 경우 에러율 77%, 수행시간 1.5배 빠르게 소요되었다. 또한, 전체 평균 보이스브라우저가 톡백보다 에러율 71% 감소하고, 수행시간은 1.4배 빠르게 수행됨을 확인하였다. 에러율과 수행 시간에 대한 두 인터페이스 간 T검증 결과 유의미한 차이가 있음을 확인하였다(p<0.05, p=에러율 0.0012, 수행시간 0.0046). 이 실험에서 주목할만한 부분은 선택 개수가 가장 많은 6개인 태스크를 수행하였을 때이다.

만족도 평가 결과, 보이스브라우저가 영역 선택 기능 만족도 항목에서 4.7점, 작업시간 만족도에서 4.2점, 피로도 감소 만족도 항목에서 4.8점을 획득하여 톡백 서비스보다 우수한 만족도 결과를 획득하였다.

Table 2. Results of User Satisfaction Survey

실험 결과 기존서비스와 비교하였을 때 본 서비스를 사용할 경우 본문 내 컨텍스트의 구조가 복잡할수록 터치 횟수와 작업시간이 감소하고, 효율적인 작업이 가능하다. 또한, 이는 사용자의 피로도 감소로 이어진다는 사실을 설문 조사를 통해 확인하였다.

선택적 포커싱 기능의 효과 분석 결과, 톡백 서비스보다 보이스브라우저의 에러율과 수행시간이 모두 감소하여 원하는 영역만을 빠르고 정확하게 선택하여 읽을 수 있음을 확인하였다. 또한, 만족도 평가에서 모든 문항이 톡백 서비스보다 월등히 높은 점수를 획득하여 선택적 포커싱 기능이 사용에 효과적이고 사용자의 피로도가 감소함을 확인할 수 있었다.

6. 결론

본 연구는 저시력인을 위한 선택적 포커싱 기법이 적용된 모바일 보이스 웹 브라우저를 개발하고 사용성 검증을 진행하였다. 저시력인이 웹 콘텐츠 내에서 원하는 영역만을 골라서 선택한 순서대로 확대 및 음성 출력해주는 선택적 포커싱 인터페이스를 적용한 모바일 보이스 웹 브라우저(보이스브라우저)를 구현하고, 톡백 서비스와 비교하여 선택적 포커싱 기능의 효과 검증 실험을 진행하였다. 작은 브라우저 메뉴의 조작과 콘텐츠 조작을 쉽고 빠르게 수행할 수 있도록 개인화 확대 메뉴를 설계하였으며, 확대 및 음성 출력을 위해서 사용자가 원하는 콘텐츠를 자유롭게 선택할 수 있도록 선택적 포커싱 기능을 설계하였다. 또한, 콘텐츠의 확대 및 음성 출력 메뉴는 선택적 포커싱 기능에서 선택된 콘텐츠를 확대, 음성, 확대 및 음성의 복합 기능을 제공하였다. 사용성 평가 결과 톡백 서비스보다 보이스브라우저가 에러율과 수행시간이 모두 감소되어 원하는 영역만을 빠르고 정확하게 선택하여 읽을 수 있음을 확인하였으며, 만족도 평가를 통해 선택적 포커싱 기능이 사용에 효과적이고 사용자의 피로도가 감소함을 확인하였다.

본 연구를 통해 저시력인이 웹 콘텐츠를 이용할 때 자신이 원하는 영역만을 선택하여 확대 및 들을 수 있어, 웹 콘텐츠 이용에서 낭비되는 시간을 줄일 수 있을 것으로 기대된다. 또한, 향후의 연구에서 텍스트 이외의 표, 이미지, 동영상 등 다양한 유형의 콘텐츠도 서비스 대상에 추가한다면 사용자의 편리함을 더욱 높일 수 있을 것이다.

※ This research was supported by Basic Science Research Program through the National Research Foundation of Korea (NRF) funded by the Ministry of Education, Science and Technology (NRF-2018R1A4A1025559)