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

Yahoo! Pipesには触ってみたことがあるだろうか。各種フィードやHTMLを取得、加工して別な形(フィードやJSON等)で出力できるWebアプリケーションだ。

ピクチャ 5-26

そのYahoo! Pipesでは各データをつなげる時にパイプを伸ばしてビジュアル的に「接続」する。それを実現するライブラリがこれだ。

今回紹介するオープンソース・ソフトウェアはWireIt、オブジェクトをつなげるイフェクトを実現するライブラリだ。

WireItはYahoo! Inc.の提供するYUIを使い、Yahoo! Pipesライクなインタフェースを実現している。ボックスに付けられた丸をドラッグすると、パイプが伸び、それを別なボックスの丸に持っていくことで、接続できる。

ピクチャ 6-27

これがただの直線であれば何だが、パイプのような曲線を描いてつながるのが面白い。サンプルは数多く登録されており、ボックスを追加して接続するもの、アニメーションを行うもの、絡んでいる線をほどくゲームなどがある。

ピクチャ 7-23

使いどころを選ぶかも知れないが、見た目と動作が一致するというのはユーザにとって分かりやすい。覚えておいて損はないライブラリだろう。

WireIt - a Javascript Wiring Library

 http://javascript.neyric.com/wireit/

wireit - Google Code

 http://code.google.com/p/wireit/

ピクチャ 8-17

ピクチャ 9-11

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2