본문 바로가기

교육은 한 사람의 인생을 바꾼다72

완전 초짜 VVVV : 3D 도형의 좌표, 이동, 회전 / EX9과 Shader 이전 포스팅에서 EX9 Renderer 에 대해서 배워보았다. 이번 포스팅에서는 EX9 renderer에서 3D 도형의 이동 및 회전과 EX9 renderer 에 입체감을 부여하는 shader에 대해서 알아보려고 한다. ▷3D 도형의 좌표, 이동, 회전 (Rotate vs Translate) 위 영상을 보면 Rotate 와 Translate 노드의 순서에 따라 도형의 이동 및 회전이 달라지는 것을 알 수 있다. Rotate는 회전 시키는 노드 / Translate는 이동을 시키는 노드이다. 먼저 왼쪽의 경우, Rotate 노드가 Translate 노드보다 선행실행되기 때문에 회전축이 처음 그대로 (0,0) 즉 정중앙에 위치하게 된다. 따라서 (0,0) 의 정중앙을 중심으로 사각형이 회전한다. 반면에 오른.. 2021. 2. 4.
완전 초짜 VVVV : 직선/ 랜덤/ 원형/ 타이포 스프레드 이번 포스팅에서는 복수의 수치를 생성하고 저장하는 다양한 스프레드에 대해서 알아보려고 한다. 이런 스프레드 중 기본적인 직선 스프레드 / 랜덤 스프레드 / 원형 스프레드 / 타이포 스프레드 의 4가지를 알아보자. ▷직선적인 값을 갖는 수치들 renderer 위에 연속적인 값을 갖는 수치들을 만들어 본다. 직선 위의 값 즉 연속적인 값을 만들기 위해선 넘버박스의 inspektor 를 변경해 여러점을 한번에 나타낼 수 있는 표의 형태로 바꾸고, 그 안에 일일이 데이터 값을 입력해줘야 한다. 하지만 만들고자하는 수치 값이 많을수록 너무 많은 시간이 걸리는 단점이 있다. 이런 작업을 더 빠르게 하고자 Spread 기능을 사용한다. ▷직선 스프레드(Linear Spread) 직선위의 연속적인 값을 쉽게 생성하기 .. 2021. 2. 3.
완전 초짜 VVVV : 3D를 표현하는 EX9 Renderer 저번 포스팅에서는 2D를 표현하는 GDI Renderer에 대해 알아보았다. 이번엔 3D를 표현하는 EX9 Renderer에 대해서 알아보자. ▷EX9 Renderer (Quad / Sphere) EX9 renderer를 생성하면 저번에 GDI Renderer와 똑같은 창이 나온다. 외관상에 차이는 없다. 그냥 검은색 칸이다. Alt + 2 를 눌러 VVVV안에 삽입해준다. Renderer 만으로는 이미지를 표현할 수 없기 때문에 간단한 3D 노드인 Quad와 Sphere를 사용해 본다. 1) Quad 쿼드노드는 입체값이 없는(높이값이 0에 가까운) 평면에 가까운 사각형을 표현한다. 따라서 Quad 노드의 속성을 지정할 땐 transform(2d) 노드를 사용한다. Transform 노드에 Scalex .. 2021. 2. 2.
완전 초짜 VVVV : 2D를 표현하는 GDI Renderer ▷GDI RENDERER VVVV 안에서 이미지를 표현하려면 Renderer(랜더러)를 사용해야 한다. 기본적으로 사용할 수 있는 renderer는 2D를 표현하는 GDI Renderer 와 3D를 표현하는 EX9 Renderer가 있다. 이중 이번 포스팅에서는 2D 이미지를 보여주는 GDI Renderer 노드에 대해 살펴본다. ▷GDI RENDERER(+Point / Circle 노드) 먼저 GDI Renderer는 처음에 삽입하면 개별 창으로 뜬다. 이럴 경우 한눈에 잘 안보이기 때문에 ALT + 2 를 눌러 VVVV안에 Renderer 창을 삽입 할 수 있다. renderer 창이 띄워지면 창 안에 이미지를 표시하는데는 다른 노드가 필요하다. 기본적인 이미지 표현 노드로 Point 노드와 Circ.. 2021. 2. 1.
완전 초짜 VVVV : 키보드 입력과 랜덤 인터랙션 이전 글에서 기본적인 키보드 입력 노드인 keyboard / keymatch 노드와 그 활용법에 대해서 알아보았다.(완전 초짜 VVVV : 키보드 입력) 이번에는 multiflipflop 노드를 활용한 키보드 입력값의 수치화와 Random 노드를 통한 난수 생성에 대해 배워본다. ▷키보드 입력과 난수(random) 생성 작품 구 위에 외부 데이터를 텍스처로 입히고, 그 데이터를 키보드 방향키로 변경시키는 작품이다. 또 배경색은 다른 방향키를 누를 때마다 랜덤하게 바뀌게 구성한 작품이다. 영상을 통해 어떠게 조작되는지 확인할 수 있다. 자 그럼, 어떤 노드를 어떻게 활용했을까? ▷MultiFlipFlop / Random MultiFlipFlop 노드를 통해 방향키 위, 아래, 좌, 우 의 값을 숫자 0~3.. 2021. 1. 31.
완전 초짜 VVVV : 비교연산과 불린 연산 ▷비교연산 비교 연산을 다룰 수 있는 노드를 살펴보자. 비교 연산이란 말 그대로 크다, 작다, 같다 등의 수치값을 비교하는 연산을 말한다. = / = 의 5가지의 노드들의 아웃풋핀에 토글박스를 연결하면, 인풋핀의 값이 참일 경우는 토글박스가 켜지고 인풋핀의 값이 거짓일 경우는 토글박스가 꺼지게 표현된다. ▷불린 연산 불린 연산은 참 혹은 거짓을 판별하는 노드이다. AND노드는 인풋핀의 값이 모두 참일 경우만 참으로 표현되지만, OR노드의 경우 인풋핏 둘 중 하나만 참이어도 참으로 표현된다. 위의 비교연산 노드와 마찮가지로, 아웃풋핀에 토글박스를 연결하면 토글박스의 켜지거나 꺼진 상태를 보고 참 거짓을 판별할 수 있다. ▷change 노드 / toggle 노드 / flipflop 노드 유사한 .. 2021. 1. 30.
완전 초짜 VVVV : 큐(QUEUE) 스프레드 ▷큐(queue) 노드 큐(queue)가 뭔지 모르겠어서 구글에 검색해보니 위와 같은 이미지가 나온다. 여러 사람이 줄지어 서 있는 것 같은 모습을 큐(queue)라고 한다고 한다. 큐(queue)는 이처럼 연속적인 사건(값)의 나열이다. 큐(queue)노드는 입력되는 자료를 연속되는 값의 흐름으로 나타내주는 노드이다. 위의 사진은 큐(queue)노드를 활용해 마우스의 움직임을 선의 흐름으로 표현한 출력 값이다. 이때 Insert는 시작 스위치, Frame Count는 큐스프레드로 만들 자료의 수이다. 하지만 큐스프레드 값의 흐름을 눈으로 확인하기 위해선, 이렇게 큐노드가 처리한 데이터를 표현할 수 있는 아웃풋박스가 필요하다. 위의 사진처럼, 넘버박스의 inspektor를 수정해서 물결치는 박스형태로 만.. 2021. 1. 29.
완전 초짜 VVVV : 스프레드의 슬라이스 값 다루기 ▷스프레드의 슬라이스 값 다루기(CircularSpread노드 / GerSlice노드) 이번에는 스프레드 속에서 개별 슬라이스 값을 추출하거나 분리, 병합해보려고 한다. 즉, 일련의 데이터들 속에서 개별 데이터 값을 추출해 활용하는 것이다. 위의 사진에서는 CircularSpread 노드를 활용해 원형으로 스프레드를 만들었다. 현재 자료는 포인터들의 좌표값이다. 이런 스프레드에서 개별 데이터를 추출하기 위해 GetSlice 노드를 활용한다. GetSlice 노드의 첫번째 인풋핀은 받아드리는 데이터의 수, 두번째 인풋핀은 추출하고자 하는 데이터의 위치이다. 현재, 10 / 6 의 값을 주었기 때문에 10개의 데이터 중 6번째 데이터를 추출한다는 뜻이다.(단, 시작이 0번부터이므로 6번째 값은 -0.43이 .. 2021. 1. 28.
완전 초짜 VVVV : 수식의 활용/ 선 없는 데이터를 연결 ▷순차적 연산 위는 일반적인 연산 방법이다. VVVV는 이렇게 위에서 아래로 가는 순차의 흐름대로 연산이 이뤄진다. 하지만 연산을 할때마다 이렇게 일일이 나열하면서 해야 한다면, 복잡한 연산에서는 매우 불편할 것이다. ▷수식의 활용 Expr노드 Expr 노드를 활용하면, 복잡한 계산도 쉽고 간결하게 표현할 수 있다. Expr 노드를 삽입 후 inspektor(ctrl + L)를 열어, variable name(변수명)에 필요한 변수를 생성하고 Term에 표현하고자 하는 수식을 작성하면 Expr 노드는 해당 수식대로 연산을 진행하는 노드로 기능한다. 이때, 인풋핀에 A, B, C, D 변수의 순서대로 정확하게 데이터값을 입력해야 한다. ▷선 없는 데이터 연결 : S(Sender) 노드와 R(Reciever.. 2021. 1. 27.

티스토리툴바