사용 안내서 취소

Animate를 사용하여 타임라인 레이어 만들기

  1. Adobe Animate 사용 안내서
  2. Animate 소개
    1. Animate의 새로운 기능
    2. 시각적 용어집
    3. Animate 시스템 요구 사항
    4. Animate 키보드 단축키
    5. Animate에서 여러 파일 유형을 사용하여 작업하기
  3. 애니메이션
    1. Animate의 애니메이션 기본 사항
    2. Animate에서 프레임 및 키프레임을 사용하는 방법
    3. Animate의 프레임별 애니메이션
    4. Animate에서 클래식 트윈 애니메이션으로 작업하는 방법
    5. 브러시 도구
    6. 모션 안내선
    7. 모션 트윈 및 ActionScript 3.0
    8. 모션 트윈 애니메이션 정보
    9. 모션 트윈 애니메이션
    10. 모션 트윈 애니메이션 만들기
    11. 속성 키프레임 사용
    12. 트윈으로 위치에 애니메이션 적용
    13. 모션 편집기를 사용하여 모션 트윈을 편집하는 방법
    14. 트윈 애니메이션의 모션 경로 편집
    15. 모션 트윈 조작
    16. 사용자 정의 속도 추가
    17. 모션 사전 설정 만들기 및 적용
    18. 애니메이션 트윈 범위 설정
    19. XML 파일로 저장한 모션 트윈을 사용한 작업
    20. 모션 트윈과 클래식 트윈의 비교
    21. 모양 트윈 만들기
    22. Animate에서 뼈 도구 애니메이션 사용하기
    23. Animate에서 캐릭터 리깅으로 작업하기
    24. Adobe Animate에서 마스크 레이어를 사용하는 방법
    25. Animate에서 장면으로 작업하는 방법
  4. 대화형 기능
    1. Animate로 버튼을 만드는 방법
    2. Animate 프로젝트를 다른 문서 유형 포맷으로 변환
    3. Animate에서 HTML5 Canvas 문서를 만들고 게시하기
    4. Animate에서 코드 조각을 사용하여 대화형 기능 추가하기
    5. 사용자 정의 HTML5 구성 요소 만들기
    6. HTML5 Canvas의 구성 요소 사용
    7. 사용자 정의 구성 요소 만들기: 예제
    8. 사용자 정의 구성 요소의 코드 조각
    9. 모범 사례 - Animate를 사용한 광고
    10. 가상 현실 제작 및 게시
  5. 작업 영역 및 작업 과정
    1. 칠 브러시 만들기 및 관리
    2. HTML5 Canvas 문서에서 Google Fonts 사용
    3. Creative Cloud 라이브러리와 Adobe Animate 사용
    4. Animate의 스테이지 및 도구 패널 사용
    5. Animate 작업 과정 및 작업 영역
    6. HTML5 Canvas 문서에서 웹 글꼴 사용
    7. 타임라인과 ActionScript
    8. 여러 타임라인을 사용한 작업
    9. 환경 설정
    10. Animate 제작 패널 사용
    11. Animate로 타임라인 레이어 만들기
    12. 모바일 앱 및 게임 엔진용으로 애니메이션 내보내기
    13. 객체 이동 및 복사
    14. 템플릿
    15. Animate의 찾기 및 바꾸기
    16. 실행 취소, 다시 실행 및 작업 내역 패널
    17. 키보드 단축키
    18. Animate에서 타임라인을 사용하는 방법
    19. HTML 확장 만들기
    20. 이미지 및 애니메이션 GIF에 대한 최적화 옵션
    21. 이미지 및 GIF에 대한 내보내기 설정
    22. Animate의 에셋 패널
  6. 멀티미디어 및 비디오
    1. Animate의 그래픽 객체 변형 및 결합
    2. Animate에서 심볼 인스턴스를 만들고 작업하기
    3. 이미지 추적
    4. Adobe Animate에서 사운드를 사용하는 방법
    5. SVG 파일 내보내기
    6. Animate에서 사용할 비디오 파일 만들기
    7. Animate에서 비디오를 추가하는 방법
    8. 비디오 큐 포인트를 사용한 작업
    9. Animate로 객체 그리고 만들기
    10. 선 및 모양 변형
    11. Animate CC의 획, 채우기 및 그래디언트
    12. Adobe Premiere Pro 및 After Effects 작업
    13. Animate CC의 색상 패널
    14. Animate에서 Flash CS6 파일 열기
    15. Animate의 클래식 텍스트 작업
    16. Animate에 아트워크 가져오기
    17. Animate의 가져온 비트맵
    18. 3D 그래픽
    19. Animate의 심볼 작업
    20. Adobe Animate로 선 및 모양 그리기
    21. Animate의 라이브러리 작업
    22. 사운드 내보내기
    23. Animate CC의 객체 선택
    24. Animate의 Illustrator AI 파일 작업
    25. 스프레이 브러시 도구로 패턴 적용하기
    26. 블렌드 모드 적용
    27. 객체 배열
    28. 명령 메뉴를 사용한 작업 자동화
    29. 다국어 텍스트
    30. Animate에서 카메라 사용하기
    31. Animate를 Adobe Scout와 함께 사용하기
    32. Fireworks 파일 작업
    33. 그래픽 필터
    34. 사운드 및 ActionScript
    35. 드로잉 환경 설정
    36. 펜 도구로 그리기
  7. 플랫폼
    1. Animate 프로젝트를 다른 문서 유형 포맷으로 변환
    2. 사용자 정의 플랫폼 지원
    3. Animate에서 HTML5 Canvas 문서 만들고 게시하기
    4. WebGL 문서 만들고 게시하기
    5. iOS용 AIR에 맞추어 애플리케이션을 패키징하는 방법
    6. Android용 AIR 애플리케이션 게시
    7. 데스크톱용 Adobe AIR에 맞춘 게시
    8. ActionScript 게시 설정
    9. 모범 사례 - 애플리케이션에서 ActionScript 구성
    10. Animate에서 ActionScript를 사용하는 방법
    11. 모범 사례 - 액세스 가능성 지침
    12. Animate 작업 영역의 액세스 가능성
    13. 스크립트 작성 및 관리
    14. 사용자 정의 플랫폼에 대한 지원 활성화
    15. 사용자 정의 플랫폼 지원 개요
    16. 액세스 가능한 콘텐츠 만들기
    17. 사용자 정의 플랫폼 지원 플러그인 작업
    18. ActionScript 3.0 디버깅
    19. 사용자 정의 플랫폼에 대한 지원 활성화
  8. 내보내기 및 게시
    1. Animate CC에서 파일을 내보내는 방법
    2. OAM 게시
    3. SVG 파일 내보내기
    4. Animate를 사용하여 그래픽 및 비디오 내보내기
    5. AS3 문서 게시
    6. 모바일 앱 및 게임 엔진용으로 애니메이션 내보내기
    7. 사운드 내보내기
    8. QuickTime 비디오 파일 내보내기
    9. ActionScript로 외부 비디오 재생 제어하기
    10. 모범 사례 - 모바일 장치 콘텐츠 만들기 팁
    11. 모범 사례 - 비디오 규칙
    12. 모범 사례 - SWF 애플리케이션 제작 지침
    13. 모범 사례 - FLA 파일 구조화
    14. Animate용 FLA 파일을 최적화하는 모범 사례
    15. ActionScript 게시 설정
    16. Animate용 게시 설정 지정
    17. 프로젝터 파일 내보내기
    18. 이미지 및 애니메이션 GIF 내보내기
    19. HTML 게시 템플릿
    20. Adobe Premiere Pro 및 After Effects 작업
    21. 애니메이션의 빠른 공유 및 게시

