2007년 6월 3일 일요일

제이콥 닐슨 Sweet * :: [유저빌리티] 유저빌리티 휴리스틱스(Usability Heuristics)

Sweet * :: [유저빌리티] 유저빌리티 휴리스틱스(Usability Heuristics)

유저빌리티는 어느 도구를 쓰는 이용자가 원하는 기능을 얼마나 쉽게 찾아내서 적절히 적용할 수 있는지를 가늠하는 것이다. 이를테면 VTR을 구입한 소비자가 예약녹화 기능이 너무 복잡해 좀처럼 이용하지 않는다면 그 예약녹화 기능의 유저빌리티는 실패했다는 말이 된다.

□ 유저빌리티는 가전제품 개발과정에서 폭넓게 적용돼 왔다.
최근 컴퓨터 소프트웨어와 웹 사이트 개발에 유저빌리티가 고려되는 경우 적은 비용과 노력으로 커다란 효과를 거둘 수 있다는 사실이 밝혀졌다. 유저빌리티는 ‘사용자에게 편리한’(user-friendly) 웹 사이트 디자인을 위한 핵심개념으로 자리 잡았다.

□ 유저빌리티에서 고려할 점들로는
△ 쉽게 배울 수 있을 것
△ 효율적으로 이용할 수 있을 것
△ 기억하기 쉬울 것
△ 에러를 미리 방지할 것
△ 사용자에게 만족감을 줄 것 등이 꼽힌다.


□ 웹사이트 디자인에서 유저빌리티 전문가들은 다운로드 시간, 페이지 크기, 서버 접속 기록 등 측정 가능한 데이터들을 분석해서 웹사이트를 보다 쉽고 편리하게 개선하기 위해 노력한다.


□ 휴리스틱스(Heuristics)
자신의 경험을 바탕으로 보다 나은 해답을 찾아나가는 행태를 연구하는 학문을 말한다. 생쥐를 이용한 미로찾기는 휴리스틱스의 가장 대표적인 실험이다. 생쥐를 미로의 입구에 놓고 반대편 출구를 찾아 나올 때까지 시행착오를 반복하게 하면 결국 지름길을 찾아낸다. 축적된 경험을 바탕으로 시행착오를 미리 줄여줄 수 있는 방안을 연구하는 것이 바로 휴리스틱스 본연의 자세라고 할 수 있다.


□ 유저빌리티 휴리스틱스(Usability Heuristics)
인 터넷은 우리에게 더 이상 생소하지 않다. 우리는 이미 자기도 모르는 사이에 인터넷에 익숙해져 있다. 그 동안 인터넷을 이용했던 경험이 쌓였기 때문이다. 그러는 중 우리는 어떤 웹사이트는 사용하기가 쉽고 어떤 경우는 왠지 모르게 불편하다는 느낌을 갖는다. 쉽고 편한 사이트는 다시 찾아지기 마련이다. 그러나 사이트 이용이 불편하면 우리는 웬만해서는 참지 않는다. 그저 마우스만 한 차례 클릭하면 얼마든지 많은 다른 사이트로 옮겨갈 수 있기 때문이다.

경험을 바탕으로 한 인터넷 사이트의 유저빌리티를 ‘유저빌리티 휴리스틱스’(Usability Heuristics)라고 부른다. 수많은 웹사이트가 성공과 실패를 거듭하면서 이용자의 공통적인 기대에 맞는 휴리스틱스가 정리될 수 있었다. 유저빌리티 전문가 제이콥 닐슨(Jacob Nielsen)은 그의 저서 ‘Usability Engineering’에서 대표적인 유저빌리티 휴리스틱스 10가지를 제시했다. 이 10가지 휴리스틱스는 일반 웹사이트 뿐 아니라 뉴스사이트에서도 반드시 고려돼야 할 웹사이트 디자인의 기본이라고 할 수 있다.

