本記事の内容

9VAeきゅうべえは、2015年「みんなのラズパイコンテスト」で優良賞をもらったフリーのアニメーション作成ソフトです。Windows版、Mac版、Ubuntu版もあり、まとめて　9VAe（きゅうべえ）とよんでいます。

9VAeきゅうべえは現在も開発中で、ここでは開発進行中のテクスチャ（タイル塗りつぶし）についてのみ記載します。

• 9VAeきゅうべえでアニメ作成したい方は、「無料ソフトでアニメを作ってみよう（9VAe きゅうべえ）」 からご覧ください。

9VAeきゅうべえのテクスチャ

• 以下のように図形の塗りつぶしに模様をつける機能です。模様の大きさは変化しないため、「タイル塗りつぶし」と表現しています。

タイルエディタ

9VAeきゅうべえVer.0.6.13からユーザーが独自のタイルを作れるタイルエディタが搭載されました。詳細はこちらをご覧ください。

タイルパターンの種類

タイルには以下の３種類があります。タイルは塗り色のカラーパレットの下の段に表示されます。

• 標準タイルは、エディタが内部に持っており、どのアニメーションでも使用できます。データを保存したときに保存タイルになります。
• 保存タイルは、アニメーションデータといっしょに保存されたタイルで、そのアニメーションの中でしか使えません。保存タイルを使っている図形をコピーすれば、別のアニメーションでも使えるようになります。模様を編集することはできません。
• 自作タイルは、画像を利用して自分で作成したタイルです。模様を編集することができ、修正すれば、そのタイルを使用したすべての図形に反映されます。自作タイルはタイルオブジェクトとしてページに保存されます。どのページに保存されていても効果は同じです。複製すれば別のタイルになります。タイルオブジェクトをコピーすれば、他のアニメーションでも使えます。タイルオブジェクトのないタイルは、保存タイルと同じ扱いになります。

自作タイルの作り方

1. タイルにしたい画像をファイルとして保存します。１枚の画像に複数枚のタイルが含まれていてもかまいません。決まったフォーマットはなく、どんな画像でも使用できます。
2. 塗り色のカラーパレットを開き、タイル領域の空きエリアをクリックします。
3. 画像ファイルを選択します。
4. 指定した画像を持ったタイルオブジェクトが１つ作成され、点選択モードで開きます。点を移動させタイルの範囲を指定します。

タイルオブジェクト

タイルオブジェクトの機能

タイルオブジェクトは、次の属性を持ちます。

つなぎ目の処理

タイルパターンは同じ模様を繰り返して描画するため、つなぎ目が目立たないパターンを作成する必要があります。9VAeきゅうべえでは、つぎのようにしてつなぎ目が目立ちにくいパターンを作成できます。

• ◇で指定されたタイルの範囲の画像をＡとします。つなぎ目を指定する点△が右上端にある場合、つなぎ目がなくなります。このとき、画像Ａは、Ａ１、Ａ２、Ａ３のように単純に繰り返されます。
• 上の「自作タイルの作り方」アニメのように△が左にずれていた場合、△から右下の領域がつなぎ目になります。つなぎ目では、画像Ａ１と画像Ａ２を重ねます（繰り返し間隔が小さくなります）。つなぎ目の左端は画像Ａ１、右端は画像Ａ２になるように混ぜ合わせます。その結果なめらかにつながるようになります。
• △が下にもずれていた場合、上下方向も同じ処理を行います。

点選択モードでのタイルオブジェクトの中心メニュー

点選択モードで複数の点を選んで、中心の「＋」をクリックすれば、以下の項目が表示されます。

タイル塗りつぶし方法

9VAeきゅうべえのタイルは、図形の色に、ハイライトや影の模様をつけるために開発されました。

ハイライトや影の模様の元になる画像は、基本はモノクロ画像です。ただし、標準の処理では内部でモノクロ画像に変換されますので、カラー画像でも使えます。このモノクロ画像の灰色の領域が図形に設定された塗りつぶしの色になります。また、白や黒の領域がハイライトや影の色になります。実際は「標準」「白を透明に」「黒を透明に」「カラー」のモード設定によって以下のように色が変換されます。

• 「標準」と「カラー」の違いは、標準ではカラー画像を内部でモノクロ画像に変換してから処理します。その結果、灰色の領域は必ず塗りつぶしの色になります。「カラー」では処理をＲＧＢ３成分にわけて行います。図形の塗りつぶしの色を灰色にすれば、タイル模様の色がそのまま表示されます。

タイルオブジェクトの中心メニュー

点選択モードを終了すると、タイルの元画像の表示が消えます。この状態で選択枠の中心「＋」をクリックすると、以下の項目が表示されます。

タイルオブジェクトの色、透明度

タイルオブジェクトを選択し、塗り色カラーパレットの色、透明度を変更すれば、タイルが黒のときの色や、タイル処理の強さを変更することがでいます。

タイルの切替え

タイル模様は、複数の模様を指定しておき、それぞれ指定した時間間隔で切替えることができるように設計されています。

これは炎が燃えるようなテクスチャも実現できるように実験的に搭載したものですが、最終的にこの形にするかどうか、まだ決まっていません。

ご意見があれば、コメントでお寄せください。

関連記事

9VAeきゅうべえ のご紹介

1. 無料ソフトでアニメを作ってみよう（9VAe きゅうべえ）
2. インストール方法
3. スクラッチ、ビスケットの次は 9VAe＝第３のプログラミング学習環境
4. よくある質問
5. 印刷用マニュアル

9VAeきゅうべえ 初級編

1. 9VAe チュートリアル（１）ーページでタイムラインなし
2. 9VAe チュートリアル（２）ー図形入力、選択、移動、サイズ変更
3. 9VAe チュートリアル（３）ーアニメキャストを作る、時間調整
4. 9VAe チュートリアル（４）ーアニメキャストの修正、往復
5. 9VAe チュートリアル（５）ー動きグラフ、ページコピー、GIF作成
6. 書き順アニメーションの作り方
7. 9VAeきゅうべえ：長いアニメを作る方法

9VAeきゅうべえ 上級編

1. AviUtil と 9VAeきゅうべえを使った簡単アニメ動画作成
2. 動くLINEスタンプのAPNG作成：無料ソフト9VAeきゅうべえ
3. 萌えキャラ デジたんを目ぱちさせるまで：APNGアニメの作り方
4. openclipartの無料イラストをアニメ化する６つの手順
5. イラストから動くLINEスタンプのようなアニメを簡単に作る方法
6. フリーソフト9VAeきゅうべえで簡単デジタルサイネージ
7. Openclipart の 無料SVG をアニメにするテクニック
8. 無料アニメソフト9VAeきゅうべえの裏技集

9VAeきゅうべえ サンプル作品

1. 9VAeきゅうべえ」で絵を描かずに作れるGIFアニメ
2. 9VAeきゅうべえで作成したSVGアニメーション

9VAeきゅうべえ 技術資料

1. アニメソフト 9VAe をカスタマイズする方法
2. イラストレータのデータを 9VAe(きゅうべえ)に変換する方法
3. 9VAeをキッズプラザ大阪向けに改造する
4. 9VAe / 9svg データフォーマット解説
5. Xtra-PCを日本語化して使ってみた
6. ワコム筆圧ペンで太さが変わる線をひくアルゴリズム
7. Raspberry Piとペンタブレットで毛筆描画アプリを作る
8. OpenCV と Python を使ったアニメーション動画用紙のスキャン画像位置合わせ