昨年リリースしました Quince の新バージョンが 2010 年 2 月 16 日にリリースされました!
Quince - http://jp.quince.infragistics.com
紹介ページ - http://jp.infragistics.com/whats-hot/quince.aspx
今回は Quince の プロダクト マネージャかつ、インタラクションデザインを手掛けた Ambrose Little の Blog を訳した形で、Quince とはどういうものなのか？ということを紹介したいと思います。
オリジナルはこちら
インフラジスティックス （以下 IG) は、新しい UX デザイン ツールのリリースを発表しました。馴染みのあるデザイン パターンのアイデアに基づいた、ユーザー エクスペリエンス (UX) デザイン パターンに焦点を当てたコンテンツを提供します。
IG ではこれまでに UX デザイン パターンをプロモーションしてきました。以下のような UX リソース ページ (英語) にもカタログを掲載しています。
- インターフェイス デザイン
- インタラクション デザインのパターン (Welie.com)
- UI デザイン パターン ライブラリ
- Yahooデザイン パターン ライブラリ
Devscovery などのコンファレンスで発表する以外にも、社内でパターンを積極的に使用することにより、ますます貴重なリソースになっています。
現在パターンを使用できるツールやパターンを共有するコミュニティはありません。そこで IG では UX デザイン パターンの検索、学習、使用、共有、パターンに関するすべてを提供することができないだろうかと考えました。
その結果、生まれたのが Quince という新しいツールなのです！
これは Quince のスタート ページです。パターンは、キーワード検索が可能で、タスク、タグによる関連付け、またはワイヤーフレームの各ビューごとに表示、全パターンを一度に表示することも可能です。この機能を使用すると、まだ使用していないパターンを検索、そのパターンについての詳細を参照し、新しいパターンとしてチーム内で共有することが可能になります。
タグの関係はこのように表示されています。これは実際のパターン カタログでのタグ付けに基づいて変更されます。このアイデアは、関係付けられたタグに基づいて関連性のある別パターンを参照できることです。たとえば、「ナビゲーション」としてタグ付けされたパターンは、「データ入力」としもタグ付けされています。
これはワイヤーフレーム マップのビューです。標準 UI ワイヤーフレームと UI 要素を表示することにより、パターンが通常どこに配置されるかを示しています。UI の特定の領域で見たことがあるパターンから、そのパターンに関連した新しいパターンを参照できます。更に、右側のタグに基づいて、パターンをフィルターするこで目的に合致したもののみを表示させることもできます。
「ユーザー操作で参照する」ビューでは、ユーザーが実際に行う操作に基づいてパターンを検索できます。検索、解析、情報の入力、ナビゲーションなどのタスク別にパターンを参照できます。
もちろん、すべてのパターンを一度に参照することもできます。この方法は、パターン名を既に知っている場合にとても便利です。上のアルファベット順のフィルター リンク (Quince のパターン) を使用すると、パターン名の最初の文字に基づいてフィルターできます。また、タグ フィルターを使用してリストを簡単にフィルターできます。この 2 つの方法はファセット ナビゲーション (Quince のパターン) の例です。Quince の作成にもさまざまなパターンを使用しています！
パターンの参照と検索はとても便利ですが、更に、パターンを表示するビューアーで詳細を確認できます。
これは「インタラクティブ パターン ビューアー」と呼ばれ、このビューは 1280x1024 の画面に最適です。ほとんどのビューでは 1024 x 768 の画面を対象しています (リキッド レイアウトでは大きい解像度が必要なため 1024 x 768 以上を使用)。実例とパターンの詳細をできるだけ大きく表示するにはスペースが必要だからです。パターンの詳細 (問題、解決策、背景、説明、実装) と例を同時に表示することにより、詳細を読みながら例を参照することができ大変便利になっています。
詳細を読みながら実例を参照できるようスクロール バーとカルーセルの両方を設定しています。
このビューでは、以下のことができます。
1. 例を参照しながら情報ボックスで例の詳細を表示
2. パターン詳細の表示でパターンの情報を同時に表示
3. このパターンを使用して、「使用した感想」から感想を追加
4. カスタムな実例を作成して他のユーザーと共有
5.「アイデアの提案」でパターンの詳細または実例を向上するアイデアを提出
6.「操作」のセクションでブックマークしたパターンを友達と共有
7. Quince のフィードにサブスクライブして常に最新の情報を入手
8. [現在の実例] をクリックして実例を元のサイズで表示
このビューでは、矢印をクリックすると、カルーセルのように例をナビゲーションできます。(注: この表示では矢印キーが使用でき、ダイアログでは [Esc] キーも使用できます。)
9. 全画面表示でパターン ドキュメントを表示。このビューは読みやすく、印刷もサポートされています。(この機能は Quince のパターンの「表示オプション」です。)
以上が Quince のインタラクティブ パターン ビューアーと参照方法についてです。更に、Quince の目的はパターン コミュニティを作成して、アプリケーションのデザインを向上することです。インタラクティブ パターン ビューアーでは簡単に意見交換ができますし、まだまだ共有されていないパターンが多くあります。是非パターンをどんどん投稿してください！
パターンの投稿
投稿するにはサインインする必要があります。サインインのステータス領域または表示されている名前の上にマウスをホバーすると、Quince コミュニティの参加レベルを示すプロファイルが表示されます。「Quince のカスタマイズ」をクリックすると、表示される情報を変更できます。
パターンの評価
最後に、「○○パターンを使用しています」の評価があります。「スター システム」 を使用してユーザーはパターンを評価することができます。パターンで重要なのはどれだけのユーザーに使用されているかです。
この評価は、お客様がパターンを使用していることが条件となるため、多くのユーザーに使用されることにより、パターンの実用性が証明されます。
そこで、「使用した感想」に「このパターンを使用しています！」を追加しました。よく使用されている場合、そのパターンを勧めることができます。パターン ビューアーでスターの上にホバーすると、について説明が表示されます。
新しいパターンを投稿した場合、0 スターから始まります。そのパターンを使用する人が増えるに従って、スターの評価も増えます。この方法は パタン・ランゲージ (クリストファー・アレグザンダー著) において、アレグザンダー がパターンを評価する方法と同じような機能です。 3 スターの評価を受けるには、「パターン評議会」によってレビューされる必要があります。
「パターン評議会」は IG で Quince を作成した社員 (Quince チーム) から構成されていますが、コミュニティからパターンの知識が豊富なユーザーも参加予定です。ユーザーが投稿したパターンをレビューし、Quince パターン コミュニティをサポートしていきます。「パターン評議会」に参加したい方は、是非ご連絡ください。
Quince に参加してください！
ユーザーによるパターンの投稿、実例の共有、コメントの共有、パターンの使用など、アイデアを追加されることで、Quince が向上していきます。多くのユーザーがアクティブなメンバーになることを期待しています。
Quince に参加して、実際に機能を体験してください。IG は Quince とパターン コミュニティをサポートします。
プライベートなコーポレート/ドメイン指定のパターン ライブラリは Quince Pro で提供される機能です。セキュアなプライベート ライブラリを使用して、会社やチーム単位でパターンを共有できます。
Quince と UX パターンについて
Quince ツールについてのディスカッションができるフォーラムがあります。Quince と Infragistics.com のログイン アカウントが使用できます。ユーザーがデザイン パターンを検索する方法として追加しました。ご意見、ご質問がある場合は、ぜひフォーラムに参加してください。
長くなってしまいましたが、ここで終わりにします。では Quince を存分に楽しんでください!
いかがでしたでしょうか？ Version 1.0 から多大な進化を遂げた Quince を是非試してみてください!!