Ken Azuma

5月のイベント、トレーニングのご案内です

大変久しぶりにBLOG記事を書くことになりました。インフラジスティックス・ジャパンのアズマです。3月末より、インフラジスティックス・ジャパン株式会社の代表取締役に就任させていただきました。これまで同様 UX 関連の話題をお伝えしながらも、会社全体の戦略や方向性などについても合わせてお伝えしていきたいと思いますので、なにとぞよろしくお願いいたします。

早速告知をさせてください！5月はイベントへの出展をさせていただきます。5月9日（水）から11日（金）まで東京ビッグサイトにて開催されます「スマートフォン＆モバイルEXPO」におきまして、弊社もブースを出展させていただきます！

5月中旬リリース予定のUIコンポーネント製品である NetAdvantage の最新版、12.1のご紹介のほか、iOS や Android に対応したSharePoint 専用クライアントの SharePlus をはじめ、新しく NetAdvantage に加わる iOS や Metro 対応コンポーネントなどもご紹介する予定です！是非皆様お立ち寄りいただきまして、新製品を体験いただければと思います。

東5ホール入口から入りまして、すぐに右に曲がっていただきますと左手に弊社ブースが見えてまいります。他者様に比べると小さなブースではございますが、その分しっかりと情報をお伝えできるように頑張りたいと思います。社員一同お待ちしております！

また、同期間中には弊社も協業をさせていただいております「セカンドファクトリー様」がクラウドコンピューティングEXPOにてご出展されています。弊社製品も一部ご紹介いただく予定で、同ブースにおけるミニセミナーにおいては、弊社からも Windows Developer Days で講演させていただいた内容を凝縮し、お話しする予定です！また、先般発表させていただいた共同のコンサルティングサービスのご説明も改めて行わせていただきます。

毎年大規模に出展されているセカンドファクトリー様のブースですが、今年もサイトコア株式会社様との共同デモ展示やSurface2の実機展示、様々なタッチ対応アプリケーション／ソリューションの展示など見逃せない内容が盛りだくさんです。是非セカンドファクトリー様のブースへもお立ち寄りくださいませ！

最後になりますが、5月は弊社 UX ワークショップを28日（月）29日（火）の両日で予定しております。こちらもまだお席に余裕がございますので、ぜひ参加のご検討を頂ければと思います。原宿で2日間、ほかの参加者の皆様とゆっくり時間をとって UX の検討をしていただくことで、皆様の実務に役立つヒントをたくさん持って帰っていただけると思います。この機会に是非ご参加くださいませ！

5月は製品のリリース、イベント、トレーニングと盛り沢山な月となりますが、精一杯進めてまいりますのでぜひよろしくお願いいたします！

３月のセミナー予定について

３月も多くの場所で講演をする機会を頂戴しております。ご都合のよいタイミングがございましたら、ぜひ足を運んでいただければと思います！

3/21(水) 無償セミナー 「多様化するニーズに開発効率化で応えよう！」

アジャイル開発やアーキテクチャコンサルティングで名高いテクノロジックアート様と共同開催で、セミナーを開催させていただきます。

インフラジスティックスからは、私から「多様化するユーザーシナリオとユーザー体験について」ということで近年のコンピューティング環境の変化に伴うユーザーシナリオの変化などについてお話させていただき、テクノロジックアート様より実際のプロセスなどについてお話いただいた後、「UI コンポーネントを活用して、更に開発生産性を向上させよう！」ということで弊社のデベロッパーサポート担当の三田と、エンタープライズ営業担当の西下からUIコンポーネントの活用による生産性の工場についてお話をさせていただく予定です。

ソフトバンクBB株式会社様の 汐留オフィス 20F セミナールーム（とてもよい会場なのです！）をお借りして開催いたします。是非ご参加くださいませ！

3/22（木）先端IT活用推進コンソーシアム：AITC様、「ユーザーエクスペリエンス技術部会」セミナー

いつも興味深いセミナーを開催されているAITC様の「ユーザーエクスペリエンス技術部会」にて、講演を担当させていただきます。

「これまでのUIとこれからのUIについて」というタイトルで、このところDevSumiなどでお話させていただいていた内容をベースにしてお話します。もちろんWindows 8 の Metro など含め新しいネタも盛り込んでまいります！概要はこんな感じです。

「これまで以上にユーザーの周辺に高度なIT活用の体験が当たり前になっている昨今の現状に対して、あえてこれまでのUIの変遷を振り返り、今後エンタープライズ環境におけるUIにおいてどのような対応が必要であるかについてお話しして行きます。」

セミナーは基本的に会員様向けですが、会員になることを検討している方も参加できるようです。

3/23（金）Jump into Metro! 連動セミナー：第1回 Windows PhoneアプリではじめるMetro UI の世界［導入編］

現在WebDesigning誌で連載させていただいているWindows Phone開発記事の「Jump into Metro!」に連動した企画として、3回に分けてセミナーを開催してまいります。先日Windows 8 Consumer Previewがリリースされたばかりですが、Metro は単なるすたいるに留まるものではなく、アプリケーションを通じた体験に関する考え方であり、マイクロソフトが「デザインランゲージ」と呼んでいるとおり、コミュニケーションの仕方そのものなのです。今後の流れを踏まえ、今すぐに Metro を表現できる場としての Windows Phone を題材に進めてまいります。環境構築のような基本的な情報もお届けしてまいりますので、これから始めてみたい！という方に是非来ていただきたい内容となっております。

かなり連続でお話しすることになりますが、一つ一つ丁寧に進めていきたいと思います。是非参加をご検討くださいませ！

もう Windows Forms で UI を開発することは難しいのでしょうか？（１）

仕事柄、お客様からは利用するべき UI テクノロジーの選択について相談を受けることがよくあります。なかでもよく聞かれるのが、「リッチな UI を作るのであれば、もう Windows Forms を使うべきではないのでしょうか？」といった質問です。

もちろん「リッチ」の定義にもよるのですが、多くの場合要件を細かく聞いていくと「特に Windows Forms で開発しても問題ない、むしろ望ましい」と考えられるケースが想像以上に多いことがわかっています。UI テクノロジーの選択の基準はいくつかありますが、第一に要件に対するフィット感を確かめ、次に現在保有しているスキルセットとの連続性を考えることになります。そのため、要件的に十分であった場合には、現在利用しているテクノロジーを利用するのが最もリスクの低い行為であり、歴史の長い Windows Forms においては未確認のバグもほとんど無い状態でテクノロジーが枯れており、都合の良いことも多いのです。

リッチ UI に対して寄せられるニーズは大きく下記のようなケースが大多数を占めます。

１．スタイルを適用したい
２．柔軟なレイアウトを行いたい
３．利用したい UI コントロールが無い／機能が不足している

もし上記のような理由でWindows Forms の採用をやめ、別のプラットフォームに移行しようとしているのであれば、一旦弊社のコントロール製品である NetAdvantage For Windows Forms をぜひ一度ダウンロードいただき、実現できる機能をチェックしてみてください。弊社の製品の中でも最も歴史が長く、多くの市場からの要望に応えながら今日に至っているだけに、多くの良くあるニーズを満たすことが可能です。

それでは順を追って課題を見ていきましょう。まずはスタイルです。

ユーザーインターフェイスに一貫性や統一感をもたせるにあたり、利用されているコントロールに対するスタイル設定はとても重要であり、iOSに代表されるなどの影響もあって現在注目されている領域です。多くの業務アプリケーションではデフォルトの状態のコントロールが使われていることが多いのですが、スタイル設定によって「仕上げ」処理を行うことにより、クオリティはずいぶん違って見えることも事実です。ここで問題になるのは、「設定できることがわかっていても時間をかけることが難しい」と判断されていることが多いことです。iOS や Windows Phone を例にとって考えみると、コントロールに適用されているスタイルはしっかりと一貫性を持っているため、利用していて非常に統一感を感じますが、スタイルデザインは単純な一枚絵を作るよりもずっと複雑な作業になります。