★ 제이콥 닐슨의 10대 유저빌리티 휴리스틱스
△ 쉽고 간단하게 대화하라
△ 이용자의 화법을 따르라
△ 생각할 필요가 없게 하라
△ 연속성을 유지하라
△ 제 때에 피드백을 주라
△ 빠져나갈 곳을 확보하라
△ 지름길을 제시하라
△ 에러 메시지를 쉽게 하라
△ 에러를 사전에 막아라
△ 필요할 때 도움을 주라
▲ 쉽고 간단하게 대화하라
한눈에 알아볼 수 있는 유저 인터페이스(User Interface)를 구축하라는 뜻이다. 색깔이나 선을 써서 같은 주제로 묶을 수 있는 내용들을 구분지어 준다거나 하이퍼링크가 걸려 있는 부분을 일반 텍스트와 달리 보이게 하는 것 등이 그 예다.

무엇보다 한 페이지 안에 너무 많은 것을 나열하지 않는 것이 좋다. 특히 웹사이트의 홈페이지에서 이런 실수가 자주 발생한다. 홈페이지에는 그 사이트가 갖고 있는 모든 것을 다 보여줄 필요는 없다. 이른바 ‘80/20 법칙’을 고려할 필요가 있다. 사이트가 갖고 있는 기능이 모두 100이라면 홈페이지에는 가장 많이 쓰이는 20만 보여주면 된다. 나머지 80은 한 번 더 마우스를 클릭해서 찾아가는 별도의 페이지에 따로 담아두도록 한다.

▲ 이용자의 화법을 따르라
웹사이트를 만들 때 가장 범하기 쉬운 실수가 사이트를 개발하는 프로그래머가 사용하는 기술적 용어를 그대로 쓰는 일이다. 웹사이트에는 그 사이트를 찾는 독자들에게 가장 친숙한 용어를 골라서 써야 한다. 예를 들어, 학교 동창회 사이트인 ‘아이 러브 스쿨’에서 ‘사용자 id’를 ‘이름표’라고 하고 ‘로그인’을 ‘등교하기’라고 표현한 것이 좋은 예다.

특히 링크이름이나 주제분류이름과 같이 한 두 단어 길이의 짧은 용어의 선택이 매우 중요
하다. 이같은 웹사이트 상의 짧은 용어들을 ‘마이크로컨텐트’(microcontent)라고 부른다. 마이크로컨텐트는 직관적이어야 한다. 한마디의 마이크로컨텐트를 봐서 이용자들은 그 링크를 누르면 무슨 일이 벌어질지 즉각 알아차릴 수 있어야 한다.
한두마디 단어로 불가능한 경우에는 메타포어(metaphor)를 사용할 수 있다. 메타포어의 대표적인 예가 아이콘이다. 윈도즈 아이콘 가운데 ‘파일 삭제’를 뜻하는 휴지통 아이콘은 훌륭한 메타포어 가운데 하나다. 이처럼 한눈에 봐서 무슨 기능을 할 것인지를 금방 알 수 있는 것이 잘 만들어진 메타포어다.

▲ 생각할 필요가 없게 하라
잘 된 웹사이트는 이용자에게 부담을 주지 않는다. 웹사이트 이용자들에게 성가신 일 가운데 하나가 날짜와 시간 입력이다. 2월을 ‘2’ 또는 ‘02’로, 오후 2시를 ‘2’와 ‘AM’ 또는 ‘14’로 웹사이트에 따라서 입력하는 방식이 저마다 다르기 때문이다. 이럴 때 잘 된 웹사이트는 아예 정해진 포맷을 미리 보여주고 선택만 하게 한다. 이용자로 하여금 생각할 필요가 없게 하자는 것이다.

이용자를 골치 아프지 않게 하는 데 좋은 방법은 용례를 미리 보여주는 것
이다. 주민등록번호를 치면서 가운데 ‘하이픈’(-)을 넣을 것인지 말 것인지는 입력하는 예를 구체적으로 적시해주는 것이 최선의 방법이다.


