시각화를 배우고 정리합니다

▶Design :: 데이터시각화와의 사례 - 나이팅게일과, P&G의 데이터시각화 이번 글에서 살펴볼 내용은 데이터시각화(Data Visualization)의 사례이다. 많은 데이터시각화 사례들이있겠지만, 그중에서도 오늘은 나이팅게일의 로즈다이어그램(Rose diagram)과 P&G의 비즈니스스피어(Business Sphere)에 대해서살펴보고자한다. 데이터시각화의사례 - 나이팅게일의 로즈다이어그램(Rose diagram) 언뜻보면 파이차트와 비슷한 로즈다이어그램. 그런데 조금만 살펴보면 파이차트와는 분명히 어딘가 분명히 다르다는 것을 눈치챌 수 있었을것이다. 파이차트가 데이터의 퍼센테이지를 각도로 표현해내는 반면, 로즈다이어그램(나이팅게일차트)는 여기에 더하여 ‘면적’에 다라 데이터를 비교해볼 수 있도록..

▶Design :: 아름다운시각화의 조건 이글에서는 노아일린스키(2012)가 제시하는 시각화에 있어 아름다움의 네 가지 기준, 그리고 아름다움을 부여하는 세 가지 방법에 대해 함께 살펴보고 이에대해 생각을 나눠보고자 한다. [ The Data Centric Universe, janwilem.tup ] 아름다운시각화란 무엇인가? 인포그래픽, 데이터시각화, 정보디자인 … 정말 다양한 이름의 '시각화'가 주변에서 이루어지고 있다. '시각화'라는 이름때문인지, 이것이 오로지 디자이너에게만 열려있는 것이라고 생각하는 경우가 많은데 사실 그렇지만은 않다. 우리 주변에는 효과적인 정보전달을위해 고안되어 제작된 것들이 굉장히 많다. [ mendeleev 의 화학원소주기율표 ] 《아름다운시각화》의 편집을 한 노아일린스키..

선택적 주의[Selective attention]선택적 주의란, 사람의 시선을 조정하는 인지적 메커니즘을 말한다. 우리가 바라보는 이미지로부터 감각데이터를 발견했을 때탐지하고 주의를 기울이게 되는 것을 말한다. ⓒkaterha 주의[attension] 외부의 자극에의해 작용하는 상향적 처리방식을 통해 선주의적으로 생기거나사용자 내부의 의식적인것에 하향식 처리방법으로 생기는 것이다. ⓒJenavieveMarie : 디자인에 대비/ 움직임을 적용함으로써 상향식처리과정을 통해 주의를 일으키거나연속되는 과정을 설명하기 위해 숫자나 붙임말로 설명을 해주는 등 하향식 처리를 통해 주의를 유도하는 것이 좋다. 자료: 코니말라메드 지음, 오병근 옮김, 『디자이너를 위한 시각언어』, 예경, 2011 ⓒco-laborat..

▶ICT노트 :: 반응형웹을 만드는 기술은? 이번 포스팅에서는 반응형웹[Responsible Web]을 살펴보고자합니다^^ 반응형웹은 PC, TV뿐만아니라 노트북, 태블릿PC, 스마트폰에 이르기까지다양한 디스플레이크기를 가진 디바이스들이 등장하게되면서사용자에게 '최적의 사용환경'을 제공해주고자하는 것이 목적입니다. 가장 좋은 방법은 아무래도각 디바이스의 화면 크기에 최적화된 디스플레이를제공해주는 것일 텐데요~ ⓒmrJasonWeave스마트폰만 놓고 생각해보더라도 디스플레이 크기가 굉장히 다양하다는 것을어렵지 않게 알 수 있습니다. 미디어쿼리[Media Queries] 미디어쿼리는 웹브라우저가 해석할 CSS코드를 해상도/비율로 분기처리 하는 규칙.디바이스정보를 서버나 클라이언트에서 확인할 필요없이 CSS만..

▶프로젝션맵핑[Projection Mapping] 이해하기 '프로젝션맵핑이라는 기술이 다양한 분야에서 자주 활용되고 있는데요 이를 접한 분들이 많아지면서 '프로젝션맵핑'에 대한 관심도 더 높아지고있습니다. 그래서 오늘은 이 '프로젝션맵핑'이 무엇인지에 대해 살펴보려고합니다.^^ 프로젝션 맵핑[Projection Mapping] Projection Mapping은 스크린으로 사용될 외벽이나 실내공간, 오브제 등이 가지고 있는 재질, 컬러, 레이아웃 등을 고려해 디자인 된 영상을 프로젝터에 의해 빛을 영사시켜 새로운 증강현실을 만들어 내는 것 워들로 보는 프로젝션 맵핑 위키피디아에 정의된 프로젝션 맵핑에 대한 개념을 워들을 이용해 시각화를 해보았습니다. objects, video, software, surf..

