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

▶프로세싱 활용노트 ③ - loadStrings(), arrayList() loadStrings()활용하기loadStrings()의 문법, 기능 및 활용, 예시 순으로 살펴보려고합니다. loadStrings()의 SyntaxloadStrings()의 Syntax는 크게 두 가지로 나눌 수 있다. loadStrings(filename);loadStrings(reader); loadStrings()의 기능 및 활용loadString()는 파일의 내용을 읽어 들여 '문자열 배열'형식으로 리턴합니다. loadStrings(파일이름)형태와 같이 파일이름이 파라미터로 사용하고자 할 경우에는 작업 진행이전에 현재 작업중인 Processing파일의 sketch폴더 내에 위치한 'data'폴더 내에 불러오고자하는 데이터..

▶프로세싱활용노트② ambientLight(), directionalLight() 이번 글에서 살펴볼것은 프로세싱의 함수중에서 조명(light)관련 내용입니다. 이번 글은 레퍼런스와 샘플코드, 그리고 결과이미지를 정리하는 단순히 정리하는 정도에 그치기보다, 실제 프로세싱에서 조명기능을 활용하는데 필요한 가~~장기초적인 개념부분도 포함하고자 했습니다. ambientLight() - 주변광 ambientLight()함수를 이야기하기전, 이 용어의 사전적 의미를 먼저 살펴보려고합니다. 'ambient'라는 단어는 '주위의, 잔잔한'이라는 뜻을 가지고 있으며, 이 ambient와 Light의 합성어인 ambientLight는 국어사전에는 나와있지않지만 '주변광'으로 용어를 이해할 수 있을 것 같습니다. 주변광이..

▶함께배우는 프로세싱 ::Complex modules in a grid 이번 글에서는 generative design에서 제공하고있는 예제를 살펴보려고합니다. 이번 예제는 Complex modules in a grid이며 마우스 움직임에 따라 그리드형태로 이루어진 shape의 모습이 바뀌게 되는 구조입니다. P.2.1.3 Complex modules in a grid의 특징은 그리드 구조가 for구문의 중첩으로 형성되는데 이거 그 안에서도 또한 번 for구문을 활용하여 특정모양을 중첩시킨다는 것입니다. 예제의 결과는 이렇게 for()구문의 중첩을 활용한 그리드의 형태로 나타나게 됩니다. 그리드 내의 타일 크기는 화면의 너비와 미리 설정하는 전체타일 개수에 의해 설정됩니다. 처음에는 한개의 원이 그리드형태..

​ ▶프로세싱 에러해결 ① You might be missing a library. 이번 살펴볼 것은 프로세싱에러 중에서도 '라이브러리설치'와 관련된 에러입니다. 이 에러가 발생한 경우,다음과 같은 형태의 에러메시지를 보게 됩니다. The packages [설치하고자 하는 라이브러리이름] does not exist. You might be missing a library. No library found for [설치하고자 하는 라이브러리 이름]. core.(상황에 따라 다를 수 있음) Libraries must be installed in a folder named "libraries" inside the 'sketchbook'folder. 또한 프로세싱 하단부에 있는 콘솔창에도 에러메시지가 뜨게되는 되..

▶프로세싱활용노트① - 나머지연산(모듈로, modulo) 이해하기 이번 글에서는 나머지연산(모듈로, modulo)에 대해서 정리해보려고 합니다. 나머지연산은 계수 연산자(modulus operator)에 관련된 내용이기때문에 프로세싱에서의 계수연산자에 대해 간략하게 살펴보고 시작하겠습니다. 계수는 특정 구간(스크린상의 도형, 배열 범위 안의 인덱스 값 등) 안에 수를 머물도록 하는 대단히 유용하면서 매우 단순한 개념으로, 나누기를 처음 배울 때 그 명칭을 칭하지 않고 개념을 배우는 것과 같다. 계수 연산자는 한 수를 다른 수로 나누었을 때 그 나머지를 계산하며, 정수와 실수에서 모두 사용할 수 있다. 여기서 간단한 나눗셈 개념이 적용됩니다.(매우간단합니다.) 20을 6으로 나머지 연산하면 몫은 2이며 식..

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

▶함께배우는 프로세싱 :: generative design P.2.1 Alignment in a grid. 이번 글에서는 generative design에서 제공하고있는 예제중 'Alignment in a grid'를 살펴보려고합니다. int tilecount = 20; int actStrokeCap = ROUND; // 선의 끝부분을 둥글둥글하게 설정합니다. * strokeCap() 선의끝부분을 어떻게 처리할지 설정하는 기능입니다. ROUND, SQUARE, PROJECT 이렇게 세 가지 종류가 있습니다. [Processing.org > reference > strokeCap 바로가기] [사진 : Processing.org ] 이번에제에서 strokeCap의 설정을 바꾸는것으로 아래사진과 같은 변화를 ..

▶Processing :: 프로세싱의 오디오기능 - Minim라이브러리 이번에 살펴볼 것은 프로세싱에서의 오디오기능입니다. 어려운것은 아니고 가장 기초적인것인데, 어떤 메커니즘인지 정리해둘 필요가 있을 것 같았습니다. 먼저 이번 예제에서 사용할 audio샘플을 함께 첨부하겠습니다. 따르르릉하고 짧게 울리는 벨소리이며 wav형식이며, 프로세싱작업 파일 내 data폴더에 넣어두시면 됩니다. 프로세싱 실행후 가장 먼저, 이번예제에서 적용해볼 Minim라이브러리를 로드해줍니다. 그다음으로 살펴볼 것은 setup부분입니다. 뒤에서 볼 수 있겠지만, bell클래스는 bell(x, y, r, filename)의 형태로 이루어져있습니다.따라서 이번 예제에서 벨은 화면 중심에서(width/2, height/2) 반지름이..

▶시각화노트 :: 데이터시각화 기술의 활용 분야 및 활용사례 '아톰시대에서 비트의 시대로'패러다임이 변화하면서, 지식정보사회에서 '정보'의 중요성이 더욱더 커지고 있습니다. 이러한 시대적 흐름 속에서 우리가 어렵지 않게 찾아볼 수 있는 변화라고 한다면 '시각화 기술의 진화 및 발전'을 이야기할 수 있습니다. 이번 포스팅에서는 시각화기술의 관련 개념 을 먼저 살펴본 뒤, 데이터시각화의 여러가지 방향을 정리하고, 마지막으로 사례를 이야기 해보려고합니다. 구글트렌드에서 data visualization을 검색한 결과입니다. 국가별 검색량을 상대적으로 나타내기때문에 전세계적인 검색량을 골고루 알 수 있는 것은 아니지만, 많은 나라중에서 우리나라가 특히 관심을 갖고 있다는 것을 알아볼 수 있습니다. 또한 검색엔진..

▶함께배우는 프로세싱 :: 위치데이터로 원그리기 ① 이번 포스팅에서는 VisualizingData - chapter 3: mapping부분에 대해서 정리해보았습니다. - table class- location파일의 의미 red dot예제의 결과모습입니다.미국 각 주의 위치에 원이 그려져있는 모습입니다. 여기서는 '어떻게 각 주의 위치에 그렸는지'가 중요합니다. 프로세싱에서 원을그리기가 아무리 쉽다고 하지만, 일일이 모든 좌표를 입력하기에는 무리가 있습니다. ellipse(470, 300, 9, 9);ellipse(302, 200, 9, 9);ellipse(410, 202, 9, 9).........이건 무리! 저자는 tsv형식의 'locaion'이라는 파일에서 정보를 불러왔습니다. 예제폴더내의 'data..