Graphics
- 
                            vvvv gamma 패치 리뷰 : 오디오 데이터 받아오기 / Audio visualization 오디오 시각화 (2)Graphics/VVVV gamma 2023. 10. 23. 22:27
1. 오디오 데이터 받아오기. 2. 원을 만든 다음, 소리에 따라 크기가 반응하게 하기. 3. 그 원의 아웃라인을 따라 점이 만들고 그 사이를 선으로 연결하기. 4. 최종적으로 보여줄 화면에 맞춰 효과를 주거나 값들을 조정하기. 지난 글에 이어서, 받아온 오디오 데이터에 반응하는 원을 만들어볼 것이다. 이번 단계에서 최종적인 형태는 아래와 같다. 화면에 원 하나가 있고, 소리가 커질수록 바깥쪽으로 더 크게 튀어나오게 된다. 3시를 기준으로 시계 방향으로 갈수록 주파수가 낮은 영역대부터 높은 영역대가 분포된다. 가장 먼저 원의 크기가 소리의 크기에 따라 반응하도록 만들기 위해서 Meter노드의 Level 아웃풋을 가져올 것이다. 소리에 따라 왔다갔다하는 게이지바로 float이 표현되어 있다. 일반적인 fl..
 - 
                            AffterEffect 단축키 및 기능 정리Graphics/Motion Graphics 2023. 10. 21. 23:51
* AfterEffect 2024 버전을 기준으로 작성 Ctrl D : 복사 Ctrl C V 복사 후 원하는 곳에 붙여넣기 Ctrl Shift C : Pre 컴포지션 만들기 (Pre-Compose) Alt / : 미리보기 화면 100% 크기로 맞추기 Ctrl Shif H : 레이어의 조절점을 보이거나 보이지 않도록 한다. (Show Layer Controls) Ctrl T : 텍스트 입력툴 (Type Tool) Ctrl -> / Ctrl /
 - 
                            vvvv gamma 노드 리뷰 : How to generate a random walk (Wanderer 예제)Graphics/VVVV gamma 2023. 10. 19. 21:46
오브젝트를 랜덤하게 움직일 수 있는 Wanderer 노드 예제에 대해 정리해보았다. Wanderer 노드를 선택한 상태로 F1을 누르면 예제를 열 수 있다. (예제가 없는 노드들도 많다.) 패치는 이렇게 구성되어있다. 결과 영상이다. 먼저, Wanderer 노드를 살펴보면 다양한 인풋들을 보인다. Wanderder: (in) - Start(Vector2), Width(Vector2), Range Mode, Main Direction, Direction, Deviation, Speed, Smoothing, Reset, Walk(Boolean) (out) - Position(Vector2) => Start: 시작점을 정한다. Width: 오브젝트가 돌아다니는 범위를 설정한다. Range Mode: 세가지 버..
 - 
                            vvvv gamma 패치 리뷰 : 오디오 데이터 받아오기 / Audio visualization 오디오 시각화 (1)Graphics/VVVV gamma 2023. 10. 16. 22:35
버전: vvvv gamma 5.0 오늘은 과제로 제출했던 Selbstporträt의 vvvv gamma파일을 다시 풀어 어떻게 만들었는지, 배운 내용을 복습하고 메모해두려 한다. 우선 결과 이미지는 보라색계열의 점과 선들이 원 모양으로 반복되어 생기는 모습이다. 또한 오디오 데이터를 받아 소리가 클수록 원의 크기가 커지며 더 바깥쪽에 생겨나게 된다. 소리가 설정해둔 일정 기준보다 작다면 원은 생기지 않는다. 최종적인 결과가 담긴 패치화면이다. 우선, 큰 순서로 노드 추가 및 연결 과정을 정리하자면, 아래 순서로 나열할 수 있다. 1. 오디오 데이터 받아오기. 2. 원을 만든 다음, 소리에 따라 크기가 반응하게 하기. 3. 그 원의 아웃라인을 따라 점이 만들고 그 사이를 선으로 연결하기. 4. 최종적으로 ..
 - 
                            vvvv gamma 노드 리뷰 : Reference Resample (ResampleBSpline 예제)Graphics/VVVV gamma 2023. 10. 11. 20:41