레이어 만들기 및 구성

레이어를 사용하면 문서의 아트워크를 쉽게 구성할 수 있습니다. 다른 레이어에 있는 객체에 영향을 주지 않고 레이어에서 객체를 그리거나 편집할 수 있습니다. 스테이지 영역에서 레이어에 아무것도 없으면 그 레이어를 통과하여 아래 레이어를 볼 수 있습니다.

레이어 또는 폴더를 그리거나 칠하거나 수정하려면 타임라인에서 레이어를 선택하여 활성화합니다. 타임라인에서 레이어나 폴더 이름 옆에 연필 아이콘이 표시되면 해당 레이어나 폴더가 활성화되었다는 것을 나타냅니다. 한 번에 여러 레이어를 선택할 수는 있지만, 한 번에 한 레이어만 활성화할 수 있습니다.

Animate 문서를 만들면 레이어가 하나만 포함되어 있습니다. 문서에서 아트워크, 애니메이션 및 다른 요소를 구성하려면 레이어를 추가합니다. 또한 레이어는 숨기거나 잠그거나 다시 배치할 수 있습니다. 만들 수 있는 레이어 개수는 컴퓨터의 메모리 크기에 의해서만 제한되며, 제작된 SWF 파일 크기가 레이어로 인해 늘어나지는 않습니다. 파일 크기에 영향을 주는 것은 레이어에 배치한 객체뿐입니다.

레이어를 구성하고 관리하려면 레이어 폴더를 만든 다음 해당 폴더에 레이어를 배치합니다. 스테이지에 표시되는 내용에 영향을 미치지 않고 타임라인에서 레이어 폴더를 확장하거나 축소할 수 있습니다. 사운드 파일, ActionScript, 프레임 레이블 및 프레임 주석에 대해 별도의 레이어 또는 폴더를 사용합니다. 별도의 레이어를 사용하면 해당 항목을 신속하게 찾아서 편집할 수 있습니다.

세밀한 효과를 만들려면 손쉽게 그리거나 편집하게 해주는 특수 안내선 레이어와 마스크 레이어를 사용합니다.

Animate에서는 5가지 유형의 레이어를 사용할 수 있습니다.

  • 일반 레이어에는 대부분의 아트워크가 FLA 파일로 포함되어 있습니다.

  • 마스크 레이어에는 마스크 레이어 아래에 있는 레이어의 선택한 부분을 숨기는 마스크로 사용되는 객체가 포함되어 있습니다. 자세한 내용은 마스크 레이어 사용을 참조하십시오.

  • 마스크가 적용된 레이어는 마스크 레이어에 연결할 마스크 레이어 아래에 있는 레이어입니다. 마스크에 의해 드러나는 마스크 레이어 부분만 표시됩니다. 자세한 내용은 마스크 레이어 사용을 참조하십시오.

  • 안내선 레이어에는 다른 레이어에서의 객체 배열을 안내하거나 다른 레이어에서의 클래식 트윈 애니메이션의 모션을 안내하는 데 사용할 수 있는 획이 포함되어 있습니다. 자세한 내용은 안내선 레이어경로를 따라 클래식 트윈 모션 만들기를 참조하십시오.

  • 안내 처리 레이어는 안내선 레이어에 연결된 안내선입니다. 안내 처리 레이어의 객체는 안내선 레이어의 획을 따라 배열되거나 애니메이션화될 수 있습니다. 안내 처리 레이어는 모션 트윈이 아닌 정적 아트워크 및 클래식 트윈을 포함할 수 있습니다.

  • 모션 트윈 레이어는 모션 트윈으로 애니메이션이 적용된 객체를 포함합니다. 자세한 내용은 트위닝된 애니메이션을 참조하십시오.

  • 뼈대 레이어는 역기구학 뼈가 연결된 객체를 포함합니다. 자세한 내용은 역기구학 애니메이션을 위한 뼈 툴 사용을 참조하십시오.

