Report

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

第32回 画面設計の勘どころ

・開催日時：2008/02/10

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

概要： 第32回目となる今回のテーマは「画面設計の勘所」です。情報の把握が容易で目に優しく操作に迷わないシステムにするために押さえておきたいポイントを解説します。

レポート： 土曜、先週から疼いていた親しらずを抜歯！して一日沈没。明けて日曜、痛いでし。鎮痛剤のむでし。眠いでし。で、水槽コケ取り〜の、水草トリミングし〜の、水替え〜の、昼寝し〜のの出掛け〜の。鎮痛剤と炎症止めでネムネムでありますが、Fun Night！終了後呑みに行った手前、以下、シャッキィィィィーンとレポートでち。 第32回 FileMaker Fun Night！「画面設計の勘どころ」 お題は... ・しっかり覚えるFileMaker 〜はじめてのスクリプト〜 ・【特集：画面設計の勘どころ】 ・恒例Tips対決総集編！ ・FMスーパーテクニック 〜Macでドットプリンタ再び　神ドライバ出現！〜 ●しっかり覚えるFileMaker 〜はじめてのスクリプト〜　＜Shinさん＞ FileMakerにおいて、関数や計算式を静的な処理と呼ぶならば、動的な処理と呼ばれるのが「スクリプト」。 M○系のソフトだと、問答無用でVBAをこねくり回すはめになるところですが、FileMakerならプログラミング知識がほとんど不要というのが今更ながら画期的。 スクリプトステップ＝最小単位の処理、たとえば「レイアウト切替」コマンドとか スクリプト＝必要に応じてスクリプトステップを連結したセット 第一段階として、スクリプトは自分が楽をするために作ります。 レイアウト切替／ワンパターンの検索条件設定／特定の順序でのソート／印刷開始ボタンなど、毎回同じ操作や入力をしたり、いちいちメニューから選択するのが面倒...という横着な理由でもOK。一発芸チックな動きですが仕事は確実に楽になり、間違いもなくなります。 第二段階としては、合わせ技。 一時停止を入れる／条件を評価して適切な別レイアウトへ切替／プレビューしてOKだったら印刷へ...更に楽になってきました。 第三段階は、他のユーザのために作成するという世界。 プログラマの第一歩ですな。他人のために作成するには細かい配慮が必要になってきます。 作成のポイント ・基本的に手操作と同じ。自分の操作手順をシミュレートしながら作る。 ・無意識に行なっている操作が、処理開始の前提になっていないか確認する。 　・現レイアウト 　・現ウィンドウ 　・対象レコードの状態 　・ソート状態 　ある特定の状態からの処理開始が前提になっている場合、その「特定の状態」を再現するところからスクリプトに含める。 さて、単に「レイアウト切替」するような一発芸スクリプトは、レイアウトモードのボタン設定で単独の「スクリプトステップ」を割り当てれば簡単に実現できます。なのに、なぜわざわざスクリプト定義するのかというと...例えば100カ所で同じ処理を使っていたとして、処理内容に変更が発生した場合、「スクリプト」を使っていれば参照先である「スクリプト」を直すだけで済む、ということですな。ボタン設定で「スクリプトステップ」が使われてたら100カ所修正ですか...疲れそうですなあ。 ここでデモ ポータルレコードを操作する一連の動きが例示されました。 ・画面切替の直前にユーザに確認を取るには→カスタムダイアログを表示し、ユーザのボタン選択に応じて以後の処理をスイッチする。 ・スクリプト開始前と終了後で、画面の状態（対象レコードやソート状態）が不自然に変化しないようにするには 　→新規ウィンドウを開いた上で処理する。 　　・関連レコードのフィールド値全置換などは、「関連レコードへ移動（新規ウィンドウ）」で新しいウィンドウ上に目的のレコードを抽出して一気に処理する。 　　・処理のために開いた新規ウィンドウは処理後に閉じておく。...そのためには、開くときにきちんとウィンドウ名を付けておくと確実だったりする。 ・後日の自分や、将来引き継いでくれたヒトのために、コメントを必ず書き残そう。 　※複数人での共同開発においては、コメントは必須。　 ・フィールド値などの状況に応じて処理を切替えるときのヒント 　・スクリプト引数→処理開始時に値を記憶し、その値を判断材料や検索条件などに利用する。 　・スクリプトの結果→結果に応じて次の処理を切替える際に利用する。 　・変数→幾つでも値を記憶しておき、スクリプト内で自在に取り出して利用できる。 　 ●【特集：画面設計の勘どころ】＜今泉さん＞ 画面の作りやすさもFileMakerの優位点のひとつ。はるか昔のバージョンから、ドロー系ソフトのインタフェースをそのまま移植したようなフレンドリーさで親しまれています。しかし、自由度が高いゆえに「あれこれできるので逆に迷う」ことや「もっと完成度が上がるハズ」といった悩みも湧いてきます。そもそもがプアな環境ならば「こーゆーもんです」と開き直ることもできるんですけど...あーどーすりゃいいんだ。 「カッコいい」と「使いやすい」はビミョーに違う 開発者は画面を切替えながら見るが、ユーザは同じ画面を何時間も見続ける。 開発者はそのシステムが手離れしたら別のシステムを手がけるが、ユーザは何年も同じシステムを使い続ける。 つまり、短時間眺める場合にちょうど良いコントラストは長時間見続けると疲労につながったりする。ユーザの目で見るよう心がけが必要。 ボタン配置なども、グラフィック的に美しくとも、実操作の流れに配慮されていないとこれも疲れそう。 ここでサンプルを例示 人材派遣業向けの実例に、問題点をいくつか紛れ込ませたものが提示されました。その問題点とは... ・スタッフ氏名などの基本情報がタブ上に置かれているため、タブを切替えると誰の詳細情報だかわからなくなる。 　→これは大胆すぎるくらい基本的な問題ですね。タブの外に出しませう。 ・明るい背景の領域が広すぎて目が疲れる。 　→こういうのが難しいんですよ。CRTで開発しているヒトは、いまどきを考慮して液晶モニタでのチェックも必要かも。 フィールドの配置は、同類項をうまく集合させたるのが効果的なようです。位置関係はオブジェクトサイズ（px表示で）やT定規を使ってきちんと揃えましょう。 ボタンの配置は、機能的な階層を表すようにしたり、関連ボタンを一列に配置するのが良いようです。 色の使い方では、そのとき入力すべきフィールドを直感的に知る為には、背景色を利用するのが効果的ということでした。 会場から質問 ・v6ユーザの悩み 　ポータルを印刷するとき、関連レコードが多いと予定のポータル行数を超えてしまい困る。 　→1.　ポータル表示行数を増やす。2.　関連レコード側に印刷用レイアウトを作り、そちらへ移動して印刷する。 ・権限関係 　承認動作などでユーザーの権限に応じてフィールドの入力可否を操作する場合は、どうやっているか。 　→レイアウトの切替で行なっている。 ・できるかどうか質問 　「戻る」ボタンは作れるか。 　→できなくはないが、かなり難しく現実的ではない。 　 レイアウトは見たまんまでプロの力量を知ることができるので、己を知るにはいい要素と思います。今回も結構反響あったようです。 ちなみに私事ですが、配色やフィールドの配置など、巷にあふれるグラフィックデザインがけっこう参考になってます。 みゆき師匠は今回レジメを忘れてしまったので、近々サイトにアップしておくとのことですよ。 ●恒例Tips対決！ ・オブジェクトグリッドへの吸着が、矢印キーによる位置の微調整などでズレた場合、そのオブジェクトをいったんレイアウト左上（原点）へ突き当てればリセットできる。（Shinさん） ・複数ウィンドウ表示時に手前のウィンドウを閉じさせない技（竹内さん） 　そもそも手前のウィンドウを開く動作をスクリプトで行なう。ウィンドウを開いた直後のスクリプトステップとして、一時停止／続行（制限時間なし）がセットされているので見かけ上は停止していても実はスクリプト実行中であってウィンドウの移動やクローズはできない。 　ポイントは、スクリプトの強制終了を許可しないこと。許可するとステータスエリアに続行／キャンセルボタンが見えてしまう。 　このウィンドウを閉じる際のスクリプトには、現在のスクリプト＝終了と設定することを忘れずに。 ・一つのボタンで、検索条件の入力開始と検索実行の二つの動作を実行するワザ（今泉さん） 　ウインドウモードを分岐条件として動作を変えるスクリプトと、 スクリプトを起動するボタンに「現在のスクリプト：終了」設定す る合わせ技で実現する一例を紹介。（サンプルファイルは近々サイ トにアップするとのことです。） ●FMスーパーテクニック〜Macでドットプリンタ再び　神ドライバ出現！〜　＜佐藤さん、竹尾さん（ガラパゴスシステムズ）＞ 昨年反響を呼んだ「Macでドットプリンタ...」（第28回）の仕切り直し。当時の検証では、縦11インチであれば単票OK、しかし連票では徐々にズレが進行してNGという結果が。しかし、MacOSまわりでは神と呼ばれるガラパゴスシステムズの技術力の前に不可能は無い。てなことでおおいに盛り上がることに。 ここで、ガラパゴスシステムズ・佐藤氏登場。 理屈では... 顧客の業務上の理由でEPSON製ドットプリンタを使うことになった。 ↓ CUPSを使えば対丈夫なハズ ↓ ESC/Pは使用せず、Rawプリンタ（コマンドをナマのままプリンタへ送る方式）として扱ってやれば良い。 実際にやってみた... 宅配便伝票にプリント実行。 ↓ CUPSでプリントできた。 ↓ 印字がズレる。ナゼ？ ＜サイズが微妙に違う。紙送りが上手く行かない。＞ 用紙サイズの計算のどこかでミスってるのではないか。 詳細に調べて行ったそうです。すると、PSから変換したイメージをESC/Pに再変換するところで、用紙サイズとマージンに応じて用紙区切を認識させるところにミスを発見。 で、対策したところ解決。 CUPSプロジェクトにも報告を入れたそうです。 すごいですね。こういうオープン系の団体に不具合や修正のレポートを送稿するあたり、一介のユーザから見ると異次元であります。即ち「神」とはこういうヒト達に与えられる称号であると... さて、この結果を簡単に自分のマシンに反映できる「ESC/Pドライバパッチ」、ガラパゴスシステムズから無償提供の予定です。ただし、できるだけ多くのプリンタでの検証と問題点の報告を求む、とのことなので皆さん宜しくお願いします。 ちなみに現時点で検証済みなのは、以前から比較的相性の良かったEPSON VP880とVP-4300ということです。 Reported by 金丸康明 アンケートのご協力、どうもありがとうこざいました！ ご意見、ご要望やご感想はこらちからお寄せください。 >> ご意見箱 Special Links： ・「画面設計の勘どころ」のレジュメ（今泉さん） ・Tips対決、サンプルファイル（今泉さん） ・記事「Mac OS X 環境でドットプリンタを使用する試み」（竹内さん） Special Thanks to： 　FileMakerまんが：たまみそさん（今回のまんがはこちら） 　ゲストスピーカー：ガラパゴスシステムズ　佐藤徹さん 　神ドライバ開発：ガラパゴスシステムズ　竹尾哲也さん 　イベントレポート：金丸康明さん

