콘텐츠로 이동

미디어 뷰어 및 에디터 (Media Viewers and Editors)

파라미터에 이미지, 비디오, 오디오 클립, 3D 모델 또는 가우시안 스플랫(Gaussian splat)이 포함되어 있으면 에디터는 일반 텍스트 필드 대신 해당 미디어 유형에 맞게 빌드된 뷰어로 전환합니다. 이러한 뷰어 중 일부는 에디터 기능도 겸비하고 있어 캔버스를 벗어나지 않고도 마스크를 그리거나 프레임을 자르거나 레이어를 합성할 수 있습니다. 이 페이지에서는 각 뷰어가 나타나는 위치, 여는 방법, 열린 상태에서 수행할 수 있는 작업에 대해 둘러봅니다.

표시되는 뷰어는 파라미터 유형에 따라 결정됩니다:

파라미터 유형 뷰어
ImageArtifact / ImageUrlArtifact 이미지 뷰어
VideoArtifact / VideoUrlArtifact 비디오 플레이어
AudioArtifact / AudioUrlArtifact 오디오 플레이어
ThreeDArtifact / ThreeDUrlArtifact 3D 모델 뷰어
SplatArtifact / SplatUrlArtifact 가우시안 스플랫 뷰어

비교 슬라이더(이미지 및 비디오)는 별도의 유형이 아닙니다. 노드가 단일 파라미터를 통해 두 개의 미디어 값을 노출할 때 비교 표시 기능이 활성화됩니다. (노드 작성자를 위한 전체 유형-위젯 매핑은 Parameter UI Reference에 나와 있습니다.)

뷰어 상단에 나타나는 추가 버튼(크롭, 마스크, 캡처 등)은 노드 작성자가 해당 파라미터에 설정한 옵션에 따라 달라집니다. 사용자가 직접 구성하는 것이 아니라 노드 자체에 내장된 설정이므로, 동일한 이미지 파라미터라도 어떤 노드에서는 자르기 아이콘이 표시되고 다른 노드에서는 마스크 아이콘이 표시될 수 있습니다.

이미지 보기 및 우클릭 작업

이미지 파라미터는 표준 이미지 뷰어로 표시됩니다. 썸네일 아래에 이미지 이름, 크기 및 파일 용량이 표시됩니다. 마우스를 올리면 라이트박스에서 이미지를 전체 화면으로 여는 확장 버튼이 나타납니다. Escape를 누르거나 바깥을 클릭하여 닫을 수 있습니다.

노드의 썸네일이나 라이트박스의 확대 버전에서 이미지를 마우스 오른쪽 버튼으로 클릭하면 다음 컨텍스트 메뉴가 표시됩니다:

  • Copy image — 원본 이미지가 다른 형식인 경우 먼저 다시 인코딩하여 전체 해상도 이미지를 시스템 클립보드에 PNG로 복사합니다.
  • Copy image URL — 이미지의 URL을 텍스트로 복사합니다.
  • Save image — 전체 해상도 이미지를 디스크에 다운로드합니다.
  • Make thumbnail — 이 이미지를 워크플로우 브라우저에 표시되는 워크플로우의 헤더 썸네일로 설정합니다. 워크플로우의 저장된 메타데이터가 즉시 업데이트됩니다.

슬라이더로 두 이미지 비교

노드가 단일 비교 파라미터를 통해 한 쌍의 이미지를 노출하는 경우 에디터는 드래그 가능한 수직 구분선이 있는 하나의 이미지로 렌더링합니다. 구분선 왼쪽은 첫 번째 이미지이고 오른쪽은 두 번째 이미지입니다. 비교 영역 위로 마우스를 움직여 구분선을 슬라이드할 수 있습니다.

마우스를 올리면 각 측면에 파일 이름이 표시된 동일한 비교 화면을 전체 화면으로 여는 확장 버튼이 나타납니다. Escape를 누르면 닫힙니다.

이미지 크롭 (자르기)

일부 이미지 파라미터에는 자르기 에디터를 여는 자르기 버튼(썸네일 위의 크롭 아이콘)이 있습니다. 내부에서 오버레이의 핸들을 드래그하여 자르기 영역의 크기를 조정하거나 다음 기능을 사용합니다:

  • Reset All — 자르기를 전체 이미지 크기로 초기화합니다.
  • 종횡비 프리셋 — Square(1:1), 16:9, 3:2, 4:3, 9:16, 2:3, 3:4.
  • Zoom — 10–300%, 점멸하는 점선 오버레이로 미리보기가 제공됩니다.
  • Rotation — -180°에서 180°, 위쪽 방향을 나타내는 화살표 표시기가 함께 제공됩니다.
  • Crop Details — 현재 left/top/width/height의 픽셀 값입니다.

Accept & Save는 자르기 정보를 새 이미지 파일로 직접 굽는 대신 노드의 파라미터 값(left, top, width, height, zoom, rotation)으로 기록합니다. 노드가 실행될 때 직접 자르기를 적용합니다. Cancel을 누르면 변경 사항이 삭제됩니다.

마스크 페인팅

