웹기획 이해하기 - 강좌7, IA 네비게이션의 본질

웹기획 이해하기 - 강좌7, IA 네비게이션의 본질

지금까지 본인의 강좌에 의아해 하시는 분들이 많을 것이라 생각이 된다. 구체적으로 어떻게 어떤 형식으로 설계하라 라는 말은 없으니 말이다. 혹 어느 전문가 분들은 구체적으로 설계하는 방법을 가르쳐 주거나 또는 웹사이트를 개발하고 구축함에 있어 팀원간에 지켜야 될 프로토타입 구조도 구체적으로 제시해 주기도 한다. 예를들면 디렉토리 명명 법 설명서나 네이밍 하는 법 또는 문서작성법까지 등등…

다시 한번 말하지만 '수단과 목적'을 확실히 구분해야만 한다. 목적을 이루기 위해 수단을 사용 하는데, 그 수단은 현재 상황(팀의 문화, 서로간의 능력, 서로간의 커뮤니케이션수준, 기타상황)에 맞게 만들어져 최적의 상태이어야 한다. (최고가 아니라 최적이다.) 그러므로 과대 포장되거나 내용물과 전혀 다른 포장을 해서 웹사이트의 목적과는 전혀 다른 방향으로 나가는 것을 막아야 한다.

# 프로세스도 중요하지만, 적을 무찌르는것이 더 중요하다.

그리하여 제 칼럼은 소(웹기획 초보자)를 우물가(웹기획의 마인드를 접하도록)에 이끌고 가도록 하는 칼럼이니 너무 정보가 없다고 불평하시지 말라. 팀원간의 커뮤니케이션 프로토콜을 확실히 인지하고(팀원 사이의 신뢰는 무릅의 관절과 관절의 연골과 같다.) 히스토리를 위한 최소한의 설계문서를 작성하여 웹사이트의 프로젝트가 성공적으로 완수 되도록 기타 부분에 더 집중 해야 한다.

보통 시스템이나 기획에 대해 좀 배웠다는 분들은 이야기 한다.
"시스템설계문서와 사이트설계문서는 굉장히 중요하기 때문에 최대한 자세히 철저히 나타내야 한다. 그리고 시간을 그만큼 많이 투자해야 한다."
절대 틀린 말이 아니다. 그러나 위와 같은 작업이 수행되기 위해서는 그 작업들이 표준화 되어 있어야 한다. 건축의 설계와 시공은 표준화 되어 있다.

그래서 최대한 상세히 그 누가(전문가)가 보아도 동일하게 시행할 수 있다. 그렇지만 아직 우리나라의 전산업계나 웹 업계에서 프로세스들이 표준화는 되어 있지 않다. (회사별로 표준화 된 곳은 많이 있다.) 전략이라는 것은 그 시기에 최적의 솔루션을 통한 목표 달성을 의미한다. 설계문서 작성이 중요하다 할지라도 우리의 현실, 팀원이 부족하면 야근을 해야 하고, 고객의 요구사항은 지나칠 정도로 넘쳐나는 외부 환경을 바라 볼때 설계문서에 그리 많은 시간을 투자할 여력이 없다.

프로세스를 중요시하다 결국 중요한 목적에 벗어날 수 있기 때문이다.


다만 히스토리를 남기는 것은 매우 중요하다. 나중에 그 문서를 보았을 때 어떻게 설계가 되었는지, 기본적인 기능설계도, 구조도, ERD, DFD, IA, UI 설계서가 약식으로라도 남아 있어야 한다. 어떻게 이런 사항을들 적절하게 조절하고 균형을 맞추는 것도 웹기획자의 임무이며 프로젝트매니저의 임무이다.

# 네비게이션 이란 무엇일까?

우리는 웹사이트 작업을 하면서 '네비게이션'이라는 용어를 상당히 많이 쓴다. 이 글을 읽는 순간 고개를 돌려 옆 팀원에게 물어봐라 '네비게이션이 뭐죠?' 그러면 그 팀원은 '집이 뭐죠?'라고 묻는 것 같은 황당함으로 설명해 줄 것이다.(^^)

'매뉴나 배치상태 뭐 이런 거자나요'

맞다. 그러나 본질을 말하고 있지는 않다.

'네비게이션은 목적중심이며 행동 지향적이다.' 목적이 있어야 하며, 행동의 Action이 예견되어 있어야 한다는 것이다. 그것이 이미지이건 텍스트이건 또는 표현방법이 메타포를 중심으로 한 아이콘이건 플래시를 사용한 것이든 간에 사용자가 원하는 목적지로 빠르고 쉽게 갈수 있도록 도움을 주어야 한다.