会場の様子：>> Topへ

来場のみなさんのご感想：>> Topへ 男性 今日はとても参考になりました。ぜひこのような企画をお願いします。 男性 プリンタドライバのお話が面白かったです。 男性 気軽に参加できて楽しめました。遠方からですが、また参加します。 女性 Macでドットプリンタ！とても楽しめました（Windowsを使うのはゆるせない〜〜の辺りが特にー）。宅配伝票ってよく業務で使いますし、大問題ですね〜。ズレるのは困ります。Tipsでは竹内さんのスクリプトを継続させて他のウィンドウを選ばせない！はぜひ使ってみたいです。ゴミデータ防止にも役立ちそうです。（営業さんのパニックが今から予想されますけど、慣れてもらいます。苦情は言わせないぞ〜！！） 女性 CUPSの話が大変興味深かったです。 男性 ファイルメーカの奥の深さを感じました。ちょっとした機能を実現させるために、いろいろなテクニックを使われているんですね。また参加させていただきたいと思います。 男性 Tipsおもしろい！ 男性 仕事が積まれていて、今日は眠いのでした。レイアウトは勉強になりました。Tipsも勉強になりました。おつかれ様でした。 男性 「はじめてのスクリプト」「画面設計の勘どころ」は易しすぎ。「ドットプリンタ」は難しすぎ（&コアすぎ）でした。開発にかかる時間を短縮する方法を次回に期待します。現状、スクリプトを探す時間、フィールドを探す時間が多すぎるので...。 男性 今泉さんの作成された画面が素晴らしかった。弟子入りしたいくらいでした。 男性 また機会があれば参加させていただければと思っております。ありがとうございました。 男性 Shinさんのスクリプトのお話や今泉さんのインターフェイスのお話などまとめると、ユーザの使い勝手を意識せよとのことだったと思いますスクリプトのコメントをあとでつけるのではなく、最初にコメントを作成するとフローがわかるというのは目からウロコが落ちました。 女性 「画面設計の...」は基本的なことが、とても重要だということを再認識しました。Tips対決ではいいネタを提供してもらいました。来てよかった。 ・にな川さんのコピーしたフィールドの位置合わせ、いつも苦労してたんです。こんなに簡単な方法があったのですね。 ・竹内さんの他のウィンドウに移動させない方法については、まさに今、知りたかったこと。帰ったらすぐにやろうと思います。 ・今泉さんの検索実行のところのスクリプト、メモがとりきれなかった。公開していただけたら有難い。おねがい！