마스크 편집이 활성화된 이미지 파라미터에는 마스크 아이콘이 표시됩니다. 클릭하면 Paint Mask 에디터가 열립니다. 원본 이미지 위에 겹쳐진 캔버스에 직접 브러시로 그립니다:

  • Brush는 흰색(표시)을 칠하고, Erase는 검은색(숨김)을 칠합니다.
  • Brush SizeBlur 슬라이더는 브러시 스트로크 두께와 부드러운 가장자리를 제어합니다. 슬라이더를 건드리지 않고 [] 키로도 브러시 크기를 조절할 수 있습니다.
  • Show Mask / Show Composite는 원시 흑백 마스크 뷰와 마스크가 투명도로 적용된 이미지 뷰 간을 전환합니다.
  • Invert Mask는 전체 마스크에서 흑백을 반전합니다.
  • Reset Mask는 마스크를 이미지의 원래 알파 채널 상태로 복원합니다.
  • Flood Fill은 전체 마스크를 현재 도구 색상으로 채웁니다.
  • Alt 키를 누른 채 드래그하여 화면을 이동하거나 Alt+스크롤로 확대/축소할 수 있습니다. 캔버스 위에는 전용 확대/축소 버튼과 뷰 초기화 버튼이 있습니다.

Apply를 누를 때 저장되는 내용은 파라미터가 기존에 보유하고 있던 데이터에 따라 달라집니다. 일반 이미지인 경우 페인팅을 통해 해당 이미지의 알파 채널이 편집되어 투명도가 포함된 새 이미지로 저장됩니다. 파라미터가 이미 별도의 마스크와 쌍을 이루고 있는 경우, 페인팅은 원본 이미지를 그대로 두고 해당 마스크를 편집하여 독립된 흑백 파일로 저장합니다.

Image Bash: 이미지 및 페인트 레이어 합성

Image Bash는 에디터의 레이어 기반 합성 도구입니다. 일부 이미지 파라미터에는 직접 열 수 있는 연필 아이콘이 있습니다. 상태를 구조화된 레이어 데이터로 저장하는 파라미터에서도 동일한 도구를 여는 Edit 버튼을 통해 접근할 수 있습니다. Image Bash를 사용하는 Griptape 자체 노드들은 단일 이미지를 제자리에서 수정하기보다는 여러 원본 이미지와 페인팅 레이어로부터 합성 장면을 구축하는 데 이 도구를 활용합니다.

내부에서 각 레이어는 이미지 레이어(캔버스 내 변형 핸들로 이동, 크기 조절, 회전이 가능한 원본 이미지 중 하나)이거나 브러시 레이어(직접 그릴 수 있는 페인트 캔버스)입니다. 사이드바에는 썸네일, 가시성 토글, 불투명도 및 순서 변경용 드래그 핸들과 함께 모든 레이어가 나열됩니다. 레이어 이름을 바꾸거나 삭제하거나 복제할 수 있으며 이미지 레이어를 페인트 가능한 새 브러시 레이어로 복제할 수도 있습니다.

페인팅 도구에는 Pen, Soft, Crayon, Spray의 네 가지 브러시 유형이 포함되며, 각각 고유한 크기, 색상 및 불투명도를 가집니다. Crayon(점 크기, 점 밀도, 퍼짐, 사각 비율, 밀도 감쇠) 및 Spray(스팟 크기, 스팟 밀도, 퍼짐 반경)에 대한 추가 컨트롤도 제공됩니다. 실행 취소/다시 실행(Undo/redo)은 최근 50개의 브러시 스트로크까지 지원합니다. 도구 내에서 캔버스 크기를 조정하고 배경색을 변경할 수도 있습니다.

기본 브러시 및 캔버스 설정은 에디터의 Settings 패널에 있습니다("ImageBash"를 검색하여 해당 카드를 찾으세요). 여기서 기본값을 변경하면 이후 새로 시작되는 도구 세션에만 적용됩니다.

비디오 재생 및 비교

비디오 파라미터는 프레임 단위로 정확한 플레이어를 사용합니다. 한 번에 한 프레임씩 이동하고 앞뒤로 재생하며 표시된 프레임 간을 이동할 수 있습니다. 키보드 단축키는 화면 컨트롤과 동일하게 작동합니다. / 키는 한 프레임씩 이동하고, j/k/l 키는 뒤로 재생, 일시정지, 앞으로 재생을 수행합니다. 노드가 프레임 선택 파라미터도 노출하는 경우 타임라인에 마커를 추가(. 키로 현재 프레임 추가), 드래그 또는 지울 수 있으며 n/m 키로 이전/다음 마커로 이동할 수 있습니다.

하단 표시줄에는 재생 FPS(편집 가능하며 비디오의 원래 프레임 레이트로 스냅하는 버튼 제공), 전체 프레임 중 현재 프레임, 음소거 및 볼륨이 표시됩니다. 확장 가능한 Video Details 패널에는 해상도, 파일 크기, 형식, 코덱, 종횡비, 재생 시간 및 프레임 레이트가 보고됩니다. Enlarge는 플레이어를 더 큰 대화 상자로 열며, Fullscreen 버튼은 브라우저의 전체 화면 모드를 사용합니다.

