キャンバスの勉強No.25(canvasでのお絵かきNo.09)

2021.07.26.07:00



 キャンバス内でお絵かきする第九弾です。

 前回途中迄だったミニラちゃんの歩行アニメの

 残りのsvg画像を補完しておきます。インクス

 ケープによる画像制作に於いては、ParaDrawの

 アンカーに当たる輪郭を形成する各点のパスを

 配置するのに少々苦労します。然しながら、

 ParaDrawの様にモーフィング処理させる為に

 次の画像とのアンカーの数や配置を統一させる

 必要は有りません。従って、一枚一枚自由にパ

 スを配置してキャラクター等の輪郭を描く事が

 出来ます。このsvgによるモーフィング処理に

 ついては又後日勉強致します。



 従ってInkscapeとParaDrawとの大きな違い

 はモーフィング処理出来るか否かです。

 ParaDrawのpdrファイルはParaFlaにより2枚

 の画像間に補完用の画像を自動的に再生して

 アニメの動きを滑らかにしてくれます。

 然しながらInkscapeのsvg画像だけではこれを

 補完して次の画像へのスムーズな画像遷移が

 出来ません。

 当初、9VAeがこのような補完作業をやってくれ

 るものだと思ってしましたが、そうではありま

 せんでした。所詮gifファイルに出力するだけ

 なので、カクカクとしたぎこちないアニメ運動

 しか得られません。

 svg画像を作成するだけでは、機能の少ない不自

 由な9VAeを利用するよりも高機能なInkscapeを

 採用した方がよっぽどきめ細かい画像作成が出

 来ると思いました。

minilla01minilla02minilla03minilla04
ミニラちゃん01 ミニラちゃん02 ミニラちゃん03 ミニラちゃん04
ミニラちゃんの各サムネイル
画像をクリックして下さい。
ミニラちゃん

キャンバスの勉強No.24(canvasでのお絵かきNo.08)

2021.07.19.07:00



 キャンバス内でお絵かきする第八弾です。

 前回のCSSアニメーションにはその他いろんな

 工夫を施せば様々な動きのするアニメgifを表現

 することが出来ます。然しここでは一旦中止し

 てまた後日取り上げたいと思います。

 それよりもsvg形式によるキャラクター画像の

 作成を再開して行きます。

 次はミニラちゃんの番です。ミニラちゃんは

 動きが簡単なのでたった四枚の画像から歩行

 スタイルを表現する事が出来ます。然しながら

 描画するのに手こずっていてまだ二枚しか出来

 ていません。



 このsvg画像を作成するのに実はインクスケ

 ープを採用しています。これはparadrawよりも

 高機能でしかも高価なadobeのillustratorに

 匹敵する程にも係わらず無料のソフトです。

 またparadrawと同じくsvg形式のベクター画像

 を作成してくれます。ただ余りにも高機能なので

 使い熟すのに少々苦労します。然しながらこれも

 慣れれば実にきめ細かい画像を作成出来ます。

minilla01minilla02
ミニラちゃん01 ミニラちゃん02
ミニラちゃんの各サムネイル
画像をクリックして下さい。
ミニラちゃん
プロフィール

chappychan2

Author:chappychan2
FC2ブログへようこそ!

最新記事
最新コメント
月別アーカイブ
カテゴリ
検索フォーム
RSSリンクの表示
リンク
ブロとも申請フォーム

この人とブロともになる

QRコード
QR