topic난이도 · 약 20

라인 드로잉 리빌

Trim Paths로 로고 윤곽선을 한 획씩 그려내는 가장 클래식한 리빌 기법.

#라인 드로잉#Draw-on#Trim Paths#로고 리빌
왜 배우는가

Draw-on 리빌은 플러그인 없이 Shape Layer만으로 구현 가능하고, 미니멀·정교·프리미엄 느낌을 줘서 포트폴리오부터 기업 영상까지 범용성이 가장 높다.

라인 드로잉 리빌의 워크플로우: ① 로고를 벡터(AI/SVG)로 준비 → ② AE에 임포트 → Shape Layer 변환 → ③ Fill 제거, Stroke만 남김 → ④ Trim Paths 추가: End 0→100% → ⑤ 드로잉 완료 후 Fill Opacity 0→100%로 색 채움. 이 5단계가 기본 레시피다.

스크롤하면 JIT 로고가 한 획씩 그려집니다
단계시간속성이징
① 윤곽선 드로잉0~1.5초Trim Paths End: 0→100%Ease In-Out
② 색 채움1.2~2.0초Fill Opacity: 0→100%Ease Out
③ 세틀 + 글로우2.0~2.5초Glow Intensity: 50→0%Linear
④ 태그라인 등장2.3~3.0초Opacity + Y PositionEase Out

Path 순서의 함정 — 로고에 Path가 여러 개일 때, Trim Paths는 Path 목록의 순서대로 그린다. 로고의 좌측부터 그려지길 원하는데 Path 순서가 뒤죽박죽이면 어색해진다. Shape Group 내 Path 순서를 원하는 드로잉 순서에 맞게 정렬해야 한다.

Stroke Width 결정 — 로고의 원래 선 굵기와 동일하게 맞추는 것이 기본이다. 하지만 의도적으로 얇은 Stroke(1~2px)로 그린 뒤 Fill로 채우면 '스케치에서 완성작으로' 느낌이 난다. Stroke Width를 키프레임으로 서서히 줄이면서 Fill을 채우면 더 세련된다.

복잡한 로고 대응 — Path가 10개 이상인 복잡한 로고는 한 번에 Trim Paths로 그리면 너무 길어진다. 이때는 로고를 2~3그룹으로 분리하고, 각 그룹에 독립 Trim Paths를 적용한 뒤 0.2초 스태거로 순차 실행한다. 전체 드로잉 시간은 2초를 넘지 않는 것이 좋다.

실기 드릴 2문항
check_circle실기 드릴 · OX

라인 드로잉 리빌에서 Fill을 먼저 표시한 뒤 Stroke로 윤곽선을 그리는 것이 표준 순서다. (O/X)

edit실기 드릴 · 단답형

라인 드로잉 리빌에서 여러 Path가 원하는 순서대로 그려지지 않을 때, 어떤 것을 조정해야 하는가?