どうも、まさとらん（@0310lan）です！
今回は、面倒な設定不要で誰でも簡単に手描きのマンガ・イラストをアニメーション化できる無料のWebサービスをご紹介します！
画像をアップロードするだけで、キャラクターの抽出からボーン構造の埋め込みまでAIが自動的に最適化してくれるのが大きな特徴です。とにかく自分の描いたキャラクターが、リアルに動きだす瞬間をぜひ楽しんでみてください！
■「Animated Drawings」の使い方
それでは、「Animated Drawings」をどのように使えばいいのか詳しく見ていきましょう！
利用するにあたり、ユーザー登録や特別な初期設定は不要です。サイトにアクセスしたら、【Get Started】ボタンをクリックしてください。
すると、画像をアップロードするためのエディタが表示されます。
この画面から手描きのマンガやイラストなどをアップロードするだけで、すぐにでもアニメーション化を楽しむことが可能です。
アップロードするための画像ですが、例えばスマホなどから手描きのマンガを撮影して画像ファイルを作成するのが簡単でしょう。
ちなみに手描きするマンガ・イラストの画像については、以下の点に注意するようにしてください。
＜手描きのポイント＞
- 白い紙に一体だけキャラクターを描く
- シワ、破れ、汚れなどがないようにする
- なるべく影が写り込まないようにする
- 明るい場所でキャラクターだけを収める
- 手、足などが重ならないように注意する
…など
上記内容を踏まえて、まずは公式のサンプル画像を利用してどのようにアニメーション化していくのかを見ていきましょう。
■画像をアップロードしよう！
それでは、手描きのマンガを実際にアップロードしてみましょう。
手持ちの画像ファイルが無いという方は、エディタ左側にあるサンプル画像を使って試すことができます。
そこで、好きな画像を1つ選択してみましょう。
すると、自動的にキャラクターを特定して、以下のようなボックスを配置してくれます。
1体のキャラクターがきっちり収まっているかを確認してください。必要であれば、ボックスのサイズをドラッグして調整することも可能です。
調整が完了したら、エディタ下部にある【Next】ボタンをクリックしましょう。
■キャラクターを抽出しよう！
次に、「Animated Drawings」がキャラクターと背景を自動的に分離した状態の画面が表示されます。
注意点として、キャラクターの部分だけがハイライト表示されているかを確認してください。
もし、以下のようにうまくハイライトされていない箇所があれば、ペンツールや消しゴムツールで修正を行います。
ほとんどの場合は修正不要ですが、手・足が重なっていたり胴体と繋がっていなかったりすると修正が必要になるケースがあります。
調整が完了したら、エディタ下部にある【Next】ボタンをクリックしましょう。
■キャラクターにボーン構造を埋め込もう！
最後に、キャラクターをアニメーション化させるための骨組みを埋め込んで、関節がリアルに動くようにします。
「Animated Drawings」では、面倒な設定不要ですべて自動的にキャラクターへ骨組み（ボーン構造）を最適化してくれます。
キャラクターの顔・目・耳・胴体・腕・足…など、十数か所に骨組みと関節が配置されているのがわかります。
もし「ボーン構造」がうまく配置されていない場合は、丸いポイントをドラッグして調整可能です。
基本的にはデフォルトの状態で問題ありませんが、実際にアニメーション化した際に動きが気になる場合はいつでも戻って再調整可能です。
■キャラクターをアニメーションさせてみよう！
ここまでの設定が完了したら、あとは1クリックでキャラクターをアニメーション化できます！
さきほどのボーン構造が完了したら、エディタ下部の【Next】ボタンをクリックしてください。
すると、手描きのキャラクターがリアルに動きだします！
エディタの左側には、さまざまなモーションがリストアップされており、好きなものを選択するだけで多彩なアニメーションをしてくれます。
例えば、こんな感じです。
せっかくなので、サンプル画像以外のマンガやイラストでも試してみましょう。
例えば、次のような画像を同じ手順でアニメーション化するとどうなるでしょうか。
こんな感じになります！
フリー素材のキャラクターも同じ手順で動かしてみましょう！
もはや静止画とは思えないリアルなアニメーションになります。
このように「Animated Drawings」を使うと、誰でも簡単にアニメーション化させることができるわけです。
ちなみに、エディタ下部の【Share】ボタンをクリックしてURLをコピーすると、友人・知人に自分のアニメーションをシェアできる機能もあります。
シェアされたURLをブラウザで開くと、作成したアニメーションを誰でも閲覧可能なのでぜひ活用してみてください。
【Fix】ボタンをクリックすると、ボーン構造を再調整できるので動きに違和感がある場合は何度でもカスタマイズ可能です。
■動画でプログラミングが学べるpaizaラーニング
動画でプログラミングが学べるpaizaラーニングでは、Python、Java、C言語、C#、PHP、Ruby、SQL、JavaScript、HTML/CSSなど、プログラミング初心者でも動画で学べる入門レッスンを公開しています。
このたび人気の「Python入門編」が全編無料となりました。他にもいろいろな動画レッスンを無料公開しておりますので、エンジニア・非エンジニアにかかわらず、プログラミングを学びたい方はぜひごらんください。
paizaラーニングについて詳しくはこちら
■まとめ
今回は、誰でも簡単に手描きのマンガ・イラストをアニメーション化できる無料のWebサービスをご紹介しました。
基本的には画像をアップロードするだけで調整などは不要のため、慣れてくれば1分も掛からずにアニメーションを楽しむことができるようになります。親子で楽しむのはもちろん、マンガやイラストを描ける人も夢中になる面白さがあるサービスと言えるでしょう。
ぜひみなさんもオリジナルキャラクターに命を吹き込んで、さまざまなアニメーションをシェアしてみてはいかがでしょうか。
＜参考リンク＞
・「Animated Drawings」公式サイト
paizaラーニングでは、ほかにもJava、C#、Ruby、C言語、PHP、SQL、JavaScript、HTML/CSSなど、人気言語の動画レッスンを公開しています。
詳しくはこちら
そしてpaizaでは、Webサービス開発企業などで求められるコーディング力や、テストケースを想定する力などが問われるプログラミングスキルチェック問題も提供しています。
スキルチェックに挑戦した人は、その結果によってS・A・B・C・D・Eの6段階のランクを取得できます。必要なスキルランクを取得すれば、書類選考なしで企業の求人に応募することも可能です。「自分のプログラミングスキルを客観的に知りたい」「スキルを使って転職したい」という方は、ぜひチャレンジしてみてください。
詳しくはこちら
