2008 . 07 . 14

PodiPodi - WebサイトにクールなUIを導入できるスクリプト

PodiPodi
以前このサイト、「ENSO」という非常に洗練されたUIのコマンドランチャーを紹介したことがありましたが、今日紹介するサイトは、Webサイト上でこのENSOと同様のUIを実現するスクリプトを提供してるサイトです。


百聞は一見に如かずということで、実際にスクリプトをこのページ内に仕込んでみたので実際に試してください。実行するには下のボタンをクリックするか、「Shift+Space」キーでコマンド窓が開きます。閉じる時には「Esc」キーを押してください。


まずは「h」とタイプして「help」を開いてみましょう。
ここでは利用可能なコマンドが表示されるはずです。
このように頭文字を入力するだけでその文字が含まれるコマンドが現れます。
info」とタイプすればこのブログの紹介が、「open archives」とタイプすればArchivesのページにジャンプするという具合です。

さらに、「find」に続けて、「ENSO」などとタイプしてみると、その文字を検索してハイライト表示してくれます。(日本語はX)
また、「Google」に続けてキーワードをタイプすれば、検索結果をそのページ上にインライン表示します。
その他コマンド一覧

と、ざっとこんなことができるスクリプトな訳です。
利用するにはアカウントを作成してスクリプトの実行に必要なコード番号を取得します。そして、目的のページにスクリプトタグを挿入します。
<script src="http://www.podipodi.com/get/コード番号/" type="text/javascript"></script>
これですぐに使えるようになりますが、最初は最小限の基本コマンドしか入っていません。そこで、先のサイトにログインして設定を調整していきます。
通常のJavaスクリプトのようにスクリプト自体をエディタで開いて編集するのではなく、このサイトの設定マネージャーを使って行うような仕組みで、変更は直ちに反映されます。 さて、簡単な設置で非常にクールなUIが導入できる訳ですが、ただ、お試しのようにブログにそのまま置いただけでは、単なるお飾りにしかならないようにも思えますが、そこら辺は各々のアイデア次第でどう使うかということでしょう。

ちなみに話はそれますが、先の「ENSO」の開発者がMozillaに入り、Firefox3のロケーションバーにも多少その影響が現れているらしく、今後のバージョンでより一層ENSOテクノロジーが導入されるようです。