wordpress/Adobe Animate CCなどweb技術やブログ運用に関する話をしていきます!検索エンジン最適化に関する実験に関する情報も!
⇒ 本ブログの詳細/制作者プロフィール/連絡先/現在の行動状況はコチラ!
⇒ 本ブログは複数のテーマ(色)を持った階層構造になってます!詳しくはコチラ!
web/ブログ全般 SEO/アクセスアップ WordPress(KUSANAGI) Adobe Animate CC(旧FLASH) 便利ソフト/サービス紹介 効率化
  1. ホーム
  2. 〇ブログ/web技術
  3. Adobe Animate CC [旧Flash]
■注目記事一覧

Adobe Animate CC(旧FLASH)が凄すぎる!その表現力と効率性を痛感!技術者にこそ是非!

画像素材サイトの「料金」と「検索結果の画像数」を比較してみた!やっぱり純日本製のサイトが使いやすい!?

「写真AC」が超オススメ!画像素材サイトとして、3年以上使い続けてます!

エックスサーバーが凄すぎる!本ブログでの超カスタマイズWordPressでも、高速レスポンスを誇る高品質サーバー!

ポイントサイト「げん玉」が凄すぎてビックリ!開始から10分で2000円以上稼げた!買い物のポイント還元もスゴイ!

[Adobe Animate CC使い方講座] Adobe Animate CCって何?まずはFlashからの変遷から解説!

デジハリのAdobeマスター講座がやばすぎる!Adobe Creative Cloudが50%オフで購入可!5分で使用可能に(超重要)!
 

[Adobe Animate CC] GIFアニメ作成ツール基盤作りました!Animate CCを最大活用すると、こんな便利なツールまで作れますよ!

Adobe Animate CCには物凄く便利な機能が備わっています。でも、なかなかその利点が伝わりにくいです。Adobe Animate CCの利点は、コチラのその他製品との比較記事でも記したとおり、「ゲームやアニメ、ツールなど各要素を良い具合で混ぜ合わせて、リアルタイムにインタラクティブに使えるコンテンツを生み出せる」ことです。レンダリングに何時間もかかる高画質なアニメーションには勝てませんが、リアルタイムにアニメーションを変えられるということが最大の特徴なんです。

その利点を活かして、GIFアニメ作成ツール基盤を作ってみました!これは、「Animate CCのアニメーションを一定の基準を満たすように作れば、ユーザーがカスタマイズしてGIFアニメを作成できるツールにしてしまうプログラム」です。今回はAdobe Animate CCがここまで、スゴイことが出来るんですよ!というアピールを込めて、機能を紹介させて頂きます。

HTML5のCanvasには、GIFアニメ作成ライブラリがある!

Animate CCはHTML5のCanvas機能を利用してアニメーションを表示しています。ですので、このCanvasに関連する機能は取り込んで使うことが出来るんです。そして、コチラのページ(Narumium Blog様)に記述されている通り、Canvas関連のライブラリとして簡単にGIFアニメが作れてしまjsgifというものがあるんです!

これを使うと、Canvasに描画を行った後に毎ターン、encoder.addFrame(ctx)という関数を呼び出せば、アニメーションのフレームが登録されていき、自動的にGIFアニメを作成してくれるんです!超便利!そのため、Animate CCのメインステージで毎ターンencoder.addFrame(ctx)を呼び出すようにすれば、それだけでGIFアニメが作れてしまうんです!

↓こんな感じのGIFアニメが簡単に生成できます!

続きを読む


[Adobe Animate CC注意点] フィルターを使ったアニメーションは、HTML5 Canvasでは使えません。

Adobe Animate CCは注意しなければいけない点がたくさんあります。前回は日本語環境で「ダイナミックテキストが複数行にならない」というバグを紹介しました。そのような「意図した通りに動かないパターン」を列挙していこうかなと思います。これさえ抑えれば、Adobe Animate CCを思った通りに動かせるようになるかと思います!

今回は、アニメーションに関する注意点についてです。「フィルターを使ったアニメーションは使えない」という、かなり強い制約です。非常に重要なポイントになります!このポイントをおさえておかないと、作った後、後の祭りになります。十分ご注意を。

続きを読む


[Adobe Animate CC注意点] ダイナミックテキストが複数行にならない!日本語だと特に注意です!

少し間が空きましたが、Adobe Animate CCの使い方講座のコンテンツを進めていきたいと思います。今回からしばらく、Adobe Animate CCの注意点について記述していこうと思っています。

Adobe Animate CCは注意しなければいけない点がたくさんあります。特に日本語環境だと注意が必要な場合がいくつかあり、意図した通りに動かない時があるんです。その「上手くいかない場合」のパターンをおさえておかないと、かなり苦労します。

ということで、今回からしばらく、その「意図した通りに動かないパターン」を列挙していこうかなと思います。これさえ抑えれば、Adobe Animate CCを思った通りに動かせるようになるかと思います!今回は、ダイナミックテキストに関する注意点です。

続きを読む


Adobe Animate CCの素晴らしいサンプル集サイト見つけました!コレを見れば何が作れるかわかる!

Adobe Animate CCで何が出来るか分かりにくい…そんな方にオススメなサイト!

Adobe Animate CCというソフトは非常にわかりにくいです。FLASHの後継ということで知られていますが、「Animate」という謎の名前に変わったことで、何が出来るのかが非常にわかりにくいソフトになってしまいました。ユーザーも少ないですしね。

Adobe Animate CCはアニメーション作成が基本ですが、自分がこのサイトでサンプルを見せている通り、それ以外にも多くの種類のコンテンツが作れます。表現力は無限大。でも、それが伝わらない…

ということで、少しでも分かりやすい形で伝えられないかと、色々探っています。そんな中、英語ですが非常に素晴らしいサイトがありましたのでご紹介させて頂きます。Adobe Animate CCでどんなコンテンツが作れるのかが分かりやすくなりますよ!

続きを読む


Adobe Animate CCが、FLASHよりも進化して使いやすい!JavaScriptプログラマにこそオススメしたい理由!

一つ前の記事で、自分がエンジニア系なのに、Adobe Animate CCを多用する理由を説明しました。簡単に言うと「無理やりコーディングせず、グラフィック的な要素は、それが得意なソフトに任せよう!」という話です。

今回は、その発展で、「JavaScriptプログラマにAdobe Animate CCをオススメしたい理由」について説明します。FLASHが衰退したことにより、その後継であるAdobe Animate CCも良いイメージを持たれていません。しかし、実はAdobe Animate CCはJavaScriptとの連携が強化されていて、JavaScriptエンジニアさんにとって非常に使いやすい環境になっています!

その例として、自分が作ったシステムを例示します。下のグラフは、自分が作った「リアルタイム行動記録公開システム」です。これは、自分が入力している行動記録をサーバーからリアルタイムに取得し、タイムチャートとして表示するシステムになっています。静的に見えますが、動的にグラフが更新されて徐々に伸びていく仕様になっています。自分は、これを1)サーバー(PHP & MySQLデータベース)、2)外部JavaScript、3)Adobe Animate CCの3つの連携で実現しています!

このように、Adobe Animate CCは外部プログラムと非常に連携しやすい構成になっています!今回は、JavaScriptプログラマさんに何故Adobe Animate CCをオススメしたいのか、そしてどのように外部プログラムとの連携性が強化されているのかについて、詳しく説明したいと思います!

続きを読む