例えば、ボタンはmouseOver などのイベントに対して幾つかの状態を持っており、それぞれに対してボタンの形状や色の設定を持っている必要があります。かつ、通常はラベルを設定できるため、可変長の文字列を内包できるようにしなければなりません。XAMLならばかなり細かくこれらの設定を行うことが可能ですが、それでもなかなか骨の折れる作業となります。

そこで、もう少し手軽にスタイル設定を行う方法が望まれることになります。弊社では Windows Form で利用可能な AppStylist というツールをご提供しております。このツールを利用することで、用意された多くのプリセットのスタイルライブラリを適用することができ、スタイルライブラリの内容に変更を加える形で新たなスタイルライブラリを作ることも可能になっています。詳細は下記のBLOG記事を御覧ください。

アプリケーションデザインツール NetAdvantage AppStylist ご存知ですか？
NetAdvantage AppStylist ご存じですか？ その２

[ AppStylist ]

AppStylist 自体はかなり細かい設定を行えるツールです（画面キャプチャをみていただければ多くの設定項目があることがわかります）が、2011 Vol.2 では新たに Office 2010 Black / Silver というスタイルライブラリも追加し、たくさんのスタイルライブラリを利用することができます。これらをそのまま使うもよし、少しだけ変更して使うもよし、というところですが、まずは「IG」というスタイルライブラリから確認してみてください。このスタイルライブラリは比較的最近用意されたもので、弊社のデザインチームがゼロからデザインしているものになります。Windows Form / Web / XAML それぞれの製品で同じデザインのスタイルライブラリを適用できるように用意していますので、まずはこちらをベースに検討されてみてはいかがでしょうか。

再掲となる部分も多かったのですが、今後しばらくは Windows Forms に再びフォーカスをあてて、スタイル以外にもレイアウトやコントロール利用の観点から掘り下げていきたいと思います。お楽しみに！

Developer Summit 2012 : 【16-D-1】UI のこれまでの10年とこれから

10周年となった Developer Summit 2012 にて、「【16-D-1】UI のこれまでの10年とこれから 」として講演をさせて頂きました。初日の最初のセッションということと、当日寒い朝だったので結構参加者がまばらになるのではないかと思っていたのですが、最終的には立ち見が出る満席状態となりました。参加いただきました皆様、ありがとうございました！トピックとして、非常に皆様の悩まれていることそのものだったのだろうと感じた次第です。

セッションの資料につきましては、SlideShare にアップロードさせて頂きましたので、ご興味の有る方はごらんいただければと思います。

10周年という記念すべき瞬間に講演を担当させていただき、とても光栄です。20周年でもお話できるように、これからも頑張っていきたいと思います。

また、先日のBLOG記事でも紹介した、「100人のプロが選んだソフトウェア開発の名著 君のために選んだ1冊」も無事発売されました。非常に良いメッセージの詰まった本ですので、是非書店などで手にとって見てください。

最後になりますが、講演でもお話ししていたように、様々な観点から開発のスピードを加速していくことが、これまで以上に重要になってきています。そのための選択肢として、是非弊社の NetAdvantage や UX ワークショップをご検討いただければと思います。特に NetAdvantage に関してはトライアル中もサポートを提供しておりますので、試用検討中などの期間にコードサンプルもあるサンプルページとあわせてご活用いただき、皆様の武器の1つとして利用いただければと思います。是非トライアルをお試しくださいませ！

NetAdvantage トライアルダウンロード

3月も別の場所で講演を予定しております。別途告知させて頂きますので、お楽しみに！と

Book : 「100人のプロが選んだソフトウェア開発の名著 君のために選んだ1冊」

２月の16日（木）17日（金）の2日間で開催される Developer Summit 2012 に合わせて、多くのスピーカーを含む100人のプロフェッショナルから、1冊ずつ様々な書籍を紹介している「100人のプロが選んだソフトウェア開発の名著 君のために選んだ1冊」という書籍の執筆に参加させて頂きました。

なんと、出版元の翔泳社様のご厚意で、書籍に出ている内容を著者のBLOGにて掲載してもよし、ということになっておりますので、本 BLOG にも掲載させていただきたいと思います。

「アイデアを発想しないヒトに、もう対価は払われません。」

- 東 賢が、顧客のためのソフトウェア開発に関わる全てのプロフェッショナルに贈りたい1冊 -

「イノベーションの神話 Scott Berkun 著、村上 雅章 訳、オライリー・ジャパン（2007）」

「若い頃からソフトウェアの世界に可能性を感じていた私は、必ずヒトの働き方や生活を変えることが出来る！と希望を大きく膨らませてこの業界に身を置く決断をした学生の一人でした。大きくはなくとも、私の「提案」が何を変えられるかもしれない、と考えていたいのです。しかし残念なことに、特に受託開発をやっている方とお話しすると「最終的には顧客がすべての決定権を持っているため、提案しても受け入れられない」というようなご意見を多く聞きます。随分と受身で、希望に満ちた世界とは少し違うようです。顧客が最終的な決定権を持っていることについては、資本主義社会に生きる以上疑問の余地はありませんが、同時に顧客は、その道のプロフェッショナルに対して、暗がりを明るく照らすような的確な助言や、困難な課題に対するアイデアを求めているに違いありません。例えば外食の時、なんのひねりもない既製品を喜んで食べたいと思うことは、普通ないでしょう。自分では作ることができない／作ることはできても時間のかかってしまう何かに対して、プロフェッショナルが「仕事」をした成果を求めているはずです。

一方、ソフトウェアの世界には「既製品」にあたる選択可能な代替品は存在しない、全てが注文建築である、という意見があります。しかし、注文建築でも、壁紙などの資材を一から作ることは殆ど無く、限られた資源のなかでどのように既製品を組み合わせて独創性を生み出す、あるいは、一握りの本当にどこにもない部分を作り出す余裕を生み出すことに集中することがほとんどです。これこそ、資源が限られた中でのアイデアの勝負です。

弊社が提供しているような開発生産性を高めるツールがあったり、これまで高価だったインフラがクラウドという形で提供されるようになったりすることで、「これまで同様にソフトウェアを粛々と設計し、開発する」という行為だけでは、顧客に対して価値を提供することが難しくなっています。コストをオフショアと単純に比較されたりするのではなく、どのようにして広い意味での提案＝付加価値を、開発組織がアプリケーションという「応用」で提供することが出来るのかが、これまで以上に求められるようになっています。

私たちと私たちの顧客の前には、タッチユーザーインターフェイスの拡大やマルチデバイス需要の拡大など、多くの技術的不連続面も立ちはだかっています。そんな時だからこそ、提案することを辞めず、価値提案をすることをあきらめないでいただきたいのです。私が現職で働いているのは、多くの方が発想をしやすい環境／時間を作り出すためのお手伝いをしたいと思っているからにほかなりません。そのためのツールを提供し、ワークショップでは発想のベースともなるブレインストーミングなどの練習も皆さんと行なっています。この点で、著者がこの書籍を執筆した意図に強く賛同しています。

ストアなどの流通形態を通じた海外からのソフトウェアの流入などで、狭い日本も「狭さを理由にできない事態」に直面するはずです。だからこそ、小粒かもしれませんが、ピリッとするようなアイデアで価値を提供し続けるために、是非本書から多くのヒントを手に入れてください。顧客ためのみならず私たち自身のためにも、アイデアで、この業界を一緒に盛り上げましょう！」

いかがでしたでしょうか。「イノベーションの神話」は今手にとって見ても非常に良い本だと思いますので、是非読んでみてください。紙面の都合で書ききれなかったことも多いのですが、昨今の事情も踏まえて加筆を予定しております。その際には、そちらも再度公開させて頂きます。

既にデブサミは満員御礼の状態と伺っておりますが、会場ではこの書籍の販売も行われるようです。恥ずかしい気もしますが、サインなどもさせていただくことになっております。会場にお越しの方は、是非お声がけください。それでは、デブサミ会場でお会いできるのを楽しみにしております！