따라서 다시 설명하자면 ‘네비게이션 이란 공간과의 상호작용을 설계하는 것이며 따라서 사용자의 경험을 만들어 나가는 것이다.' 그 경험이 이미 많이 겪어본 실제세상(Real world)의 경험이 있다면 그것을 우선시 하도록 하는 것이 매우 중요하다.

# Navigation에서 고민하는 문제들

- 여기는 어디인가?
- 갈 수 있는 곳은 어디인가?
- 갈 수 있는 방법은 무엇인가?
- 예전에 갔던 곳을 어떻게 다시 갈수 있는가?

위와 같은 고민을 최소화 하도록 도와주는 것이 네비게이션의 역할 이다. 여느 웹기획 책자 및 웹디자인 책자와 같이 구체적으로 ‘폰트 몇’을 사용해라 아이콘을 어떻게 사용해라 구체적인 예시는 들어주지 않겠다. 웹사이트도 인간이 사는 실제 세상과 같아서 변화무쌍한 모든 상황에 '이것이 정답이다.'라고 말하는 것은 세상에 대한 섣부른 일반화가 되지 않을까 생각한다.

- 여기가 어디인지 어떻게 사용자에게 알려 줄 것인가?
- 지금 현재 위치에서 갈 수 있는 곳이 어디인지 어떻게 알려 줄 것인가?
- 사용자가 갈수 있는 방법을 알게 할 방법은 무엇인가?
- 예전에 갔던 곳이 어디인지 어떻게 제공해 줄 것인가?

# 네비게이션도 정보설계 이며

정보설계의 목적은 Usability가 증가하는 방향이다.


성공적인 네비게이션을 위한 10가지 조건
1. 쉽게 익힐 수 있어야 한다.
2. 일관성이 있어야 한다.
3. 피드백을 제공해야 한다.
4. 문맥으로 표시되어야 한다.
5. 행동과 시간을 절약할 수 있어야 한다.
6. 명확한 시각적 메세지를 제공해야 한다.
7. 명확하고 이해할 수 있는 레이블 이어야 한다.
8. 사이트의 목적에 적합해야 한다.
9. 대안을 제공해야 한다.
10. 사용자의 목적과 행동을 지원해야 한다.

나중에 이야기 하겠지만 유용성(Usability)을 높이기 위한 부분과 거의 일치한다. 사용자의 유용성 또는 사용성을 증가하기 위하여 사용자들이 고민하지 않고 원하는 정보의 최종목적지에 도달하게 하는 것, 그리고 그 위치에서 나온 후 나중에도 쉽게 찾을 수 있도록 하는 것, 이것이 네이베이션의 목적이며 유용성을 높이게 만드는 방법이다.

네비게이션을 설계하는 것 또한 정보설계의 일환이며 그 목적은 사용성과 일치 해야 한다. 사용하기 어려운 네비게이션은 사용하지 않는 장식에 불과할 수 밖에 없다. 그래서 이해하기 쉬운 네비게이션을 만드는 것이 매우 중요 하다 할 수 있다.

‘이해 하기 쉽다’ 라는 것을 어떻게 표현해야 할까? 인간의 인지적 능력, 신경생리학적 감각, 사용자의 경험에 근거한 현실세계의 이해도 등을 이해해야 한다. 물론 사이트를 설계하는 본인도 인간이기에 본인의 입장에서 설계를 하면 된다. 그러나 본인이 인간전체라 단언할 수 없기에 기타 학문들을 참고 하거나 여러 사람의 의견을 들을 수 밖에 없다.

그렇다면 인간이 ‘이해하기 쉽게’ 사이트를 만들기 위해서는 두가지 방법으로 좁혀진다.

1. 리서치를 통한 이해도 측정 : 여러 사람의 의견을 들어 결론을 찾아가는 방법


2. 이미 연구된 학문의 자료를 참조하는 경우 : 인간의 인지적능력, 신경생리학적 감각,HCI

사이트를 이용하게될 유저, 사이트의 전략, 시장환경, 조직의 비전에 따라 모든 상황이 달라지기 때문에 위의 두가지 방법을 적절하게 조합하여 나름대로의 이론을 만들어 가는 것 밖엔 별다른 방법이 없다.

그리하여 효과적인 네비게이션 설계를 하기 위해서는

아래사항에 대한 고려가 우선되어야 한다.


- HCI(Human Computer Interface) 측면 고려
- Usability(유용성,사용성) 측면 고려
- Web Image Design의 계층적, 시각적 표현
- 인지심리학적 측면 고려
- 사용자의 경험(User experience) 고려


# 일반적으로 보는 네비게이션 설계들

- Navigation bars
- 위치 정보
- 페이지 전/후 관계
- 색인
- 사이트 맵
- 검색
- 하이퍼텍스트, 하이퍼링크
- Action 설계

