ITエンジニア/デザイナ向けにオープンソースを毎日紹介

gui-datは流体のようなイフェクトを文字に対して行うJavaScriptライブラリ。

gui-datはHTML5/JavaScript製のフリーウェア(ソースコードは公開されている)。Flashや画像を使えばできることをテキストベースでやることに意義がある。テキストであれば検索もできるし、システム連動もしやすい。サイズも軽く済む場合が多い。


左上の文字がアニメーションする

テキストであってもイフェクトを加えれば画像のロゴに負けないくらいのインパクトは生み出せる。むしろダイナミックにイフェクトできる分、画像よりも有利な場合だってあるはずだ。そんな可能性を感じさせるソフトウェアがgui-datだ。

gui-datは実物を見てもらえれば何がすごいのかすぐに分かるはずだ。テキストの中を丸が通り抜けていくような、水が流れているようなイフェクトがJavaScriptによって実現している。文字を変えたり、イフェクトの度合いをダイナミックに変更することも可能だ。


文字は自由に変更可能

アウトラインを表示する設定にすれば、元のテキストに比べてどれくらいのイフェクトがされているか分かるだろう。Explodeをクリックすると破裂するイフェクトが起こる。こうしたアニメーションを実現しようと思うとFlashを使わなければ難しかっただろうが、gui-datを使えばJavaScriptだけで実現できてしまう。


MOONGIFTはこう見る

gui-datには様々なメソッドが用意されているが、その中で面白いのはsaveURLだろう。これを呼び出せばURLが出力される。これで現在のパラメータ設定が保存できる仕組みだ。設定が保存できることで、ベストな設定を探るのも容易になるだろう。

gui-datのような流体のようなイフェクトは実現が難しく、ニーズは多いと思われる。どこでも使えるという訳ではないが覚えておくときっとぴたりと使える場面に出会えるはずだ。

gui-dat(デモ含む)

jonobr1/gui-dat - GitHub

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2