Information Architecture

Information Architecture 60095052 이상희 60095053 이충규 60095055 전미정

Definition Information Architecture Element Mobile

Definition • IA란? • IA의 등장배경

IA란? • 정보는 사용자에게 전달되기 위해서 • 가공과 설계의 과정을 거치게 된다. • 이러한 과정을 “정보설계 혹은 정보디자인” • 이라고한다. • “인포메이션 아키텍처”는 • 1975년 Richard Saul Warman에 의해 처음 사용 • Louis Rosenfeld와 Peter Moville의 종합 설명

IA란? • 정보설계, 정보 아키텍처, 인포메이션 아키텍처 • (Information Architecture) • 사용자와 의뢰인 요구의 균형을 고려하여, • 사이트의 아이덴티티(identity)를 정의함 • 컨텐츠에 직관적으로 접근하고, • 업무 처리가 용이하게 정보공간을 설계 • 사이트의 내용(Content)과 기능을 결정 • 인포메이션 체계 내의 조직화, 내비게이션 체계, 레이블링을 의미 • 사용자에게 정보를 어떻게 전달할 것인지를 계획 • 사이트 개발 후 유지보수에 대한 사후관리를 계획

IA의 등장배경 디지털화와 네트워크화를 통해서 가상공간에 적합한 새로운 패러다임을 요구하고 있다. 기존 미디어에서 사용자(User)들은 일방향적으로 전달받는 수동적인 수용자였지만, 웹에서는 자신의 목적에 따라 정보를 생산&소비하기도 하며 적극적으로 정보를 탐색하며 새로운 의미를 생성한다. 이 때 정보의 유형에 따라 사용자의 정보탐색 유형이 달라지며 따라서 정보설계 또한 이에 맞도록 설계되어야 한다. 웹사이트 개발에서 가장 기본이 되는 정보구조는 다루어질 정보를 대상으로 사이트의 골격을 설계하는 것이다.

Element • Organization system • Navigation system • Labeling system

IA 의 Element 정보 아키텍처는 크게 3가지 측면으로 나눌 수 있다. 전체적인 구조와 세부적인 정보를 설계하는 Organization system 사이트 내에서 사용자의 이동에 대해 설계하는 Navigation system 내용 구성요소들에 대해 어떤 명칭을 붙이는지에 대한 Labeling system이 있다.

Organization system • Organization system란 • 정보를 어떻게 분류할 것인가에 관한 것으로 • 사이트의 포괄적인 정보설계를 말한다. • Organization system은 • 전체적인 측면에서 정보에 대해 분류·조직하는 • Organization Scheme과 • 구조적인 측면에서의 정보를설계하는 • Organization Structure의 • 두 가지 측면에서 고려할 수 있다.

Organization scheme • ① 명확한 Scheme • 철자순(alphabetical) 분류, • 연대순(chronological) 분류, • 지역별(geographical) 분류가 해당된다. • - 장점 : 사용하기 편리하며, 비교적 유지관리가 쉬운 편 • - 단점 : 찾고자하는 바가 명확해야 함

② 모호한 Scheme • 주제별(topical) 분류, • 행동별(task-oriented) 분류, • 사용자 유형별(audience-specific) 분류, • 메타포에 의한 분류(metaphor-driven)등이 해당된다. • - 장점 : 정보의 성격에 따라 오히려 효과적임 • - 단점 : 명확한 구분이 어렵기에, 사용하기가 쉽지 않음

② 모호한 Scheme 주제별 분류 : 주제의 해당범위를 정의하여 사용자에게 명시하는 방법으로 가장 많이 사용된다. 행동별 분류 : 사이트의 정보를 분류할 때, 사용자의 예상되는 주요행동을 기반으로 하는 방법이다. 주로 소프트웨어의 메뉴에 적용되는 방법으로 open, edit, copy, paste, quit 등등 행동별로 정보를 분류한다.

사용자 유형별 분류 : 예상되는 사용자가 둘 이상의 유형일 때, 각각의 유형별로 나누어 정보를 제공하는 방법이다. 이 방법은 사용자가 자신에게 해당되는 정보를 보다 쉽게 찾을 수 있게 하기 때문에 오히려 혼란을 줄 수도 있다. 메타포에 의한 분류 : 일상생활에서 익숙한 것에 비유하는 메타포로 정보를 분류하여, 사용자가 쉽게 찾을 수 있도록 하는 방법이다.

Organization structure • 계층구조, 선형구조, 하이퍼텍스트구조, 데이터베이스구조 • 계층 구조 (=메뉴구조, Hierarchy) : • top-down 방식으로, 상위개념과 하위개념, 내용간의 순서, • 논리 등의 측면에서 연계성이 있는 구조 • 우리에게 익숙한 방법이기 때문에, • 계층구조 웹사이트는 쉽고 빠르게 전체적인 구조를 파악 가능 • <계층적인 정보 구조 설계시 고려사항> • - 계층구조 간의 균형과 상호배타성 • 같은 레벨의 카테고리(category)는서로 명확하게 구분되어야 하며, • 카테고리 간에 서로 비슷한 비중