비디오 비교 파라미터는 이미지 비교와 동일한 드래그 가능한 구분선을 사용하여 두 비디오를 나란히 표시하며, 프레임 단위로 완벽히 동기화된 상태를 유지하고 어느 쪽의 오디오 트랙을 재생할지 선택할 수 있는 스위치를 제공합니다.

비디오를 마우스 오른쪽 버튼으로 클릭하면 Copy video URLSave video 옵션이 나타납니다.

오디오 재생

오디오 파라미터는 아래에 재생 컨트롤(재생/일시정지, 경과/전체 시간, 음소거, 볼륨 슬라이더)이 있는 파형(waveform)으로 렌더링됩니다. 파형의 아무 곳이나 클릭하고 드래그하여 해당 위치로 탐색할 수 있습니다.

웹캠 또는 마이크 캡처

웹캠 캡처가 활성화된 이미지 파라미터는 카메라 접근 권한을 허용하면 일반적인 썸네일 대신 실시간 카메라 미리보기를 표시합니다. 카메라 버튼을 누르면 정지 사진이 캡처되어 업로드되며, 미리보기가 캡처된 이미지로 교체됩니다. 캡처 버튼을 사용해 다시 촬영할 수 있습니다.

마이크 캡처가 활성화된 오디오 파라미터는 파형 옆에 녹음 버튼을 표시합니다. 클릭하여 녹음을 시작하면 타이머로 전환되며, 다시 클릭하여 중지하면 녹음 파일이 자동으로 인코딩되어 업로드됩니다. 휴지통 아이콘을 누르면 캡처된 녹음이 지워져 다시 녹음할 수 있습니다.

두 기능 모두 브라우저 카메라 또는 마이크 권한을 허용해야 합니다. 접근이 거부되면 컴포넌트에 캡처 컨트롤 대신 오류 메시지가 표시됩니다.

3D 모델 보기

3D 모델 파라미터는 인터랙티브 뷰어로 열립니다. 드래그하여 회전(orbit), 스크롤하여 확대/축소, 마우스 오른쪽 버튼 드래그로 이동(pan)할 수 있습니다. 지원되는 형식은 glTF/GLB(Draco 압축 메시 포함), OBJ, FBX, DAE, 3DS, STL, PLY입니다. USDZ 파일은 일반 텍스트 USDA 변형인 경우에만 로드되며, Rodin이나 Apple QuickLook 같은 도구에서 내보낸 바이너리 USDC 파일은 미리보기가 지원되지 않지만 파일 자체는 그대로 저장되고 다운로드할 수 있습니다. 자체 재질(material)을 포함하지 않는 형식(STL, PLY, 일반 OBJ)은 중립적인 기본 재질이 적용되어 입체 지오메트리로 확인할 수 있습니다.

뷰어 위에 마우스를 올리고 확장 아이콘을 클릭하면 열려 있는 동안 천천히 자동 회전하는 동일한 모델이 전체 화면으로 열립니다. Escape 또는 닫기 버튼으로 종료할 수 있습니다.

가우시안 스플랫 보기

스플랫 파라미터(.splat.ksplat 파일)는 3D 모델 뷰어와 동일한 궤도 회전/줌 카메라 컨트롤을 사용하며, 삼각 메시 대신 가우시안 스플래팅 렌더러를 통해 렌더링됩니다. 확장 아이콘을 클릭하여 스플랫을 전체 화면으로 열 수 있으며 Escape 또는 닫기 버튼으로 종료합니다.

이미지에서 워크플로우 로드하기

Griptape Nodes는 썸네일로 내보내는 PNG 파일 내에 워크플로우의 노드 그래프를 임베드할 수 있습니다. 이러한 PNG 파일 중 하나를 캔버스에 끌어다 놓으면 에디터가 포함된 워크플로우 메타데이터를 감지하고 단순히 이미지 노드를 추가하는 대신 수행할 작업을 묻습니다:

  • Add Image — 다른 일반 이미지처럼 취급하여 해당 파일로부터 일반 이미지 로드 노드를 생성합니다.
  • Add Nodes from Workflow — 이미지를 생성한 노드들을 현재 워크플로우에 추가하고 참조된 라이브러리, 정적 파일 및 의존하는 워크플로우를 가져옵니다. 최종 적용 전에 대화 상자에서 노드, 라이브러리 및 종속성 목록을 확장하여 추가될 항목을 미리 확인할 수 있습니다.

여러 개의 PNG 파일을 한 번에 끌어다 놓으면 동일한 대화 상자의 배치(일괄) 버전이 표시됩니다. 드롭된 이미지 중 워크플로우 메타데이터를 포함하고 있는 이미지 수가 표시되며 선택한 옵션(이미지로 추가 또는 워크플로우 노드 추가)이 모든 파일에 한 번에 적용됩니다. 메타데이터가 포함되지 않은 이미지는 어떤 옵션을 선택하든 항상 일반 이미지 노드로 추가됩니다.