UIstudy.net <정보> 북스터디 발표 자료

1. UIstudy.net 북스터디 발표 자료
정보의 조직화
김선희(dipred@gmail.com)

2. 정보의 조직화
1. 정보 조직화의 정의
2. 정보 분류하기
3. 정보 배열하기
4. 정보 관계 맺기: 데이터 재배열
5. 정보 설계

3. 들어가며,
<정보디자인 교과서>
• 2008. 4월 초판
• 참고서적 발행시기 : 1983~2007년

4. 1. 정보 조직화의 정의
인간이 혼자 존재할 수 없듯이
정보는 하나만으로 존재할 수 없다.
하나의 정보는 관계있는 다른 정보를 불러오게 된다.
바로 그런 관계를 찾아내는 것이 중요하다.
_마쓰다 유키마사
사용자는 복합적이며 사회적이다.
정보도 마찬가지다.
_캘빈 무어즈

5. 1. 정보 조직화의 정의
좋은 정보디자인이란?
정보를 사용자에게 정확하게 효율적으로 전달하는 것.
정보의 조직화란?
정보를 사용자와 사용 목적, 사용 환경에 맞도록
분류하고 재배열하는 과정.

6. 1. 정보 조직화의 정의
정보조직화의 과정(선택과 집중)
1. 데이터(Data) : 자료 또는 논거
2. 분류하기(Classifing) : 유사한 것끼리 묶기
3. 배열하기(Arranging) : 의미에 따라 배치
4. 관계맺기(Organizing) : 재배열
⇒ 정보의 가치와 유용성 증대.
정보에 대한 관점과 정보에 담긴 이야기도 변화.

7. 1. 정보 조직화의 정의
정보조직화의 과정(선택과 집중)
이미지 출처 : http://www.pnas.org/content/105/31/10687/F4.expansion.html

8. 1. 정보 조직화의 정의
정보조직화의 과정(선택과 집중)
각 행동에 주체를 연결시키기 비슷한 패턴으로 X 표시가 나타나는 줄들 각 그룹에 해당하는 행동과 주체들을
을 모아서 표 아래쪽에 한데 묶어 놓는다. 바탕으로, 적당한 그룹 이름을 지정
한다.
출처 <멘탈모델>:http://www.flickr.com/photos/rosenfeldmedia/sets/72157603511616271/with/2125039157/

9. 1. 정보 조직화의 정의
정보조직화의 과정
1. 데이터(Data)
2. 분류하기(Classifing)
3. 배열하기(Arranging)
4. 관계맺기(organizing)
⇒ 정보의 가치와 유용성 증대.
정보에 대한 관점과 정보에 담긴 이야기도 변화.

10. 2. 정보 분류하기
분류기준의 요건
• 정보 디자인의 목적과 용도(관점)를 분명히 파악하고 정한다.
• 가중치가 동등해야 하고 분류의 결과가 논리적이고 명확해야
한다.
잘 분류된 정보는 정보 디자인으로 조직하고 재구성하는 노력을
덜어준다.

11. 2. 정보 분류하기
ex1) 린네의 동식물 분류
: 생물을 상호 간의 차이 및 유사점
이미지 출처 : http://www.gabotsoc.org/Graphics/Plant_Kingdom.gif

12. 2. 정보 분류하기
ex2) 듀이의 십진분류법
: 도서, 주제별 10개 분야로 나누고
그 아래 자릿수는 하위 카테고리 표시.
이미지 출처 :
http://t3.gstatic.com/images?q=tbn:ly53EXowduHt7M:http://cfs7.tistory.com/i
mage/30/tistory/2008/09/09/15/15/48c61482c4640

13. 3. 정보 배열하기
리처드 솔 워먼의 LATCH
정보는 무한한 반면, 그것을 조직화하는 방법은 제한되어 있다
• 위치(Location)
• 문자(Alphabet)
• 시간(Time)
• 카테고리(Category)
• 위계(Hierachy)
이미지 출처 :
http://www.aiga.org/resources/content/1/3/1/9/images/1_RSWportrait.jpg

14. 3. 정보 배열하기
위치
다양한 출처나 장소에 기반을 둔 정보의 조사・비교
ex) 화산지대, 특정 동식물 분포.
진료과목, 선거 득표.
이미지 출처 : http://politicalmaps.org/wp-content/uploads/2008/11/usa-
today-interactive-2008-election-map.png

15. 3. 정보 배열하기
문자
방대한 정보. 이용자의 범위가 넓어 카테고리나 지역별 분류가
효과적이지 못한 경우.
• 정보의 차별성과 의미전달은 떨어짐.
• 타 기준분류 후, 하위분류 시 사용
ex) 전화번호부
이미지 출처 :
http://www.bloomberg.com/markets/st
ocks/movers_index_dow.html

