Report

イベントのレポートです。　>> 写真へ　>> アンケートの声へ

【特別編】デジタルフュージョン来日講演：〜超クールなユーザインタフェースの世界・FileMakerでAjax!〜

・開催日時：2008/10/29 19:00-20:00

・開催場所：Apple Store Ginza 3F シアタールーム

概要： FileMaker Excellence Award for Solution of the Year 2008を受賞した「Fusion Reactor」をひっさげて、DIGITAL FUSION社のクレイグ・ソーンダーズ氏、ロバート・シントン氏がFileMaker Fun Night!のために来日します。Fusion Reactorは、Ajaxのエレガントな操作感をFileMakerで実現する、驚きのPlug-inです。今回はFileMaker Fun Night特別編として開催いたします。その背景にある技術とDevConでのセッションの話題も含めた形で、ホットでエキサイティングな一時間をお楽しみください。

レポート： オバマ、勝ったね。論評は控えようと思うけども、この未曾有の金融危機下に米国民は大きく舵を切ったわけで、極東にある一介の島国の住人としては、その大転舵が我々に対して更なるしわ寄せを及ぼすことのないよう祈るばかりだ。あぁこんなに場違いな枕詞で、いっぺんやってみたかった。でも、もうしません。次の行に何て書けばいいか見当もつかなかったので。さて、月に2回の開催ともなれば私の場合はこのようにネタ切れになってしまうのですが、Fun Night! のコンテンツにはネタ切れという概念は存在しないようです。このところ発熱気味のプラグインですが、今回も強力なのが出てきましたよ。デハ。 【特別編】FileMaker Fun Night!「デジタルフュージョン来日講演：〜超クールなユーザインタフェースの世界・FileMakerでAjax!〜」 お題は... ・【特別編】「デジタルフュージョン来日講演：〜超クールなユーザインタフェースの世界・FileMakerでAjax!〜」 ・恒例Tips対決！ ●【特別編】「デジタルフュージョン来日講演：〜超クールなユーザインタフェースの世界・FileMakerでAjax!〜」 　（デジタルフュージョン社 CEO クレイグ・ソーンダーズ氏） Ajax（エイジャックス、アジャックス）は、ウェブブラウザ内で非同期通信とインターフェイスの構築などを行う技術の総称。XMLHttpRequest（HTTP通信を行うためのJavaScript組み込みクラス）による非同期通信を利用し、通信結果に応じてダイナミックHTMLで動的にページの一部を書き換えるというアプローチを取る。(wikipedia.org より) たとえば、ブラウザ上のフォームからsubmitボタンをクリックしなくとも、フォーム内の1カ所の数値を書き換えるだけで関連する小径や集計に変化が反映されたり、部署名プルダウンの変更で担当名プルダウンの選択肢が変わるような仕組み。たとえが適切かどうかは判らないがワシ的にはAjaxとはこんなモノという認識を持っている。 お題の「FileMakerでAjax」というのは、Enterキーを押したり、関係ないトコをクリックすることでフィールド値を確定しなくても、入力してる最中の値でDBがきちんと反応し、正しく戻り値を出すということのようだ。どうやって？ デジタルフュージョン社（digitalfusion.co.nz）は1996年にニュージーランドに設立されたFMデベロッパ。先のDevConで、プラグイン「Fusion Reactor」によりFileMaker Excellence Award for Solution of the Year 2008を受賞している。今回はその強力なパフォーマンスの一部を紹介してくれようという企画なのだ。 さて、FileMakerのレイアウトは原則的に静的なものなので、動的な表現は困難だ。 ・動きのきっかけとなりうるイベント要素が少ない。 ・プログラム可能なグラフィック要素がない。 具体的にできないことを挙げてみると、 ・ドラッグ＆ドロップ ・ライブフィルタリング...入力しているだけで文字列を確定しなくても結果が付いてくるタイプ ・インタラクティブなグラフ描画 ・ドラッグできるカレンダー など これらの要素は、別にそこに無くても機能的には完結できる。 ではなぜ、それらが必要とされているのかというと、 ・売り物の製品は、買い手の期待に応えなければならない。 ・直感的な操作は、使い手にとってパフォーマンスの向上をもたらす。 ・人はそもそも視覚要素でものごとを判断する動物である。 と、そもそも論まで到達してしまうようなのだ。 では、そうした一例をということで、デモ。 ▼ライブ・フィルタリング アドレス帳らしきDBで、対象の絞り込みにポータルフィルタを使っている。 しかし、条件を確定しなくても、入力中の文字列が変化すればフィルタ結果がリアルタイムに変化している。 ▼ドラッグ&ドロップ 市場の平面図といったレイアウトがあり、目的のマス内にテナント情報をドロップすると内容が入力される。 ▼ビジュアルなソート 映画制作のためのストーリーボードがあって、目的のカットに相当する領域をドラッグして順序を入れ替えることができる。 また、ウィンドウのサイズを変更すると、変更後のサイズに収まるように（エディタの文字のように）内容がキュキュっと移動する。 ▼ホテル予約システム 普通はクリックだけのインタフェース。リレーションは複雑を極め、メンテは地獄、しかも動作は遅い。 しかしドラッブ＆ドロップが可能になるだけでなくメンテが楽で、しかも動作が速いというユーザの期待通りのパフォーマンスを実現。 さて、これらをどうやって実現しているのかといえば、webビューアである。 ・webビューア＝レイアウト上のプログラム可能な領域（HTML/JavaScript/Ajax/CSS...） ・webビューアとは表示のためだけにあるのではない。たとえばgoogleマップのようなインタラクティブな要素も盛り込むことができる。 ここで問題視されるのは、当のFileMakerとのデータ授受をどうするのか、なのだが、 ソーンダーズ氏によれば2つのアプローチが可能らしい。 ・CWPによるサーバサイドでの実装（PHP APIなどを利用） 　まあ当然というか、googleマップが引き合いになってることだし。 　サーバ側で全部やるのでプラグインはいらないが、web公開エンジンやらwebサーバ、PHPソースコードなど絡まってくる要素が多く管理が煩雑。 ・プラグインによるクライアントサイドでの実装（Reactor/MBS Plugin） 　プラグインがすべてを解決してくれるので構成がシンプルになる。 　webビューアからFileMakerに対してリクエスト等の必要データを投げ、戻り値を再びwebビューアで受け取って表示する。 　ここで「Reactor」などのプラグインは、webビューアに読み込まれてたJavaScriptからデータを受け取り、FileMakerへ引き渡す。 　FileMakerのスクリプトも「Reactor」などのプラグインによって起動される。 プラグインの優位性をまとめてみると、以下のようなことらしい。 ・動作が速くスムーズ ・システムの要素をクライアント側に集約できる ・クライアント側のスクリプトを使える ・サーバの負荷にならない 逆にデメリットとは、 ・費用 ・プラグインをインストールする手間 　（確かに手間なのだが、AutoUpdateを使えば解決できる。） ・更新がサードパーティに依存する 　（APIやプラットフォームは今や安定域に入っているので杞憂だし、サポートは安定して受け続けられる） と言っている。 デメリットのカッコ内は、必ずしもそうとは言えないのではないかとの思いもあるが、まあ、社長の弁なのでそーゆーことにしておこう。 このように、webビューアというものの性格上、JavaScriptがいい感じに動いてくれるので、そこからFileMakerをうまく制御するために、「FRTB_FMUpdate()」とか「FRTB_FMScript()」といった関数が用意されているという。これはきっとReactorをインストールするとフィールド定義なんかに出てくるようになるのだろう。 更に幾つかの関数について具体的な説明が繰り広げられたが、逐一の説明はテキストが膨大になるのでここでは省略することにしよう。 あくまでポイントは「webビューアゆえにJavaScriptが使えるので、そこからデータを貰ってFileMaker本体に橋渡しをする。そういう関数を使えるようになる」ことだと解釈した。 訴求力の高い、クライアントがイチコロになるようなデモを行いたいならコレ、って感じでしょうか。 効能としては、沢山いる外野の王様たちが提案をボツにするために些末な理由を探してくれるようなクライアントによく効きそうです。 ▼Q&A ・FileMakerのポートがFirewallで塞がってるような場合、動作に影響はあるか？ 　→問題なく動作する。 ・Reactorは、要するにwebサーバなのか？ 　→その通り。ローカルマシン専用のwebサーバである。 ・Windowsだと選択できない項目があるようだが、どうなっているのか？ 　→基本的に互換性保持を目標に努力しているが、WindowsのIEでは正直何があるかわからない。 　　必要があれば対応するので連絡をいただきたい。 ・WindowsにてIEをv7→v8へ上げても大丈夫か？ 　→何らかの問題発生は否定できない。 ●恒例 Tips対決！ 　ソーンダーズ氏、熱演につき時間が押してマス。よって2名だけね。 ・ソーンダーズ氏 　テキストをマウスポインタで選択しておき、Option +「線の色指定」を行うと文字色を変更できる。 ・竹内さん 　Option + ファイルオープンではFileMaker純正のダイアログに初期値として自動的にユーザ名が入力される。 　一方、スクリプトで同様なログインダイアログ風のものを作るときも、修飾キーでログインアカウント名が入るようにしておくと何かと便利。 自身の日常に照らせば、検索条件の確定を待たずして結果リストがひょいひょいと追従する、そのことに拘らなければならない事情を抱えていないだけに、何となくピンとこない部分があるんだけども、本文にも書いたように、新システムの導入といった局面では「外野の王様」が沢山現われる会社もあるようなので、開発を生業とするプロの皆さんならば、このあたりは切実な問題でもあるんだろうね。 ワシのようなアマチュア級の場合、日々の状況は「ぬるい」のだろうが、世の中にこういうモノがあるのだ、というところだけはキチンと押さえておきたいものだ。うむ。 Reported by 金丸康明 アンケートのご協力、どうもありがとうこざいました！ ご意見、ご要望やご感想はこらちからお寄せください。 >> ご意見箱 Special Links： ・Fusion Reactor（Digital Fusion） ・Digital Fusion ・FAMLog（松尾篤さんのサイト） ・FileMaker Server カスタムWebテクニック改訂版（BNN新社） Special Thanks to： 　会場ヘルプ：新妻利恵さん（有限会社アールビィ） 　書籍ご提供：松尾篤さん（株式会社エミック） 　イベントレポート：金丸康明さん