新年明けましておめでとうございます！

皆様、新年明けましておめでとうございます。インフラジスティックスに参加してようやく4ヶ月が経過しました。昨年いっぱいは様々な準備を行う一年となりましたが、皆様のお陰で無事第一回の UX ワークショップも開催することができ、感謝の気持ちでいっぱいです。旧年中は本当にありがとうございました！新年早々ではありますが、いくつかお知らせがございます。

無償セミナー「その UI 開発、新時代を戦えますか？～今から始めるマルチデバイスアプリ・タッチアプリ開発～」

2012年ですが、おそらくWindows 8 もリリースされることになり、これまでの iOS や Android に牽引される形となったスマートフォン／タブレットに代表されるマルチデバイスの需要がさらに喚起される年になるのではないでしょうか。このような状況を踏まえまして、弊社では新年早々ではございますが「その UI 開発、新時代を戦えますか？～今から始めるマルチデバイスアプリ・タッチアプリ開発～」と題しまして、日本マイクロソフト様と共同でセミナーを開催させていただくことになりました！既にお客様向けのメールでの告知を開始しておりますが、年末に開始したにも関わらずかなりの勢いで席が埋まりつつあります。ご興味のある方は是非早めのお申し込みをお願いできればと思います。

私も最初のセッションで話をさせて頂きますが、当日はマイクロソフト様からも講演をいただき、弊社からも後二人、おなじみの池原と、普段サポートの担当として活躍しております三田が「NetAdvantage の現在と未来」というタイトルで、弊社主力製品のロードマップや方向性も含めたお話をさせて頂きます。サポートの経験から来る生々しい話題も飛び出すかもしれませんので、是非皆様お誘い合わせの上ご参加くださいませ！

「Developer Summit 2012」セッション講演「UI のこれまでの10年とこれから」

また、2月16日（木）・17日（金）の二日間で開催されます、「Developer Summit 2012」におきまして、Mobile Technology トラックのオープニングトラックとして「UI のこれまでの10年とこれから」と題し、これまでの10年間を振り返りつつ、今後の UI の流れを考えていきたいと思います。初日最初のセッションということで少々緊張しておりますが、私もこの転機にて振り返る良いチャンスを頂いたと思い、色々と情報を整理しております。先ほどサイトを確認してみたところ、既に残席が「僅か」という状態になっておりました。ご参加いただく皆様、ありがとうございます！今回のデブサミは10周年ということもあって大変素晴らしいセッションがたくさんあります。これを読んでいただいている皆様と実際に会場でお会いできるのを楽しみにしております！

次回 UX ワークショップ、2月の23日（木）24日（金）の2日間で開催

告知が続いておりますが、最後！第一回を無事開催させて頂きました「UX ワークショップ」ですが、次回の第二回を2月の23日（木）24日（金）の2日間で開催させていただくことが決まりました！前回ご参加いただきました皆様からは、「日頃意識できていない点で考えることが、とても重要だと感じました。失敗を上げた後で考え方を整理するとその失敗は防げると気づくことができ、とてもよかったです。」「UX,UIの定義についてわかりやすかった。今後のUI設計について非常に参考になった。」というような、良いフィードバックもいただくことが出来ました。次回もしっかりと準備をして実施したいと考えておりますので、是非ご検討くださいませ。

最後に、新年に気を引き締めるべく、本社訪問時にホワイトボードに書かれていた「心得」を掲載します。私達の製品やサービスに咲いていただける時間は皆さんの貴重な時間のほんの一部であり、頂いた時間を無駄にしないように、多くの価値を届けられるように2012年も頑張ってまいります。

新年早々の告知三連発でしたが、今後このブログの記事につきましても、後から振り返って意味のあるような内容にするべく、一層の充実を目指していきたいと考えておりますので、今後とも何卒よろしくお願いいたします！

NetAdvantage for XAML 11.2 の Resource Washer のご紹介

おまたせ致しました！昨日 XAML 系製品をリリースし、2011 Vol.2 全体のリリースが完了しました！本リリースを含め、弊社では「Ease-of-use ：使いやすさ」「Performance ：パフォーマンス」「Styling ：スタイリング」の3本の柱に注力をしております。

その中でも、以前の BLOG 記事でもお伝えした「スタイリング」については、ユーザーインターフェイスに統一感を持たせて、一貫性のある UX を提供するにあたって重要な要素であるといえます。以前の記事では Windows Forms における AppStylist や jQuery の theme roller の話もさせて頂きましたが、 XAML 系製品に新たに搭載された Resouce Washer について紹介させて頂きました。これに関しまして、実際にどんな事が行われているのか、といったご質問を幾つかいただいておりましたので、 本社の BLOG に掲載されていた記事を和訳し、意訳を加える形で再度ご紹介させていただきたいと思います。（個人的にはこの機能はかなり気に入っております。是非実際の動作をサンプルでお確かめ下さい！）

原文：Introduction to Resource Washing in NetAdvantage for Silverlight 11.2 Thanks, Damyan!

トライアルダウンロード：http://jp.infragistics.com/dotnet/netadvantage/ultimate.aspx

サンプルファイル：こちらからダウンロードください

リソースウォッシャーは XAML によるクロスプラットフォームのコンポーネントです。目に見える形のあるものではありませんが、外観についての機能となります。この機能は、単色あるいは複数色を指定された XAML のリソースディクショナリを指定した単色で「染める」ことで、 UI のスタイル適用においてドラマチックな効果を得るためのものです。

リソースディクショナリで提供されるため、アプリケーション全体のカラースキームを変更することが可能になります。この機能はオリジナルのブラシ／カラーを変更するのではなく、ディクショナリのコピーを作り、設定に従ってコピーに対して変更を行います。そのため、オリジナルのディクショナリを変更することなくランタイムにて処理されます。リソースディクショナリは、アプリケーションの中のコンポーネントによって使われるスタイル／テンプレート／カラー／ブラシなどの共有オブジェクトのコレクションを含んでおり、リソースウォッシャーはそれらに対して単色指定により選択されたモードに従って色の変更を加える処理になります。

ウォッシュモード

リソースウォッシャーは2つのモードを備えています。

• SoftLightBlend - これはデフォルトのモードで、RGBのそれぞれを指定された単色と混ぜ合わせることをしています。これは服などを色のついた水で染めるような処理であると想像すれば分かりやすいでしょう。下記の実例をご覧ください。

背景に LinearGradientBrush を適用した2つのボーダーがあります。元々の設定ではこのような状態でした。

これに対して、「赤」でランタイム時にリソースウォッシュするとこのようになります。

見ての通り全域に「赤色」が混ざり、カラーパレットが変更された状態になっています。

• HueSaturationReplacement – このモードは、 一色のみを混色することでは十分に色が支配的な状態にならない場合に、一色を使って色相（ Hue ）と彩度（ Saturation ）を入れ替えてしまいます。そのため明度のみが残り、濃淡だけでグラデーションがつくことになります。

上記と同様のボーダーをこのモードでシアンを指定した場合：

今度は全体がシアンと明度だけで染められています。

リソースウォッシャーを利用する

このコンポーネントを利用する最初のステップは参照とネームスペースの設定です。リソースウォッシャーは、ベースのアセンブリに含まれています。 Silverlight の場合は InfragisticsSL4.v11.2.dll です。かつネームスペースを以下のように設定してください。

そして、スコープに従って該当コンポーネントのリソースとして参照します。（例えば UserControl の中です）基本的な設定は XAML とコードの中に設定できます。プロパティは「読んで字のごとく」のものばかりです。 WashColor , WashMode, そして AutoWash です。最後の一つが SourceDictionary となります。 XAML で記述し、オートウォッシュを利用するとこのような形になります：

コードで制御するやり方の利点は、処理を動的にできることです。上記の例ではオートウォッシュが設定されており、アプリケーションの起動時に設定されるため、 styles.xaml で設定されたオリジナルの状態が表示されることはありません。このコンポーネントのプロパティはデフォルト値を持っており、 WashColor のデフォルトカラーは透明であるため、このままではなにも表示されなくなってしまいます。ウォッシュの実行のために2つの方法があります。