16. 3. 정보 배열하기
시간
• 일정 기간에 일어난 사건을 조직화
• 정보의 변화를 발견하고 비교 시 유용
ex) 개인/국가의 역사, Twitter의 타임라인,
블로그의 글순서, 쇼핑몰의 신상품순,
주요 경제지표 그래프
이미지 출처 : http://www.kitco.com/images/live/gold.gif

17. 3. 정보 배열하기
카테고리
• 정보의 속성에 따른 분류에 적합
• 중요도나 주제가 서로 유사한 정보
• 색상 등으로 고유특성을 부여
ex) 백화점 상품종류별 분류,
블로그의 카테고리.
Twitter의 List,
지하철 노선도
이미지 출처 : http://www.mta.info/nyct/maps/sub1a.gif

18. 3. 정보 배열하기
위계
• 데이터의 값이나 중요도의 순서
• 정보에 가중치나 우선순위를 부여
• 단위나 수치로 표현
ex) 각종 순위/차트(인기/판매),
경제지표 그래프
이미지 출처 : http://blog.daum.net/riskmgt/8926025

19. 3. 정보 배열하기
정보의 구조나 조직화, 분류방법에 대한 이해가 필요하다.
정보를 조직화하는 기준
• 데이터를 어떻게 바라보고 있는가?
• 데이터로부터 무엇을 말하고자 하는가?
• 데이터가 사용되는 정황은 어떠한가?
• 어떻게 데이터를 재배열하는가?

20. 3. 정보 배열하기
자동차 사례 연구 p.86

21. 3. 정보 배열하기
정보사용자, 사용목적, 사용환경에 맞도록 다섯 가지 분류방법
을 복합시켜 사용할 수 있다.
위치+시간, 위계+범주처럼 분류방식을 복합하여, 새로운 발견
을 이끌어내고 하나의 이야기를 만들어낼 수 있다.

22. 3. 정보 배열하기
이미지 출처 : http://blog.daum.net/riskmgt/8926025

23. 3. 정보 배열하기
이미지 출처 : http://blog.daum.net/riskmgt/8926025

24. 4. 정보 관계 맺기(데이터 재배열)
정보의 재배열이란?
• 데이터에 의미를 부여하는 가장 기본적인 과정.
• 분류된 데이터를 정보 수용자가 인식하기 쉽
게 패턴화하는 것.
ex) p89, 90

25. 5. 정보설계
정보 설계의 개념(리처드 솔 워먼, 1970)
• 기술, 그래픽 디자인, 글쓰기 및 저널리즘의 결합.
• 정보의 구조와 조직화, 재배치 포괄.
⇒ 질서와 관계생성
• 정보설계가 정보전달과정에서 하는 역할과 기능은 인지 심리
학 관점에서 이해 가능.
※ 인지심리학이란 인간이 지식을 획득하는 방법, 획득한 지식
을 구조화하여 축적하는 메커니즘을 주된 연구대상으로 한다.

26. 5. 정보설계
이미지 출처 : http://madang.ajou.ac.kr/~yjkim/cp.jpg

27. 5. 정보설계
정보설계가란?
• 데이터에 내재한 패턴을 조직화하여 복잡한 것을 명료하게
만드는 사람.
• 사용자가 필요한 지식을 쉽게 찾을 수 있도록 정보의 구조 또
는 맵map을 창조하는 사람.
ex) BusinessWeek Cover Story, 2004.5.14
The Power Of Design(IDEO 사례)
http://www.storysearch.co.kr/story?at=view&azi=94406

28. 5. 정보설계
정보 설계와 인지 작용
지각(Perception)
• 외부의 자극을 수용
• 정보디자인 영역(정보의 접근과 이해)
인지(Cognition)
• 인식・기억・추리・비교・판단을 통해 정보를 이해하는 사고과정.
• 정보 설계 영역(정보검색 및 관리)
이미지 출처 : http://gumbereyehospital.com/blog/?p=67 , http://www.sherlock-holmes.com/wear.htm

29. 5. 정보설계
정보 설계의 핵심은 사람들이 알고자 하는 것(목적)을 바로 답할
수 있도록 정보를 조직하는 것.
ex) 검색결과
사용자 입장에서 정보의
체계와 구조를 만들어야
하며, 사용자에 대한 이해가
선행되야 한다.

30. 5. 정보설계
웹에서의 정보 설계(루이스 로젠펠드와 피터 모빌)
• 정보 체계 내의 네비게이션 구조,
레이블링, 조직화를 의미한다.
• 컨텐츠에 직관적으로 접근하고 업무 처리가
용이하도록 정보 공간을 설계
• 사용자가 정보를 쉽게 찾고 관리할 수 있게
웹사이트를 분류하고 조직화하는 분야