会場の様子：>> Topへ

来場のみなさんのご感想：>> Topへ 男性 I found the lecture interesting and hope to come and listen to more lectures in the future. 男性 びっくりしました！FMでここまでできるとは...。すご過ぎます。 男性 前評判通り、デベコンにいるよう！ 男性 素晴らしいプラグインのご紹介でした。利用してみたい。 男性 とても、ためになりました。ありがとうございました。 男性 スバラシイ！！ 男性 とても勉強になりました。ありがとうございました。 男性 ありがとうございました。 Bentoってどうですか？ 男性 これは本当にFileMakerか！！と感動しました。あとは、会社で予算が出るか...。ムリだろうなあ...。 女性 単純にとても面白かったです。いつか使ってみたい...。どうもありがとうございました。 男性 来てよかったヨ！ 男性 やっぱり日本語はいい！ 男性 とても素晴らしいデモでした。どうもありがとうございます！ 男性 デモはダウンロードしていましたが、実際にデモしていただいたので、改めてよくわかりました。つまらなさを感じていたFileMakerのインターフェイスが非常に新鮮に感じました。 男性 Reactorの機能がどのようなメカニズムで動いているのか、もっと内部的な話が聞きたかったです。 今日も大変勉強になりました。 すごい！いいものを見せていただきました。Reactor使ってみたいです。 女性 直感的な動きをここまで実現できるのはすごい！毎回感動です。Winマシンでうまく動かないのが少しさみしいです。