[info06]data visualization

KGIT 2014 F Fall Semester | JYLEE

INFORMATION DESIGNINFORMATIONDESIGN

http://info2014.jylee6977.com/tc




Information DesignKGIT 2014 Fall Semester | JYLEE





METAPHOR







마음을연구하는심리학자, 인지과학자, 신경생물학자, 행동경제학자=

사람은 뭔가 새로운 것에 맞딱 드리면 익숙한 것을 찾는다는 원칙




DATA VISUALIZATION







“우리는정보과부하나자료과다로부터비롯된모든괴로움에있는것을느낀다.좋은소식은그것에대한쉬운해결이있을지도모른다는것이고, 그것은우리의눈을더사용하는것이다.”David McCandless

“사람은 보는것만으로도데이터에대해많은것을알수있으며데이터의의미를이해하고그이야기를이해하곤한다.” 존 터키

“차트와그래프는단순히분석을위한도구가아니라생각의소통을위한전달체이며, 농담거리를전달하는매개이기도하다.” 네이선 야우







데이터시각화(data visualization)는데이터분석결과를쉽게이해할수있도록 시각적으로 표현하고전달하는과정을말한다. 데이터시각화의 목적은도표(graph)라는수단을통해정보를명확하고효과적으로전달하는 것이다(Friedman, 2008). 때로는한장의 그림이책한권의설명보다더설득력이있기때문이다. 우리속담에도백번듣는것보다한번보는게낫다고했다.

데이터 시각화 (빅데이터, 2012, 커뮤니케이션북스)

DATA VISUALIZATION







= 정보 시각화(information visualization)

정보 시각화는일반적으로소프트웨어 시스템의파일이나프로그램코드, 도서관의서지데이터베이스, 인터넷의관계네트워크등과같은대규모비수량정보를시각적으로표현하는것을의미한다.

DATA VISUALIZATION







= 과학적 시각화(scientific visualization)

과학적시각화는주로 건축학, 기상학, 의학, 생물학분야에서시간의흐름에따른변화를입체적으로표현하는것을말한다. 과학분야의연구결과를일반인이쉽게이해하도록그림으로표현하는사람을시각화과학자(visualization scientist)라고한다. 아름답게표현된행성이나은하계의사진은이들이만든작품이다.

DATA VISUALIZATION

= 정보그래픽 (info graphics) = 통계시각화 (statistical visualization)

http://datavisualization.ch/showcases/scientific-visualizations-on-ted/

http://datavisualization.ch/showcases/scientific-visualizations-on-ted/







DATA VISUALIZATION

데이터시각화두가지관점

• 마인드맵• 뉴스표현• 데이타표현• 관계들의표현• 웹사이트들의표현• 기사와리소스들• 툴과서비스

통계적그래픽 (statistical graphics)

주제지도학 (thematic cartographic)

프랜들리 (2008)




01. Data Visualization Process







정보조직화단계 사용자의정보인지에관여혼돈의상태로존재하는데이터를분류하고배열하고조직화하여질서를부여

정보시각화단계사용자의정보지각에관여보다효율적으로정보전달을위해시각, 청각, 촉각, 미각, 후각의감각기관에 최적의자극을제시하는방법제시

상호작용단계정보와사용자간의상호작용측면의사용자경험을디자인정보의인지적요인뿐만아니라지각적요인을함께활용정보시각화단계와밀접하게연동되면서동시에입력기술의특성도함께고려

ETRI의 시각화 절차의 단계 분류

http://ko.wikipedia.org/wiki/ETRI







데이터Data

정보Information

지식Knowledge

지혜Wisdom

제작자/디자이너

사용자

연구/제작/수집/발견 표현/조직화 대화/이야기/통합 사고/평가/해석/회상

자극Stimulus







Information Design

Info Graphics

Data Visualization

Data







사실 통계 시각화 비교 컨셉 스토리 메세지

Data Visualization

Information Visualization

Information Design

누구를대상으로, 어떻게, 무엇을




02. Data Visualization Tools







2.1 데이텨통계를 활용한 Floating Chart Program www.gapminder.org

DATA VISUALIZATION TOOL

http://www.bit.ly/XsIXIE

http://www.bit.ly/XsIXIE







FLOWING DATA: 공개데이터를활용한 FLOWING CHART


http://www.flowingdata.com/







DATA.GOV: 공개데이터를활용한 국가 DATA


data.gov

https://explore.data.gov/Federal-Government-Finances-and-Employment/Data-Center-Closures-West/fkmu-qp3f

https://explore.data.gov/Federal-Government-Finances-and-Employment/Data-Center-Closures-West/fkmu-qp3f







DYGRAPHS : 자바스크립트를활용한사용자중심그래프 http://dygraphs.com/


http://dygraphs.com/

http://dygraphs.com/







InstantAtlas : MAP DATA를활용한화려한 시각화


http://www.instantatlas.com/







Timeline : 시간흐름, 타임라인을만들어주는 Open Source 시각화도구


http://www.simile-widgets.org/timeline/







Exhibit : MIT에서만든 Open Source Interactive Map


http://www.simile-widgets.org/exhibit/







Modest Maps : 웹사이트내에서 쉽게추가하여 쓸 수 있는 가벼운 Map


http://modestmaps.com/

http://modestmaps.com/







Leaflet: HTML5와 CSS3의 wrapper를 활용한 Open Street Map


http://leafletjs.com/







Visual.ly: 아주쉽게데이터 시각화를할수있는툴


http://create.visual.ly/







Better World Flux : 심난한전세계적 데이터를좋은 세상을만들자는 Tool


http://www.betterworldflux.com/







jqPlot : 차트나플롯 등다양한시각화방법을 제공하는 사이트


http://www.jqplot.com/







Dipity : 인터랙티브한타임라인을만들어 주는 TOOL


http://www.dipity.com/







D3.js : 다양한데이터를 이용하여데이터를 실시간으로 시각화하는자바스크립트툴킷


http://d3js.org/







Google Charts: 구글이 제공하는 다양한차트프로그램


https://developers.google.com/chart/interactive/docs/

https://developers.google.com/chart/interactive/docs/







Polymaps: 데이트시각디자이너들이 직접참여하여만든아름다운 MAP들의향연


http://polymaps.org/







Kartograph: 자바스크립트와 SVG만을활용한아름다운 맵


http://kartograph.org/







iCharts: Google Docs에있는데이터를활용하여다양한 시각화적용


http://www.icharts.net/




03. Data Visualization + Infographics Samples







Country Codes of the World

DATA VISUALIZATION Samples

http://www.historyshots.com/OtherArtists/4015.cfm







Flags as Infographics

DATA VISUALIZATION SAMPLES

http://www.newsdesigner.com/archives/002152.php







Independent: Infographic

DATA VISUALIZATION SAMPLES

http://www.kottke.org/06/07/independent-infographic




다음주에 계속

하나의아름다운 DATA VISUALIZATION을만들어와보세요

[info06]data visualization

Design

tooldata visualization

comdata visualization

svgdata visualization

statistical visualization

data visualization process

data visualization tools

comtcflowing data

comtcbetter world flux