• AutoWash を false に設定し、リソースウォッシャーの WashResources() メソッドをイベントハンドラでコールします：

• WashColor を設定せず、AutoWash を設定しません。（デフォルトは true です。）その後イベントハンドラの中で WashColor を設定します。リソースウォッシャーはこの設定で自動的にリソースを変更します：

更なるカスタマイズ

• アタッチドプロパティ

Styles.xaml のリソースディクショナリの中には、他にも幾つか有用なものがあります。：

リソースウォッシャーはブラシに対して2つのアタッチドプロパティを追加しています。一つは true に設定することでウォッシュ処理の対象外にするものです。

もう一つのプロパティは、ブラシをグループに設定するものです。

これらのグループは、リソースウォッシャーの WashGroupCollection の中で設定され、グループごとに個別のウォッシュ処理の設定を行うことができます。

是非皆さんの UI にてリソースウォッシュをお試しください！

リソースウォッシャーを利用するメリットは、色の変更を簡単に行えることではありますが、最も効果を発揮するのは xamGrid のような複雑なスタイリングが適用されたコントロールのスタイル制御を一括して行えるところです。手動でも確かに可能ではありますが、設定が多ければ多いほど変更が面倒な作業となります。ランタイム時に xamColorPicker と組み合わせればユーザーに自由な配色設定をする機会を与えることができ、全体のバランスを崩さずにパーソナライズされた体験を提供することが可能になります！

XAML は大変自由度が高いだけに設定できる項目も多く、スタイル設定に難しさを感じている方もいらっしゃるようです。そんなかたに是非こちらのリソースウォッシャーを使っていただきたいと思います。まさに目から鱗の簡単さです。

いや、そうではなくて配色そのものに迷ってしまう？？もしそうであれば、是非是非弊社の UX ワークショップ の受講もご検討ください！一般的な UI における配色の基本／どうしてあの色はある程度ウケがいいのか？などもお伝えしております！次回パブリックワークショップは2月23日（木）24日（金）を予定しており、皆様のお申し込みをお待ちしております！

Windows Storeの登場は何を意味するのか？

//build/ 以後詳細な情報が公開されていなかった Windows Store ですが、遂に先日サンフランシスコにてイベントが行われ、ビジネスモデルなどの計画が明らかになりました。

Windows Store のビジネスモデル

多くのスマートフォンにおけるストアタイプの利益構造と同じで、初期の利益シェアは70%であるものの、25,000ドル以上を売り上げた場合80%に上昇するようです。多くのアプリの平均的な金額がどのあたりになるのか気になるところです。もちろん最大のインパクトとになるのは、このストアの対象になるのが現在4億を超えるPC全体に対するものになることです。Windows 8 自体が普及するのには時間がかかるのかもしれませんが、ARM CPU ベースの Windows 8 デバイスが出荷されることになれば、かなりのスピードで分母が増えていくことでしょう。既に Windows Live をベースにして課金可能な安定した基板を持っており、XBOX Live などでも応用をしているマイクロソフトですから、インフラが問題になることも無いのではないでしょうか。個人的にも、どのようなアプリケーションがストアに並ぶことになるのか、非常に楽しみです。エンタープライズ用途向けにはストアを経由しないアプリケーション配置の方法も用意されるようです。とはいえ、企業向けのアプリケーションであっても、ストア経由のアプリケーションから様々な影響を受けることは間違いないでしょう。

開発組織に対するインパクトは？

それでは、この動きは開発組織に対してどのようなインパクトをもたらすでしょうか。直近のスマートフォン市場を例にして考えてみます。現在非常に元気のよいスマートフォン市場ですので、新たにネイティブアプリケーションの開発に着手されている会社も多いようです。しかし、多くのケースで「これまでの開発とのスピード感の違い」について違和感を覚えておられます。これまでであれば、たとえコンシューマー市場向けのアプリケーションであったとしてもある程度バージョンリリースで開発期間を固定できたのに対して、スマートフォン向けアプリとなった場合には終わりのないアップデートが待っています。ストアというインフラを通じて販売機会がこれまでになかったほど広がるのと同時に、多くの選択肢の中から選択され続ける努力を怠ることができない、待ったなしの環境に踏み込む事にもなるのです。

そうなってくると、これまでの開発の速度／体制では顧客からの要求に追いつけなくなってしまうケースも多く出てくることでしょう。そんなタイミングであるからこそ、インフラジスティックスとしては UI コンポーネントを利用して開発生産性をこれまで以上に高めることで、この流れに是非乗って頂き、他社との差別化を行い、機会の増大による新たな利益を手に入れていただきたいと考えております。

インフラジスティックスがお手伝いできることは何か？

実は、入社してからの数カ月の間に多くのお客様とお話させていただいた結果として、弊社の製品にご満足いただき、大変うまく活用していただいているお客様にはある共通点があることがわかりました。それは「設計の段階で要件を UI コントロールで満たすことが出来るかを評価」され、それによって開発の難易度を判断し、機能開発の可否判断をされていることです。大変シンプルな事実なのですが、いざ開発に入ろうとする瞬間に生産性をあげるために UI コントロールを探され、結果として弊社の製品にたどり着いて効果を上げる場合ももちろんあるのですが、ユーザインターフェイスに関わる仕様が開発の手戻り要因の多くを占めることは明らかであり、設計の段階で正確なイメージを持っていただくことが難しい領域の一つです。この段階で、弊社の UI コントロールとその機能をひな形として使って頂き、これで十分か、これ以上に必要なところはあるか、と仕様を詰めていただくと、多くのケースで認識齟齬が少なくなり、正確な見積もりをしていただくことが可能になります。もちろん、 UI コントロールを積極的に使っていただくことでプロジェクト期間全体を短くしていただくことが可能です。（仕様を詰める段階で、弊社のサンプルブラウザを使っていただいてるお客様もいらっしゃいました）

ラフな形でコントロールを並べた状態をプロトタイプとして捉え、前述のような設計の推敲に活かされているお客様もいらっしゃいます。やり方はともかく、弊社の UI コントロールを使っていただくことで「UI 開発における手札が多く増えた状態」になるはずですので、設計時点で具体的な状態を意識して頂ければ一層効果が期待できると思われます。また、設計時点での可否判断において弊社のサポートをうまく利用して頂ければ、一層効率よくその後の開発プロセスを進めていただけるはずです。（ある特定の仕様が弊社の UI コントロールで実現できるか？といった内容でサポートへの問い合わせをしていただくケースも多くございます。）

また、そのようなお客様では、年に2回以上行われている弊社の製品アップデートに関しても、新たに手札が増え、既存の環境に対しても新たに価値提供できる可能性があると考えていただいているケースが多く、弊社の製品アップグレードがそのままお客様の製品の価値向上につながっている状態になっているケースもあり、インフラジスティックスとしても大変嬉しく感じております。

もちろん、最初から弊社のコントロールを購入して頂いて手札を増やしていただけると大変嬉しいのですが、それが難しい場合でもトライアルを利用していただくことで、20日間サポート付きでご利用頂けますので、この期間を有効活用していただいてうまく設計工程を進めて頂き、結果として弊社のコントロールが役に立つとわかれば購入していただく、という流れが自然かつ満足度が高いのではないかと思います。

また、要件から実際の実装される姿を想定して設計する時に、 UI コントロールを利用したどのような実装パターンがあるのかについても検討することになるかと思います。弊社はこれまでも Quince という UI パターンブラウザを提供して参りましたが、それらを具体的にどのように UI に落としこんでいくかについて UXワークショップにおいて詳しくお伝えしておりますので、こちらへの参加も合わせてご検討いただければと思います。

