[TD] Ripple Effect Based on Camera
공부용으로 작성되는 페이지입니다. 틀린 부분이나 환경에 따라 오류가 발생할 수 있습니다.
최종 결과물 미리보기
요즘 GLSL 작업 외에 TD를 만질 일이 없어서 오랜만에 건드리고 싶었다.
오늘은 손의 위치에 따라 화면을 물결처럼 흐트러뜨리는 효과를 만들어보았다.
안 그래도 GLSL로 Fluid 효과를 TD내에서 구현하고 싶은데, 공부 후에 hand tracking과 결합해보고 싶다.
Hand Tracking in Touchdesigner
GitHub - torinmb/mediapipe-touchdesigner: GPU Accelerated MediaPipe Plugin for TouchDesigner
GPU Accelerated MediaPipe Plugin for TouchDesigner - torinmb/mediapipe-touchdesigner
github.com
플러그인을 사용하였다. 보기좋게 통합해준다. 위치 데이터로 사용할 Chop과 잘 작동하는지 확인하기 위해 Top을 Out 시켜주었다.
물결 효과 만들기
물결 효과를 만들기 위해 사용했던 노드들. 기본적으로 FeedBack과 Blur를 사용하고 왜곡 효과를 씌워주는게 전부다.
아직 헷갈리는 기능들만 따로 메모해둔다.
- Look Up : 다른 이미지를 기반으로 색상을 변형해서 재맵핑 해주는 역할
- Slope : 이미지의 픽셀 값을 기준으로 이웃 픽셀과의 차이를 계산하여 출력하는 노드. 사실 나도 얘는 아직 잘 와닿지 않는다.
- Displace : 왜곡 효과를 부여한다고 생각하면 된다
고민했던 부분
1. 기준점으로 삼을 손
Hand Tracking 기반 작업에서 항상 하는 고민. 무엇을 기준으로 삼을 것인가...
일단은 Pinch_Medipoint를 기준점으로 삼아서 위치값을 받아왔다. 이번에는 Z 값은 필요없으니 따로 사용하지 않았다.
그리고 테스트 하기 쉬운 손으로 사용한 탓에 반대손으로 하면 수치가 안 맞다. 이건 if문 따위를 추가해주면 별 문제 없이 해결될듯.
2. 보정하기
Mediapipe로 가져온 Hand Tracking의 위치값이 1대 1로 대응되지 않는다. Range나 Limit을 통해 지정해줘야함.
범위를 모르겠을 때는 보통 mouse in으로 테스트 해보고 알아내는게 좋다.
어떤 센서를 쓰더라도 사실 이게 제일 귀찮고 힘든 과정이라고 생각한다. 나는 어려울 때마다 HQ의 Sensor Data 관련 영상을 참고한다.
참고로 이번에는 Transform과 Math의 Range 때문에 미스매칭이 자꾸 발생했었다. 이는 Transform의 화면은 -1~ 1 좌표이기 때문이었다.
따라서 Math chop에서 To Range 범위를 1~-1로 세팅해주었다.
전체 노드
주석 단축키가 갑자기 생각이 안 나서 하마터면 정리를 못 할 뻔했다.... shift + c 였다.
그리고 중간중간 렉이 걸리는데 이번 작업을 노트북으로 진행해서 그런 거 같다 동영상도 찍으려다가 하마터면 컴 자체를 터뜨릴 뻔했다.
트래킹이 너무 끊기는 느낌이 들어 Filter도 추후에 추가해줬는데, 아마 그것도 데이터 자체의 문제보다는 노트북에게 너무 무거운 작업이었나봄 -_-
그 외 참고자료
[TouchDesigner] Slope 노드의 채널 설정(Vertical Luminance)
Slope 노드의 설정Slope 노드: 이미지의 각 픽셀에서 기울기(gradient)를 계산하는 노드입니다.Green 채널을 Vertical Luminance로 설정: Green 채널은 이미지의 세로 방향 기울기 정보를 포함합니다. 즉, 각 픽
alsseul.tistory.com
Displace TOP - TouchDesigner Documentation
The Displace TOP will cause one image to be warped by another image.
docs.derivative.ca