일반, 마스크, 마스크 처리 및 안내선 레이어는 모션 트윈 또는 역기구학 뼈를 포함할 수 있습니다. 이러한 항목이 이 레이어 중 하나에 있으면 레이어에 추가할 수 있는 내용 유형에 제한이 있습니다. 자세한 내용은 모션 트윈역기구학 애니메이션을 위한 뼈 툴 사용을 참조하십시오.

레이어 만들기

레이어를 만들면 선택한 레이어 위에 새 레이어가 생깁니다. 새로 추가한 레이어가 활성 레이어가 됩니다.

  1. 다음 중 하나를 수행합니다.
    • 타임라인 아래쪽에 있는 [새 레이어] 버튼 을 클릭합니다.

    • 삽입 > 타임라인 > 레이어를 선택합니다.

    • 타임라인에서 레이어 이름을 마우스 오른쪽 버튼으로 클릭(Windows)하거나 Command 키를 누른 상태에서 클릭(Macintosh)한 다음 컨텍스트 메뉴에서 레이어 삽입을 선택합니다.

레이어 폴더 만들기

  1. 다음 중 하나를 수행합니다.
    • 타임라인에서 레이어나 폴더를 선택한 다음 삽입 > 타임라인 > 레이어 폴더를 선택합니다.

    • 타임라인에서 레이어 이름을 마우스 오른쪽 버튼으로 클릭(Windows)하거나 Command 키를 누른 상태에서 클릭(Macintosh)한 다음 컨텍스트 메뉴에서 [폴더 삽입]을 선택합니다. 그러면 선택한 레이어나 폴더 위에 새 폴더가 표시됩니다.

    • 타임라인 아래쪽에 있는 [새 폴더] 아이콘 을 클릭합니다. 그러면 선택한 레이어나 폴더 위에 새 폴더가 표시됩니다.

레이어 및 레이어 폴더 구성

문서를 구성하려면 타임라인에서 레이어와 폴더를 다시 정렬합니다.

레이어 폴더는 레이어를 트리 구조로 배치하여 작업 과정을 구성합니다. 스테이지에 표시되는 레이어에 영향을 미치지 않고 폴더에 포함된 레이어를 보려면 폴더를 확장하거나 축소합니다. 폴더는 레이어와 다른 폴더를 포함할 수 있으므로 컴퓨터에서 파일을 구성하는 것과 거의 같은 방식으로 레이어를 구성할 수 있습니다.

타임라인에서 레이어를 제어하면 폴더 안의 전체 레이어에 영향을 미칩니다. 예를 들어, 레이어 폴더를 잠그면 폴더 안의 모든 레이어가 잠깁니다.

  • 레이어나 레이어 폴더를 레이어 폴더로 이동하려면 해당하는 이름을 대상 레이어 폴더 이름으로 드래그합니다.
  • 레이어나 폴더의 순서를 변경하려면 타임라인에서 하나 이상의 레이어 또는 폴더를 원하는 위치로 드래그합니다.
  • 폴더를 확장 또는 축소하려면 폴더 이름 왼쪽에 있는 삼각형 버튼을 클릭합니다.
  • 모든 폴더를 확장 또는 축소하려면 마우스 오른쪽 버튼을 클릭(Windows)하거나 Command 키를 누른 상태에서 클릭(Macintosh)하고 모든 폴더 확장 또는 모든 폴더 축소를 선택합니다.

레이어 또는 폴더 이름 변경

기본적으로 Animate에서는 레이어 1, 레이어 2 등과 같이 만들어지는 순서대로 새 레이어에 이름을 할당합니다. 내용을 구체적으로 표현하려면 레이어 이름을 변경합니다.

  1. 다음 중 하나를 수행합니다.
    • 타임라인에서 레이어나 폴더의 이름을 두 번 클릭한 다음 새 이름을 입력합니다.

    • 레이어나 폴더의 이름을 마우스 오른쪽 버튼으로 클릭(Windows)하거나 Command 키를 누른 상태에서 클릭(Macintosh)한 다음 컨텍스트 메뉴에서 속성을 선택합니다. [이름] 상자에 새 이름을 입력한 다음 [확인]을 클릭합니다.

    • 타임라인에서 레이어나 폴더를 선택한 다음 수정 > 타임라인 > 레이어 속성을 선택합니다. 이름 상자에 새 이름을 입력한 다음 확인을 클릭합니다.

레이어 또는 폴더 선택

  1. 다음 중 하나를 수행합니다.
    • [타임라인]에서 레이어나 폴더의 이름을 클릭합니다.

    • 선택할 레이어의 [타임라인]에서 아무 프레임이나 클릭합니다.

    • 선택할 레이어에 있는 [스테이지]의 객체를 선택합니다.

    • 연속된 레이어나 폴더를 선택하려면 타임라인에서 해당 이름을 Shift+클릭합니다.

    • 연속되지 않은 레이어나 폴더 여러 개를 선택하려면 타임라인에서 해당 이름을 Ctrl+클릭(Windows) 또는 Command+클릭(Macintosh)합니다.

단일 레이어에서 프레임 복사

  1. 레이어에서 프레임 범위를 선택합니다. 레이어 전체를 선택하려면 [타임라인]에서 레이어 이름을 클릭합니다.
  2. 편집 > 타임라인 > 프레임 복사를 선택합니다.

  3. 붙여넣기를 시작할 프레임을 클릭하고 편집 > 타임라인 > 프레임 붙여넣기를 선택합니다. 복사한 프레임의 정확한 수를 대상 타임라인에서 대체하려면 프레임 붙여넣기 및 덮어쓰기 옵션을 사용합니다.

    프레임 붙여넣기 및 덮어쓰기 작업 과정

    A. 프레임을 선택하고 복사합니다. B. 붙여넣으려는 대상 프레임을 마우스 오른쪽 버튼으로 클릭하고 [프레임 붙여넣기 및 덮어쓰기]를 선택합니다. C. 붙여넣는 프레임은 타임라인에서 정확히 동일한 수의 프레임을 덮어씁니다. 