Metro の原則でも出てきましたが、あくまでも重要なのは「何を見せるか＝コンテンツ」であり、皆様のアイデアから生まれる創造的な部分です。これに対してインフラジスティックスは様々な「ひな形＝パターン」を提供し、皆様が本当に差別化出来るポイントに集中していただくためのお手伝いをしたいと考えております。是非弊社の製品／サービスの活用をご検討いただければと思います。

今回は非常に抽象的な内容となってしまいましたが、この数ヶ月感じていたことを Windows Store の報道をきっかけとしてまとめて書かせて頂きました。つい先日NetAdvantage 2011 Volume 2 をリリースさせていただいたところですが、今後も更なる価値向上を目指してアップデートを続けていき、定期的に私を含めたチームBLOGにてご案内していきますので、是非よろしくお願いいたします！

NetAdvantage 2011 Vol.2 スタイル編

今回は、これまでの Metro のお話を少しお休みして、リリースが目前に迫っている NetAdvantage 2011 Vol.2 に関する紹介をさせて頂きます。（たまには製品紹介メインにもお付き合いください！）まず、それぞれの製品における機能面での紹介は、既に弊社の塚越がBLOGに記事を掲載しております。

【Winform】NetAdvantage 次期バージョン 2011 vol.2 追加予定の新機能

【ASP.NET】【jQuery】次期バージョン 2011 vol.2 追加予定の新機能

【Silverlight】【WPF】次期バージョン 2011 vol.2 追加予定の新機能

まず、Windows Form / ASP.NET / jQuery / Silverlight / WPF の主要５製品について解説しています。たくさん興味深い機能が追加されていますが、UX アーキテクトの視点からいくつかピックアップしていきたいと思います。これらの５製品は、下記の３グループに大別できます。

1. Windows Form
2. Web (ASP.NET / jQuery)
3. XAML (Silverlight / WPF)

まず、Windows Form についてはこれまでの宣言通りに機能追加を続けていく予定で、製品群の中では独立して製品開発が続いています。次にWeb ですが、現在はASP.NET がコントロールの種類なども含めてまだまだ先を行っているものの、徐々に jQuery が差を縮めてきて、最終的にはほぼ同じ機能をXAMLのようにリリースしようとしているグループです。最後にXAMLですが、ここ数回のリリースの中で徐々に進めてきた「Shared XAML Strategy = 可能な限りXAMLを共通化していく戦略」に沿って、ほとんどのコントロールがどちらのテクノロジーでも利用できるようになりました。

弊社の主要製品は下記の３つに大別できます。

1. Windows Form = 既存アプリケーション／システムのサポートや改善
2. Web (ASP.NET / jQuery) = Web 標準にフォーカスしたクロスプラットフォーム対応
3. XAML (Silverlight / WPF) = XAML 製品群におけるスキルポータビリティの追求

Web ／ XAML それぞれにモバイルという軸も存在していて、 jQuery mobile (まだ製品予定として発表できる段階ではありませんが、取り組んでいます) や Windows Phone で対応しています。

すべての製品に共通して目指しているのは、「ユーザーインターフェイス開発において、いかに生産性を高め、優れたUXを実現するための支援が出来るかを追求すること」です。この共通の目標に対して様々な取り組みがされていますが、まず弊社のコンポーネントにおけるスタイル設定について紹介させてください。

ユーザーインターフェイスに一貫性や統一感をもたせるにあたり、利用されているコントロールに対するスタイル設定はとても重要であり、iOSに代表されるなどの影響もあって現在注目されている領域です。多くの業務アプリケーションではデフォルトの状態のコントロールが使われていることが多いのですが、スタイル設定によって「仕上げ」処理を行うことにより、クオリティはずいぶん違って見えることも事実です。ここで問題になるのは、「設定できることがわかっていても時間をかけることが難しい」と判断されていることが多いことです。iOS や Windows Phone を例にとって考えみると、コントロールに適用されているスタイルはしっかりと一貫性を持っているため、利用していて非常に統一感を感じますが、スタイルデザインは単純な一枚絵を作るよりもずっと複雑な作業になります。

例えば、ボタンはmouseOver などのイベントに対して幾つかの状態を持っており、それぞれに対してボタンの形状や色の設定を持っている必要があります。かつ、通常はラベルを設定できるため、可変長の文字列を内包できるようにしなければなりません。特にXAMLではかなり細かくこれらの設定を行うことが可能ですが、なかなか骨の折れる作業となります。

そこで、もう少し手軽にスタイル設定を行う方法が望まれることになります。弊社では Windows Form 及び ASP.NET で利用可能な AppStylist というツールをご提供しております。このツールを利用することで、用意された多くのプリセットのスタイルライブラリを適用することができ、スタイルライブラリの内容に変更を加える形で新たなスタイルライブラリを作ることも可能になっています。詳細は下記のBLOG記事を御覧ください。

アプリケーションデザインツール NetAdvantage AppStylist ご存知ですか？
NetAdvantage AppStylist ご存じですか？ その２

[ AppStylist ]

AppStylist 自体はかなり細かい設定を行えるツールです（画面キャプチャをみていただければ多くの設定項目があることがわかります）が、2011 Vol.2 では新たに Office 2010 Black / Silver というスタイルライブラリも追加し、たくさんのスタイルライブラリを利用することができます。これらをそのまま使うもよし、少しだけ変更して使うもよし、というところですが、まずは「IG」というスタイルライブラリから確認してみてください。このスタイルライブラリは比較的最近用意されたもので、弊社のデザインチームがゼロからデザインしているものになります。Windows Form / Web / XAML それぞれの製品で同じデザインのスタイルライブラリを適用できるように用意していますので、まずはこちらをベースに検討されてみてはいかがでしょうか。

一方、jQuery には弊社ではスタイル設定用のツールを用意していません。というのも、jQuery UI のオフィシャルなツールとして ” Theme Roller ” というツールが用意されている為です。この Theme Roller に関しても、既に弊社の池原がBLOGで記事を書いています。

NetAdvantage for jQuery コントロール + Theme Roller [Tips]

[ ThemeRoller ]

jQuery においても、先ほど書いた「IG」と同じスタイルを適用することができます。また、Theme Roller にある Theme も同様に適用可能です。これに関するオンラインヘルプへのリンクもご紹介しておきます。

NetAdvantage for jQuery のスタイルおよびテーマ設定

XAMLプラットフォームにおいては、スタイルの自由度はWindows Form や Web のレベルとは大きく異なり、非常に極端なものも含めておよそ思いつく限りのことが出来るようになっています。ヘルプでも、独立した「デザイナーガイド」を用意している程です。これらの編集には Expression Blend を利用するのが最も確実な方法です。なのですが。。。あまりに自由度が高すぎるため、手をつけるのが難しいと感じている方も多いようです。NetAdvantage ではOffice2010テーマと呼ばれるテーマリソースを Rsource Dictionary 形式で用意していますので、こちらを利用していただくことも可能です。また、2011 Vol.2 においては更に「リソースウォッシング」という機能を追加しました。これは、単色を指定することでコントロールに適用された濃淡によって外観の全てを変更できる機構です。この機能を利用すれば、外観全体を簡単に変更できるようになります。実際に色がどのように変わるかが見えないとイメージがつかないと思いますので、下記BLOG記事（英語）もご参考ください。

[ office2010テーマをオレンジ一色でリソースウォッシュした例 ]

Introduction to Resource Washing in NetAdvantage for Silverlight 11.2（英語）

このように、弊社が提供する製品群において、できるだけ簡単に統一したスタイリングを提供できるように様々な機能をご用意しております。機能に比べてなかなか手が回らない部分ではありますが、うまく「仕上げて」いただいて、品質を高めていってください！NetAdvantage 2011 Vol.2 がリリースされたら、リソースウォッシュも含めて是非試してみてください！

Metro : Windows Phone から Metro を考えてみる（２） - Windows Phone Design Day–(5)

今回も引き続き Windows Phone Design Day のネタをお届けします。このネタで既に５回目なので、リンクをしておきますね。

