인스펙터 (속성 편집)
오른쪽 인스펙터에서 선택한 요소의 속성을 편집합니다. 요소를 선택하지 않으면 "No Selection"이 표시됩니다.
커밋 시점: 숫자·텍스트 입력은 Return 또는 포커스 이동 시 반영, 슬라이더·색상·노브는 즉시 반영됩니다.
섹션은 종류별로 아이콘이 붙은 카테고리로 나뉘며 위에서 아래로 Layer → Layout → 콘텐츠(Text/Video/Rectangle/Polygon/Image) → Appearance → Effects → Mask → Modifiers → Timeline 순서입니다. 선택한 레이어 종류에 해당하지 않는 섹션은 표시되지 않습니다.
Frame (아트보드) 선택 시
아트보드 라벨(또는 레이어 패널의 섹션 헤더)을 클릭해 Frame 자체를 선택하면 인스펙터가 Frame 편집 모드로 바뀝니다.
- Name — 프레임 이름.
- Preset — 내장 크기 프리셋(1920×1080 (16:9), 1280×720 (16:9), 1080×1080 (1:1), 1080×1920 (9:16), 1440×1024). 선택하면 프레임이 그 크기로 리사이즈됩니다(레이어는 각자의 제약(Constraints)에 따라 재배치). 현재 크기가 목록에 없으면 Custom으로 표시됩니다.
- Size (W, H) — 크기를 숫자로 직접 입력.
- Background — 배경색(불투명도 포함).
- 문서에 프레임이 둘 이상이면 Delete 키로 선택한 프레임을 삭제할 수 있습니다.
Layer (레이어)
- Name — 레이어 이름(레이어 패널에서 더블클릭해도 바꿀 수 있음).
Layout (배치)
- Alignment(정렬) — 섹션 최상단의 6개 버튼으로 선택 요소를 정렬합니다. 왼쪽 그룹: 좌/가운데(가로)/우 정렬, 오른쪽 그룹: 상/가운데(세로)/하 정렬. 여러 개를 선택하면 선택 묶음 기준으로, 하나면 아트보드 기준으로 정렬됩니다.
- Position (X, Y) — 요소 위치(좌상단 기준).
- Size (W, H) — 너비/높이. 사이에 있는 자물쇠(비율 고정) 를 켜면 W/H 한쪽을 바꿔도 원래 비율이 유지되고, 리사이즈 핸들 드래그도 비율이 고정됩니다(맥에서는 Shift로도 가능). 자물쇠 상태는 레이어별로 문서에 저장됩니다(Undo 가능). (패스 도형은 실제 패스 범위를 표시하며, 값을 바꾸면 패스가 그 크기로 변형됩니다.)
- Scale (X %, Y %) — 상자 크기와 별개인 변환 배율(100 = 원본). 키프레임의 Scale X/Y 트랙과 Constraints 의 Scale 이 바꾸는 값입니다. Size 는 항상 화면에 보이는 크기(상자 × 배율)를 표시하며, 배율이 걸린 상태에서 Size 를 편집하거나 캔버스에서 리사이즈하면 배율이 크기에 흡수되어 Scale 은 100% 로 돌아갑니다(획 두께·모서리 등도 함께 조정되어 모양은 그대로). 타임라인이 켜져 있으면 그 시점의 Size/Scale 키프레임에 기록됩니다.
- Rotation — 회전 각도. 숫자 입력 또는 다이얼(노브) 을 돌려 설정합니다. 노브는 현재 값에서 돌린 만큼 더하거나 빼는 상대 방식이라(시계 방향 +, 반시계 −) −60° 에서 조금 돌리면 −50° 처럼 이어지고 값이 0–360° 로 갑자기 바뀌지 않습니다.
- Constraints(제약) — 부모(Frame 또는 Group)의 크기가 바뀔 때 요소가 어떻게 따라갈지 정합니다(Figma 방식). 기본값은 Left / Top(부모 좌상단에 고정 = 지금까지의 절대 위치). 가로·세로 각각 아래에서 하나씩 선택합니다.
- 가로: Left(왼쪽 가장자리 간격 고정) · Right(오른쪽 가장자리 간격 고정) · Left and Right(양쪽 간격 고정 → 폭이 늘어남) · Center(부모 가로 중심 기준 오프셋 유지) · Scale(부모 폭에 비례해 위치·크기 스케일).
- 세로: Top · Bottom · Top and Bottom(높이가 늘어남) · Center · Scale.
- 두 개의 드롭다운으로 정하거나, 오른쪽 핀 위젯의 막대를 눌러 가장자리 고정을 토글합니다(한쪽 → 반대쪽까지 누르면 양쪽 고정, 다시 누르면 Center). Center·Scale은 드롭다운으로 선택합니다.
- 제약을 바꿔도 요소는 움직이지 않습니다(현재 위치에서 간격을 다시 계산). 실제 재배치는 부모가 리사이즈될 때 일어납니다. *맥에서 Frame(아트보드) 크기를 바꾸면 즉시 반영됩니다.*
Text (텍스트)
텍스트 요소 선택 시 표시됩니다.
- Content — 텍스트 내용(여러 줄 가능).
- Font — 설치된 폰트 패밀리 선택(맨 위 "System" = 시스템 기본 폰트).
- Weight — 굵기(Thin ~ Black).
- Italic — 이탤릭 토글.
- Size — 폰트 크기.
- Alignment — 정렬(왼쪽/가운데/오른쪽/양쪽).
- Line Height — 줄 간격(배수).
- Tracking — 자간(pt).
- Resizing — 상자가 내용을 따라가는 방식(Figma의 텍스트 리사이징과 같음).
- Auto Width(↔) — 한 줄로 두고 폭이 내용에 맞춰 늘어남(직접 넣은 줄바꿈만 줄이 바뀜).
- Auto Height(↕) — 폭은 고정, 줄바꿈된 줄 수에 맞춰 높이가 따라옴.
- Fixed Size(□) — 폭·높이 모두 고정(내용이 넘칠 수 있음).
- 내용·폰트·크기·자간 등을 바꾸면 Auto 모드의 상자가 다시 맞춰집니다. 이때 위쪽 가장자리와 정렬 기준 가장자리(왼쪽 정렬이면 왼쪽, 가운데 정렬이면 중심, 오른쪽 정렬이면 오른쪽)는 제자리에 남습니다.
- 캔버스에서 상자를 손으로 리사이즈하면 모드가 바뀝니다: Auto Width 상자를 옆으로 늘리면 Auto Height 로, Auto 상자의 높이를 바꾸면 Fixed Size 로 전환됩니다.
- 캔버스에서 텍스트를 더블클릭하거나 ⏎ 을 눌러 제자리에서 편집할 수도 있습니다. 벡터 편집 참고.
Video (동영상)
동영상 요소 선택 시 표시됩니다.
- Clip Start / Trim In / Trim Out — 타임라인 배치 시각과 시작·끝 트림(초).
- Auto Rewind (Loop) — 동영상을 전체 애니메이션 내내 반복 재생합니다. 반복되는 구간은 켜는 순간의 Trim In~Trim Out 구간(Split Clip 으로 나눈 조각 포함)입니다. 켜면 Trim Out(끝 시각)을 원본 길이보다 크게 늘릴 수 있고(애니메이션 길이까지), 켜는 순간 애니메이션이 클립보다 길면 끝까지 자동으로 늘어납니다. 끄면 Trim Out 이 켜기 전 구간으로 되돌아가 나눠 둔 조각이 유지됩니다. 반복이 처음으로 되돌아가는 지점에는 타임라인 클립 바에 ↺ 아이콘이 표시됩니다(맥). 재생·내보내기(영상/오디오) 모두 반복됩니다.
- Cursor Highlight / Zoom × — 화면 녹화 클립의 커서 강조·자동 줌 세기.
Rectangle (사각형)
- Corner Radius — 모서리 둥글기.
Polygon (다각형) / Star (별)
다각형 또는 별 요소 선택 시 표시됩니다(별이면 섹션 제목이 Star).
- Sides / Points — 변(꼭짓점) 개수(3~24). 스테퍼로 조절하면 즉시 모양이 바뀝니다.
- Inner Radius — (별만) 안쪽 반지름(바깥 반지름 대비 %). 값이 작을수록 뾰족한 별이 됩니다.
- Corner Radius — 모서리 둥글기.
Image (이미지 · 비디오)
이미지/비디오 요소 선택 시 표시됩니다.
- Corner Radius — 이미지·비디오 모서리를 둥글게 잘라냅니다(내보내기·양쪽 플랫폼 동일하게 반영).
이미지·비디오를 추가할 때, 원본이 아트보드보다 크면 비율을 유지한 채 아트보드 안에 들어오도록 축소됩니다(넘치지 않음).
Appearance (모양)
- Opacity — 불투명도. 슬라이더 또는 % 숫자 입력.
- Fill (채움) — 켜고/끄기. Solid / Gradient 선택.
- Solid: HEX 입력(
#RRGGBB, 투명도 포함 시#RRGGBBAA,#RGB단축형), 스포이드 버튼(화면 어디든 색 추출, 단축키 I), 또는 색상 피커. - Gradient: 타입(Linear/Radial/Angular), 각도(Linear/Angular), 여러 스톱(각 스톱의 색·위치(%) 편집, Add Stop / − 로 추가·삭제)을 지정.
- 그라디언트 레이어를 선택하면 캔버스에 그라디언트 에디터가 나타납니다(Figma/Sketch 스타일):
- 축 선 과 양 끝의 끝점 핸들(원) — 끝점을 드래그하면 각도가 바뀝니다.
- 각 스톱이 축 위에 색상 사각형으로 표시됩니다. 클릭하면 선택(파란 테두리 + 위치 % 배지), 드래그하면 위치(0~100%)가 바뀝니다.
- 축 선 위를 더블클릭하면 그 위치에 보간된 색으로 새 스톱을 추가합니다.
- Radial/Angular: 타원형 외곽선과 함께 축에 수직인 핸들(원) 이 표시됩니다. 이 핸들을 드래그하면 종횡비(aspect) 가 바뀌어 그라디언트가 타원형으로 늘어나거나 눌립니다.
- 각도·종횡비는 키프레임으로 애니메이션됩니다(같은 종류 그라디언트끼리).
- Solid: HEX 입력(
- Stroke (선) — 켜고/끄기. 색상(HEX/피커)과 Weight(두께) 설정.
Effects (이펙트)
레이어 이펙트는 한 섹션에 모여 있고, 각 이펙트는 토글로 켤 때만 세부 값이 펼쳐집니다. 그림자는 오른쪽 ⊕ 로 추가합니다.
Shadows (그림자)
드롭 섀도우를 레이어 뒤에 드리웁니다. 여러 개를 쌓을 수 있어 다중 그림자 표현이 가능합니다(목록 위쪽 그림자가 앞에 그려짐).
- Add Shadow — 그림자를 추가합니다(기본: 검정 35%, 아래로 4pt, 흐림 8pt).
- 각 그림자 행:
- 색상 피커 — 그림자 색·불투명도(알파).
- Offset (X, Y) — 그림자 위치 오프셋(+Y는 아래쪽).
- Blur — 흐림 정도(pt).
- − 버튼 — 해당 그림자 삭제.
- 그림자는 캔버스 미리보기와 이미지/동영상 내보내기에 반영됩니다. (Lottie 내보내기에서는 효과가 생략됩니다.)
Blur (레이어 블러)
레이어 전체에 가우시안 블러를 적용합니다. Core Image CIGaussianBlur 기반, 미리보기·내보내기(이미지/동영상)에 동일하게 반영됩니다.
- 제목 줄의 토글 — 켜기/끄기.
- Radius — 블러 반경(pt). 클수록 더 흐려집니다. 라벨 옆 다이아몬드(◇) 로 키프레임을 찍어 반경을 애니메이션할 수 있습니다(포커스 인/아웃 연출).
블러·보케 등 여러 효과를 한 레이어에 함께 켤 수 있으며, 목록 순서대로 적용됩니다.
Color Adjust (색 보정)
레이어 색을 보정합니다. Core Image(CIColorControls·CIExposureAdjust·CIHueAdjust) 기반, 미리보기·내보내기(이미지/동영상)에 동일하게 반영됩니다.
- 제목 줄의 토글 — 켜기/끄기. (모든 값이 기본값이면 화면 변화 없음.)
- Brightness — 밝기(-1~1, 0=기본).
- Contrast — 대비(0~4, 1=기본).
- Saturation — 채도(0~4, 1=기본, 0=흑백).
- Exposure — 노출/EV(-4~4, 0=기본).
- Hue — 색조 회전(-180°~180°, 0=기본).
- 각 항목은 라벨 옆 다이아몬드(◇) 로 키프레임을 찍어 애니메이션할 수 있습니다(예: 서서히 흑백으로, 노출 플래시).
Vignette (비네트)
레이어 가장자리를 어둡게 해 시선을 안쪽으로 모읍니다(스포트라이트/포커스 연출). Core Image CIVignette 기반.
- 제목 줄의 토글 — 켜기/끄기.
- Intensity — 어둡게 하는 강도(0~2, 0=없음).
- Radius — 비네트 크기/감쇠(0~3, 클수록 어두운 링이 바깥쪽).
- 각 항목은 다이아몬드(◇) 로 키프레임 애니메이션 가능.
Pixellate (모자이크)
레이어를 사각 블록으로 뭉개 모자이크 처리합니다(민감정보 가리기/스타일). Core Image CIPixellate 기반.
- 제목 줄의 토글 — 켜기/끄기.
- Block Size — 블록 크기(pt). 클수록 더 거칠게 뭉개집니다. 다이아몬드(◇) 로 키프레임 애니메이션 가능.
Bokeh (렌즈 블러)
레이어에 피사계 심도(보케) 블러를 적용합니다. 밝고 초점이 나간 부분이 부드러운 원형 보케 디스크로 번집니다(배경·장식용). Core Image CIBokehBlur 기반, 미리보기·내보내기(이미지/동영상) 동일하게 반영됩니다.
- 제목 줄의 토글 — 켜기/끄기.
- Radius — 보케 디스크 반경(pt). 클수록 더 흐려지고 번짐이 큽니다. 라벨 옆 다이아몬드(◇) 로 현재 시각에 키프레임을 찍어 반경을 애니메이션할 수 있습니다(초점이 서서히 맞거나 흐려지는 연출).
- Ring — 디스크 가장자리 링(도넛) 강조(0~1). 높일수록 보케 링이 뚜렷해집니다.
성능: 블러는 비교적 무거운 연산이지만, 같은 모양·배율의 결과는 캐시되어 이후 다시 그릴 때(다른 레이어 편집·이동·확대 없이 재렌더) 즉시 재사용됩니다. 그래도 켠 레이어가 많거나 반경이 매우 크면 느려질 수 있습니다. 그림자·다른 효과와 함께 적용할 수 있습니다. Lottie 내보내기에서는 생략됩니다.
Mask (마스크)
Use as Mask (Figma 방식 마스크)
- 제목 줄의 토글 — 이 레이어를 마스크로 지정합니다. 같은 그룹에서 이 레이어 위에 있는 레이어들이 마스크 모양 안에서만 보이고, 마스크 자신은 그려지지 않습니다. (Arrange ▸ Use as Mask, ⌃⌘M 과 동일)
- Type — Alpha(투명도) / Vector(외곽선만) / Luminance(밝기). 자세한 동작은 레이어 참고.
Crop (크롭)
이 레이어를 사각형/타원으로 잘라냅니다(레이어 자기 자신 클립). 두 도형으로 서로를 마스킹하려면 위의 Track Matte를 쓰세요.
- 제목 줄의 토글 — 크롭 켜기/끄기.
- Shape — Rectangle / Ellipse. (Ellipse로 바꾸면 즉시 타원으로 잘려 보입니다.)
- Inset — 가장자리에서 안쪽으로 줄이는 양(pt).
- Mode — Add(안쪽만) / Subtract(바깥쪽만) / Intersect.
- Inverted — 안/밖 반전.
- Draw Path… / Redraw Path… — 누르면 펜 모드로 바뀌고, 캔버스에 자유곡선 외곽선을 그리면 그 모양이 이 레이어의 마스크가 됩니다(닫힌 영역). Use Shape 로 사각/타원 모드로 되돌립니다.
- 내보낼 때 Lottie 레이어 마스크(
masksProperties)로 출력됩니다.
Sound (사운드)
비디오 레이어와 오디오 레이어에 표시됩니다.
- Mute — 이 클립의 소리를 끕니다(재생·내보내기 모두). 레이어나 그 부모 프레임/그룹을 숨겨도 소리가 함께 꺼집니다(보이지 않는 것은 들리지 않음). 영상은 감추고 소리만 남기려면 레이어의 Opacity 를 0 으로 두세요.
- Volume — 전체 레벨(0–200%, 100 = 원본). 슬라이더는 즉시 반영, 숫자 입력은 Return 시 반영.
- Fade In / Fade Out — 클립이 들리는 구간의 시작에서 올라오는 시간 / 끝에서 내려가는 시간(초). 트림·등장/퇴장으로 실제 들리는 구간이 줄면 그 구간의 양끝 기준으로 적용되고, Auto Rewind 로 반복되는 클립도 전체 구간에 한 번만 페이드됩니다.
- 오디오 레이어에는 Duration / Clip Start / Trim In / Trim Out 도 여기에 표시됩니다(비디오의 Video 섹션과 같은 의미). 타임라인의 클립 바 드래그·트림, Capture ▸ Split Clip at Playhead 도 오디오 클립에 동일하게 동작합니다.
- 타임라인 클립 바에는 페이드 구간이 어두운 쐐기로, 음소거는 스피커 아이콘으로 표시됩니다.
Track Matte (트랙 매트)
레이어를 바로 앞(위)에 있는 레이어로 마스킹합니다(앞 레이어가 있을 때 표시).
- Track Matte — None / Alpha / Alpha Inverted / Luma / Luma Inverted.
- Alpha: 앞 레이어가 불투명한 영역만 이 레이어가 보입니다(Inverted는 반대).
- Luma: 앞 레이어의 밝기를 마스크로 사용(앱 미리보기에서는 알파로 근사, 내보낸 Lottie에서는 정확).
- 매트로 쓰인 앞 레이어는 직접 그려지지 않고 마스크로만 소비됩니다.
Modifiers (모디파이어)
도형 레이어에서만 표시됩니다.
Trim Path (트림 패스)
도형(사각형/타원/다각형/패스) 선택 시 표시됩니다. 외곽선을 일부만 보이게 잘라, 선이 그려지는(draw-on) 연출을 만듭니다.
- Trim — Start % / End %: 보이는 구간의 시작·끝(0~100%). 예: Start 0 → End 0→100을 애니메이션하면 선이 그려지는 효과.
- Offset — 시작점을 회전(도).
- 라벨 옆 다이아몬드(◇) 로 현재 시각에 키프레임을 찍어 Start/End/Offset을 애니메이션할 수 있습니다.
Repeater (리피터)
도형 선택 시 표시됩니다. 같은 도형을 여러 개로 복제하며 점점 변형/페이드시킵니다.
- 제목 줄의 토글 — 리피터 켜기/끄기.
- Copies — 복제 개수.
- Offset (X, Y) — 복제마다 누적되는 이동량.
- Rotation — 복제마다 누적되는 회전(도).
- Scale — 복제마다 누적되는 크기(%).
- Opacity (start, end) — 첫 복제 → 마지막 복제의 불투명도(점점 사라지게 가능).
Point (패스 앵커)
패스 앵커를 선택하면 표시됩니다.
- Position (X, Y) — 선택한 앵커의 좌표(로컬). 직접 입력해 정밀하게 이동합니다.
Keyframe 배너
타임라인이 켜져 있으면 인스펙터 상단에 현재 어느 키프레임을 편집 중인지 항상 표시됩니다.
- "Baseline keyframe · 0.00s" — 첫(기준) 키프레임.
- "Keyframe 2 / 4 · 1.50s" — 해당 키프레임.
- "Edits add a keyframe at …" — 키프레임이 아닌 시각(편집 시 그 시각에 키프레임이 생김).
자세한 내용은 애니메이션 참고.