많은 전자책에서 리치 미디어의 관련성에 대해 논쟁 수 있습니다,하는 동안 그것은 어떤 종류의 애니메이션은 정적 이미지 보다 독자에 게 더 매력적인 의심 없이. 애니메이션을 만드는 아이디어는 작성자에게 위협적 일 수 있습니다. 그것은 결과에 관하여 이지 않는다-그것을 일어난 요구되는 것이에 관하여 이다. 그것은 추한 얻을 수 있습니다. 또는 더 나쁜:비싸다.
다른 사람에 대한 대화 형 전자 책을 개발하는 우리의 여행에서,우리는 애니메이션의 힘을 실현하고 여러 전자 책에 활용했다. 이미지에 이러한 아주 작은 추가 정말 귀하의 서적에 큰 영향을 줄 수 있으며,그것은 질문없이 나머지에서 눈에 띄는 만들 수 있습니다.
진짜 도전은 애니메이션을 생산하는 효율적이고 쉬운 방법을 찾는 것입니다. 이 문서에서 우리는 전자책에서 애니메이션 기술에 대 한 몇 가지 배경을가지고 하 고 명확한 예제와 함께 애니메이션 기법을 생산 하기 위해 상대적으로 쉽게 번호를 보면.
애니메이션 유형
빠른 소개를 제공하기 위해 다양한 방법으로 애니메이션을 만들 수 있습니다. 프레임 별 애니메이션만큼 복잡하고 시간이 많이 걸릴 수 있습니다. 즉,각 분수에 대해 별도의 이미지를 그리는 것입니다. 우리는 트위닝에 더 관심이 있습니다(중간 중간에 대한 짧은). 트위닝하면 애니메이션의 시작 및 끝 상태를 지정하고 나머지는 컴퓨터에서 자동으로 생성됩니다. 가속도,탄력성,수신 거부 등과 같은 속도 효과를 적용하기 위해 사용할 완화 기능을 지정할 수도 있습니다. 여기에 완화 기능의 전체 목록입니다.
그렇다면 애니메이션은 전자 책 안에 어떻게 포함되어 있습니까? 여기에 귀하의 옵션이 있습니다:
- 페이지 위젯
이 목록은 당신을 놀라게하는 것이 아니라 당신이 사용할 수있는 기술적 가능성을 탐구하는 것입니다. 그러나이 목록을 단순화합시다. 애니메이션 지프 이미지에는 특수 소프트웨어(예:포토샵)가 필요하며 애니메이션 파일 크기는 일반적으로 매우 큽니다. 벡터 그래픽만 지원하며 개발 배경을 만들어야 합니다. 플래시는 오래된 애플 아이북 같은 독자에 지원되지 않습니다,혼자 모바일하자. 이 애니메이션 및 페이지 위젯에 우리를 떠난다. 그들은 모두 기본적으로 형제와 자매입니다. 페이지 위젯은 페이지 내에 직접 애니메이션을 적용하는 대신 아이프레임(창)을 통해 애니메이션을 적용합니다. 우리는 더 나은 하나의 파일에 전체 애니메이션을 가지고 구성되어 있기 때문에 페이지 위젯을 사용하는 것을 선호합니다.
애니메이션 소프트웨어
소프트웨어가 관련된 한,구글 웹 디자이너는 애니메이션을 만들 수있는 간단하고 무료 소프트웨어입니다. 구글 웹 디자이너는 웹 및 모바일 용 애니메이션 배너 및 광고를 만드는 데 중점을 둡니다. 우리는 당신이 빠른 애니메이션을 만들 고급 아무것도 필요하지 않은 것으로 나타났습니다.
다음과 같이 구글 웹 디자이너의 기본 워크 플로우입니다:
- 각 레이어에 대해 키 프레임을 지정하고 완화 기능을 선택하십시오.
- 우편 패키지로 내보내기
내보낸 파일은 페이지에 추가 할 준비가 된 페이지 위젯입니다.전자 책에 페이지 위젯을 추가하는 방법에 대한 자세한 내용은 책 위젯에 대한 기사를 참조하십시오.
애니메이션 기술
노하우는 효과적인 애니메이션을 만드는 데 충분하지 않습니다. 당신이 그것을 어떻게 사용할지는 중요합니다. 그냥 난로를 사용하는 방법을 학습처럼,반드시 당신이 곧 어떤 블랑 케트 드 베오 요리 할 수 있습니다 의미하지 않는다. 먼저 몇 가지 요리법을 배울 필요가 있습니다. 그래서 애니메이션을 적용 할 수있는 다른(쉬운)조리법을 살펴 보자.
플로팅 이미지
이 애니메이션의 가장 간단한 형태이다. 다른 방향으로 이동하는 이미지(뿐만 아니라 회전 할 수 있습니다). 그리고 그것이 테이블에 새로운 것을 가져 오지 않을 것이라고 생각할지라도,당신은 틀 렸습니다. 움직임이 얼마나 자연에 따라,당신은 당신의 전자 책에 가져다 독자를 구애 할 수 있습니다 얼마나 많은 삶의 놀라게 될 것입니다. 이 유형의 애니메이션의 가장 좋은 점은 추가 리소스 없이 현재 이미지에 적용할 수 있다는 것입니다. 배경(배경이 흰색이라고 가정)과 애니메이션을 병합하려면 이미지에 흰색 배경이 있는 것이 좋습니다. 여기에 우리가 조류에 대해 만든 대화 형 전자 책의 예입니다.
다음은 몇 가지 기본 회전 만있는 다른 예입니다. 정확한 타이밍을 적용하면 매우 믿을 수있는 효과를 줄 수 있습니다.
웹 전체에서 이러한 유형의 애니메이션을 찾을 수 있습니다. 예를 들어,이 링크에서 당신은 우리가 좋아하는 부동 이미지의 또 다른 예를 찾을 수 있습니다(부동 우주 비행사 두꺼비를보고 기억을 불러 일으키는라는 제목의 섹션으로 이동). 복잡성의 작은 비트를 추가하려면,당신은 위치에 고정,뒤쪽에 앉아 다른 이미지를 가질 수 있습니다. 다음과 같이:
이미지 변환
후자와 비슷하지만 이미지를 이동하는 대신 변형합니다. 지원되는 변환은 크기 조정,기울이기 및 3 차원 회전입니다. 당신은 당신이 변환을 적용하는 이미지에 관해서는 매우 선택적이어야합니다. 잘못된 변형은 일을 꽤 이상하게 보이게 만들 수 있습니다. 여기에 우리의 대화 형 전자 책에서 조류에 적용 왜곡 및 3 차원 회전 변환의 조합입니다.
전환 구성 요소
한 단계 더 나아가 봅시다. 이 유형의 애니메이션을 사용하면 이미지가 하위 이미지로 나뉩니다. 빈 화면에서 각 하위 이미지는 서로 다른 방향에서 자체 입구를 만들어 궁극적으로 원본 이미지를 완성합니다. 당신이 무엇을 하든지,이것은 결코 나빠 보이지 않을 것입니다. 그것은 확실히 좋아 보이지만 더 좋아 보일 수 있습니다. 하위 이미지 및 전환의 선택은 애니메이션이 독자에게 얼마나 매력적인 제어 할 수 있습니다. 하위 이미지를 화면 밖으로 다시 전환하여 이 애니메이션을 반복할 수 있습니다.
그래프 및 차트
보고서 또는 통계가 포함 된 전자 책을 만드는 경우 유용 할 것입니다. 당신은 아마 당신이 매우 복잡한 것을 보려고 생각하고 있습니다. 그것은 총 반대입니다. 최소한의 노력과 간단한 노하우로,당신은 마법의 터치와 함께 차트를 애니메이션,당신의 독자가 작품의 톤 생각 할 수 있습니다. 많은 애니메이션이 실제로 그런 식으로 존재–당신의 눈은 현실에서 훨씬 간단 뭔가를 이해로 당신의 마음을 속여.
그래프와 차트를 애니메이션으로 만드는 아이디어는 다음과 같습니다. 당신은 구글 웹 디자이너에 이미지로 그래프/차트를 가져옵니다. 위의 레이어에,당신은 흰색 상자를 만들 것입니다. 이 마스킹 효과를 제공하는 데 사용됩니다. 처음에는 흰색 상자가 가로&세로 축을 제외하고 그래프/차트 위에 나타납니다. 당신은 아래에 숨겨진 무엇을 나타 내기 위해 수직으로 위쪽으로 흰색 상자를 전환됩니다. 독자의 눈은 막대기가 실제로 다만 계시되고 있는 곳에,아래에서 위쪽으로 성장하고 있는 무슨이다는 것을 믿기로 그를 속일 것이다. 당신은 루프 애니메이션을하려는 경우,당신은 다시 한 번 그래프를 숨기기 위해 다시 아래로 흰색 상자를 전환 할 수 있습니다. 정확한 타이밍에,이것은 다만 당신의 독자를 유혹할 것이다. 몇 가지 예를 들어 보겠습니다. 여기에 추가 이미지가 막대의 캡으로,흰색 상자와 함께 애니메이션 된 더 복잡한 예입니다.
결론
이 문서에서 우리는 애니메이션이 전자 책에서 작동하는 방법의 일반적인 아이디어를 촬영했습니다,그 뒤에 기술. 우리는 당신의 워크 플로우에서 너무 많은 시간을 복용하지 않고,전자 책 이미지에 신속하게 적용 할 수있는 네 가지 간단한 기술/트릭을 보았다. 그것은 모두 구글 웹 디자이너의 기초를 갖는에 투자하는 몇 가지 작은 설치 시간에 온다. 또 다른 게시물에서,우리는 첫 번째 애니메이션을 만들기 위해,거기에 따라 구글 웹 디자이너와 아기 단계에 더 자세히 살펴 복용한다.
한편,애니메이션 시작!
당신은 또한 즐길 수 있습니다:
더 매력적인 전자 책을 만들기위한 5 해킹
쿨 트릭:전자 책에서 동적 문자 이름 만들기
대화 형 전자 책을 만드는 방법:단계별 가이드
동영상을 최적화하고 전자 책에 추가하는 방법
이미지에 전자 책 저자 가이드