Metro : Windows Phone から Metro を考えてみる（２） - Windows Phone Design Day – (1)
Metro : Windows Phone から Metro を考えてみる（２） - Windows Phone Design Day – (2)
Metro : Windows Phone から Metro を考えてみる（２） - Windows Phone Design Day – (3)
Metro : Windows Phone から Metro を考えてみる（２） - Windows Phone Design Day – (4)

今回は  “perceived performance” = 見かけのパフォーマンスに関する話題になります。多くのアプリケーション開発ではパフォーマンスを高くするにあたって色々な悩みがあると思います。レスポンスを「即時に」するという仕様は「言うは易し行うは難し」で、特にネットワークを経由したアクセスを前提にしている場合にはどうしてもユーザーを待たせることになってしまいます。その時、どううまく待ってもらえるかがとても大事になります。

[ Perceived Performance ]

100 ms 以下（ボタンタッチ時の挙動など）、500 ms から１秒（リストビューでスワイプした時の Pivot アニメーションなど）、２秒以下（アプリのローディングやメールが飛んでいくアニメーションなど）、２～５秒、５～１０秒、１０秒以上、もっと長いプロセスと分けて説明していて、２秒以下のものは基本的に Built in common controls に挙動を任せています。適切に UI がフィードバックを返していなければ、デバイスが活きているのかどうかもわからないと感じるものです。メトロの原則にもあるように、アニメーションなどをうまく利用してデバイスが活きていることを伝え、結果として見かけ上のパフォーマンスを高く感じさせます。なんの反応もなく２秒待つことは経験的にもどのユーザーも相当イラッとしますね。ｗ

[ Perceived Performance (Cont.) ]

もう少し問題なのは２秒以上待つようなケースです。このようなケースではローディングのためにプログレスバーを出すことになりますが、５秒までなら短時間であるとしてプログレスバーのみ、１０秒までなら「％」表示、それ以上の場合は「サーバに接続しています」「データを取得しています」などのサブステップを見せるようにする、などの工夫が必要になるとしています。１０秒以上のケースではユーザーはとにかく何が起きているのか不安になりますから、その時点でなにが進行しているのか知らせる必要があります。（場合によっては処理をキャンセルする可能性もあるわけで、その時何が起こるのかも一緒に設計する必要がありますね）

古くは「砂時計」が有名な待たせるモーションでしたが、最近 SAMSUNG の Windows 8 スレートを使っていて気づいたのが、HDDのアクセスランプがないために、何が起こっているのかわからないケースがありました。無意識にアクセスランプを見て、ガリガリと何かやっているな、ということで納得していたのでしょう。タッチインターフェイスになって、より一層全てをダイレクトにユーザーが感じるようになった時、アプリケーションが適切に「頑張っています」「悩んでいます」「誰かの応答を待っています」と伝えてくれなければ、固まってしまったと感じ、その体験が「パフォーマンスが悪い」というイメージの固定化を招いてしまいます。そうならないためにも、適切なモーションを利用するようにしましょう。２秒以下の状況で使うものにも、メールのアニメーションのようにそれぞれのアプリケーションでは工夫の余地が出てくると思います。

Windows Phone Design day では、この他にも様々な話題が取り上げられていました。

Designer insights into Panorama and Pivot ( Chad Roberts, Amy Alberts, 32:18)
→Pivot と Panorama に関する詳細な説明です。
Making Audio Sing on Windows Phone (Matthew Bennett, 34:26 )
→音とアプリケーションの関わりに関する説明です。
Windows Phone Voice ( Karen Kesler, 32:00 )
→セールスやマーケティング的な側面でどのようなメッセージングを行うべきかという話題について説明しています。
Designer Resources: Expression Blend Overview and Roadmap ( Celso Gomes, Peter Blois, 41:20 )
→Blend で WP7 アプリケーションを開発する流れに関する説明です。 
Designer Resources: Windows Phone Documentation ( Chris Kilbourn, 11:18 )
→用意されているガイドラインなどのドキュメントに関する説明です。
Designer Resources: Windows Phone Design Templates ( Chad Roberts, 04:01 )
→.psd で用意されているデザインテンプレートに関する説明です。

かなりたくさんの情報がありますね！Windows Phone 7 はマイクロソフトがとても力を入れているプラットフォームですから当たり前といえば当たり前ですが、これが次期 Windows となればもっと情報は充実してくるでしょう。このとき、タッチファーストであるが故に既存のアプリケーション開発での留意事項と異なることが出てきます。このようなことに対処するためにも、Windows Phone 7 を使ってウォーミングアップをしておくと、スムーズに新しい世界に入っていけるのではないかと考えております。

ここまでお読み頂きました皆様、是非弊社の NetAdvantage for Windows Phone もチェックしてみてください。現行のリリースもたくさん役に立つコントロールがありますが、近々リリースさせていただく11.2においては、Google/Facebook/Windows Liveを利用したアクセスコントロールや、Silverlight では既に提供しております、コントロール設定を維持するための Persistence Framework など、新機能がたくさん追加されます！（現時点ではあくまで予定です。近日中に詳細な情報が弊社BLOGなどで公開されます。）これらのコントロールも活用していただいて、AppHubが賑やかにしてやりましょう！

Metro : Windows Phone から Metro を考えてみる（２） - Windows Phone Design Day–(4)

今回も引き続き、Windows Phone Design Day を追いかけていきます。

Deconstructing a Windows Phone application, part 4: Globalization (Ayman Raslan, Franklin Yow : 37:45 )
→国際化対応とローカライズに関する説明です。今回は動画の中身は比較的軽めです。

個人的に、国際化対応は Windows Phone というプラットフォームを扱う上で極めて重要だと考えています。現時点での日本でのシェアはまだまだ少なく、少数のユーザーを相手にアプリケーションをリリースするよりも、NOKIAが大きく力を入れていたりする北米、ヨーロッパなどの市場の多数のユーザーを狙っていかなければアプリケーションを通じての売上は難しいと言えます。逆にいえば、北米、ヨーロッパを入れてもまだまだリリースされていないタイプのアプリがたくさんあることも事実で、iPhone やAndroid に比べて手付かずの領域があるうちに進出しておいたほうが良いと思います。そのためにも、多言語化対応などについては最初から検討に入れておくとよいでしょう。

動画の内容としては、可能な限りコード変更の発生を避け、ja-jp や en-us などのカルチャー単位（英語を利用していても、国によって単位フォーマットなどは異なるケースもあります）でプログラムとは別に管理したリソースを出し分けるように開発しましょう、というような一般的な話が多かったです。

[ Globalization : Final messages ]

編集フィールドとコントロールが欧文以外の文字列をしっかりと扱えること（弊社の UI コントロール製品はもちろんそのようになっております！）、IMEなども含めた入力を受け付けられること、ユーザーカルチャーに依存する日付、時間、通貨、数値などを正しく表示できること、U.S. 向けのアプリをただ翻訳しただけのものにしないで、ターゲットユーザー市場に対してデザインされたものであること、などを確認しましょう。

[ Globalization : Final messages ]

UTF-8のような正しいエンコードを利用していること、正しいローカライズガイドラインに従っていること（MS は MSDN などでガイドラインを公開しています。）などについても確認しましょう。URLに記載されているサイトではサンプルも含めて様々な情報が公開されていますので、一読されることをお勧めします。

また、一般的な国際化に関する話題を2008年の MIX で講演させていただいた時の動画も紹介しておきます。英語はいまいちですが、内容はそれなりに詰まっているはずです！

http://channel9.msdn.com/Events/MIX/MIX08/T15

次回は、モーションを利用してどのように見かけのパフォーマンスを高く見せるか、という話題について取り上げます。お楽しみに！

Metro : Windows Phone から Metro を考えてみる（２） - Windows Phone Design Day–(3)

取り上げた題材が大きかったためか、なかなか先に進みませんが、前回／前々回に引き続き Windows Phone design Day に関する記事となります。タッチインターフェイスにおけるターゲットサイズについて取り上げます。