레이어 폴더에서 프레임 복사

  1. 전체 폴더를 선택하려면 폴더를 축소(타임라인에서 폴더 이름 왼쪽의 삼각형 클릭)하고 폴더 이름을 클릭합니다. 

  2. 편집 > 타임라인 > 프레임 복사를 선택합니다.

  3. 폴더를 만들려면 삽입 > 타임라인 > 레이어 폴더를 선택합니다.

  4. 새 폴더를 클릭한 다음 편집 > 타임라인 > 프레임 붙여넣기를 선택합니다.

레이어 또는 폴더 삭제

  1. 레이어나 폴더를 선택하려면 [타임라인]에서 이름을 클릭하거나 레이어에서 프레임 중 하나를 클릭합니다.
  2. 다음 중 하나를 수행합니다.
    • 타임라인에서 레이어 [레이어 삭제] 버튼을 클릭합니다.

    • 레이어나 폴더를 [레이어 삭제] 버튼으로 드래그합니다.

    • 레이어나 폴더의 이름을 마우스 오른쪽 버튼으로 클릭(Windows)하거나 Command 키를 누른 상태에서 클릭(Macintosh)한 다음 컨텍스트 메뉴에서 레이어 삭제를 선택합니다.

     레이어 폴더를 삭제하면 포함된 레이어와 내용도 모두 삭제됩니다.

하나 이상의 레이어 또는 폴더 잠금/잠금 해제

  • 레이어나 폴더를 잠그려면 이름 오른쪽에 있는 자물쇠 모양 열을 클릭합니다. 레이어나 폴더를 잠금 해제하려면 자물쇠 모양 열을 다시 한 번 클릭합니다.

  • 모든 레이어 및 폴더를 잠그려면 자물쇠 모양 아이콘을 클릭합니다. 모든 레이어와 폴더를 잠금 해제하려면 자물쇠 모양 아이콘을 다시 한 번 클릭합니다.

  • 여러 레이어 또는 폴더를 잠그거나 잠금 해제하려면 자물쇠 모양 열을 드래그합니다.

  • 다른 모든 레이어 또는 폴더를 잠그려면 자물쇠 모양 열을 Alt 키를 누른 상태에서 클릭(Windows)하거나 Option 키를 누른 상태에서 클릭(Macintosh)합니다. 모든 레이어 또는 폴더의 잠금을 해제하려면 자물쇠 모양 열을 다시 Alt 키를 누른 상태에서 클릭하거나 Option 키를 누른 상태에서 클릭(Macintosh)합니다.

레이어 복사 및 붙여넣기(CS5.5만 해당)

타임라인에서 전체 레이어 및 레이어 폴더를 복사하여 같은 타임라인 또는 다른 타임라인에 붙여넣을 수 있습니다. 어떠한 유형의 레이어든 복사할 수 있습니다.

레이어를 복사하여 붙여넣으면 복사된 레이어의 레이어 폴더 구조가 유지됩니다.

  1. 레이어 이름을 클릭하여 타임라인에서 하나 이상의 레이어를 선택합니다. 인접한 레이어를 선택하려면 Shift 키를 누른 상태에서 클릭합니다. 인접하지 않은 레이어를 선택하려면 Control 키를 누른 상태에서 클릭(Windows)하거나 Command 키를 누른 상태에서 클릭(Macintosh)합니다.

  2. 편집 > 타임라인 > 레이어 복사 또는 레이어 잘라내기를 선택합니다. 레이어를 마우스 오른쪽 버튼으로 클릭하고 컨텍스트 메뉴에서 레이어 복사 또는 레이어 잘라내기를 선택할 수도 있습니다.

  3. 붙여넣을 대상인 타임라인에서, 붙여넣은 레이어를 삽입할 위치 바로 아래의 레이어를 선택합니다.

  4. 편집 > 타임라인 > 레이어 붙여넣기를 선택합니다.

레이어가 타임라인에서 선택한 레이어 위에 나타납니다. 레이어 폴더를 선택한 경우에는 붙여넣은 레이어가 폴더 안에 나타납니다.

레이어를 마스크 또는 안내선 레이어에 배치하려면 먼저 해당 마스크 또는 안내선 아래에서 레이어를 선택한 후에 붙여넣어야 합니다. 마스크나 안내선 레이어 아래에 마스크, 안내선 또는 폴더 레이어를 붙여넣을 수는 없습니다.

레이어를 선택하고 편집 > 타임라인 > 레이어 복제를 선택하여 레이어를 복제할 수도 있습니다. 새로운 레이어에는 레이어 이름에 “copy”라는 단어가 붙습니다.

여러 레이어에 속성 설정

  1. Animate에서 FLA 파일을 만들거나 기존 파일을 엽니다.

  2. 속성을 수정할 레이어를 선택하고 마우스 오른쪽 버튼을 클릭한 후 속성을 선택합니다.

  3. 레이어 속성 대화 상자에서 속성을 수정합니다.

  4. 확인을 클릭합니다.

레이어 또는 폴더 표시/숨기기

타임라인에서 레이어나 폴더 이름 옆의 빨간색 X 표시는 이 레이어나 폴더가 숨겨져 있음을 나타냅니다. [제작 설정]에서 SWF 파일을 제작할 때 숨겨진 레이어를 포함할 것인지 여부를 선택할 수 있습니다.

  • 레이어 또는 폴더를 숨기려면 타임라인에서 해당 레이어나 폴더 이름 오른쪽에 있는 눈 모양 열을 클릭합니다. 레이어 또는 폴더를 표시하려면 다시 한 번 클릭합니다.

  • 타임라인에 있는 모든 레이어와 폴더를 숨기려면 눈 모양 아이콘을 클릭합니다. 모든 레이어와 폴더를 표시하려면 자물쇠 모양 아이콘을 다시 한 번 클릭합니다.

  • 여러 레이어 또는 폴더를 표시하거나 숨기려면 눈 모양 아이콘 열을 드래그합니다.

  • 현재 레이어 또는 폴더를 제외한 모든 레이어 및 폴더를 숨기려면 눈 모양 아이콘 열을 Alt 키를 누른 상태에서 클릭(Windows)하거나 Option 키를 누른 상태에서 클릭(Macintosh)합니다. 모든 레이어와 폴더를 표시하려면 같은 방식으로 다시 한 번 클릭합니다.

