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