FC2ブログ

動くイラストと猫漫画

鉄道・猫漫画・フリー素材のブログです。16年目に突入しました。

Entries

連載「GIFアニメと私」第2章


自分史の記録として、フリー素材3000点以上作ったGIFアニメと自分との歴史を綴っています。

※第1章 1990年~1992年まで(パソコン通信・ESCアニメ・音楽演奏ソフトRay)はこちら

第2章 1993年ごろ~2007年まで

5.九州へ引っ越し

それまでは埼玉で仕事についていましたが、夫の転勤で九州へ移動して、仕事もやめました。
その頃からパソコン通信の世界で、私のESCアニメつきRayデータが人気になり、ニフティサーブのボードリーダーをまかされたりしました。

当時、著作権協会とニフティが共同で著作権付きデータの実験をしていたので、「愛は勝つ」「セイ・イエス」などの人気曲もデータ化できたせいもあり、データダウンロード数も伸びていました。
PC98シリーズ音楽演奏ソフトRay
ray-gamen.png

仕事をやめて時間ができたので、それまでRayのタイトル部分だけのアニメを作っていましたが、全画面を使ってのデータ作成にも挑戦しました。
「アメイジング・グレイス」は、全画面(当時は黒)に雪と教会を表示し、馬車に乗った猫のカップルがやってきて教会に入り、天使が上から舞い降りてくるというESCアニメでした。

ESCアニメ作家さんたちと共同で作ったシューベルトの弦楽五重奏曲「鱒」は、フロッピー付きのデータ本にものりました。その他ピーターポールアンドマリーの「パフ」やショパンの「子犬のワルツ」なども本になりました。

ちょうどパソコンPC9801が爆発的に売れた時期と重なってます。
pc9801.gif


6.アニメ作り空白期間(1996年~2005年)


その後、パソコンもWindowsの時代になり、PC98シリーズ対応のRayデータは下火になり、私も遠ざかりました。
自宅で仕事を始めたせいもあり、Windowsは仕事でのみワープロとして使っていました。

win98.jpg

