 |
|
|||||||||||||||||||||||||||||||||||||||
IBM Workplace Designer の詳細 |
||||||||||||||||||||||||||||||||||||||||
|
||||||||||||||||||||||||||||||||||||||||
|
Ethan Perry, Product Designer, IBM Jeff Sokolov, Senior Software Product Designer, IBM レベル：上級 原文の掲載：2006年10月25日 更 新 日：2006年03月17日更新  原文はこちら
IBM Workplace Collaboration Services は役に立つさまざまな機能を提供し、ユーザーがより簡単にかつ効率よく仕事を進めることを支援します。現在、ビジネス・アプリケーションの開発者は、IBM Workplace Designer を使用することにより、ドキュメントセントリックな (文書を軸にした考え方を持つ) ビジュアル開発環境を通じて、Workplace Collaboration Services インフラストラクチャーを利用するカスタム Workplace コンポーネントを作成できます。この記事では、次に示す Workplace Designer の主な設計目標を紹介し、製品ではこれらの機能がどのように実現されているのかを解説します。
この記事では、上記の製品の設計目標をサポートする各機能と、開発者がこれらの機能を利用する方法について解説します。これらの機能には、フォーム・エディター、スキーマ・エディター、UI コントロール、ビュー・コントロール、シンプルアクション、JavaScript エディター、デプロイメント機能が含まれます。 この記事は、主に Web 開発者、および Lotus Domino Designer や Visual Basic などの迅速なアプリケーション開発環境のユーザーを対象としています。読者の方に、Workplace Designer を使用することの利点、主な機能、ツールを使い始める方法をご理解していただける内容になっています。Workplace Designer の基本的な説明については、developerWorks Lotus の記事『IBM Workplace Designer の概要』を参照してください。
はじめにIBM Workplace 製品群は、ユーザーがさまざまなアプリケーションを使用して共同作業を行うことを可能にします。開発者は Java API を使用して独自の Workplace アプリケーションを開発できるだけでなく、Workplace Designer を使用することで、さまざまなカスタム・コンポーネントを作成できるようになりました。このツールは、IBM Workplace 製品群の優れたコラボラティブ機能を利用するドキュメントセントリックなアプリケーションを迅速に作成できるビジュアルな環境をもたらします。Workplace Collaboration Services および Workplace Services Express が導入されている企業では、組み込みのテンプレートを使用して、ディスカッション・ボード、メンバー・ディレクトリー、Web 会議などのコンポーネントを社内のチーム内で共有できます。これらのコンポーネントは、すべて同じページ内に配置できます。例として、チーム・ブログ、チーム・カレンダー、文書、ディスカッション、チャット・ルーム、検索が含まれるプロジェクト・チーム用の [チームスペース] を図 1 に示します。 図 1. Workplace Designer の「チームブログ」コンポーネントを含む [チームスペース]  システム管理者またはビジネス・ユーザーは、テンプレートを編集することにより、アプリケーションに含めるコンポーネントを選択できます。社内で、組み込みのテンプレートにはないカスタム・コンポーネントが必要になったとき、社内の開発者は Workplace Designer を使用して必要な機能を作成できます。たとえば、ここで示したチーム・ブログは Workplace Designer に含まれているサンプル・コンポーネントで、カスタマイズが可能です。 この記事では、Workplace Designer のユーザー・インターフェースの設計を担当した製品デザイナーたちが、最初のリリースでの設計目標をどのように実現したのかを説明します。実現にあたっては、さまざまな設計手法が使用されました。たとえば、ビジネス・パートナーによるフィードバック・フォーラムを活用したり、開発チームと連携してユーザー・インターフェース仕様の改良を重ねました。また、ツールのプロトタイプおよび初期バージョンを使用して、想定ユーザーによるフォームの構築テストを何回も実施しています (この資料（US）を参照してください)。このプロセスで常に重点が置かれたのは、Workplace Designer を Workplace アプリケーション開発用の使いやすいツールにするために必要な設計目標を満たすことでした。
設計目標 1: ビジュアルな開発ツールによる迅速なタイム・ツー・バリューWorkplace Designer は、役に立つコンポーネントを開発者が迅速に作成できるよう設計されています。UI コントロール・パレットとフォーム・エディター (図 2 参照) を組み合わせることで、ドラッグ・アンド・ドロップ機能を使用してフォームを組み立てられます。ユーザーはフォーム・エディター内でテキストを直接入力したり、さまざまなコントロールを追加できます。[プロパティー] パネルにもすぐにアクセスでき、コントロールのプロパティーを一貫した方法で設定することも容易です。また、CSS (カスケーディング・スタイル・シート) クラスも用意されていて、[フォーマット] タブを使用して標準の Workplace スタイルをテキストとコントロールに適用できます。図 2. フォーム・エディター  フォームを作成するためのさまざまな代替手法が利用できます。開発者は、フォームのレイアウトから開始するか、スキーマ・エディターを使用してデータ構造の定義から開始します。ユーザーは、最初に UI コントロールを追加し、[プロパティー] パネルの [データ] タブを使用して、これらのコントロールに新しいデータ・フィールドを作成できます。 J2EE 開発手法との整合性を維持し、データ管理の自由度を高めるために、フォームのレイアウトとは独立してデータ・スキーマを定義することも可能です。ユーザーは、同じスキーマを複数のフォームで再使用したり、外部ソースからスキーマ・エディターにスキーマをコピーすることもできます。スキーマをコンポーネントに追加した後、ユーザーはデータ・パレットからデータ・フィールドをドラッグしてフォーム上に配置し、このデータ要素にバインドされた UI コントロールを自動的に生成できます。
設計目標 2: 表現とデータの分離 (オプション)Workplace Designer を使用している開発者は、開発中のコンポーネントの外観をコンポーネントによって保存されているデータから分離できます。このことは、フォーム内の視覚的なユーザー・インターフェース要素を異なるデータ・ソースに結び付けられることを意味します。Workplace Designer のリリース 2.5 および 2.6 では、Workplace Designer のネイティブ・データ・ストレージに保存されたデータにコントロールをバインドできます。これ以降のリリースでは、コントロールを Web サービスや外部リレーショナル・データベースにもバインドできます。プレゼンテーション・レイヤーとデータ・レイヤーを分離することにより、フォームを再作成したりコードを追加することなくデータのバインディングを変更でき、フォームの再利用や更新がより簡単になります。前述のように、ユーザーは最初にフォームを作成しておき、その後でコントロールをデータ・フィールドに結び付けられます。あるいは、スキーマ・エディター (図 3 参照) を使用して、データ構造の定義から始めることもできます。スキーマ・エディターには、XML を使用してデータ構造を記述するための W3C 標準に準拠した XML Schemas を編集するさまざまな機能が装備されています。 図 3. スキーマ・エディター  各フォームは、スキーマを使用するデータ・ソースにバインドされています。また、サブフォームに似た「パネル」をフォームに追加し、異なるデータソースとスキーマをフォーム自体から使用することも可能です。この方法により、スキーマを再使用するための自由度が高まり、異なるスキーマからのデータを 1 つのフォーム内で組み合わせることができます。 たとえば、プロジェクトに関する情報を “project” というスキーマを用いるデータ・ソースから表示するフォームがあるものとします。プロジェクトの課題に関する情報を記述する “issue” という別のスキーマを作成するには、“issue” スキーマを使用するパネルを、“project” スキーマを使用するフォームに追加します。これにより、異なるスキーマを用いてデータが保存されているにもかかわらず、課題に関する情報をプロジェクト情報のすぐ横に表示することができます。 ユーザーは [プロパティー] パネル (図 4 参照) の [データ] タブを使用して、UI コントロールをデータにバインドできます。 図 4. [データ] タブ  [データのバインド] メニューで、<<新規フィールド>> を選択して新しいデータ・フィールドを作成することもできますし、現在のスキーマから既存のフィールドを選択することもできます。 また、XPath エディターを使用して、スキーマ内の特定の場所に基づいてデータ値を指定するデータのバインド式を定義することもできます。XPath は、ファイルの場所を示すパスの指定に似ています。たとえば、“/issue/description” は、スキーマ要素 “issue” の 1 階層下のスキーマ要素 “description” を指定します。XPath に “if” ステートメントまたは他の演算子を含めることにより、現在のデータ・ソースからのデータに基づいて値を動的に計算することもできます。
設計目標 3: ドキュメントセントリックなプログラミング・モデルのサポートビジネス・パートナーおよび潜在的なユーザーからのフィードバックによると、ドキュメントセントリックなプログラミングこそが Workplace Designer での開発手法の核となります。アプリケーションの基本として文書を使用すると、ユーザー間での情報の共有とコラボレーションが容易になります。情報をフォーム内に格納し、この情報を他のユーザーにも利用可能にすることで、多くの用途が得られます。ステータス・レポート、プロジェクト課題のトラッキング、バグ・トラッキング、経費報告、出張手配など多くのアプリケーションが、その中心的な役割を担う機能を文書に依存しています。Workplace Designer を使用すると、開発者はエンド・ユーザーが文書の作成に用いるフォームを簡単に作成できます。ビュー・コントロール (図 5 参照) は、動作中のコンポーネント内では、送信された文書のリストを表示します。単純なアプリケーションには、データを文書内に送信するフォームや、送信済みの文書のリストを表示するビュー・コントロールを持つフォームが含まれることがあります。ビュー・コントロールを持つフォームでは、ボタンを配置してユーザーに新規文書を作成してもらうことができます。作成された文書が送信されると、ビュー・コントロール内のリストに表示されます。 図 5. フォーム・エディター内のビュー・コントロール  また、Workplace Designer にはより高度な機能がいくつかあり、これらの機能を利用すると、パネルを使用して異なる種類の文書を同じフォーム内に混在させることができます。たとえば、project スキーマと issue スキーマを用いる前述の例では、issue スキーマを使用するパネルを、全体のフォームを使用する文書とは別の追加文書に関連付けることができます。1 つのプロジェクトに対して複数の課題がある場合は、反復パネルとしてパネルを定義し、パネルを繰り返すことにより、プロジェクトに関連する各課題の情報をすべて表示できます。[連絡先リスト] サンプル・アプリケーションでは、この機能を利用して、1 つの連絡先に複数の電話番号を割り当てています。
設計目標 4: イベント・ベースのロジックを追加するさまざまな方法の提供フォームに追加されたほとんどすべての UI コントロールには、ユーザー・イベントまたはシステム・イベントが発生したときに起動されるスクリプトを定義できます。この最も一般的な例は、ユーザーがクリックしたときにスクリプトを起動するボタンです。デスクトップ・アプリケーションおよび Web アプリケーションの多くの開発者が認めるように、JavaScript などのスクリプト言語は、Java などの完全なプログラミング言語を必要とせずにさまざまな動作を定義できる強力な能力を持っています。また、Workplace Designer のシンプルアクションを使用すると、スクリプトを記述せずに、多くの一般的なアクションを実行できます。開発者は [イベント] タブでシンプルアクションを使用することにより、フォームを開いたり、現在のフォームの文書モードの変更やビュー内での選択文書の削除を行うことができます。たとえば、どのフォームを開くのかを簡単なダイアログボックスで指定するよう設計しておくと、実行時にエンド・ユーザーがコンポーネントを使用しているときにアクションが発生します。 JavaScript エディター (図 6 参照) には、コードの作成や整理を支援するさまざまな機能があります。コードの補完機能では、ユーザーの入力内容に基づいてコードを完成させるために、関数やプロパティーの候補のリストが表示されます。単に [CTRL] + [Space] を押すと、ドロップダウン・メニューが表示されます。たとえば、「@」記号を入力して [CTRL] + [Space] を押すと、利用できる @関数のリストが表示されます。ユーザーは Domino Designer で利用できる @関数に慣れているので、Workplace Designer でも JavaScript を介してこれらの多くの関数が利用できるようになっています。 図 6. JavaScript エディター  コメント、文字列、JavaScript のキーワードを明確に区別するために、これらのコードはデフォルトの色とは異なる色で表示されます。開発者は、[プリファレンス] ダイアログの [JavaScript] で、使用したい色を設定できます。 また、Workplace Designer に含まれるさまざまな JavaScript ライブラリーで利用できる関数を表示する [参照] タブもあります。これらのライブラリーを使用すると、サーバー上でさまざまな機能を実行できます。
設計目標 5: IBM Workplace Collaboration Services によるコラボラティブ・サービスの有効化Workplace Designer には、Workplace アプリケーションのコア機能 (デプロイ、テンプレート、アクセス制御、パラメーター、Workplace API) を活用するための機能があります。デプロイ 開発者の間では、デプロイを繰り返しながら行う開発手法は重要な概念になっています。コードをテストし、必要な変更を繰り返し行うには、アプリケーションをすばやく簡単にデプロイできることがユーザーにとって不可欠です。Workplace Designer は、デプロイメントに関するより技術的な側面を支援することによってこれを可能にします。つまり、適切なファイルを生成し、これらを Workplace アプリケーション・サーバー (Workplace Collaboration Services または Workplace Services Express) 上の適切な場所に配置します。これは、展開プロファイル (図 7) を通じて実行されます。 図 7. 展開プロファイル  関連するサーバーとデータベースの情報に基づいて展開プロファイルを作成した後は、[デプロイ] オプションを使用することでコンポーネントをデプロイできます。同じサーバーへの以降のデプロイでは、コンポーネントが自動的に更新されます。更新されたコンポーネントは、デプロイ先のサーバーの任意のアプリケーション・テンプレートで利用可能になります。 アクセス制御 Workplace Designer を使用すると、開発者は [読者]、[作成者]、[編集者] などの定義済みの役割に基づいて、異なるフォームとデータへのアクセスを与えることができます。[チームスペース] などの Workplace アプリケーションにコンポーネントを追加するとき、[チームスペース] テンプレートの管理者は、各メンバー・タイプにどのような役割を与えるのかを指定できます。対応するメンバー・タイプのユーザーは、テンプレートで指定されたアクセス・レベルを持ちます。たとえば、モデレーター・リストのすべてのメンバーには、Workplace コンポーネントへの [編集者] の役割が割り当てられます (図 8 参照)。 図 8. コンポーネントに対する Workplace Designer のアクセス・レベル  パラメーター 組織内では、開発者に変更を依頼せずに、ユーザー自身が使用するアプリケーションをカスタマイズしたいケースもあります。Workplace Designer を使用している開発者は、パラメーターを利用することで、追加の開発作業を必要とせずに変更が可能なコンポーネントを作成できます。開発者は、Workplace の [チームスペース] またはアプリケーションの作成時にシステム管理者によって設定される 1 つ以上の変数を定義できます。たとえば、Blog コンポーネントには、BlogTitle と BlogDesc (ブログの説明) というパラメーターがあります。システム管理者は、アプリケーションの新しいインスタンスを作成するときに、ブログのタイトルと説明を決定します。開発者は JavaScript を使用して、システム管理者によって設定されたパラメーターを参照します。たとえば、Blog コンポーネントでは、「context.getComponentParameter("blogTitle")」というスクリプトによって、パラメーターに入力された値が生成されます (図 9 参照)。 図 9. Blog プロパティー  Workplace API JavaScript を用いて Workplace API を使用する Workplace オブジェクトを作成および変更することにより、Workplace プラットフォームとの連携をより高められます。Workplace Designer のスクリプト・エディターでは、Workplace API への適切な JavaScript 呼び出しを行うことにより、開発者はプログラムからメール・メッセージ、Web 会議、カレンダー・エントリーを生成できます。 ライブネーム Workplace Designer 2.6 では、Workplace Designer で開発されたコンポーネントは、「ライブネーム」機能を活用できます。ライブネームとは、名前を単にクリックするだけでユーザー間のコラボレーションを可能にする機能です。Workplace アプリケーション・サーバー上のディレクトリーに登録されている社員名を表示するフィールドまたは列に特別なドロップダウン・メニューがあり、エンド・ユーザーはこのメニューに表示されている社員に対し、すぐにメールやインスタント・メッセージを送信できます。
設計目標 6: 他の IBM アプリケーション開発ツールと一貫した手法のサポートWorkplace Designer は、Workplace Collaboration Services と Workplace Services Express で利用できる Template Builder 機能を利用して Workplace アプリケーションに組み込めるコンポーネントを作成します。このコンポーネントを Workplace アプリケーション・サーバーにデプロイすると、アプリケーション・テンプレートに含まれる利用可能なコンポーネントのリストにこのコンポーネントが追加されます。また、Rational Application Developer で Java コードを作成し、Workplace Designer の JavaScript エディター内からその Java 機能を呼び出すこともできます。将来的に Workplace Designer は、Rational Application Developer 環境へのプラグインとして利用可能になる予定です。開発者は、Java アプリケーションの記述用のパースペクティブから、Workplace Designer 機能を使用した Workplace コンポーネントの編集用のパースペクティブに切り替えられます。
設計目標 7: サンプル・アプリケーションおよびチュートリアルを通じた容易な学習方法の提供ユーザーからのフィードバックに基づき、開発者が Workplace Designer を使い始めるときの補助となるサンプル・アプリケーションとチュートリアルを用意することにしました。このため、Workplace Designer には、[プロジェクト・マネージャ]、[ディスカッション・データベース]、[連絡先リスト] などのサンプル・アプリケーションが含まれています。これらのサンプル・アプリケーションがどのように構築されているのかを調べることにより、フォーム、ビュー・コントロール、パネル、スキーマが相互にどのように連携して Workplace コンポーネントを形成するのかを理解できます。追加のサンプル・アプリケーションは、IBMのdeveloperWorks Workplace Webサイト（US）に掲載される予定です。Workplace Designer のマニュアルにはチュートリアルが含まれていて、フォームやスキーマを作成するのに必要な手順やスクリプト・エディターの使い方が示されています。また、マニュアルには、各機能の説明と使用可能な JavaScript 関数のリファレンスも含まれています。 Workplace Designer の使い方で不明な点があるときは、Workplace Application Development フォーラム（US）で質問するとよいでしょう。IBM の社員が頻繁に回答しています。また、これまでに得られたナレッジは開発コミュニティー内で共有されています。
まとめDomino Designer のユーザー、Web 開発者、Visual Basic のユーザーの方は、Workplace Designer の多くの面に親しみを感じるのではないでしょうか。UI コントロールを使用したフォームの作成経験があり、スクリプトの書き方を知っている場合は、すぐに Workplace コンポーネントを作成できるようになります。Workplace Designer の今後のバージョンへのご提案がある方は、ぜひお知らせください。
リソース
筆者について（原文のまま）Ethan Perry is a Product Designer in the Workplace, Portal and Collaboration Software division of the IBM Software group. He is currently designing user interfaces for IBM Workplace application development tools, including Workplace Designer. Ethan holds a Bachelor's degree in Computer Science from Yale University, and a Master's degree from the Massachusetts Institute of Technology. He has authored several Human Computer Interaction articles in conference proceedings, and has also written a variety of design and strategy documents in his work as a User Experience designer. You can contact Ethan at ethanp@us.ibm.com.Jeff Sokolov is a Senior Software Product Designer in the Workplace, Portal and Collaboration Software division of the IBM Software group. He is currently the Design Lead within this division for application development tools supporting IBM Workplace. Jeff holds a Bachelor's degree from University of California at San Diego and a PhD from Carnegie Mellon University in Cognitive Developmental Psychology. Over the course of his academic and professional career, he has published numerous articles in a variety of conference proceedings, journals and books. You can contact Jeff at sokolov@us.ibm.com.
|
||||||||||||||||||||||||||||||||||||||||