레이어 내용을 외곽선으로 보기

객체가 속한 레이어를 구별하려면 한 레이어의 모든 객체를 색상이 있는 외곽선으로 표시합니다.

  • 해당 레이어의 모든 객체를 외곽선으로 표시하려면 레이어 이름 오른쪽의 외곽선 모양 열을 클릭합니다. 외곽선 표시를 해제하려면 다시 한 번 클릭합니다.

  • 모든 레이어의 객체들을 외곽선으로 표시하려면 외곽선 모양 아이콘을 클릭합니다. 모든 레이어의 외곽선 표시를 해제하려면 다시 한 번 클릭합니다.

  • 현재 레이어를 제외한 모든 레이어에서 객체를 외곽선으로 표시하려면 외곽선 열을 Alt 키를 누른 상태에서 클릭(Windows)하거나 Option 키를 누른 상태에서 클릭(Macintosh)합니다. 모든 레이어의 외곽선 표시를 해제하려면 같은 방식으로 다시 한 번 클릭합니다.

 레이어의 모션 경로에서도 레이어 외곽선 색상을 사용합니다.

레이어의 외곽선 색상 변경

  1. 다음 중 하나를 수행합니다.
    • 타임라인에서 해당 레이어 아이콘(레이어 이름 왼쪽에 있는 아이콘)을 두 번 클릭합니다.

    • 레이어 이름을 마우스 오른쪽 버튼으로 클릭(Windows)하거나 Command 키를 누른 상태에서 클릭(Macintosh)한 후 컨텍스트 메뉴에서 속성을 선택합니다.

    • 타임라인에서 레이어를 선택한 다음 수정 > 타임라인 > 레이어 속성을 선택합니다.

  2. 레이어 속성 대화 상자에서 외곽선 색상 팔레트를 클릭하고 새 색상을 선택한 다음 확인을 클릭합니다.

레이어 및 레이어 폴더 보기

레이어 또는 폴더 표시/숨기기

[타임라인]에서 레이어나 폴더 이름 옆에 빨간색 X 표시가 있다면 이 레이어나 폴더가 숨겨져 있음을 나타냅니다. 제작 설정에서 SWF 파일을 제작할 때 숨겨진 레이어를 포함할지 여부를 선택할 수 있습니다.

  • 레이어 또는 폴더를 숨기려면 타임라인에서 해당 레이어나 폴더 이름 오른쪽에 있는 눈 모양 열을 클릭합니다. 레이어 또는 폴더를 표시하려면 다시 한 번 클릭합니다.

  • 타임라인에 있는 모든 레이어와 폴더를 숨기려면 눈 모양 아이콘을 클릭합니다. 모든 레이어와 폴더를 표시하려면 자물쇠 모양 아이콘을 다시 한 번 클릭합니다.

  • 여러 레이어 또는 폴더를 표시하거나 숨기려면 눈 모양 아이콘 열을 드래그합니다.

  • 현재 레이어 또는 폴더를 제외한 모든 레이어 및 폴더를 숨기려면 눈 모양 아이콘 열을 Alt 키를 누른 상태에서 클릭(Windows)하거나 Option 키를 누른 상태에서 클릭(Macintosh)합니다. 모든 레이어와 폴더를 표시하려면 같은 방식으로 다시 한 번 클릭합니다.

레이어 내용을 외곽선으로 보기

객체가 속한 레이어를 구별하려면 한 레이어의 모든 객체를 색상이 있는 외곽선으로 표시합니다.

  • 해당 레이어의 모든 객체를 외곽선으로 표시하려면 레이어 이름 오른쪽의 외곽선 모양 열을 클릭합니다. 외곽선 표시를 해제하려면 다시 한 번 클릭합니다.

  • 모든 레이어의 객체들을 외곽선으로 표시하려면 외곽선 모양 아이콘을 클릭합니다. 모든 레이어의 외곽선 표시를 해제하려면 다시 한 번 클릭합니다.

  • 현재 레이어를 제외한 모든 레이어에서 객체를 표시하려면 외곽선을 Alt 키를 누른 상태에서 클릭(Windows)하거나 Option 키를 누른 상태에서 클릭(Macintosh)합니다. 모든 레이어의 외곽선 표시를 해제하려면 같은 방식으로 다시 한 번 클릭합니다.

레이어의 외곽선 색상 변경

  1. 다음 중 하나를 수행합니다.
    • 타임라인에서 해당 레이어 아이콘(레이어 이름 왼쪽에 있는 아이콘)을 두 번 클릭합니다.

    • 레이어 이름을 마우스 오른쪽 버튼으로 클릭(Windows)하거나 Command 키를 누른 상태에서 클릭(Macintosh)한 후 컨텍스트 메뉴에서 속성을 선택합니다.

    • 타임라인에서 레이어를 선택한 다음 수정 > 타임라인 > 레이어 속성을 선택합니다.

  2. 레이어 속성 대화 상자에서 외곽선 색상 팔레트를 클릭하고 새 색상을 선택한 다음 확인을 클릭합니다.

 레이어의 모션 경로에서도 레이어 외곽선 색상을 사용합니다.