7.ホームページビルダーとの出会い


 しばらく、パソコンは仕事でワープロのみ使ってましたが、猫の写真を使った4コマ漫画を親族間のメールマガジンで配布していたら、ある親族からホームページをやってみたら?というお誘いを受けました。2006年の後半ごろでした。

 その頃の私は、インターネットを使い始め、猫ブログをいくつも閲覧していたので、自分も猫の4コマ漫画を公開したくなりました。
 それで、ホームページビルダーでホームページを作成し、2007年2月27日に公開し始めました。

 なぜか、ブログより先にホームページを始めてしまったのです(^_^;

 結果的にHTMLを本質的に理解するには、その方が役立ちました。

8.「うしちこ通信」開始とGIFアニメ開始


うしちこ通信
「うしちこ通信」のタイトル部分の一例

 ヤフージオシティーズ無料サーバーで開設したホームページは「うしちこ通信」という名前でした。(現在Yahoo!ジオシティーズは閉鎖されています)

「うし」と「チー公」という2匹の飼い猫の日記形式で4コマ漫画を載せていました。(のちにうしはウーシーマン、チー公はチー公王子という芸名で猫漫画になりますが、最初の頃は本名でした)

GIFアニメは、猫漫画の中で動きのあるタイトルやアクセントに使うイラストのために、ホームページビルダーの中のウェブアニメーターという機能を使って、作っていました。

結局、今もGIFアニメはホームページビルダーのウェブアニメーターを使っています。

最初の頃は、コマ数を増やすとファイルのデータサイズもバカでかくなってしまい、重いアニメしか作れず、読み込むのに時間がかかってしまいました。

そのうち、動かす部分だけのコマを作る方法や、コマによって表示時間を変える方法や、背景を固定して他のコマを動かす方法などがわかってきました。すべて試行錯誤の上、独学でマスターしました。

(1)動かす部分だけのコマを使って作ったGIFアニメ↓

家で踊ろうパプリカ

背景の上にパプリカダンスを踊る部分だけの画像を重ねて表示しています。
全体の画像を組み合わせるよりずっと少ないデータサイズになります。

(2)コマによって表示時間を変えたGIFアニメーション
GIFアニメーション
このアニメは、実際は1枚1枚の画像を猫の写真を合成して作っているので、とんでもなく時間がかかっています。しかし、データサイズはとても軽いです。

(3)背景を固定して、電車や車を横に動かすGIFアニメーション
例↓
キハ40系タラコ色gif
(吉備線や芸備線などを走るキハ40系47系気動車のイラスト素材)
電車やバス・車などのイラスト約1500種はこの方法で作っています。

簡単そうに見えますが、電車のイラスト作成、背景と電車の大きさあわせ、風景の季節感、GIFアニメーションの速度変化、メッセージの入れ方、など、実は多くの課題をクリアしないと変なアニメになってしまいます。
このへんのバランスは、長年のカンとしか言いようがありませんし、背景部品だけでも大きさや季節感を変えて、500種類ぐらい用意しないとなりません。
左右に動かすアニメーションは、ある程度自動でできますが、その方法を会得するのにも1.2年かかりました。

(4)背景と前景を同時に動かすGIFアニメーション

tree-eva500k-ani_20210120102325a84.gif
エヴァンゲリオン新幹線の動くイラスト 500系新幹線

これは実は3枚の画像でできています。
だから楽だろうと思われるかもしれませんが、実は(3)の方法よりかなり試行錯誤します。

必ず、後ろの背景が等速度で流れるように、1ピクセル単位の調整が必要で、前景の電車部品の位置も1枚1枚微調整が必要です。(同じ位置だと不自然なアニメになります)

しかもインタプリタではなくコンパイラなので、3枚の画像を作ってはGIFアニメーション作成して微調整を繰り返さないと、流れるように見えるGIFアニメーションにならないのです。
(画像作成ソフト→GIFアニメ作成ソフト→調整が必要なら→画像作成ソフト の繰り返し)
7korobi8oki_20210120103536a4b.gif

余談ですが、このタイプのGIFアニメーションは、3枚の画像の順番を間違えると、こんな風に高速でバックするGIFアニメになってしまいます(^_^;
back-eva500k-ani.gif
おもしろいでしょ?

以上、第2章でした。
このつづき(Yahoo!ブログ時代へ)は、また後日に。

最後までお読みいただきありがとうございました。
上は(4)の方法で作成したGIFアニメーションです。(フリー素材)

GIFアニメのフリー素材3000点以上の無料サイト


関連記事

コメント

Re: Mrs.green さん 

> 私にとってパソコン恩師です
> これからもよろしくお願いします。
> 久しぶりのチーコーとウーシーマンの
> アニメ懐かしい

 いえいえ、私も最近のパソコン事情、ネット事情にはおいてけぼりです。
 でもGIFアニメがこんなに生き残れるコンテンツだとは思いませんでした。
 チー公とうしの動く画像をたくさん作ったので、2匹がネットの世界でずっと生き残れてよかったです。

Re: マイラさん 

> 書かれている事を何度読んでもよくわからない私~

 GIFアニメを作ったことがある人でないとわからなくて当然です。
 Yahoo!ブログ時代にたくさんの方に名前アイコンやブログバナーなどを作ってさしあげた経験が役立っています。
 こちらこそ使っていただき励みになっています。ありがとうございます。

Re: 峠さん 

最初の頃はGIFアニメの教科書などなかったので
試行錯誤の中でだんだんにしくみを理解していきました。
Yahoo!ブログ時代に1000以上の名前アイコンを作った経験が役立ってます。
ファンと言ってくださる方がいることが生きる励みになっていますので、こちらこそ感謝です

無題 

すごい!
としか表現できません
何度聞いても私にはよく理解できない
私には一生かかってもできないことです
そんな私に色々教えてくれてホントに
私にとってパソコン恩師です
これからもよろしくお願いします。
久しぶりのチーコーとウーシーマンの
アニメ懐かしい

  • posted by Mrs.green 
  • URL 
  • 2021.01/21 11:13分 
  • [Edit]

無題 

書かれている事を何度読んでもよくわからない私~笑。こういうことを独学でマスターされていかれたちいこさんは素晴らしいです。これだけ時間をかけて作られた物を簡単にお借りするだけで何だか申し訳なく思います。いつもありがとうございます。
  • posted by マイラ 
  • URL 
  • 2021.01/21 03:47分 
  • [Edit]

無題 

独学でマスター

なんですから 主人の言う
凄い人じゃなァ です
 ちいこさん!!

  うしちこ母さん素材の大ファン
  感謝しかないです
  • posted by 峠 美千子 
  • URL 
  • 2021.01/20 12:34分 
  • [Edit]

Comment_form

管理者のみ表示。 | 非公開コメント投稿可能です。

Menu

最新記事一覧(サムネイル画像付き)

石橋文化センターつばきまつり Mar 21, 2023
埼玉鉄道博物館その2「鉄道ジオラマ動画」 Mar 20, 2023
埼玉鉄道博物館その1 Mar 19, 2023
「ただいま東京クーポン」で「ペニーレイン」と「天空」 Mar 17, 2023
東京撮り鉄乗り鉄日記1「特急あずさ、中央線」 Mar 16, 2023
撮り鉄「埼玉新交通ニューシャトル」 Mar 15, 2023
初めてのビジター応援席「ホークスvsライオンズのオープン戦」 Mar 14, 2023
猫漫画「3匹の猫トーク」 Mar 10, 2023

ブロとも申請フォーム

シンプルアーカイブ

シンプルアーカイブの使い方
2007~2012ヤフーブログ

プロフィール

ちいこ

Author:ちいこ
ホームページ「動くイラストフリー素材」で3200点以上の著作権フリー画像を配布しています。「動くイラスト」で検索して下さい。

FC2ブログカウンター

ランキング参加中

応援ありがとうございます

鉄道コム にほんブログ村 イラストブログ フリーイラストへ
にほんブログ村