はじめてのEdge Animate

ザ・ストリッパーズ

HTML5時代のアニメーション制作ツールの解説書。
コードを書かずにさくさくコンテンツができる！スマホやタブレット向けコンテンツもこれで万全！

定価: 2,640円（本体価格 2,400円）

発売日

2013年5月1日
判型／ページ数

B5変型／216ページ（フルカラー）
ISBN

978-4-88337-858-6

この書籍を購入する

この書籍を問い合わせる

キーワード：: Adobe / Edge / Flash / HTML5 / JavaScript / jQuery

概要
目次
正誤表・ダウンロード

Adobe Edge Animateの解説書が登場！

コードが苦手な人でもタイムラインベースでアニメーションやバナーが作れます。

もちろん、出力はHTML5ベース。スマホやタブレット対応もこれで万全！

はじめに
Introduction
Edge Animateの概要
Edge Animateでできること

サンプルファイルの使い方

Capter01
Edge Animateを動かしてみよう
1　Edgeの起動
2　新規作成
3　ファイルの保存
4　各種パネル名
5　図形を描いてみよう
6　色を塗ってみよう
7　変形させてみよう
8　フィルターとシャドウを使ってみよう
9　アクセシビリティに配慮した設定をしてみよう
10　図形を整列しよう
11　文字を書いてみよう
12　画像を配置しよう
13　実際のブラウザでチェックしてみよう
14　スマートフォンでも表示チェックをしてみよう

アニメーションしてみよう
1　タイムラインを理解する
2　ピンを使ってアニメーションしてみる
3　自然な動きをつけてみよう

Capter02
JavaScriptを使ったコンテンツ
1　スライド素材を確認
2　トリガーでタイムラインの再生状態を操作する
3　アクションでマウス操作時の処理を追加する
4　シンボルを利用する
5　シンボルの編集
6　タイムラインアクション
7　ラベルの使用
8　コードパネルで全体のアクションを見渡す

可変レイアウト
1　可変レイアウトに適した素材
2　ステージを可変にする
3　ウィンドウサイズにあわせたレイアウトの確認方法
4　エレメントの位置をウィンドウサイズに追従させる
5　アニメーションしているエレメントの位置をまとめて可変対応する
6　エレメントの幅をウィンドウサイズに追従させる
7　プリセットレイアウトで画像を配置
8　ステージ幅の最小値、最大値の設定
9　スマートフォンでの可変レイアウト

Capter03

プリローダーを設置してみよう
1　プリローダーイメージを設定してみよう
2　プリローダーの表示位置設定
3　プリローダーの種類
古いブラウザ向けに代替コンテンツを設定する
1　ポスターを使った代替表示
2　下位ステージの編集
3　Google Chrome Frame の利用
パブリッシュ設定
1　Webサイトのパブリッシュ設定
2　パブリッシュ後のファイル
3　Animate デプロイメントパッケージ書き出し
4　iBooks / OSX 書き出し
HTMLページヘの埋め込み
1　Dreamweaverと連携した埋め込み
2　仮想プロジェクトのファイル構造
3　素材画像のファイルパス設定
4　JavaScriptファイルのパス設定
5　既存のHTMLファイルへ埋め込む

Capter04

シューティングゲームを作ってみよう
1　シューティングゲームの構成
2　Flash で作ったアニメーションを Edge Animate で再生
3　描画ツールの応用で敵機を描く
4　敵機の動きをタイムラインで設定する
5　ネストしたシンボルのアニメーション
6　Adobe Edge Animate JavaScript API の概要
7　ゲーム開始時の処理
8　ランダムに敵機を追加する
9　キーボードイベント
10　当たり判定
11　ゲーム終了時の処理