레이어 투명도 설정

  1. Animate에서 FLA 파일을 하나 만들거나 기존 파일을 엽니다.

  2. 타임라인의 눈 모양 아이콘 열을 Shift 키를 누른 상태에서 클릭하여 표시 여부를 투명으로 설정합니다.

     Shift 키를 누른 상태에서 클릭하는 경우 숨겨진 레이어에는 영향을 주지 않습니다.

  3. 다음 옵션 중 하나를 사용하여 레이어 투명도를 설정합니다.

    • 임의의 레이어를 마우스 오른쪽 버튼으로 클릭하고 컨텍스트 메뉴에서 속성을 선택합니다. 레이어 속성 대화 상자에서 표시 여부 > 투명을 선택합니다.
    • 임의의 레이어를 마우스 오른쪽 버튼으로 클릭하고 다른 항목을 투명하게 표시
      를 선택합니다.
    레이어 속성
    레이어 속성

  4. 확인을 클릭합니다.

 레이어 투명도는 숨겨진 레이어에는 영향을 주지 않습니다.

고급 레이어 사용

Animate의 고급 레이어 모드에서 타임라인에 있는 모든 레이어는 기호로 제작됩니다. 고급 레이어 모드에서는 다음 기능에 액세스할 수 있습니다.

고급 레이어 모드는 기본적으로 활성화됩니다. 수정 > 문서 설정을 사용하여 고급 레이어를 활성화하거나 비활성화할 수 있습니다. 변경 사항을 적용한 후에는 기본으로 설정을 클릭하여 후속 문서를 위해 그리고 Animate 세션 전반에서 현재 설정을 보존할 수 있습니다. 

Animate에서 스크립트를 사용하여 이러한 심볼에 액세스할 때는 레이어를 객체로 사용하여 심볼을 호출해야 합니다. 예를 들어 고급 레이어를 사용하지 않을 때는 다음 샘플과 유사한 스크립트를 사용하여 심볼에 바로 액세스할 수 있습니다. 

getchildbyname("symbol1");

그러나 고급 레이어를 사용할 때는 다음 샘플과 유사한 스크립트를 사용하여 레이어를 통해서만 심볼에 액세스할 수 있습니다.

Layer=getchildbyname("L1");

Layer.getchildbyname("symbol1");

AS3 문서 유형용 고급 레이어를 사용하여 심볼에 액세스하기 위한 샘플 코드: 

Var Layer:MovieClip =MovieClip(getchildbyname("L1")); Layer.getchildbyname("symbol1");

HTML5 캔버스 문서 유형용 고급 레이어를 사용하여 심볼에 액세스하기 위한 샘플 코드: 

Layer=this.getchildbyname("L1"); Layer.getchildbyname("symbol1");

다음 그림은 고급 레이어를 사용하여 심볼에 액세스하는 방법 및 고급 레이어를 사용하지 않고 심볼에 액세스하는 방법을 보여 줍니다. 

고급 레이어를 사용/사용하지 않고 심볼에 액세스하는 방법을 보여 주는 그림
고급 레이어를 사용/사용하지 않고 심볼에 액세스하는 방법을 보여 주는 그림

 Animate에서 고급 레이어를 사용할 때 제작된 애니메이션 프로젝트의 크기가 늘어날 수 있습니다. 카메라 또는 레이어 심도 기능에 액세스할 때 문제가 있으면 고급 레이어가 ON 상태인지 확인합니다. 비활성화된 경우에는 예상되는 비헤이비어를 얻기 위해 활성화합니다.

레이어 효과 적용

지금까지 필터 및 색상 효과는 동영상 클립에만 적용할 수 있었습니다. 이제 고급 레이어를 통해 필터 및 색상 효과를 일부 프레임에 적용할 수 있습니다. 해당 프레임은 다시 모양, 드로잉 객체, 그래픽 심볼 등의 모든 컨텐츠에 적용됩니다. 프레임 간에 클래식, 모양 및 IK 트윈을 사용하여 레이어 효과를 트위닝할 수도 있습니다.

원하는 프레임을 선택하여 개별 프레임이나 여러 프레임에 레이어 효과를 적용할 수 있습니다. 전체 레이어를 선택하여 레이어의 모든 프레임에 레이어 효과를 적용할 수도 있습니다. 동영상 클립과 그래픽 심볼 같은 심볼의 타임라인에 그리고 모든 장면 사이에 레이어 효과를 적용할 수도 있습니다.

 레이어 효과는 고급 레이어 모드가 설정된 상태에서만 적용할 수 있습니다. 파일이 이 기능을 사용하도록 하기 위해 고급 레이어 모드를 명시적으로 활성화해야 할 수도 있습니다.

프레임에 필터 사용

특정 프레임에 필터를 추가하려면 먼저 프레임을 선택합니다. [속성 관리자] 패널이 프레임 고유 속성을 로드합니다. 필터 드롭다운 목록에서 + 아이콘을 클릭합니다. 

프레임 필터
프레임 필터

프레임에 필터를 추가할 때 다음 스크린샷에 나온 것과 같은 [속성 관리자]가 나타납니다. 

요구 사항에 따라 각 필터의 속성을 설정하고 프레임 레벨에서 적용할 수 있습니다. 트위닝은 모든 프레임 필터에 적용될 수 있습니다. 

속성 관리자의 프레임 필터 속성
속성 관리자의 프레임 필터 속성

 레이어 효과는 ActionScript 3 문서 유형에서만 지원됩니다. 모션 트윈 및 카메라 레이어는 레이어 효과를 지원하지 않습니다.

색상 효과 사용

특정 프레임에 색상 효과를 적용하려면 먼저 프레임을 선택합니다. [속성 관리자] 패널이 프레임 고유 속성을 로드합니다. [속성 관리자] 패널에서 원하는 색상 속성을 선택합니다.

색상 효과
색상 효과

혼합 모드 사용

특정 프레임에 혼합 모드를 적용하려면, 먼저 골조를 선택하고 골자 속성 패널의 디스플레이 구역에 목록화된 혼합 모드 선택하세요.