선형 구조(=선적 흐름 구조, Linear 구조, • Sequence 구조) : • 연속된 일련의 정보를 순차적으로 볼 수 있도록 구성하는 방식 • 정보의 내용이 이야기와 같이 일정한 흐름을 따라가는 경우나, • 각 단계마다 순서에 따라가는 경우가 해당 • 웹에서는 전체적으로 계층적 정보 구조로 설계된 사이트의 도입(Intro) 부분에 선형 구조가 부분적으로 사용 • <선형 구조 설계시 고려사항> • 전체의 유기적인 연결을 위한 일관성과 원활한 의사소통을 위한 상호작용성

하이퍼텍스트 구조 (=Hypertext 구조, • Interactive 구조, 대화형 구조, 네트워크형 구조) : • 각 항목마다 각각 독립적인 객체로 존재, • 상호연관성을 지니고 객체간의 끊임없는 연결로 이루어진 구조 • 하이퍼텍스트 구조는 원하는 항목으로 즉시 이동 가능 • 반면에, 복잡한 구조로 인해 사용자의 혼란을 가중 • 대체로 계층 구조나 데이터베이스 구조를 기본구조로 사용, • 하이퍼텍스트 구조를 보조적으로 사용

데이터베이스 구조 : • bottom-up방식으로, 광범위한 정보들이 모인 구조 • 사용자가 찾고자하는 바를 잘 알 때는, • 검색(search)기능을 통해서 • 쉽고 빠르게 원하는 정보에 접근할 수 있음 • <데이터베이스 구조 설계시 고려사항> • - 키워드(keyword)의 선정 • 예상되는 키워드들에 대해서, 사용자들이 사용할 수 있는 유사어휘들도 함께 선정하는 것이 좋음

Navigation system • Navigation system 이란? • Navigation (항해): • 사용자가 정보를 찾아서, 하이퍼미디어 안 이곳 저곳을 돌아다니는 행위를 말한다. • Navigation system : • 정보설계에 있어서, • 사용자의 실질적이고 구체적인 정보탐색 방법에 관한 것 • 사용자들의 사용 패턴에 따라 설계되어, • 사용자들의 노력을 최소화 할 수 있도록 하는 것이다.

Navigation system • 계층적, 글로벌, 로컬 Navigation system • 계층적 Navigation system : • 사이트의 계층구조에서 가장 기본적인 이동 • 상하의 계층적인 이동만 가능, • 2단계 이상의 상하이동이나 좌우의 같은 레벨인 항목들로의 직접적인 이동은 불가능

Navigation system • 글로벌 Navigation system : • 폭넓은 상하의 수직이동이나 좌우의 수평 이동을 의미 • 사용자가 보다 자유롭게 접근할 수 있는 유연성이 있는 • 반면에, 정보탐색에 혼란을 줄 수 있음 • 로컬 Navigation system : • 복잡하고 규모가 큰 사이트의 경우, • 그에 속하는 작은 하위 사이트인 sub-site가 하나 이상 • 있을 수 있는데 이렇게 부분적으로 적용되는 내비게이션 방법 • 예를 들어, 가전제품 회사 웹사이트의 ‘online 제품안내’부분은 • 하나의 sub-site가 될 수 있음

Navigation system • 보조적 Navigation (항해보조도구) : • 사이트의 정보 구조에 대한 기본적인 내비게이션 이외로 이를 보조하여 사용자의 정보탐색을 돕는 것을 의미 • 원하는 항목으로 이동이 가능할 수 있게 • 목차, 사이트 맵, 인덱스(Index) 기능, • 사용자가 항해한 경로를 저장하여 알려주는 • 행로(History) 기능, • 원하는 정보를 표시해두고 다음에 쉽게 찾을 수 있도록 하는 • 책갈피(Bookmark) 기능등이 여기에 속함

Labeling system • Labeling system이란? • 정보를 분류하여 설계할 때, 분류된 항목을 지칭하는 명칭 • 즉, 그 내용을 예상할 수 있는 명칭을 레이블(label)이라고 • 한다. • 레이블에 대한 예상 내용과 실제 포함된 내용이 일치할 때, • 사용자는 효과적인 정보탐색이 이루어 질 수 있다.

Labeling system • 내비게이션, 제목, 링크, 색인어, 아이콘 레이블 • 내비게이션 레이블 : • 사이트의 정보 구조에 대한 기본적인 내비게이션을 위해, • 필요한 레이블 • Main, Home / Search, Find, Site Map, Contents, • Table of Contents / Contact, Contact Us, About US • / Help, FAQ 등

