こんにちは、AnyIllustスタッフです！
今日は、インフォグラフィック記事の3回目。
いよいよ、オリジナルのインフォグラフィックを作っていきましょう。

まずは情報収集です

インフォグラフィックにしなければならない題材があるのなら、それについて詳しく調べましょう
調べていく上で、どんな素材が必要蚊、どんな画面にするかのインスピレーションも湧いてくるはずです

今回スタッフは、オリジナルのゆるキャラの生態をインフォグラフィックにしますね

こんなキャラクターです
ここにある情報をわかり易くまとめます
また、最終的にアニメーションを付ける必要があるので、この時点でどの情報をどのように動かすのかも計画しておきましょう

構図を考えましょう

次に情報の数だけボックスを作るイメージで、大体の構図を考えます
すべてを同じ大きさや形にする必要はないので、自由に考えてみましょうφ(..)
実際に作るとスペースが足りなかったりするかもしれませんが、作る前に紙に鉛筆で配置を考えてみるのは全体のイメージを掴むことができるのでおすすめです(o・ω・o)
スタッフが作ってみた例です

実際に作ってみよう！

では、先程作った構図を参考にインフォグラフィックを実際に作ってみます
今回は、キャラクターに合うよう火鉢でおもちを焼いている構図を使うことにしました

できたのがこちらです！
どうですか？わかりやすくできているでしょうか？
色は配色サイトを参考に作ってみました。
背景のイラスト以外は太い線でシンプルに作成しました

少し変則的な配置になっていますが、こういうときでもちゃんと「箱」や「線」を意識した配置にします

こんな感じで意識して配置してみました
少し枠ギリギリの配置になってしまっていますね
中に入っているものを全体的に縮小して、もう少し情報と外枠との隙間を作ってあげればさらに収まりが良くなります

次回は、こちらの画像を使用してアニメーションgifを作っていきましょう(｀･ω･´)ゞ

記事一覧(完結済み)

 any-illust.com

http://any-illust.com/%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A9%E3%82%B0%E3%83%A9%E3%83%95%E3%82%A3%E3%83%83%E3%82%AF%E3%81%AE%E3%82%A2%E3%83%8B%E3%83%A1%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3gif%E3%82%92%...

http://any-illust.com/%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A9%E3%82%B0%E3%83%A9%E3%83%95%E3%82%A3%E3%83%83%E3%82%AF%E3%81%AE%E3%82%A2%E3%83%8B%E3%83%A1%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3gif%E3%82%92%E4%BD%9C%E3%81%A3/

 イラスト制作、キャラクター制作、インフォグラフ...

インフォグラフィックのアニメーションgifを作ってみよう！：2/3

http://any-illust.com/%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A9%E3%82%B0%E3%83%A9%E3%83%95%E3%82%A3%E3%83%83%E3%82%AF%E3%81%AE%E3%82%A2%E3%83%8B%E3%83%A1%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3gif%E3%82%92%E4%BD%9C%E3%81%A3-2/

こんにちは、AnyIllustスタッフです(｀･ω･´)ゞ今日も引き続き、インフォグラフィックを制作していきましょう！前回は、良いインフォグラフィック作品の特徴をまとめましたね■シンプルなイラスト■重要な（グラフ、数...

 イラスト制作、キャラクター制作、インフォグラフ...

インフォグラフィックのアニメーションgifを作ってみよう！：3/4

http://any-illust.com/%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A9%E3%82%B0%E3%83%A9%E3%83%95%E3%82%A3%E3%83%83%E3%82%AF%E3%81%AE%E3%82%A2%E3%83%8B%E3%83%A1%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3gif%E3%82%92%E4%BD%9C%E3%81%A3-3/

こんにちは、AnyIllustスタッフです！今日は、インフォグラフィック記事の3回目。いよいよ、オリジナルのインフォグラフィックを作っていきましょう。

 イラスト制作、キャラクター制作、インフォグラフ...

インフォグラフィックのアニメーションgifを作ってみよう！：4/4

http://any-illust.com/%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A9%E3%82%B0%E3%83%A9%E3%83%95%E3%82%A3%E3%83%83%E3%82%AF%E3%81%AE%E3%82%A2%E3%83%8B%E3%83%A1%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3gif%E3%82%92%E4%BD%9C%E3%81%A3-4/

こんにちは、Any Illustスタッフです今日は、前回作ったインフォグラフィック画像を使ってアニメーションgifを作っていきますよ(^O^)／前回作った画像はこれでした一枚の画像のすべての位置が動いているインフ...

関連記事はこちら:

インフォグラフィックのアニメーションgifを作ってみよう！：4/4 インフォグラフィックのアニメーションgifを作ってみよう！：1/4 インフォグラフィックのアニメーションgifを作ってみよう！：2/4 インフォグラフィックの作り方1-③動画にしてみよう！