레이어 또는 프레임에 블렌딩을 적용할 때 양식과 드로잉 객체 그래픽 기호가 포함된 컨텐츠에 모두 적용됩니다. 하나의 레이어 위에 있는 모든 개체는 프레임에 적용된 혼합 모드에 따라 다른 레이어에 개체와 혼합됩니다.

레이어 혼합 모드

혼합 모드에 대한 자세한 내용은 혼합 모드 적용을 참조하십시오.

레이어 효과를 사용하여 애니메이션을 향상하는 방법

레이어 심도 적용

애니메이션 제작자는 심도가 구현된 것 같은 효과를 만들어 2D 애니메이션의 서로 다른 평면에 레이어를 배치할 수 있습니다. 

레이어 심도 패널에서 레이어 심도를 동적으로 변경할 수 있습니다. 레이어 심도 패널을 열려면 윈도우 > 레이어 심도를 클릭합니다.

각 레이어를 나타내는 레이어 심도
각 레이어를 나타내는 레이어 심도

 레이어 심도의 최소값 및 최대값을 -5000에서 10000 사이로 설정할 수 있습니다.

위의 스크린샷에 나와 있는 것처럼 지정된 프레임의 각 레이어 이름 옆에 레이어 심도 값이 표시됩니다.

  • 각 값 위에 마우스를 놓고 슬라이더를 오른쪽이나 왼쪽으로 드래그합니다.
  • 심도를 줄이려면 슬라이더를 왼쪽으로 드래그합니다. 심도를 높이려면 슬라이더를 오른쪽으로 드래그합니다. 
  • 작은 양수 값을 사용하여 가까이 있는 객체를 표시하고 큰 양수 값을 사용하여 멀리 있는 객체를 표시할 수 있습니다.

그런 다음 애니메이션의 트윈 범위에서 레이어 심도 값을 트위닝할 수 있습니다. 

각 레이어는 레이어 심도 패널에서 고유한 색상의 선으로 표시됩니다. 타임라인에서 각 레이어를 나타내는 색상을 확인할 수 있습니다. 

여러 색상으로 된 선을 위나 아래로 이동하여 각 레이어의 객체 심도를 높이거나 낮출 수도 있습니다.

  • 레이어의 객체 심도를 줄이려면 선을 클릭하고 위쪽 방향으로 드래그합니다.
  • 레이어의 객체 심도를 높이려면 선을 클릭하고 아래쪽 방향으로 드래그합니다.

레이어 심도를 적용한/적용하지 않은 애니메이션을 보여 주는 그림:

레이어 심도를 적용하지 않은 컨텐츠
레이어 심도를 적용하지 않은 컨텐츠

레이어 심도를 적용한 컨텐츠
레이어 심도를 적용한 컨텐츠

레이어 심도를 적용한 애니메이션을 보여 주는 그림:

다중 평면 레이어에서 카메라를 사용하여 시차 효과를 만들거나 평면의 컨텐츠를 확대할 수 있습니다. 또한 특정 레이어에 카메라를 고정할 수도 있고, 대화형 API를 사용하여 런타임에 카메라 효과를 적용할 수도 있습니다. 자세한 내용은 카메라 및 레이어 심도를 사용하여 시차 효과 만들기를 참조하십시오.

 레이어 심도는 기본 타임라인에만 적용될 수 있습니다.

레이어 심도에 대해 크기 유지

객체의 크기와 위치에 영향을 주지 않고 객체의 레이어 심도를 변경할 수 있습니다. 크기 유지 기능을 사용하려면 레이어 심도 패널의 오른쪽 위 모서리에 있는 크기 유지 버튼을 클릭합니다.

크기 유지 옵션은 다음과 같은 두 가지 모드로 사용할 수 있습니다.

  • 크기 유지 버튼을 클릭하고 원하는 레이어의 레이어 심도를 수정합니다. 크기 유지 버튼은 자동으로 전환됩니다.
  • Alt 키를 길게 눌러 크기 유지 옵션을 임시로 활성화하면서 레이어 심도 값을 드래그합니다.
레이어 심도에 대해 크기 유지
레이어 심도에 대해 크기 유지

런타임에 레이어 심도 적용

런타임에 객체에 카메라를 사용하고 카메라 API를 통해 효과를 적용할 수도 있습니다. 자세한 내용은 런타임에 대화형 카메라 사용을 참조하십시오. 

AS3용 레이어 심도 API

API를 사용하여 런타임에 레이어를 관리할 수 있습니다. 예를 들어 런타임에 애니메이션에 추가 레이어를 삽입하거나 애니메이션에 있는 레이어 중 하나의 심도를 줄일 수 있습니다. 

메서드

프로토타입

예제

설명

setLayerZDepth

fl.Layer.setLayerZDepth(timeline,
layerName,zDepth)

fl.Layer.setLayerZDepth("layerName", 100);

특정 레이어의 Z 심도 값을 설정합니다.

getLayerZDepth

fl.Layer.getLayerZDepth(layerName) : zDepth

fl.Layer.getLayerZDepth("layerName");

특정 레이어의 Z 심도 값을 반환합니다.

addNewLayer

fl.Layer.addNewLayer(layerName,
zDepth=0)

fl.Layer.addNewLayer("layerName",-80);

타임라인에 새 레이어를 추가하고 Z 심도를 설정합니다.

removeLayer

fl.Layer.removeLayer(layerName)

fl.Layer.removeLayer("layerName");

타임라인에서 레이어를 제거합니다.

HTML Canvas용 레이어 심도 API

메서드

프로토타입

예제

설명

setLayerZDepth

AdobeAn.Layer.setLayerZDepth(layerName,
zDepth)

console.log(fl.Layer.setLayerZDepth
("layerName",100));

특정 레이어의 Z 심도 값을 설정합니다.

getLayerZDepth

AdobeAn.Layer.getLayerZDepth(layerName)
:zDepth