Labeling system • 제목 레이블 : • 정보의 계층구조에서 하나의 항목을 대표하는 제목, 또는 • 하나의 페이지 내에서 하나의 정보 이름으로 여러 정보를 • 구분하기 위한 것 • 링크 레이블 : • 문장 속에 내재된 링크(embedded link)에 사용되는 레이블 • 링크 레이블은 주변 문맥으로 의미를 쉽게 파악할 수 있기 • 때문에, 비교적 쉽게 사용

Labeling system • 색인어 레이블 : • 검색의 효율성을 증대시키기 위해, • 각각 페이지의 내용에 해당하는 키워드, 색인어들을 • <META> 태그를 이용해 HTML 문서에 입력하는 것 • 사용자들이 입력한 키워드가 타이틀 부분에 있을 수 있도록, • <TITLE>부분에 색인어 레이블을 넣는 것이 효과적이다. • ex) • <META name="keyword' content="제품안내, 컴퓨터, 노트북, 프린터, 스캐너“> • <TITLE>제품안내 - 컴퓨터, 노트북, 프린터, 스캐너</TITLE>

Labeling system • 아이콘 레이블 : • 이미지로 레이블의 기능을 하는 것 • 아이콘 레이블은 • 눈에 띠고 사용자에게 친숙할 수 있으며 • 전체적인 시각적 아이덴티티에 부합할 수 있으나, • 이미지가 내포하는 추상적인 의미를 표현하기가 어려움 • 아이콘 레이블은 텍스트 레이블과 함께 사용하는 것이 • 효과적

Library mobile website-IA • Organization system • Navigation system • Labeling system

Library mobile website • IA 적용 사례 - 도서관 모바일 웹사이트 • - 국내 스마트폰 가입자 수가 폭발적으로 증가함에 따라, • 사회 각 분야에서는 스마트폰과 연동된 서비스와 • 전용 웹 사이트가 늘어나고 있다. • - 이에 국내외 많은 도서관에서도 • 모바일 서비스를 준비 중이거나 시행하고 있다. • 애플리케이션뿐만 아니라 모바일 전용 웹 사이트를 이용한 • 모바일 서비스는 기존의 PC용 웹 사이트의 축소판으로 • 실시간 업데이트가 빠르다는 장점을 가지고 있다.

Library mobile website 도서관 모바일 웹사이트를 앞선 설명과 같은 ①Organization system ②Navigation system ③Labeling system의 3가지 영역으로 분석해 보겠다.

Organization system • 메인화면에서 그리드형태 or 리스트형태로 제공 • ☞ 명지대 도서관 모바일 웹사이트 : 그리드형태의 메인화면 구조

▪ 도서관의 모바일 웹사이트의 정보구조는 병렬구조이다. ▪ 정보의 흐름은 수평방향으로만 진행되며, 제공하고자 하는 메뉴가 많아질수록 사이트의 폭은 넓어지게 된다. ▪ 일반 PC용 웹사이트에서 볼 수 있는 글로벌 내비게이션, 로컬 내비게이션이 존재하지 않다.

Navigation system • 도서관의 모바일 웹사이트들은 'm'이나 ‘mobile'같이 • 모바일을 나타내는 표현을 • 웹 페이지의 URL에 서브도메인, 서브디렉토리로 구성하고 있다. • ☞명지대 도서관 모바일 웹사이트 :http://m.lib.mju.ac.kr/index.ax • 모바일 기기로 일반 PC용 웹사이트에 접속했을 때, • 모바일 웹사이트로 자동 연결해 주는 리디렉션(redirection)기능을 • 한다. • ☞명지대 도서관 모바일 웹사이트 : 의 경우는 • PC버전의 도메인으로 연결됨

모바일 웹사이트들은 병렬 정보구조이기 때문에, • 메인화면으로 돌아가는 홈버튼과 • 현재페이지의 위치를 알려주는 기능의 내비게이션바를 • 제공하고 있다. • ☞명지대 도서관 모바일 웹사이트 : 는 • 모바일 웹사이트 메인으로 돌아오는 버튼

Labeling system • 도서관의 모바일 페이지의 레이블들은 • 전문용어의 사용을 피하고, 일반적인 명칭을 • 사용한다. • 이미지로 시각적인 간결함과 함께 • 모호한 표현에 대해 알 수 있도록 텍스트를 함께 • 사용한다.

<인용 정보원> ▪ 최선경. 정보유형에 따른 멀티미디어 정보설계 연구 : 웹 기반 컨텐츠의 정보유형을 중심으로. 이화여자대학교 대학원;정보디자인과, 1999 (석사). ▪ 남재우, 김성희. 「도서관 모바일 웹사이트의 인포메이션 아키텍처에 관한 연구」. 『한국정보관리학회 학술대회 논문집』. 17. (2010.8) : 73~80.

-Thank you

Information Architecture