KGIT 2014 Fall Information Design Class by JYLEE

1. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
InformationDesign
KGIT 2014 Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN

2. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
METAPHOR

3. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
마음을연구하는
심리학자, 인지과학자, 신경생물학자, 행동경제학자=
사람은뭔가새로운것에맞딱드리면익숙한것을찾는다는원칙

4. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc

5. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc

6. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc

7. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
DATA VISUALIZATION

8. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
“우리는정보과부하나자료과다로부터비롯된모든괴로움에있는것을느낀다.좋은소식은그것에대한쉬운해결이있을지도모른다는것이고, 그것은우리의눈을더사용하는것이다.” David McCandless “사람은보는것만으로도데이터에대해많은것을알수있으며데이터의의미를이해하고그이야기를이해하곤한다.”
존터키 “차트와그래프는단순히분석을위한도구가아니라생각의소통을위한전달체이며, 농담거리를전달하는매개이기도하다.”
네이선야우

9. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
데이터시각화(datavisualization)는데이터분석결과를쉽게이해할수있도록시각적으로표현하고전달하는과정을말한다. 데이터시각화의목적은도표(graph)라는수단을통해정보를명확하고효과적으로전달하는것이다(Friedman, 2008).
때로는한장의그림이책한권의설명보다더설득력이있기때문이다.
우리속담에도백번듣는것보다한번보는게낫다고했다.
데이터시각화(빅데이터, 2012, 커뮤니케이션북스)
DATA VISUALIZATION

10. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
= 정보시각화(informationvisualization)
정보시각화는일반적으로소프트웨어시스템의파일이나프로그램코드, 도서관의서지데이터베이스, 인터넷의관계네트워크등과같은대규모비수량정보를시각적으로표현하는것을의미한다.
DATA VISUALIZATION

11. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
= 과학적시각화(scientificvisualization)
과학적시각화는주로건축학, 기상학, 의학, 생물학분야에서시간의흐름에따른변화를입체적으로표현하는것을말한다. 과학분야의연구결과를일반인이쉽게이해하도록그림으로표현하는사람을시각화과학자(visualizationscientist)라고한다. 아름답게표현된행성이나은하계의사진은이들이만든작품이다.
DATA VISUALIZATION
= 정보그래픽(info graphics)
= 통계시각화(statistical visualization)

12. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
DATA VISUALIZATION
데이터시각화두가지관점
• 마인드맵
• 뉴스표현
• 데이타표현
• 관계들의표현
• 웹사이트들의표현
• 기사와리소스들
• 툴과서비스
통계적그래픽(statistical graphics)
주제지도학(thematic cartographic)
프랜들리(2008)

13. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
01. Data Visualization Process

14. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
정보조직화단계
사용자의정보인지에관여
혼돈의상태로존재하는데이터를분류하고배열하고조직화하여질서를부여
정보시각화단계
사용자의정보지각에관여
보다효율적으로정보전달을위해시각, 청각, 촉각, 미각, 후각의감각기관에최적의자극을제시하는방법제시
상호작용단계
정보와사용자간의상호작용측면의사용자경험을디자인
정보의인지적요인뿐만아니라지각적요인을함께활용
정보시각화단계와밀접하게연동되면서동시에입력기술의특성도함께고려
ETRI의시각화절차의단계분류

15. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
데이터
Data
정보
Information
지식
Knowledge
지혜
Wisdom
제작자/디자이너
사용자
연구/제작/수집/발견
표현/조직화
대화/이야기/통합
사고/평가/해석/회상
자극
Stimulus

16. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
Information Design
Info Graphics
Data Visualization
Data

17. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
사실
통계
시각화
비교
컨셉
스토리
메세지
Data Visualization
Information Visualization
Information Design
누구를대상으로, 어떻게, 무엇을

18. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
02. Data Visualization Tools

19. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
2.1 데이텨통계를활용한Floating Chart Program www.gapminder.org
DATA VISUALIZATION TOOL

20. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
FLOWING DATA: 공개데이터를활용한FLOWING CHART
DATA VISUALIZATION TOOL

21. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
DATA.GOV: 공개데이터를활용한국가DATA
DATA VISUALIZATION TOOL

22. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
DYGRAPHS: 자바스크립트를활용한사용자중심그래프http://dygraphs.com/
DATA VISUALIZATION TOOL

23. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
InstantAtlas: MAP DATA를활용한화려한시각화
DATA VISUALIZATION TOOL

24. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
Timeline: 시간흐름, 타임라인을만들어주는Open Source시각화도구
DATA VISUALIZATION TOOL

25. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
Exhibit: MIT에서만든Open Source Interactive Map
DATA VISUALIZATION TOOL

26. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
Modest Maps: 웹사이트내에서쉽게추가하여쓸수있는가벼운Map
DATA VISUALIZATION TOOL

27. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
Leaflet: HTML5와CSS3의wrapper를활용한Open Street Map
DATA VISUALIZATION TOOL

28. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
Visual.ly: 아주쉽게데이터시각화를할수있는툴
DATA VISUALIZATION TOOL

29. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
Better World Flux: 심난한전세계적데이터를좋은세상을만들자는Tool
DATA VISUALIZATION TOOL

30. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
jqPlot: 차트나플롯등다양한시각화방법을제공하는사이트
DATA VISUALIZATION TOOL

31. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
Dipity: 인터랙티브한타임라인을만들어주는TOOL
DATA VISUALIZATION TOOL

32. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
D3.js: 다양한데이터를이용하여데이터를실시간으로시각화하는자바스크립트툴킷
DATA VISUALIZATION TOOL

33. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
Google Charts: 구글이제공하는다양한차트프로그램
DATA VISUALIZATION TOOL

34. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
Polymaps: 데이트시각디자이너들이직접참여하여만든아름다운MAP들의향연
DATA VISUALIZATION TOOL

35. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
Kartograph: 자바스크립트와SVG만을활용한아름다운맵
DATA VISUALIZATION TOOL

36. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
iCharts: Google Docs에있는데이터를활용하여다양한시각화적용
DATA VISUALIZATION TOOL

37. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
03. Data Visualization + Infographics Samples

38. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
Country Codes of the World
DATA VISUALIZATION Samples

39. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
Flags as Infographics
DATA VISUALIZATION SAMPLES

40. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
Independent: Infographic
DATA VISUALIZATION SAMPLES

41. KGIT 2014 F Fall Semester | JYLEE
INFORMATION DESIGN
INFORMATIONDESIGN
http://info2014.jylee6977.com/tc
다음주에계속
하나의아름다운DATA VISUALIZATION을만들어와보세요