商用利用可パーティクル作成ツール「Particle Develop」

HTML5製のデザインツール「Particle Develop」で遊んでみました。商用利用可能、誰でも自由に使えます。

Webサイトに華やかな表現を!HTML5用パーティクルライブラリ「ParticleJS」

ということなので、本来は動きのあるWebサイト用のツールですが、画像形式での書き出しも可能です。

パーティクル(Particle)は日本語で「粒子」のこと。炎とか雲とか光跡とか、なんとなくキラキラフワフワした映像の総称と思っていただければたぶん間違ってないです(笑)

使い方ですが、まず、「Particle Develop」のページへ行きます。

こちらがトップ画面。

トップ

右側のテンプレートから好きなものを選びます。

真ん中の「四角形」はパーティクルの発生源です。ドラッグで動かせます。

右上の歯車マークなどがタブになっていて、ここでメニューが切り替わります。

エミッター設定

エミッター設定パネルではパーティクルの広がり方などを変更できます。

X座標とY座標を上げて発生数を増やすと、画面いっぱいになりますよ。

エミッター設定1

パーティクル設定

パーティクル設定では、パーティクルそのもののサイズや量を調整できます。

開始色

開始色は文字通りパーティクルの色を変更したい場合。透明度もここですね。

形状設定

形状設定でパーティクルの形を変えられます。

円だけじゃなくて、花やハートがあるのも面白いです。

ステージ設定

ステージ設定は画面の大きさですね。最大にするとこんな感じ。

保存する際は、右上にある「イメージの書き出し」です。

イメージ書き出し

画像ファイルとしてはPNGかJPEGが選べます。WebPはGoogleが開発した画像形式なので、Google Chromeとかでしか開けません。ただし、WebPが一番軽いです。

「パラメーター保存」を選ぶとこんな感じです。

パラメータ保存

Webサイトを作る方にはありがたいのかもしれませんが、とりあえず私はこれはパスで。

「イメージの書き出し」を使って、JPEG形式とPNG形式で書き出した画像が以下です。

JPEG

PNG

ん~……せっかくキラキラのパーティクルなのに、イマイチ画質が……(汗)

いくつか、「黒い砂漠」のキャラと組み合わせてもみましたが……。

それなりに試行錯誤してみましたが、どうもあまり綺麗にならないですよねぇ……。

……で、3度目の正直がこれです。

これなら「まあまあイケる」と思うんですが、これ実は「Particle Develop」にある「イメージの書き出し」は使わず、PrintScreenで画面をそのままスクリーンショットで撮って、パワポでトリミングしたモノなのです。

本来は「アニメーション」として「動き」見せる用途のモノだと思うので、まぁ、こんなものかなぁ、と思ったりもします。

幸い自由に使ってもいいようなので、画面を一定時間録画してパーティクル部分だけを切り取って映像に使う、なんてコトもできるかもしれません。機会があればやってみたいですね。

背景色が黒と紫の2色しか選べないのは少々物足りないかなぁ。パーティクルの形状ももっとたくさんあると嬉しいですが、ないものねだりですねコレは(笑)

それでは、以上です。



ゲーム動画ランキング