*버전: vvvv gamma 5.0 만들고 싶은 이미지가 있는데 그러기 위해서는 ResampleBSpline 노드 공부가 필요해서 예제를 분석했다. 노드의 예제를 찾는 방법은 간단하다. 설명이 필요한 노드를 클릭하고 F1을 누른다. 딱 ResampleBSpline만을 포함하는 내용은 아닌 모양이다. Reference Resample이라는 이름으로 창이 띄워졌다. ResampleBSpline을 포함해 다양한 Resample노드들의 아웃풋을 비교해서 한번에 볼 수 있다. 결과적으로는 초록선들이 움직이고 위에는 슬라이더바가 보이는 창이 나타난다. 하나씩 어떻게 작동하고 있는지 살펴보자. 가장 먼저 노드의 시작점이 상단 부분을 살펴보면 LFO를 RandomSpread와 연결해둔 것을 볼 수 있다. LFO의 Cy..
 - 
                            vvvv gamma : Controlling Patches / VL7.Graphics/VVVV gamma 2023. 10. 8. 06:43
* 아래 영상을 보고 노트한 내용이다. https://youtu.be/LOX32diUgOQ?si=TZeH1j2nQCxK3nQA 마지막 튜토리얼 영상이다. 마우스와 키보드를 이용한 인터랙션을 진행하는 내용이었다. 우선, 지난번에 Sphere들의 위치로 랜덤하게 움직이는 Box예제를 가져왔다. 1. Mouse Mouse 노드를 추가해서 RootScene에 추가한다. (RootScene의 input 핀을 늘이기 위해서는 Ctrl + 를 누른다.) Mouse 노드의 position in the world 아웃풋을 XYz노드를 추가해 연결한다. 그리고 Box의 TransformSRT의 Translation에 연결한다. => 마우스의 위치에 따라 박스가 이동하게 된다. 다음으로는 Switch 노드에 대해 알아볼 것..
 - 
                            vvvv gamma : Spreads & Iteratio / VL6.Graphics/VVVV gamma 2023. 10. 7. 00:01
* 아래 영상을 보고 노트한 내용이다. https://youtu.be/3u3QOd4UyWM?si=eh6v0s6EA1VC_miC 지난번 영상에서 만들었던 것과 같은 구조에서, Box가 여러개의 Sphere의 위치로 랜덤하게 움직이는 결과를 만들 것이다. 우선, 여러개의 Sphere를 만들기 위해서는 아래와 같이 만들 수 있을 것이다. 하지만 똑같은 내용을 계속 복사해서 붙여넣는 것은 그다지 좋지 않다. 조금 더 효율적인 방법으로 만들 수 있다. Cons(/spread): 여러개의 데이터(float, integer, vector)를 받아 하나의 Spread로 묶어준다. (여기서는 output이 Spread이다.) ForEach(/이텔릭체): splicer로 통과시키면 해당 Spread의 개수만큼 반복된다. ..
 - 
                            vvvv gamma : The Stride Rendering Pipeline / VL5.Graphics/VVVV gamma 2023. 10. 6. 21:49
*아래 영상을 보고 노트한 내용이다. https://youtu.be/4rDgVe1F0gg?si=1A0--d5V-nrpfBDW 이 영상에서는 3D 오브젝트를 렌더해보는 내용을 다뤘다. 1. VL.Stride Stride는 일종의 3D 오브젝트를 렌더링할 수 있는 패키지를 모아놓은 것처럼 보인다. 우선 나의 프로젝트에 Stride 패키지를 추가해야 한다. VL.Stride를 검색하면 +VL.Stride라는 박스가 나타나는데 눌러 추가한다. 그리고 stride를 다시 검색해보면 아래처럼 폴더가 나타난다. 폴더를 열어보면 아래처럼 다양한 노드들이 나타난다. 살펴보면 Camera, Rendering, Textures 등 3D 렌더와 관련된 다양한 노드들이 나타난다. 먼저 창을 띄우기 위해서 SceneWindow를..