31. 5. 정보설계
정보 조직화 측면에서의 웹의 정보 설계
⇒ 묶음, 위계, 링크, 표식, 네비게이션으로 구성.
웹사이트의 성공 여부는 우수한
콘텐츠,
잘 짜인 정보 체계와 구조에 좌우됨

32. 5. 정보설계
정보의 묶음(Chunk)
유사하거나 관련있는 정보를 몇 개의 덩어리로 묶은 것.(기억 용
량의 한계)
ex) 책/chapter, 웹/메뉴,하부 페이지
• 방대한 정보를 다루는 웹에서는 적은 수로 묶기 어려움.
• 해당 분류 체계 직관적인가도 중요(사용자 관점)

33. 5. 정보설계
정보의 위계
• 사용자가 쉽게 정보구조에 친숙해질 수 있다.
• 길을 잃을 염려가 낮아진다.
• 사람들의 심성모형mental model에 가까운 구조

34. 5. 정보설계
웹에서 정보 위계를 구성할 때 고려할 사항
• 정보의 위계는 서로 배타적인 정보의 묶음으로구성되야 한다.
• 다른 카테고리 내의 정보는 서로 중복되지 않게.
• 정보의 위계에서 폭(정보묶음)과 깊이(단계)를 고려
• 위계에 지나치게 얽매이지 말아야 한다.
링크, 검색 등 다른 정보 경로도 고려.

35. 5. 정보설계
링크(Link)
• 비선형적 구조
• 정보의 유연성과 확장성을 강화.
• 정보를 복잡하게 만들고 사용자를 혼란에 빠뜨릴 수 있음.
⇒ 링크는 조직화된 정보의 위계에서 크게 벗어나지 않는 범위
에서 이루어져야 하며
정보의 맥락과 사용자의 편의에 따라 유연하게 적용해야.

36. 5. 정보설계
정보의 표식(Label)
• 조직화된 웹페이지에서 정보의 내용을 쉽고 간결하게 전달할
수 있는 이름(제목)이 중요.
Cf) MS 웹사이트
• 표식의 목표는 정보를 효과적으로 알리는 것.
• 정보의 제목과 표식은 매체에 상관없이 사용자에게 정보의
특성 ・ 구조 ・ 해당 카테고리 안에서의 정보 경로를 가장 명확
하게 보여주는 도구이다.

37. 5. 정보설계
표식 작성 시 유의사항
• 정보디자인의 틀 안에서 일관성 유지.
• 짧은 문구, 친숙하고 함축적인 표현
• 불확실하고 모호한 표현은 배제

38. 5. 정보설계
네비게이션(Navigation)
• 필요한 정보의 길을 찾고 경로를 보여주는 일체의 장치와
도구
• 정보의 속성과 사용자의 인지에 일치되도록 구성하는 것이
중요.

39. 5. 정보설계
방대한 정보를 가진 웹사이트에서 고려할 것
• 일관성있는 네비게이션
• 페이지마다 현재 위치를 표시
• 돌아오는 길도 제공한다.
Ex) 취소버튼
• 찾고자 하는 정보나 페이지에 도달하면, 이를 알려준다.
Ex) 검색결과
• 정보가 많고 경로가 복잡할 땐 검색기능 제공

40. 참고
<검색2.0 발견의 진화>
• 원서 : 2006
• 번역본 : 2007년

41. 참고
P86
정보 상호작용의 복잡성은 전형적인 인간-컴퓨터 상호작용 모델
에서는 잘 표현되지 않는다.
그에 비해 HII(Human information Interaction, 인간 정보 상
호작용) 접근법은 정보처리의
상호 운용성을 위해 형태와 기능에 대한 제어를 어느 정도 희생
하는 네트워크형 정보 시스템에서 최선이다.
그러한 환경에서 사용자는 다양한 기기와 인터페이스를 통해 정
보 개체를 검색하고 상호작용할 수 있다. 이제 인터페이스보다
정보가 중요해지고 있는 것이다.

42. 참고
HII(Human information Interaction) : 인간 정보 상호작용
• 1995년에 나흠 거숀(Nahum Gershon)
• 인간과 정보를 연결하는 매체와 관계없이 인간이 어떻게 정
보와 상호작용하고 관련되며,
정보를 어떻게 처리하는가를 보여주기 위해 만든 용어.

43. 참고
<이 사람은 왜 정리에 강한가>
• 사토 카시와 지음
• 오프비트님의 추천서