Deconstructing a Windows Phone application, part 3: Target Sizes ( Tirthankar Sengupta, 13:39 )
→何年もタッチでのターゲットサイズについて調査しているラボの研究者の発表です。

[ Target Size Guidelines : 9 mm ]

数百時間に及ぶユーザーリサーチや様々な研究の結果から、タッチターゲットのサイズにおける一種のマジックナンバーとして “ 9 mm ” が導きだされたようです。

[ Target Size Guidelines : Summary ]

推奨されるタッチターゲットサイズは9 mm 以上、最低でも7 mm 以上とし、その場合は15 mm 以上の幅を持たせる。（てて幅に余裕がない場合に利用する）タッチできるアイテムのビジュアルサイズは4.2 mm 以上にする。ちさなコントロール同士の配置ではうまく間を取る、コントロールをタッチしやすくするためにパディングやバッファを使う、そのターゲットで実際に何が行われるか（task context）を意識して、エラー率を評価する。サマリーで以上のようなことが示されています。後のQ&Aで出てきますが、Windows Phoneにおける 9 mm とはおよそ90ピクセルとして考えているようです。ただし、極端に大きな画面サイズや小さな画面サイズがあった場合はこの限りではないと思いますので、実測の必要はあると思いますが、基本の DPI が 262 DPI と決められているため、想定はしやすいと思います。

仮にこれらのことを今後Windows 8 のメトロに適用する場合には、様々なハードウェアが存在することが予測されるため確実に実測が必要になると思われます。また、Windows Phone のオペレーションでは主に親指が使われるケースが多いですが、それが人差し指になった時、マルチタッチになった時なども想定しておく必要があります。 Windows 8 用のガイドラインも用意されるのではないかと思いますが、今のところ転用する場合には注意するようにしましょう。

[ Target Size Guidelines : Implementation ]

上記スライドの右下部分を見てみましょう。これはアプリケーション一覧のある画面ですが、戻るボタンのビジュアルサイズが43ピクセルであるのに対して、タッチターゲットとしてはもう少し広く97ピクセルを確保してあります。そのため9 mm ルールを超えていますね。一方、アプリケーションアイコンについては62 x 62のサイズに対して、次のアイコンまで12ピクセルしか空白がありません。デッドスペースを作らずに上下を均等にタッチターゲットに割り振ってようやく7 mm を超える程度ですが、アプリケーションの名前を示している右のエリアが十分に幅をとっているため、縦幅が小さくてもタッチしやすい構造になっています。

左上で示されているように、実際に目指できる空間と、タッチできる領域間の空間、双方を意識する必要があります。このあたりは別にアプリケーションアイコンを配置する際に開発者が意識することではありませんし、テンプレートはこのようなルールを意識して作られていますが、テンプレートを超えた実装を行う場合にはこのルールを思い出す必要が出てきますね。

[ Target Size Guidelines : Research Background ]

どうやって9 mm ルールに達したかの背景もしっかり書かれています。興味のある方はご覧下さい。実際には、エラー率などはタッチの反応レベルなどのハードウェアに依存したところもあると思いますので、実機でのテスト／評価が必須になると思われます。弊社のこれからのコントロールも、ビジュアルサイズと目標サイズの違いがあることなどを意識する必要がありそうです。このようなサイズの調整についてはXAMLでのカスタマイズであれば非常に都合がよく、HTMLベースのものだとかなり頑張らないといけないと思われます。いずれにしても弊社としては、XAMLベースプラットフォームも、HTMLベースのWebスタンダードも両方サポートしていきますので、今後もこれらのガイドラインと絡めて情報を提供してまいります。

次回は、国際化について書いていきます。重そうなテーマですが、現在 Windows Phone に取り組む上でとても重要なパートになりますので私も気合を入れて書きたいと思います。お楽しみに！

Metro : Windows Phone から Metro を考えてみる（２） - Windows Phone Design Day–(2)

前回に引き続き、Windows Phone Design Day のコンテンツを見ていきます。

Deconstructing a Windows Phone application part2: Animation ( Jeff Arnold, 34:22 )
→WP7 のリードモーションデザイナー（！）がアニメーション／インタラクションの話をしています。

[ why use motion? ]

リッチアプリケーションを初めて作るようなケースでは、「私のアプリケーションにはアニメーションなんて必要ありません」とおっしゃる意見も多いのですが、このスライドで示されているように「ユーザーを喜ばせる」だけではなく、「ヒントで動作を促す」ことや、「見た目のパフォーマンスをだます」「ユーザーに次に何をするべきかを伝えることを助ける」ことなども可能です。最近は機能が多いにもかかわらず UI をシンプルにしなければならないため、ヒントをアニメーションで伝えることはとても大事になっています。（ビデオにもあるように、Windows Phone のスタートスクリーンでの「ちょい見せ」はとても良い例ですね）

[ definition of Transition / Animation ]

次に、トランジションとアニメーションの定義を行なっています。（さすがリードモーションデザイナーですね！）トランジションは「UI の中で、ある状態からある状態へユーザーが移動する際に与える視覚的なフィードバック」であるとし、アニメーションは「ある状態の中での動きを伴った視覚的なフィードバックで、ユーザーのアクションとは必ずしも紐づかないもの」であるとしています。前者はスタートでタップしてアプリケーションへ遷移する際の動きに代表される状態と状態の間の動き、後者はロックスクリーンが「跳ねる」ことやプログレスバーなど、ある状態の中で起こる動きです。動きは常に目的を持っており、ユーザーにデバイスが「活きている」事を伝えたり、どのようにしてデバイスと関わるかを伝えるために使われるともしています。

紙芝居とTVアニメを想像すると分かりやすいと思います。それぞれの状態を紙芝居やアニメでのシーンであるとすれば、紙芝居ではあるシーンの中では視覚的には動きが無いので、弁士のかたがドラマチックに語ることでそれを伝えていますが、TVアニメではまさにアニメーションで動いているため、何が起こっているのかは見ればわかります。また、シーンが変わるときにも連続性があるのか完全に状況が変わるのかによって違いますが、やはり視覚効果やサウンドを使って「変化」を伝えています。（サザエさんあたりの分かりやすい番組で、意識してみてみると理解しやすくなるでしょう）

ある UI を扱うときに、仮にトレーニングがあると想像してください。トレーナーがたくさん次にやるべきことを説明する必要があるのであれば、まさに紙芝居の弁士の役割になってしまっていて、実際には利用者が UI に触れるときにはその声は聞こえて来ないという問題につながります。アニメーションを効果的に利用することによって、UI そのものに雄弁に語らせることが出来るのです。皆さんの UI が、紙芝居の紙だけをを渡されて、ストーリーを想像しなければならないようなものになっていないか想像してみてください！

[ 2.5D not 3D ]

全体に平面で構成されたシンプルな世界にモーションを加えることで「2.5D」の表現を目指しているとのことです。あくまでも派手すぎず、原則にあるようにコンテンツに集中することを忘れずに、動きを与えていきます。

特にWindows Phone では、デバイス側のハードウェアキーとして「バックボタン」が付いているので、ある状態に進む／バックキーで戻る、と２通りのトランジションがあり、それぞれにin / out で最大４通りのトランジションを設定可能です。もっとシンプルなものでは２通りの場合もあります。ゲームでもない限り、ヒットターゲットが動くようなものを作らないように、とも指摘していました。アニメーションに凝りだすと表現としてはあり得るのですが、操作し難く成るのは間違いありません。

Windows phone でも Windows 8 でも、ビルトインコントロールが持っているアニメーションやアニメーションライブラリ（ビヘイビア）で多くのパターンを吸収できるようになっています。また、Expressionなどで設定できるイージングなども役に立つでしょう。特にイージングでは様々なパターンがありますが、動きが作り出すイメージを事前にしっかりと確認しておくと良いと思います。開発する側としては、どのような選択肢がすぐに使えるものとして用意されており、どのシチュエーションで利用できるかをわかった上でうまく活用することが大事です。インフラジスティックスでも、Infragistics Motion Framework というものを用意しており、データを躍動的に見せる仕掛けを簡単に実現できるようになっています。ぜひ一度サンプルをご覧いただければと思います。