▶Sublime Text3 설치 방법 서브라임텍스트3 설치 방법 오늘은 많은분들이 사용하고 계시는 sublimetext 설치방법에 대해서 소개하고자 합니다. 먼저 SublimeText3를 다운받습니다. 먼저 SublimeText3를 다운받습니다. 다운로드페이지 바로가기 위 사진 속 표시해둔 부분에서 운영체제에 맞는 버전을 다운로드하시면 됩니다. 저는 윈도우64비트를 선택해서 다운받았습니다. 다운로드는 1분도 채 걸리지않아서 부담없이 받으실 수있습니다.^^ 다운받으신 후 설치프로그램을 열면 이런 화면을 보실 수있습니다. 특별히 세팅을 해야할 부분은 없고 NEXT버튼을 누르고 설치를 해주면 됩니다. 텍스트를 다루는 프로그램인 만큼 한글설정을 꼭 해주어야겠지요?^^ 설치를 잘 마치셨다면 한글설정을 하는 방법을..

▶ 데이터시각화 이해하기#1 데이터시각화란? 데이터시각화(data visualization)에 대해 몇가지 파트로 나누어 자세하게 살펴보려고 합니다. 먼저, 데이터시각화의 정의부터 살펴보겠습니다. 데이터시각화[Data Visualization] 정의 데이터 시각화는 데이터 분석 결과를 쉽게 이해할 수 있도록 도표라는 시각적 수단을 통해 정보를 효과적으로 전달하는 것을 말한다. 백과사전에서 '데이터시각화'를 설명하고 있는 내용입니다. 여기서는 '데이터시각화'라는 단어 자체에 주목하여 의미를 해석하고 있습니다. 이번에는 위키백과[영문]에서 데이터시각화를 어떻게 설명하고있는지 '워들'을 이용하여 살펴보겠습니다. . 위키백과에서는 데이터시각화를 '시각화, 정보'라는 중심개념을 바탕으로 설명하고있습니다. 우리가 ..

이번 포스팅에서는 [게슈탈트의 법칙]에 대해서 알아보고자 합니다. 게슈탈트의 법칙[Gestalt Laws]사람이 형태를 지각할 때, 각 물체들이 공통적인 속성을 갖고 있는 경우유사한 시각요소가 있는 것 끼리 묶어서 보려는 경향 또는, 조금 더 가까이 있는 것들을 하나로 묶어 보려고 하는 경향 게슈탈트 법칙은 디자인의 모든 분야에서빠질 수 없는 매우 중요한 원리이자 활용범위가 넓은 조형이론이다. 게슈탈트법칙의 원리는 [근접성, 유사성, 연속성, 폐쇄성]크게 4가지 원리로 나누어 볼 수가 있습니다. 근접성의 원리근접성의 원리는 서로 가까이 있는 것들은 하나로 묶어서 인식하게 된다는 원리입니다.위 사진에서도 초록색 수직선 6개가아니라, 3개의 두줄로된 선으로 인식하게 됩니다. 유사성의 원리유사성의원리는 비슷한..

[유용한 PPT상식, PPT이미지 삽입 후 투명도 조절하기]이번 포스팅에서는 PPT에 넣은 이미지의 투명도를 조절하는 방법입니다. 오늘 PPT에서 만들어볼 이미지입니다.이렇게 이미지위에 텍스트를 삽입할 때 이미지의 투명도를 조절하면텍스트가 훨씬 잘 보이게됩니다. 그런데 PPT에서 이미지를 선택한 후 [그림서식]을 눌러보면 당췌 [투명도 조절기능]을 찾아볼 수 없습니다. 먼저 [삽입 - 도형]을 클릭하여 원하는 크기의 도형을 그려줍니다. 도형을 우클릭해서 [도형서식]을 들어갑니다.설정창에서 [채우기 - 그림 또는 질감 채우기]를 선택합니다.그리고 [다음에서 삽입: 파일]로 원하는 사진을 불러옵니다.이렇게 하면 도형안에 원하는 사진이 채워지게 됩니다. 그리고 마지막으로 오늘 최종 목표인 [투명도 조절]을 해..

오늘 주제는 프레지에서 [애니메이션 기능 사용하기] 입니다.프레지하면 흔히 [줌 in/out]기능을 먼저 떠올리게되는데요프레지는 패스기능과 함께, 참 유용한 애니메이션 기능을 갖추고 있습니다. 예제 위해서 프레지에서 제공하는 콘텐츠를 불러왔습니다.우선 가장 먼저 [패스설정]을 누르시고, 그 속에서 1옆의 [별표]를 클릭하시면 바로 애니메이션 설정 창으로 이동이 됩니다. 보여지기 원하는 순서대로 콘텐츠를 클릭하면 작은 별모양과 함께 순서를 알 수 있는 번호가 뜨게 됩니다.어느정도 마쳤거나 이제까지의 상황을 보려면 오른쪽 위 부근에 [▶:play]를 누르면 됩니다.