Macで手軽にHTML5のアニメーションを作成できるソフトをご紹介いたします。
Mac AppStoreからダウンロードできます（有料）
Hype2の操作画面です。画像やテキストを表示させるパレットとキャンパスサイズや画像に動きをつけるインスペクタ画面に分かれてます。
画像が動くカンタンなアニメーションを作成してみます。
左上の【要素】をクリック。
画像を選択
キャンパスに画像が追加されました。
画像の大きさはドラッグ・アンド・ドロップで変更できます。
素材に動きを付ける場合には右下の録画ボタンをクリック。
アニメーション継続時間を設定します。タイムラインの縦棒を左側にドラッグさせます。
タイムラインに赤いバーが表示されました。素材に対して動きをつけると赤いバーの目印がつきます。
再生ボタンを押してみると画像が拡大縮小されます。リピートさせることもできます。
【プレビュー】ボタンをクリックすると
デフォルトのブラウザでプレビューできます。
書き出せるファイル
- HTML5
- Gifアニメ
- mp4ビデオ
HTML5で書きだした場合はソースファイルとHTMLファイルに分割されます。アニメーションですが動画ファイルではないのでファイル容量は少なめ。
Gifアニメ
mp4ビデオ
画像をクリックした時にアクションをつけたり、シーンを追加して分岐させることもできる高機能なアプリケーション。AndroidアプリやiPhoneアプリも作成できるそうです！
