複数枚のGIF画像を、コマ送りで表示する仕組みをGIFアニメーションと呼びます。
ここでは、ペイントソフトとフリーソフトを使って、GIFアニメーションの作り方を紹介します。
今回、GIFアニメーションを作成するのに、次のフリーソフトを使用します。
『Giam』(GIF MNGアニメーション作成ツール)
作者:古溝 剛さん
作者のサイト「古溝 剛のオリジナルソフト公開ホームページ」でダウンロード可能です。
専用ダウンロードページはこちら:「Giamダウンロードのページ」
※ ダウンロード及びインストールは自己責任でお願いします。
作者:古溝 剛さん
作者のサイト「古溝 剛のオリジナルソフト公開ホームページ」でダウンロード可能です。
専用ダウンロードページはこちら:「Giamダウンロードのページ」
※ ダウンロード及びインストールは自己責任でお願いします。
このフリーソフトは、GIFアニメーション等を作成するツールです。
GIFアニメーションを作成するのに便利なソフトですので、
素材作成では活躍の機会が多いと思います。
GIFアニメーションを作成するのに便利なソフトですので、
素材作成では活躍の機会が多いと思います。
各コマの作成
1.ペイントソフトの起動
左下にある「スタート」から、「全てのプログラム→アクセサリ→ペイント」と選択します。
左下にある「スタート」から、「全てのプログラム→アクセサリ→ペイント」と選択します。
起動直後の画面
![]() |
2.サイズの変更
画面上部にある「変形」から「キャンパスの色とサイズ」を選択し、幅と高さを入力します。
その下の単位は「ピクセル」、色は「カラー」になっている事を確認してください。
画面上部にある「変形」から「キャンパスの色とサイズ」を選択し、幅と高さを入力します。
その下の単位は「ピクセル」、色は「カラー」になっている事を確認してください。
3.背景色の変更
画面下部にあるカラーボックスから色を右クリックで選択します。
もしこの中に使いたい色が存在しない場合は、今回作るアイコンで使用しない色を右ダブルクリックして、色の編集画面を表示させ、「色の作成」で好きな色を作成します。
色の選択が出来たら、画面左のツールボックスから「塗りつぶし」ボタンを選択します。
キャンパス上で右クリックすると、選択した色で塗りつぶされます。
画面下部にあるカラーボックスから色を右クリックで選択します。
もしこの中に使いたい色が存在しない場合は、今回作るアイコンで使用しない色を右ダブルクリックして、色の編集画面を表示させ、「色の作成」で好きな色を作成します。
色の選択が出来たら、画面左のツールボックスから「塗りつぶし」ボタンを選択します。
キャンパス上で右クリックすると、選択した色で塗りつぶされます。
4.テキストの入力
画面下部にあるカラーボックスから色を左クリック選択します。
(使いたい色がない場合は、「3」と同じ様に色の編集画面から選択します。但し左クリック。)
画面左のツールボックスから「テキスト」ボタンを選択します。
画面上部にある「変形」から「背景色を不透明にする」のチェックを外します。
(左側のツールボックス内でも設定可能)
次に、キャンパス内でクリックし、その後テキスト入力サイズを変更します。
(四角い点線の辺の上でクリックしたまま移動させて調節します)
書体などの書式を設定してから、テキストを入力します。
「塗りつぶし」や「鉛筆」のボタンを利用し、修正や色付けをします。
画面下部にあるカラーボックスから色を左クリック選択します。
(使いたい色がない場合は、「3」と同じ様に色の編集画面から選択します。但し左クリック。)
画面左のツールボックスから「テキスト」ボタンを選択します。
画面上部にある「変形」から「背景色を不透明にする」のチェックを外します。
(左側のツールボックス内でも設定可能)
次に、キャンパス内でクリックし、その後テキスト入力サイズを変更します。
(四角い点線の辺の上でクリックしたまま移動させて調節します)
書体などの書式を設定してから、テキストを入力します。
「塗りつぶし」や「鉛筆」のボタンを利用し、修正や色付けをします。
※書式変更
画面上部の「表示」から「書式バー」を選択します。
フォント・サイズ等の設定を行ないます。
画面上部の「表示」から「書式バー」を選択します。
フォント・サイズ等の設定を行ないます。
テキスト入力の様子
![]() |
6.保存
画面上部の「ファイル」から「名前をつけて保存」を選択します。
保存場所を選択し、名前を入力します。
「ファイルの種類」を「GIF」に変更して保存します。
画面上部の「ファイル」から「名前をつけて保存」を選択します。
保存場所を選択し、名前を入力します。
「ファイルの種類」を「GIF」に変更して保存します。
7.次のコマを作る
画面上部の「変形」→「すべてクリア」でキャンパスを初期状態に戻します。
上記「3」~「6」で、次のコマを作成します。
同様に、GIFアニメーションで使用するコマを、全て作成します。
画面上部の「変形」→「すべてクリア」でキャンパスを初期状態に戻します。
上記「3」~「6」で、次のコマを作成します。
同様に、GIFアニメーションで使用するコマを、全て作成します。
アニメーションの作成
1.ソフトの起動~読み込み
『Giam』(GIF MNGアニメーション作成ツール)を起動します。
「開く」ボタンで、アニメーションの1コマ目を読み込みます。
「ファイルからコマの付足し」ボタンで2コマ目を読み込みます。
同様に「ファイルからコマの付足し」ボタンで、3コマ目・4コマ目・・・と、読み込みます。
『Giam』(GIF MNGアニメーション作成ツール)を起動します。
「開く」ボタンで、アニメーションの1コマ目を読み込みます。
「ファイルからコマの付足し」ボタンで2コマ目を読み込みます。
同様に「ファイルからコマの付足し」ボタンで、3コマ目・4コマ目・・・と、読み込みます。
2.全体の設定
コマ表示窓の右側にある繰り返しセットと永久に繰り返すにチェックを入れます。
一定回数繰り返した後に停止させたい場合は、繰り返し回数を指定して、永久に繰り返すのチェックを外します。
コマ表示窓の右側にある繰り返しセットと永久に繰り返すにチェックを入れます。
一定回数繰り返した後に停止させたい場合は、繰り返し回数を指定して、永久に繰り返すのチェックを外します。
3.各コマの設定
・共通設定
「名前を付けて保存」ボタンから、作成したGIFアニメを保存します。
・共通設定
コマ選択リストボックス下にある「全部選択」ボタンを押します。
ウェイト有りにチェックを入れます。
消去手段を、背景色でつぶすを選択します。
・個別設定ウェイト有りにチェックを入れます。
消去手段を、背景色でつぶすを選択します。
コマ選択リストボックスで、1コマ目を選択します。
背景色を透過処理する場合は、透過色の使用にチェックを入れます。
ウェイト有りにチェックが入っている事を確認し、ウェイト時間を設定します。
ウェイト時間とは、選択中のコマから次のコマへ移るまで(待機)の時間です。
コマ選択リストボックスで、2コマ目を選択し、同様にウェイト時間を設定します。
更に、3コマ目・4コマ目・・・と設定していきます。
全てのコマの設定が終わったら、「View」ボタンで実際に動いている様子を確認します。
調整が必要な場合は、必要個所の設定を修正します。
4.保存背景色を透過処理する場合は、透過色の使用にチェックを入れます。
ウェイト有りにチェックが入っている事を確認し、ウェイト時間を設定します。
ウェイト時間とは、選択中のコマから次のコマへ移るまで(待機)の時間です。
コマ選択リストボックスで、2コマ目を選択し、同様にウェイト時間を設定します。
更に、3コマ目・4コマ目・・・と設定していきます。
全てのコマの設定が終わったら、「View」ボタンで実際に動いている様子を確認します。
調整が必要な場合は、必要個所の設定を修正します。
「名前を付けて保存」ボタンから、作成したGIFアニメを保存します。
※ 各機能の詳しい説明は、ヘルプを参照して下さい。
※ ヘルプの最初の画面で、各ボタン等の呼名や解説を見る事が出来ます。
※ ヘルプの最初の画面で、各ボタン等の呼名や解説を見る事が出来ます。
・今回試しに作成したGIFアニメーションは次の3点です。
名前アイコン(ブログタイトルとニックネームの交互表示)
+
★を1コマずつ右に動かす
+
+
+
+
★が右に動くライン(上の画像をライン用に長さを延長)

今回はテキストのみで作成しましたが、絵やキャラクターなどを動かして、
オリジナルな素材を作ってみてはいかがでしょうか?
オリジナルな素材を作ってみてはいかがでしょうか?
アニメキャラクターなどを真似したものを作成して使用すると、
著作権侵害になる場合がありますので注意してください。
著作権侵害になる場合がありますので注意してください。
Microsoft Corporationのガイドラインに従って画面写真を使用しています。
記事作成:「きろくぶろぐ」http://blogs.yahoo.co.jp/mon_7_jp