console.log(fl.Layer.getLayerZDepth
("layerName"));

특정 레이어의 Z 심도 값을 반환합니다.

레이어 부모/자식 관리

Animate에서는 레이어 간에 부모/자식을 관리할 수 있습니다. 레이어 부모/자식 관리를 활용하면 애니메이션의 한 레이어/객체가 다른 레이어/객체를 손쉽게 제어하도록 할 수 있습니다. 애니메이션 디자이너 또는 게임 디자이너는 캐릭터를 구성하는 다양한 부분의 움직임을 보다 쉽게 제어할 수 있으므로 애니메이션 제작 시간을 단축할 수 있습니다.

레이어 부모/자식 관리 보기를 사용하려면 고급 레이어를 활성화해야 합니다. 기본적으로, 고급 레이어는 새 파일에 대해 설정되어 있습니다. 타임라인의 오른쪽 위 모서리에서 계층 구조 심볼 아이콘을 클릭하여 레이어 부모/자식 관리 보기를 활성화할 수 있습니다.

레이어 부모/자식 관리 표시
레이어 부모/자식 관리 표시

 뒤틀린 객체에 대한 부모/자식 관리는 자식 레이어 객체의 변형점이 부모 레이어 객체 위에 있을 때만 작동합니다.

부모 및 자식 레이어

부모/자식 관리 보기에서 레이어 1을 레이어 2로 드래그하면 레이어 1이 레이어 2(부모)의 자식이 됩니다. 자식 레이어의 객체는 고유한 속성을 지니고 있는 것과는 별개로 부모 레이어 객체의 위치 및 회전을 상속받습니다. 따라서 부모를 이동하거나 회전하면 자식도 부모를 따라 이동하거나 회전합니다. 여러 개의 부모-자식 관계를 만들어서 계층 구조를 만들 수 있습니다.

레이어 부모/자식 관리

레이어 핸들(색상 헤드)을 클릭하고 다른 레이어 위로 드래그하여 레이어 간을 연결할 수 있습니다. 또는 레이어 이름 옆에 있는 가로 직사각형 공간의 아무 곳이나 클릭하고 다른 레이어로 드래그할 수 있습니다. 레이어를 한 번 클릭하고 팝업 목록에서 부모 레이어를 선택할 수도 있습니다. 

선을 클릭하여 드래그하려고 하면 레이어 색상 헤드 가까이에 점선이 나타납니다. 클릭 및 드래그 동작을 해제하면 연결된 부모-자식으로 인해 두 레이어가 연결됩니다.

부모 레이어 설정
부모 레이어 설정

레이어 부모/자식 관리 보기 계층 구조의 맨 왼쪽 색상 헤드는 부모를 나타냅니다. 부모-자식 계층 구조는 왼쪽에서 오른쪽으로 이동합니다.

레이어의 색상 헤드를 클릭하고 점선을 드래그하여 놓음으로써 연결을 제거할 수 있습니다. 또는 아래의 스크린샷처럼 가로 공간을 클릭하고 부모 제거를 클릭할 수 있습니다. 

부모 제거
부모 제거

아래 스크린샷에서는 레이어 부모/자식 관리를 사용할 경우 레이어 계층 구조 및 위치의 전과 후를 비교해서 확인할 수 있습니다.

레이어 부모/자식 관리 적용 이전 및 이후
레이어 부모/자식 관리 적용 이전 및 이후

아래에는 인체의 각 부분에 대해 레이어 부모/자식 관리를 사용한 모습을 보여 주는 샘플 그림이 나와 있습니다.

레이어 부모/자식 관리를 사용한 신체 부분의 샘플 일러스트레이션
레이어 부모/자식 관리를 사용한 신체 부분의 샘플 일러스트레이션

위의 그림에서

  • 몸통은 인체의 모든 부분에 대한 부모입니다.
  • Legs_thigh은 Sneaker, Leg_lower, Ankle 등 다른 다리 부분의 부모입니다.
  • 머리는 부모인 목의 자식이고 몸통은 목의 부모입니다. 따라서 몸을 벗어나 목을 드래그할 때마다 머리 부분도 함께 이동하게 됩니다.

부모 자식 관리는 자식 레이어의 각 키프레임에 대해 설정해야 하는 프레임 속성입니다. 키프레임에서는 자식 레이어의 연결을 끊거나 자식 레이어를 다른 부모 레이어에 다시 연결할 수 있습니다.

부모/자식 관리에서 크기 조절, 기울이기, 뒤집기 지원

Animate 2022부터 부모 개체의 [위치] 및 [회전] 속성 외에도 [크기 조절], [기울이기] 및 [뒤집기] 속성을 전파할 수 있도록 확장되었습니다. 기본적으로 모든 속성이 표시됩니다. 그러나 아래와 같이 [타임라인] 패널에서 [부모/자식 보기 표시] 버튼을 길게 누르면 호출할 수 있는 [부모/자식 관리] 팝업에서 크기 조절, 기울이기, 뒤집기 전파를 끄거나 켤 수 있습니다.

Scale_Skew_1
부모/자식 관리에서 크기 조절, 기울이기, 뒤집기 지원

또한 [자유 변형] 도구로 변형할 때 수정자 키로 크기 조절, 기울이기, 뒤집기 전파 설정을 켜거나 꺼서 일시적으로 변경할 수 있습니다. 이 설정을 일시적으로 치환하려면 [자유 변형] 도구로 개체에 [크기 조절] 또는 [기울이기]를 적용할 때 액센트(`) 키를 누르고 있으면 됩니다. 이 기능은 새로 지원하는 속성의 전파 비헤이비어를 일시적으로 전환하고 싶을 때 유용합니다.

Scale_Skew_2
전파 설정을 전환하는 키보드 수정자

레이어 부모/자식 관리 튜토리얼

Adobe 로고

내 계정 로그인