많은 웹사이트에서 널리 쓰이고 있는 일반적인 관행은 가급적 그대로 따르는 것이 좋다.
예를 들어 보자. 웹브라우저에서 하이퍼링크의 기본 색깔은 파랑색이다. 마우스 포인터가 링크 위로 올라가면 빨강색으로 변한다. 한 번 클릭하고 나면 그 링크는 보라색으로 남는다. 이용자들은 이같은 시스템 기본 설정에 익숙해 있다. 그런데 웹페이지를 만들 때 하이퍼링크의 기본 색깔을 보라색으로 지정해 놓았다고 치자. 이용자들은 링크를 클릭했었는지 아닌지를 분간하기 힘들어진다. 이처럼 이미 널리 관행으로 굳어져 있는 요소는 함부로 손대지 않는 것이 좋다.

▲ 연속성을 유지하라
이용자가 한 웹사이트를 방문해서 여기저기를 돌아다닐 때 그가 여전히 그 웹사이트 안에 머물러 있다는 느낌을 확실히 줘야 한다. 사실상의 표준으로 굳어진 사례가 웹사이트 화면 왼쪽 윗부분에 사이트의 로고 이미지를 고정시키는 방법이다. 또한 사이트 전체를 일관하는 페이지 레이아웃과 색조도 연속성(consistency)을 유지하는 중요한 요소다.

사이트의 연속성은 눈에 보이는 디자인만으로는 부족하다. 기능상의 연속성의 유지가 중요하다. 예를 들어 회원 가입 과정과 회원 정보 변경 과정을 나타내는 웹페이지의 순서와 절차에 일관성이 있어야 한다. 이용자의 태스크(task)를 처리하는 일련의 과정이 사이트 전체의 흐름에서 벗어나지 않아야 한다는 말이다.

▲ 제 때에 피드백을 주라
에러가 났을 때는 반드시 에러가 발생했다는 사실을 알려줘야 한다. 거꾸로 에러는 발생하지 않았으나 기다리는 시간이 길어질 때는 정상적으로 작동하고 있음을 알려줄 필요가 있다.
아무런 피드백 없이 시간이 길어지면 이용자는 사이트가 멈춰버렸다고 생각하게 된다. 이용자는 그 사이트를 떠나고 만다. 그리고는 그 사이트는 불완전한 곳이라고 생각하고 좀처럼 다시 돌아오지 않는다.

▲ 빠져나갈 곳을 확보하라
어느 페이지에서든지 꼭 갖춰야 할 두 가지 링크가 있다. 하나는 그 사이트의 홈페이지로 돌아가는 링크고 다른 하나는 바로 앞 페이지로 돌아가는 링크다.
이 용자가 클릭을 반복하다보면 웹사이트 트리구조에서 점점 깊은 페이지로 빠져든다. 자칫 웹사이트 안에서 길을 잃을 수 있다는 얘기다. 만일 홈페이지로 돌아오거나 앞 페이지로 빠져나오는 링크가 없으면 길을 잃은 이용자의 유일한 선택은 그 사이트를 닫아버리는 것이다.

▲ 지름길을 제시하라
웹 브라우징에서 가장 잘 알려진 지름길은 ‘즐겨찾기’다. 즐겨찾기는 자주 보는 웹사이트를 한번의 클릭으로 찾아갈 수 있게 한다. 일반 컴퓨터 응용프로그램에서도 지름길은 여기저기서 눈에 띈다. ‘파일 열기’는 메뉴를 일일이 찾아 클릭할 필요없이 키보드에서 Ctrl+O, 즉 컨트롤키를 누른 상태에서 알파벳 O를 치면 된다. 이를 ‘핫 키’(hot key)라고 부른다. 또한 [그림 14]처럼 최근에 작업했던 파일이 ‘파일 열기’ 메뉴에 별도로 나타나는 것도 지름길의 하나다.