以上、アニメーションについて追いかけて行きました。次回ではタッチ UI におけるターゲットサイズについて取り上げていきます。お楽しみに！

Metro : Windows Phone から Metro を考えてみる（２） - Windows Phone Design Day–(1)

U.S.ではWindows Phone のリリースが先行していたこともあって、多くのイベントが既に開催されています。” Windows Phone Design Day ” もそのひとつで、2日間の Deep Dive セミナーです。Store の展開も先駆してたくさんのアプリがアップロードされましたが、今後はクオリティを高めるフェイズに入っているようで、今後これに近いセミナーが世界各国で行われるようです。日本でも実施されると良いですね！

ありがたい事に当日の模様は全てビデオで見ることができます。英語になりますが、内容的にはとても参考になりますので是非流して見られることをお勧めします。全体の流れとしては：

Ana and Miles, the Windows Phone personas ( Tracey Lovejoy, 3:33 )
→リサーチチームのメンバーから Windows Phone 自体のターゲット、ペルソナについて語られています。（猛烈に早口な人なので、とりあえずスライドを見ながら適宜ポーズしつつご覧下さいｗ

The Metro Design Language, the inspiration ( Jeff Fong, 29:48)
→Metro のデザインチームが Metro について解説しています。ここまでの私のBLOGをお読みの方には既にご存知の内容がほとんどですが、Windows Phone に特化したアートワークが見れるのでそこだけ眺めておきましょう。

この後の続く6本が “Deconstructing a Windows Phone application” というシリーズになっていて、アプリケーションをある視点で分解して解説しています。

1. UI コントロール
2. アニメーション
3. ターゲットサイズ
4. グローバライゼイション（国際化）
5. 見た目のパフォーマンス

の5つです。（どうもPart5のレコードがなさそうですので、どんな内容だったのか調べてみたいと思います。）私もいつもセミナーなどでお話ししているのですが、対象を大きな一つの要素として捉えるのではなく、幾つかの課題要素に分割することでアプローチがしやすくなります。

Windows Phone ということで要素が限られるためにレイアウトそのものについてはあまり語られていませんが、その代わりに詳細なデザインテンプレートが用意されています。28種類のレイヤー構造を持ったフォトショップのファイル（.psd）で、SegoeWPというフォントも入っています。（これの日本語版も是非欲しいですね！）フォトショップのファイル（.psd）というとかなり身構えてしまう人も多いと思いますが、なんのことはないグラフィックファイルですから、重なったセル画を眺めるぐらいの感覚で見てみると良いと思います。Expression Design を MSDN などでお持ちならばそちらでも見れますし、フリーソフトなどでも閲覧可能なものがあります。本家のトライアル版をダウンロードしても良いですね！特に重要なのは編集することではなく「デザイナーに発注するとしたらどういう構造で発注したらいいのか」を確認できることです。印刷して簡単に注釈をつけて、このファイルと一緒に渡すのも良いと思います。

このような分解する視点と、デザイナーとデベロッパーとの協業を考えておくことは、 Windows 8 のメトロスタイルアプリになっても同じように必要になりますので、ある程度限定な環境である Windows Phone などを題材にして慣れておくと良いと思います。

Deconstructing a Windows Phone application part 1: Controls ( Rhon Manlapaz, Ryan Bickel, 17:40)
→まずはコントロールの視点で掘り下げています。

スタート時点の Tile からローディングスクリーン、ランディング（初期）スクリーンと流れ、Pivot や List ビューに関する説明、リストの先にある詳細ビューの見せ方、クイックジャンプリスト、コンテキストメニュー、確認画面などなど、コントロールそのものというよりもそれが使われる状況について説明されています。アプリケーションには「流れ」がありますから、その中でどのようにコントロールを配置するのかはとても大事な視点ですね。それぞれの UI コントロールのデザインガイドラインについては、MSDN に詳細な記述がありますのでそちらが参考になると思います。

UI コントロールの一覧を見た上で「足りない要素がある」と感じた場合には是非弊社の NetAdvantage for Windows Phone もチェックしてみてください。チャートやバーコードなどのはっきりと分かりやすいものもありますが、インフォボックスやメッセージボックスのような渋めの（？）コントロールもあります。いつも感じるのは、UI コントロールはパレットの上の絵の具のようなもので、無ければ原色から混ぜて作れますが、あれば表現は簡単になりますし、逆にパレットにそれがあることで新たにアイデアを得たりできます。是非皆さんのパレットにも弊社のコントロールを加えてみてください！

いきなり Part1 で長くなりましたが、次回以後ペースを上げていきたいと思います！

Silverlightを囲む会in東京#4で講演せさせて頂きました

前回お伝えしていたとおり、三連休の一日目、2011/10/08に、Silverlightを囲む会in東京#4で講演をさせて頂きました。「Windows 8 におけるUXとメトロスタイルアプリケーション」というタイトルで、Windows 8 とメトロを中心にお話致しました。

さすがに連休でもコミュニティの勉強会に参加されようという皆様でしたので、既にほとんどの方が Windows 8 を既にインストールして試されているようでした。皆さんにご協力頂きまして「インフラジスティックス」という名前も一緒に声に出して覚えて頂きました。ありがとうございます！

|
[ インフラジスティックス、もう覚えたかな？ｗ ]

当日の内容は、これまでのBLOGの内容をまとめる形でお届けし、ほとんどのスライドは /build// のセッションから借りたものになります。メトロにおいてはテンプレートが多くをガイドしてくれますが、そうであるからこそメトロの構造にしっかりと目を向けて取り組みましょうということでお話をしました。

[ view Architecture ]

上記分析の視点は前職の頃からよくお話していたアプローチですが、メトロのようなルールが明確になっているものだとそれぞれを分解することでそれぞれの関係がよりはっきりとし、テンプレートを超えた実装を行う際にそれぞれの視点を持っていることが重要になってくると考えております。

[ ig loves Windows 8! ]

インフラジスティックスとしては、今後Windows 8 におけるメトロスタイルアプリケーション環境も、デスクトップアプリケーション環境も、全力でサポートをしてまいります。現時点でのWindows 8 への取り組みに関する弊社のまとめはここで確認することができます。ぜひお時間のあるときにでもご覧ください。

[ UX ワークショップのご案内 ]

当日もご紹介しておりましたが、今後特にデスクトップアプリケーション環境において、既存環境との互換性を持ちながらメトロスタイルアプリケーション環境との体験ギャップをいかに小さくするか、ということが大きな課題となると思われます。弊社の UX ワークショップにおいてもメトロの適用／適合については大きなトピックとして取り上げていきたいと思いますので、皆様のプロセスにメトロを組み入れるためのきっかけとして、是非ご活用ください！ご検討お願いします！

[ Is silverlight OK for us? ]

こちらも当日のスライドからの抜粋ですが、Silverlightに取り組まれている皆さんは、まずは安心して大丈夫であると考えています。XAML のスキルセットはこれからも活用可能ですし、デスクトップアプリケーション環境と既存環境ではこれからもSilverlight の活躍の場があると考えています。Silverlight 5 でサポートされる機能を考えるとなおさらですね。とはいえ、これから5年／10年問題がないと言い切れるテクノロジーはほぼ存在しないと考えています。今持っているスキルセットを最大限に利用することを考えていくと良いのではないかと思います。（HTML5とのパフォーマンス比較も参考にしてみてください！）

[ 当日のスライド ]

当日のスライドについては上記の通り SkyDrive 経由で閲覧／ダウンロード可能です。また、当日の模様は会場をご提供いただいた IIJ 様のご厚意により、暫くの間こちらで閲覧可能となっております！（私の講演は2:20ごろからになります）他の皆様のセッションも大変素晴らしい内容でしたので、是非御覧ください！

コミュニティでお話させていただくと、いつも逆にパワーをいただきます！是非今後とも宜しくお願いいたします！