Navigation bars, 메뉴 바라고 생각하면 된다. 이 메뉴바를 이해하기 쉽게 만들려면 우선 지난 강의때 본 정보체계를 확실하게 설계해야 하며 시각적으로 확실히 구분이 가도록 만들어야 한다. 콤보박스 스타일이거나 Tab 네비게이션, 펼침매뉴 등이 많이 사용된다.

위치정보, 내가 어디에 있는가? 내 위치를 알아보고 현재 위치에서 갈수 있는 곳을 알려줘야 한다. 내가 어디 있는가를 알아야 이동할 방향을 찾게 되는 것이다. 군인이 풀과 나무만 있는 산 속에서 목적지에 가기 위해서 나침반과 지도라는 도구를 사용하는데 현재 있는 위치를 파악하지 못한다면 나침반과 지도는 쓸모 없는 도구가 되어 버린다.

페이지 전/후 관계, 이전페이지와 현재페이지가 어떤 의미로 연결되어 있는지에 대한 정황적 설명이 필요하다.

색인, 웹사이트 전체에 대하여 또는 정보 전체에 대하여 알파벳순 가나다순 또는 주제별로 색인(INDEX) 하여 찾아갈 수 있는 방법을 제시한다. 책의 마지막 페이지에 보면 리스트가 나와 있다. 이런 접근도 특정 정보를 찾는데 도움이 될 것이다.

사이트맵, 사이트의 구조상태를 그대로 트리구조로 보여준다. 사이트의 전체적인 현황 설명이 가능하며 사이트를 운영하는 운영자입장을 나타내 줄 수 있는 좋은 방법이다.

검색, 기타 다른 방법으로 정보에 접근하기 어렵거나, 정보가 너무 많아 찾을 수 없을 때 검색이 되어 찾아갈 수 있도록 도와준다.


하이퍼텍스트/ 하이퍼링크, 웹의 가장 기본적인 요소인 하이퍼링크이다. 이것은 하나의 페이지에서 또 다른 페이지로 바로 이동이 가능하다는 행위성을 포함하고 있다. 어느곳으로 갈 것인지 적절하게 표현해주는 전략이 필요하다. 그리고 하이퍼링크를 연결시킬 키워드에 대해서도 많은 고민을 해야 한다.

Action 설계, 일반적으로 클릭했을 경우 예상되는 반응이 나타나도록 해야 한다. 링크되어 있어 클릭했는데 그 링크된 키워드에 대한 관련정보가 나타나지 않고 엉뚱한 정보가 나타난다던지, 링크를 클릭했는데 그냥 단순 밑줄이었다던지 한다면 옳바른 설계가 아닐 것이다.

위와 같은 작업들이 Web Navigation(웹사이트 항해)을 도와주는 역할을 해서 좀더 쉽고 빠르게 원하는 정보에 접근하도록 도와주게 된다.


# Trend와 유행은 다르다.


Trend, 추세(趨勢)란 경제변동 중에서 장기간에 걸친 성장•정체•후퇴 등 변동경향을 나타내는 움직임을 말한다.

장기간에 걸친 비즈니스와 관련된 경향을 말하는 것이기 때문에 단순히 최근 웹네비게이션의 유행을 잘못 인지하여 Trend라 생각하거나 단순히 모방하는 것은 옳지 않은 방법이어서 사용자들이 쉽게 식상해 하거나 쉽게 질리게 만드는 경우가 많다.

최근에는 플래시의 과도한 사용이 마치 Trend 인양 사용되어져 왔는데 사이트개발을 의뢰한 경영자나 담당자의 요구가 많았던 것 같다. 감성적인 디자인도 중요하지만 그보다 더 중요한 것은 웹페이지는 ‘정보 문서’라는 것이다. 정보 전달력이 떨어지는 웹페이지는 아무런 의미가 없다.

감성만 있고 정보는 없는 페이지 , 정말 지양해야 한다.

IA의 한 요소인 Navigation에 대해 의미론적 접근을 해보았다. 각 상황별 네비게이션 전략에 대해서는 말해주지 못했지만 차후 연구하여 별도의 글로 작성해 보도록 하겠다.

웹 네비게이션이란 자동차에 위치를 알려주는 네비게이션과 같다.

그래서 내가 지금 어디인지? 어디로 가야 하는지? 명확하게 나타내 주면 된다.

그것을 표현하는데 '입체적'이라던가 '멋있다' 라던가 하는 부분에 신경을 많이 쓰는 것은 네비게이션의 본질은 모르고 겉만 치장 하는 것과 같다.

그 본질을 잘 깨닫는 자만이 고객을 얻을 수 있을 것이다.


웹기획자 이정기

이메일 : quiz94@dreamwiz.com

네이트온 : quiz94@nate.com

블로그 : http://blog.naver.com/quiz94

http://paper.cyworld.nate.com/jkweb/

다운로드
의견 1 신규등록      목록