웹페이지를 디자인할 때는 사이트 이용자들이 어느 페이지 어느 기능을 자주 이용하는지를 파악해야 한다. 자주 이용하는 링크는 서버에 저장되는 로그 데이터(log data)를 분석해서 정확히 알 수 있다. 많은 이용자들이 자주 쓰는 페이지나 기능으로 연결되는 링크는 홈페이지에서 눈에 잘 띄는 곳에 독립된 링크로 만들어둬야 한다. 이용자들의 클릭을 단 한 번이라도 줄여주는 것이 웹사이트 디자인의 미덕이고 유저빌리티의 제1조이기 때문이다.

▲ 에러 메시지를 쉽게 하라
에러 메시지는 아무리 친절해도 기분이 좋지 않은 피드백이다. 그런데도 친절하게 씌어진 에러메시지는 흔치 않다. 대부분의 에러메시지는 기술적인 용어 투성이인데다 ‘치명적인 오류’, ‘불법 사용’ 등 깜짝 깜짝 놀랄만큼 과도한 용어가 많다.

에러 메시지는 이용자의 입장을 생각해서 알기 쉽고 정확하게 써야 한다. 기술적인 용어를 피하고 과격한 표현을 삼가야 한다. 정말 잘 된 에러메시지는 에러 발생 사실과 함께 다음 단계로 어떻게 해야 할 것인가를 안내해준다. 예를 들면 ‘서버 접속 한도 초과’라고 하기보다는 ‘사용자가 많이 몰려 접속되지 않았습니다. 2~3분 후에 다시 접속해주십시오’하는 식이 돼야 한다.

▲ 에러를 사전에 막아라
아 주 당연하지만 꼭 상기해야 할 중요한 점이다. 아무리 사소한 에러라고 할지라도 예상되는 에러는 사전에 모조리 막아야 한다. 사이트를 운영하는 도중에는 에러가 발생하면 즉시 경보를 울리도록 하는 장치가 필요하다. 서버에 쌓이는 로그 데이터 가운데 ‘에러 로그(error log)’를 포착하면 에러의 종류와 발생 위치를 정확히 알 수 있다. 그러나 놀랍게도 에러 로그를 면밀히 관리하는 사이트는 그리 많지 않다. 운용중에 발생하는 에러는 지체없이 바로 잡아야 한다.

▲ 필요할 때 도움을 주라
웹사이트 사용법을 쉽게 찾아볼 수 있게 해야 한다. ‘도움말(help message)’은 키워드를 이용해서 검색할 수 있게 디자인되는 것이 최고다. 또한 웹사이트 사용법 전체를 담은 사용자 매뉴얼을 잘 정리해둬야 한다.

사용자 매뉴얼은 최소한 두 단계로 준비돼야 한다. 우선 가장 많이 쓰는 기능을 중심으로 한 두 페이지로 정리된 ‘빨리 찾아보기(Quick Reference)’가 반드시 필요하다. 그리고 상세한 이용법이 체계적으로 정리된 ‘파워 유저 매뉴얼’(Power User’s Manual)이 따로 있어야 한다.

웹사이트가 됐던 일반 컴퓨터용 응용 프로그램이 됐건 이용자의 90% 이상이 매뉴얼을 읽지 않고 곧바로 사용하려 한다는 조사 결과를 주목해야 한다. 일단 시도해봤다가 잘 안되는 경우에야 비로소 매뉴얼을 찾는다. 그러나 이때 매뉴얼이 소설책처럼 장문의 깨알 같은 글씨로 쓰여 있으면 이용자들은 매뉴얼을 꼼꼼히 읽기보다는 사용을 포기하는 쪽을 택한다. 이같은 극과 극을 연결시켜주는 징검다리가 바로 ‘빨리 찾아보기’ 매뉴얼이다.

더욱 중요한 점은 도움말이나 사용자 매뉴얼이 쉬운 말로 기술돼야 한다는 사실이다. 이용자들이 평상시에 쓰는 용어와 어법으로 매뉴얼을 정리해야 한다. 웬만한 프로그래머나 웹사이트 개발자들은 평이한 말을 써서 사이트를 설명하는 데 익숙치 않다. 도움말이나 매뉴얼은 외부 전문기관에 맡길 것을 권한다.

댓글 없음: