Adobe Animate에서 중첩 심볼을 편집하는 동안 다른 캐릭터 부분을 미리 보는 방법

어떤 경로로 심볼에 들어가느냐에 따라 편집 맥락이 달라집니다. 라이브러리에서 심볼을 두 번 클릭하면 정의를 편집할 수 있습니다. 스테이지의 인스턴스에서 편집 모드로 심볼에 들어가면 주변 개체를 표시한 채 작업할 수 있습니다. Adobe는 이 두 가지를 심볼을 편집하는 별개의 방법으로 소개합니다. 라이브러리에서 작은 캐릭터 부분을 직접 열었다면 문서로 돌아가 조립된 캐릭터를 통해 들어가세요. Animate에서 심볼 사용하기

중첩되면 이 차이에 편집 단계가 더해집니다. 캐릭터 컨테이너에는 여러 부분이 들어갈 수 있고, 각 부분에 심볼이 더 들어갈 수도 있습니다. Adobe 문서에 따르면 무비 클립에는 자체 타임라인이 있으며 다른 무비 클립 안에 중첩할 수 있습니다. 아트워크를 변경하기 전에 조정하려는 부분이 어느 컨테이너에 속하는지 확인하세요. 여러 타임라인 사용하기

유용한 준비 방법은 경로를 일상적인 말로 설명하는 것입니다. 예를 들어 장면, 캐릭터, 머리, 특정 세부 요소 순으로 말할 수 있습니다. 이는 설명을 위한 이름일 뿐, 프로젝트에서 반드시 사용해야 하는 이름은 아닙니다. 이 경로를 따라가면 편집을 시작하기 전에 의도한 컨테이너에 들어왔는지 확인할 수 있습니다.

먼저 스테이지에 조립된 캐릭터가 보이는지 확인한 다음 아래 순서대로 진행하세요.

1. 캐릭터의 바깥쪽 심볼 인스턴스를 선택합니다.
2. Windows에서는 마우스 오른쪽 버튼을 클릭하고, macOS에서는 Control 키를 누른 채 클릭한 다음 편집 모드를 선택합니다.
3. 해당 컨테이너 안에서 필요한 중첩 부분을 선택하고 같은 명령으로 들어갑니다.
4. 변경하기 전에 스테이지 위의 편집 막대에서 심볼 이름을 확인합니다.

Adobe는 스테이지 인스턴스에서 사용하는 명령과 편집 막대에 현재 심볼이 표시되는 방식을 설명합니다. Webucator의 중첩 무비 클립 튜토리얼 원본에서도 편집 모드를 통해 컨테이너에 들어가 심볼 자체의 타임라인에서 내용을 편집하는 방법을 보여 줍니다. Adobe 심볼 편집 안내, Webucator 중첩 심볼 안내

캐릭터를 정확하게 조정하려면 각 단계에서 잠시 멈추고 다음 작업이 그 단계에서 수행되어야 하는지 확인하세요. 머리에 대해 세부 요소 전체를 이동하는 것과 그 요소 안의 아트워크 형태를 수정하는 것은 서로 다른 작업입니다. 의도한 변경에 필요한 깊이까지만 들어가세요. 그러면 편집 경로를 따라가기 쉽고, 결과의 배치도 더 쉽게 판단할 수 있습니다.

편집 모드로 들어간 뒤 보기 > 미리 보기 모드 > 전체를 선택하세요. Adobe는 전체 모드에서 스테이지의 모든 내용을 완전히 렌더링하며 표시 속도가 느려질 수 있다고 설명합니다. 같은 설명서에 따르면 미리 보기 모드 설정은 문서 내 편집 화면에 영향을 주지만 문서 내보내기 방식은 바꾸지 않습니다. Animate용 FLA 파일 최적화 모범 사례

심볼 편집 중 색이 흐려지는 현상을 없애기 위해 전체 모드를 사용하는 구체적인 방법은 캐릭터 디자이너이자 애니메이터인 Nick Tilcheff가 Adobe Community에 올린 답변 원본에서도 확인할 수 있습니다. 해당 답변은 2019년에 작성되었으며, 공식 설명서에는 전체 명령의 렌더링 동작이 별도로 설명되어 있습니다. 심볼을 두 번 클릭하면 스테이지가 투명해집니다

인접한 색상을 비교하거나 겹치는 부분을 확인하거나 전체 실루엣을 판단할 때는 전체 렌더링을 사용하세요. 편집 막대도 계속 확인하세요. 주변 부분을 완전히 렌더링하면 화면에 보이는 모양만으로는 현재 편집 중인 심볼을 판단하기 어렵습니다. 화면 표시가 느려지면 세부 작업에는 가벼운 미리 보기 모드를 사용하고 시각적으로 확인할 때 전체 모드로 돌아가세요.

변경해야 하는 항목에 맞춰 단계를 선택하세요. Adobe는 심볼의 아트워크와 개별 인스턴스의 속성을 구분합니다. 인스턴스마다 회전, 크기 조절, 색조 및 투명도를 각각 설정할 수 있습니다. 이 구분을 바탕으로 다음과 같이 결정할 수 있습니다. Animate에서 심볼 인스턴스 만들기 및 사용하기

의도한 변경	시작 위치	시각적으로 비교할 항목
인접한 부분에 맞춰 부분 전체를 재배치	해당 부분의 인스턴스가 포함된 컨테이너	간격, 정렬, 겹침
배치된 부분 하나를 회전하거나 크기 조절	해당 인스턴스가 포함된 타임라인	조립된 캐릭터에 맞는 비율
부분 안의 아트워크 형태를 수정	해당 부분의 심볼 내부	주변 아트워크와 비교한 수정된 윤곽
다른 세부 요소 안의 세부 요소를 조정	중첩 인스턴스를 따라 해당 세부 요소로 이동	바로 주변과 전체 캐릭터 모두

이 표는 심볼과 인스턴스의 차이를 바탕으로 권장하는 작업 방식입니다. 편집하기 전에 “이 세부 요소 전체를 머리 안에서 조금 이동한다”와 같이 의도한 결과를 한 문장으로 정리하세요. 편집한 뒤에는 그 관계를 다시 확인하세요. 위치, 형태, 크기를 한꺼번에 바꾸기보다 조정 목표를 분명히 하면 결과를 더 쉽게 검증할 수 있습니다.

주변 아트워크가 보이는지 확인하는 것과 움직임이 동기화되어 재생되는지 확인하는 것은 별개의 점검입니다. Adobe는 애니메이션이 적용된 그래픽 인스턴스가 이를 포함하는 타임라인에 연결되어 있으며 문서 편집 모드에서 애니메이션을 표시할 수 있다고 설명합니다. 무비 클립 심볼에는 독립된 타임라인이 있어 Animate 편집 환경에서는 정지된 상태로 표시됩니다. 전체 미리 보기 모드는 렌더링을 바꾸지만 이러한 타임라인 동작은 바꾸지 않습니다. 그래픽 및 무비 클립의 재생 동작

그래픽 인스턴스의 재생 설정은 속성 패널에서 확인하세요. Adobe는 반복, 한 번 재생, 단일 프레임 옵션을 설명합니다. 단일 프레임은 지정된 내부 프레임을 표시합니다. 주변 부분이 예상과 다른 자세로 보이면 아트워크를 수정하기 전에 해당 설정을 확인하세요. 그래픽 인스턴스 반복 설정

이 작업에서는 중첩된 세부 요소에 들어가기 전에 비교할 자세를 정하세요. 조정한 뒤에는 이를 포함하는 타임라인으로 돌아가 조립된 자세를 다시 확인하세요. 이렇게 하면 “이 부분이 여기에 잘 맞는가?”와 “애니메이션이 어떻게 진행되는가?”를 따로 살필 수 있으므로, 타이밍 문제를 진단할 때 표시 모드 변경에 의존하지 않아도 됩니다.

편집 모드에서 심볼을 편집해도 원본 심볼 자체가 변경됩니다. Adobe의 심볼 튜토리얼에서는 심볼을 업데이트하면 해당 심볼을 사용하는 모든 인스턴스가 함께 업데이트되는 것을 보여 줍니다. 장면의 맥락이 보이면 편집 내용을 판단하기 쉽지만, 그 심볼에 들어온 특정 인스턴스에만 변경이 제한되는 것은 아닙니다. 심볼 만들기

재사용 중인 부분의 형태를 수정하기 전에 수정 사항을 해당 심볼이 나타나는 모든 위치에 적용할지 결정하세요. 별도의 아트워크 변형을 만들려면 인스턴스를 선택하고 수정 > 심볼 > 심볼 복제를 선택할 수 있다고 Adobe는 설명합니다. 이렇게 하면 심볼이 복제되고 선택한 인스턴스가 복제본으로 대체됩니다. 인스턴스를 선택해 심볼 복제하기

캐릭터의 두 위치에 같은 작은 장식 심볼을 사용하는 경우를 예로 들어 보겠습니다. 두 위치 모두 새로운 윤곽으로 바뀌어야 한다면 공유 심볼을 편집하는 것이 적절합니다. 한 위치만 윤곽을 바꿔야 한다면 먼저 별도의 변형을 만드세요. 배치만 조정하려면 해당 컨테이너에서 인스턴스를 살펴보는 것부터 시작하세요.

편집 > 문서 편집을 사용하거나 편집 막대의 탐색 컨트롤을 사용해 문서로 돌아가세요. Adobe는 이 종료 방법을 안내하고, Webucator 튜토리얼에서는 편집 모드에서 나올 때 편집 막대의 왼쪽 화살표를 사용하는 방법을 보여 줍니다. Adobe 종료 안내, Webucator 편집 막대 예시

두 가지 배율에서 결과를 살펴보세요. 수정된 가장자리를 확인할 수 있을 만큼 가까이 확대하고, 캐릭터 전체를 판단할 수 있을 만큼 멀리 축소합니다. 변경하려던 관계를 비교하고, 편집한 심볼이 다른 곳에서도 사용된다면 그 위치도 확인하세요. 다음 편집에서 주변 맥락이 사라지면 스테이지 인스턴스를 거치는 경로를 다시 따라가세요. 주변 맥락이 흐리게 보일 뿐이라면 전체 미리 보기 모드를 확인하세요. 이 순서를 따르면 조립된 캐릭터를 유용한 참고 자료로 유지하면서 중첩 아트워크를 반복해서 편집할 수 있습니다.

• Adobe: Animate에서 심볼 사용하기
• Adobe: 여러 타임라인 사용하기
• Adobe: Animate에서 심볼 인스턴스 만들기 및 사용하기
• Adobe: Animate용 FLA 파일 최적화 모범 사례
• Adobe Learn: 심볼 만들기
• Adobe Community: 심볼을 두 번 클릭하면 스테이지가 투명해집니다
• Webucator: Adobe Animate에서 무비 클립 심볼 만드는 방법