[파일] > [이미지 내보내기] 또는 [파일] > [애니메이션 처리된 GIF 내보내기]를 선택합니다.
- Adobe Animate 사용 안내서
- Animate 소개
- 애니메이션
- Animate의 애니메이션 기본 사항
- Animate에서 프레임 및 키프레임을 사용하는 방법
- Animate의 프레임별 애니메이션
- Animate에서 클래식 트윈 애니메이션을 사용하여 작업하는 방법
- 브러시 도구
- 모션 안내선
- 모션 트윈 및 ActionScript 3.0
- 모션 트윈 애니메이션 정보
- 모션 트윈 애니메이션
- 모션 트윈 애니메이션 만들기
- 속성 키프레임 사용
- 트윈으로 위치에 애니메이션 적용
- 모션 편집기를 사용하여 모션 트윈을 편집하는 방법
- 트윈 애니메이션의 모션 경로 편집
- 모션 트윈 조작
- 사용자 정의 속도 추가
- 모션 사전 설정 만들기 및 적용
- 애니메이션 트윈 범위 설정
- XML 파일로 저장한 모션 트윈을 사용한 작업
- 모션 트윈과 클래식 트윈의 비교
- 모양 트위닝
- Animate에서 뼈 도구 애니메이션 사용하기
- Animate에서 캐릭터 리깅으로 작업하기
- Adobe Animate에서 마스크 레이어를 사용하는 방법
- Animate에서 장면으로 작업하는 방법
- 대화형 기능
- 작업 영역 및 작업 과정
- 칠 브러시 만들기 및 관리
- HTML5 Canvas 문서에서 Google Fonts 사용
- Creative Cloud 라이브러리와 Adobe Animate 사용
- Animate의 스테이지 및 도구 패널 사용
- Animate 작업 과정 및 작업 영역
- HTML5 Canvas 문서에서 웹 글꼴 사용
- 타임라인과 ActionScript
- 여러 타임라인을 사용한 작업
- 환경 설정
- Animate 제작 패널 사용
- Animate로 타임라인 레이어 만들기
- 모바일 앱 및 게임 엔진용으로 애니메이션 내보내기
- 객체 이동 및 복사
- 템플릿
- Animate의 찾기 및 바꾸기
- 실행 취소, 다시 실행 및 작업 내역 패널
- 키보드 단축키
- Animate에서 타임라인을 사용하는 방법
- HTML 확장 만들기
- 이미지 및 애니메이션 GIF에 대한 최적화 옵션
- 이미지 및 GIF에 대한 내보내기 설정
- Animate의 에셋 패널
- 멀티미디어 및 비디오
- Animate의 그래픽 객체 변형 및 결합
- Animate에서 심볼 인스턴스를 만들고 작업하기
- 이미지 추적
- Adobe Animate에서 사운드를 사용하는 방법
- SVG 파일 내보내기
- Animate에서 사용할 비디오 파일 만들기
- Animate에서 비디오를 추가하는 방법
- Animate로 객체 그리고 만들기
- 선 및 모양 변형
- Animate CC의 획, 채우기 및 그래디언트
- Adobe Premiere Pro 및 After Effects 작업
- Animate CC의 색상 패널
- Animate에서 Flash CS6 파일 열기
- Animate의 클래식 텍스트 작업
- Animate에 아트워크 가져오기
- Animate의 가져온 비트맵
- 3D 그래픽
- Animate의 심볼 작업
- Adobe Animate로 선 및 모양 그리기
- Animate의 라이브러리 작업
- 사운드 내보내기
- Animate CC의 객체 선택
- Animate의 Illustrator AI 파일 작업
- 블렌드 모드 적용
- 객체 배열
- 명령 메뉴를 사용한 작업 자동화
- 다국어 텍스트
- Animate에서 카메라 사용하기
- 그래픽 필터
- 사운드 및 ActionScript
- 드로잉 환경 설정
- 펜 도구로 그리기
- 플랫폼
- Animate 프로젝트를 다른 문서 유형 포맷으로 변환
- 사용자 정의 플랫폼 지원
- Animate에서 HTML5 Canvas 문서 만들고 게시하기
- WebGL 문서 만들고 게시하기
- iOS용 AIR에 맞추어 애플리케이션을 패키징하는 방법
- Android용 AIR 애플리케이션 게시
- 데스크톱용 Adobe AIR에 맞춘 게시
- ActionScript 게시 설정
- 모범 사례 - 애플리케이션에서 ActionScript 구성
- Animate에서 ActionScript를 사용하는 방법
- Animate 작업 영역의 액세스 가능성
- 스크립트 작성 및 관리
- 사용자 정의 플랫폼에 대한 지원 활성화
- 사용자 정의 플랫폼 지원 개요
- 사용자 정의 플랫폼 지원 플러그인 작업
- ActionScript 3.0 디버깅
- 사용자 정의 플랫폼에 대한 지원 활성화
- 내보내기 및 게시
- Animate CC에서 파일을 내보내는 방법
- OAM 게시
- SVG 파일 내보내기
- Animate를 사용하여 그래픽 및 비디오 내보내기
- AS3 문서 게시
- 모바일 앱 및 게임 엔진용으로 애니메이션 내보내기
- 사운드 내보내기
- 모범 사례 - 모바일 장치 콘텐츠 만들기 팁
- 모범 사례 - 비디오 규칙
- 모범 사례 - SWF 애플리케이션 제작 지침
- 모범 사례 - FLA 파일 구조화
- Animate용 FLA 파일을 최적화하는 모범 사례
- ActionScript 게시 설정
- Animate용 게시 설정 지정
- 프로젝터 파일 내보내기
- 이미지 및 애니메이션 GIF 내보내기
- HTML 게시 템플릿
- Adobe Premiere Pro 및 After Effects 작업
- 애니메이션의 빠른 공유 및 게시
- 문제 해결
이 문서를 통해 이미지 및 애니메이션 처리된 GIF를 내보내는 방법을 알아보십시오.
Animate는 에셋을 사용자 친화적이고 인터랙티브한 방식으로 .png, jpeg, 정적 및 애니메이션 처리된 GIF 포맷으로 내보낼 수 있게 [이미지 내보내기] 및 [애니메이션 처리된 GIF 내보내기] 기능을 도입합니다.
웹 및 기타 온라인 미디어에서 사용할 이미지를 준비할 때는 이미지 화질과 파일 크기를 절충해야 하는 경우가 많습니다.
[이미지 내보내기] 대화 상자의 최적화 기능을 사용하여 다양한 파일 포맷과 파일 특성으로 최적화된 이미지를 미리 볼 수 있습니다. 이미지의 여러 버전을 동시에 표시하고 미리 보면서 최적화 설정을 수정하여 필요에 맞는 최상의 설정을 결합하여 선택할 수 있습니다. 또한 투명도와 매트를 지정하고, 디더링 조절 옵션을 선택하고, 지정된 픽셀 치수나 원본 크기의 비율로 이미지 크기를 조정하는 등의 작업을 수행할 수도 있습니다.
[이미지 내보내기] 명령을 사용하여 최적화된 파일을 저장할 때 해당 이미지에 대한 HTML 파일을 생성하도록 선택할 수 있습니다. 이 파일에는 이미지를 웹 브라우저에 표시하는 데 필요한 모든 정보가 포함됩니다.
Animate에서는 [다른 이름으로 저장] 명령을 사용하여 이미지를 GIF, JPEG 또는 PNG 파일로 저장할 수 있습니다. 파일 포맷에 따라 이미지 품질, 배경 투명도나 매트, 색상 표시 및 다운로드 방법을 지정할 수 있습니다. 그러나 파일에 추가한 링크, 애니메이션 등의 웹 기능은 유지되지 않습니다.
또한 Animate 이미지 프로세서를 사용하여 이미지 폴더의 복사본을 JPEG 형식으로 저장할 수 있습니다. 이미지 프로세서를 사용하여 이미지의 크기를 조절하거나 이미지의 색상 프로파일을 웹 표준 sRGB로 변환할 수 있습니다.
이미지 내보내기
[이미지 내보내기] 대화 상자([파일] > > [내보내기] > [이미지 내보내기] 및 [파일] > [내보내기] > [애니메이션 처리된 GIF 내보내기])를 사용하여 최적화 옵션을 선택하고 최적화된 아트워크를 미리 봅니다.
A. 표시 옵션 B. 최적화 팝업 메뉴 C. 프리셋 옵션 D. 이미지 크기 옵션 E. 애니메이션 옵션 F. 미리 보기 G. 툴 모음
대화 상자에서 이미지 미리 보기
이미지 영역 위쪽의 탭을 클릭하여 표시 옵션을 선택합니다.
원본
최적화되지 않은 이미지를 표시합니다.
최적화
현재 최적화 설정이 적용된 이미지를 표시합니다.
2장
이미지의 두 가지 버전을 나란히 표시합니다.
대화 상자를 사용하여 탐색
[이미지 내보내기] 대화 상자에서 아트워크가 일부만 보이면 [손 툴]로 드래그하여 다른 영역을 볼 수 있습니다. [돋보기 도구]를 사용하여 보기를 확대하거나 축소할 수도 있습니다.
- [손 도구]를 선택하거나 스페이스바를 누른 상태에서 보기 영역에서 드래그하면 이미지 전체를 이동하면서 볼 수 있습니다.
- [돋보기 도구]
배율을 직접 입력하거나 대화 상자 아래쪽에서 선택할 수도 있습니다.
를 선택하고 보기 영역 내부를 클릭하여 확대합니다. Alt(Windows) 또는 Option(MacOS) 키를 누른 상태로 보기 영역 내부를 클릭하여 축소합니다.
최적화된 이미지 정보 및 다운로드 시간 보기
[이미지 내보내기] 대화 상자의 각 이미지 아래에 있는 주석 영역에는 최적화 정보가 표시됩니다. 원본 이미지에 대한 주석에서는 파일 이름과 파일 크기를 보여 줍니다. 최적화된 이미지에 대한 주석에서는 현재 최적화 옵션, 최적화된 파일 크기 및 선택한 모뎀 속도에 따른 예상 다운로드 시간을 보여 줍니다. [미리 보기] 팝업 메뉴에서 모뎀 속도를 선택할 수 있습니다.
이미지 감마를 다른 값으로 미리 보기
컴퓨터 모니터의 감마 값 설정에 따라 웹 브라우저에서 전체 이미지가 더 밝게 보이거나 더 어둡게 보입니다. 다른 감마 값을 적용할 때 시스템에 표시되는 이미지의 모양을 미리 보고 감마를 조정하여 이미지를 보정할 수 있습니다. 미리 보기 옵션을 활성화해도 최종 이미지 출력에는 영향을 주지 않습니다.
- [이미지 내보내기] 대화 상자의 [미리 보기] 팝업 메뉴를 사용하여 다음 옵션 중 하나를 선택합니다.
모니터 색상
이미지 감마를 조정하지 않습니다. [모니터 색상]이 기본 설정입니다.
레거시 Macintosh(색상 관리 없음)
Mac OS 10.5 이전 버전에서 사용되는 기본 감마 1.8을 시뮬레이션합니다.
Windows(색상 관리 없음)
Windows 및 Mac OS 10.6 이상 버전에서 사용되는 기본 감마 2.2를 시뮬레이션합니다.
문서 프로필 사용
색상 관리 문서에 첨부된 문서 색상 프로파일과 일치하도록 감마를 조정합니다.
웹용으로 이미지 최적화
-
-
대화 상자 위쪽의 탭을 클릭하여 표시 옵션([최적화] 또는 [2장])을 선택합니다.
-
(선택 사항) 이미지에 여러 개의 분할 영역이 포함되어 있으면 최적화할 분할 영역을 하나 이상 선택합니다.
-
[사전 설정] 메뉴에서 사전 설정된 최적화 설정을 선택하거나 개별 최적화 옵션을 설정합니다. 선택한 파일 형식에 따라 사용 가능한 옵션이 다릅니다.
-
이미지 품질과 파일 크기 간의 균형에 만족할 때까지 최적화 설정을 세밀하게 조정합니다. 이미지에 여러 개의 분할 영역이 포함되어 있으면 모든 분할 영역을 최적화해야 합니다.
참고:최적화된 미리 보기를 원본으로 복원하려면 해당 미리 보기를 선택한 다음 [사전 설정] 메뉴에서 [원본]을 선택합니다.
-
최적화된 이미지에서 보는 색상이 다른 브라우저에서도 똑같이 보이도록 이미지 색상을 sRGB로 변환합니다.
-
다음 옵션을 선택합니다.
없음
저장된 메타데이터가 없습니다(JPEG 파일의 EXIF 저작권 고지 사항 제외). 가장 작은 크기의 파일이 생성됩니다.
저작권
저작권 고지 사항, 권한 사용 조건, 저작권 상태 및 저작권 정보 URL을 저장합니다.
저작권 및 문의 정보
모든 저작권 정보뿐 아니라 작성자, 작성자 직함, 전자 우편, 주소, 구/군/시, 시/도, 우편 번호, 국가, 전화 번호, 웹 사이트 등을 저장합니다.
카메라 정보를 제외한 모두
셔터 속도, 날짜 및 시간, 초점 거리, 노출 보정, 미터링 패턴, 플래시 사용 등과 같은 카메라 설정에 대한 EXIF 데이터를 제외한 모든 메타데이터를 저장합니다.
모두
모든 메타데이터를 파일에 저장합니다.
-
[저장]을 클릭합니다..
-
[최적화 다른 이름으로 저장] 대화 상자에서 다음을 수행하고 [저장]을 클릭합니다.
-
파일 이름을 입력하고 결과 파일을 저장할 위치를 선택합니다.
-
[형식] 옵션을 선택하여 저장할 파일의 종류를 HTML 및 이미지, 이미지 전용, HTML 전용 중에서 지정합니다.
-
(선택 사항) HTML 및 이미지 파일의 출력 설정을 지정합니다.
-
이미지에 여러 개의 분할 영역이 포함되어 있으면 [분할 영역] 메뉴에서 분할 영역을 저장하는 옵션([모든 분할 영역] 또는 [선택 분할 영역])을 선택합니다.
참고:최적화 설정을 마지막으로 저장된 버전으로 되돌리려면 Alt 키(Windows) 또는 Option 키(Mac OS)를 누르고 [재설정]을 클릭합니다. 다음에 [웹 및 저장] 대화 상자를 열 때 같은 설정이 유지되도록 하려면 Alt/Option 키를 누른 채 [기억]을 클릭합니다.
Illustrator에서 파일을 웹용으로 저장하는 방법에 대한 비디오는 www.adobe.com/go/vid0063_kr을 참조하십시오.
-
최적화 사전 설정 저장 또는 삭제
최적화 설정을 이름이 지정된 세트로 저장한 다음 다른 이미지에 적용할 수 있습니다. 저장한 설정은 이름이 지정되어 미리 정의된 설정과 함께 [사전 설정] 팝업 메뉴에 나타납니다. 이름이 지정된 세트나 미리 정의된 세트를 편집하면 [사전 설정] 메뉴에 [이름 없음]으로 표시됩니다.
-
최적화 옵션을 설정하고 [최적화] 팔레트 메뉴에서 [설정 저장]을 선택합니다.
-
설정에 이름을 지정하고 적절한 폴더에 저장합니다.
Photoshop
(Windows XP) Document and Settings\[사용자 이름]\Application Data\Adobe\Adobe Photoshop CS5\최적화 설정
(Windows Vista) Users\[사용자 이름]\AppData\Roaming\Adobe\Adobe Photoshop CS5\최적화 설정
(Mac OS) User/[사용자 이름]/Library/Preferences/Adobe Photoshop CS5 Settings/최적화 설정
Illustrator
(Windows XP) Document and Settings\[사용자 이름]\Application Data\Adobe\Adobe Illustrator CS5 Settings\[언어]\웹 설정용으로 저장\최적화
(Windows Vista) Users\[사용자 이름]\AppData\Roaming\Adobe\Adobe Illustrator CS5 Settings\[언어]\웹 설정용으로 저장\최적화
(Mac OS) Users/[사용자 이름]/Library/ApplicationSupport/Adobe/Adobe Illustrator CS5/[언어]/웹 설정용으로 저장/최적화
참고:다른 위치에 저장한 설정은 [사전 설정] 팝업 메뉴에 표시되지 않습니다.
-
사전 설정을 삭제하려면 [사전 설정] 메뉴에서 사전 설정을 선택하고 [최적화] 메뉴에서 [설정 삭제]를 선택합니다.
웹 그래픽을 특정 파일 크기로 압축
-
[파일] > [내보내기] > [이미지 내보내기] 또는 [파일] > [내보내기] > [애니메이션 처리된 GIF 내보내기]를 선택합니다.
-
[이미지 내보내기] 또는 [애니메이션 처리된 GIF 내보내기] 대화 상자 위쪽의 탭을 클릭하여 표시 옵션([최적화] 또는 [2장])을 선택합니다.
-
(선택 사항) 최적화할 분할 영역과 사용할 파일 형식을 선택합니다.
-
[사전 설정] 메뉴의 오른쪽에 있는 [최적화] 메뉴에서 [파일 크기에 맞게 최적화]를 선택합니다.
-
원하는 파일 크기를 입력합니다.
-
[시작] 옵션을 선택합니다.
현재 설정
현재 파일 형식을 사용합니다.
GIF/JPEG 자동 선택
이미지 내용에 따라 최적의 형식이 자동으로 선택됩니다.
-
[사용] 옵션을 선택하여 지정된 파일 크기를 현재 분할 영역에만 적용할지, 이미지의 각 분할 영역에 적용할지, 모든 분할 영역에 적용할지를 지정합니다. [확인]을 클릭합니다.
최적화 중 아트워크 크기 조정
[이미지 내보내기] 대화 상자에서 이미지 크기를 지정된 픽셀 치수나 원본 크기의 특정 비율로 조정할 수 있습니다.
-
[이미지 내보내기] 대화 상자에서 [이미지 크기] 탭을 클릭합니다.
-
추가 옵션을 설정합니다.
비율 제한
픽셀 너비와 픽셀 높이의 현재 비율을 유지합니다.
참고:SWF 및 SVG 파일 형식의 경우 [대지에 클립]을 제외한 [이미지 크기] 팔레트의 모든 기능을 사용할 수 없습니다.
-
새 픽셀 치수를 입력하거나 이미지 크기를 조정할 백분율을 지정하고 [적용]을 클릭합니다.
웹 브라우저에서 최적화된 이미지 미리 보기
[이미지 내보내기] 대화 상자([파일] > [내보내기] > [이미지 내보내기] 또는 [파일] > [내보내기] > [애니메이션 처리된 GIF 내보내기])를 사용하여 시스템에 설치된 모든 웹 브라우저에서 최적화된 이미지를 미리 볼 수 있습니다. 브라우저 미리 보기에는 이미지와 함께 이미지의 파일 형식, 픽셀 치수, 파일 크기, 압축율 및 기타 HTML 정보가 나열된 캡션이 표시됩니다.
- 기본 웹 브라우저에서 이미지를 미리 보려면 [이미지 내보내기] 대화 상자의 아래쪽에 있는 브라우저 아이콘을 클릭합니다.
- [브라우저] 대화 상자에서 컴퓨터에 있는 모든 브라우저를 찾을 수 있고, 이미지를 미리 볼 기본 브라우저를 설정할 수 있습니다.