taninnosorani blog

What is the UX Workflow?

Microsoft Surface 2.0 Design and Interaction Guideline 翻訳

Surfaceのデザインガイドラインを翻訳しました。

翻訳の精度を保証するものではありません。Surfaceの名称は「Pixel Sense」に改名されていますが、ここではガイドラインに従い旧名の「Surface」を使用しています。ガイドラインにはSurfaceの特色であるテーブル型ディスプレイのガイドラインが主な内容ですが、普遍的なインタラクションデザインに関する記載も多くあります。原書には画像付きで分かりやすく書かれているので是非読んでみてください。

Surface 2 Guideline PDF
http://www.microsoft.com/en-us/download/details.aspx?id=26713
Surface 1 Guideline PDF
http://www.microsoft.com/en-us/download/details.aspx?id=19410

SurfaceSDKのセミナー資料も公開しています。 http://www.slideshare.net/slideshow/embed_code/13097810?startSlide=9

目次

  1. イントロダクション
  2. はじめに
    1. 基本原則
    2. 重要事項
  3. デザインプリンシプル
    1. インタラクションデザインガイドライン
      1. 何人かの人と同じ時間を使った体験を作る
      2. 直接的なタッチインタラクション
      3. 体験を引き立てるために物質的なオブジェクトを使用する
      4. 常にタッチに反応すること
      5. コンテンツに基づいた体験を作る
      6. トランジションの注意
    2. ビジュアル＆モーションデザインガイドライン
      1. 方向とレイアウト
      2. 深度
      3. 形状
      4. テクスチャー
      5. 配色
      6. タイポグラフィー
      7. イコノグラフィー
      8. モーションデザイン
    3. サウンドデザインガイドライン
    4. 言語と文章のデザインガイドライン
  4. SURFACE HARDWARE
    1. INPUT METHODS
    2. HARDWARE SPECIFIC CONSIDERATIONS

Microsoft Surface 2.0 デザイン＆インタラクションガイド - デザインとアプリケーション開発の原則とガイドライン

セクション 1.0: イントロダクション

Sufaceは開発者とデザイナーがユーザーに驚きとソーシャル性とインタラクティブエクスペリエンスを提供することができます。ユーザーは360度全ての側面から互いのコラボレーションによって確かめ合いながら使うことができます。その信頼は堂々巡りの話し合いを止めるのに十分であり、直感的に老若問わずユーザーへ理解させることができます。（タッチやプッシュ、プル、ターン、スクリーンにオブジェクト置くことで？。）Surfaceはユーザーとコンテンツが相互に打ち解け触れ合っていく新しい機会を作ることができます。簡単に言えば、ユーザーが一緒に繋がり、学び、楽しみ、決定する簡単な方法はありません。Surfaceは常に直感的であり、有益であり、魅力的であり、助けになることを約束し、デザイナーと開発者がユーザーが探しだしたり覚えたりする体験を作ります。 説得力のあるSurfaceの体験を作るにはインターフェイスデザインとは異なるアプローチが必要です。このドキュメントはインタラクションとビジュアル、効果音、文章などを含むアプリケーションの主要な側面に関するデザインの原則とインターフェイスデザインのガイドラインを提供します。

セクション 2.0: はじめに

以降のセクションでは、Surfaceアプリケーションを計画する上で心に留めておくための重要な事柄をハイライトします。

セクション 2.1: 基本原則

楽しさ
魅惑的な、驚くべき、報われる
Surfaceは触覚や視覚、聴覚に繋がることでレスポンスと心を捕らえることでユーザーの好奇心に報います。

スマート
直感的な、精通した、鋭敏な
Surfaceはユーザーの次の動きを予測します。それは必要な時にタイミング良く明らかにされる重要な情報と上記で誘導します。

控えめな
優雅な、繊細な、魅力的な
Surfaceはユーザーがおもてなしと機転を通して体験する中に含まれる可能性を理解することを手助けします。

セクション 2.2: 重要事項

1. ピクセル対インチ

Surfaceハードウェアは下記を公開します。

Microsoft.Surface.Input.InteractiveSurfaceDevice.PhysicalScaleTransform property.

このプロパティは96dpiとSurfaceのユニットで使用される論理的dpiの間の比率を表します。この変換を使えば、96picelはディスプレイで１つの実際のインチになります。LogicalDpiXとLogicalDpiYのプロパティも公開しています。それらはSurface上で表示された1インチのピクセル数を返します。

それらのプロパティは、UIElementが似たような物理的ディスプレイサイズを持っても、たとえどんなSurfaecデバイスが使われているかに関係なく開発者がアプリケーションを作ることを許可します。このプロパティはスクリーンサイズか解像度に関係なく、適切なサイズのコンテンツを持つアプリケーションを設計する際の手助けとなります。

免責事項：デフォルトの96dpiが想定されるハードウェアのタイプである場合には、全てのディスプレイが実際のピクセルサイズを公開しているわけではありません。

2. 国際化とローカライズ

Surfaceアプリケーションは世界中の言語と地域が用意されています。グローバルマーケットで自社のアプリケーションを販売する開発者は国際化が準備されていることを確認してください。アプリケーションインターフェイスは様々なテキスト長や日付形式をサポートするベストプラクティスな設計に従ってください。そして色彩や画像、地政学的な問題の使用にあたっては文化的感性を心がけてください。MSDNオンラインではそれらのベストプラクティスを扱う様々なトピックを持っています。

一般的に、ローカライズされた文字列に対して少なくとも40%のバッファスペースを提供すべきです。

3. ユーザーの理解

Surfaceアプリケーション開発より前に、アプリケーション開発者やデザイナーはどんなアプリケーションを開発することが使われることが多いか、そしてビジネスゴールを理解することが大切です。

セクション 3.0: デザインプリンシプル

デザインはSurfaceのエクスペリエンスの重要な部分です。Surfaceアプリケーションはコンテンツが常に体験の中心であることを保証することを手助けする特別な一連の原則に基づいています。
顧客の要件と実装はアプリケーションによって異なってきます。そのため開発者がアプリケーションのデザインとスタイルの土台としてのプリンシプルの使用が強く推奨されます。Surfaceのデザインプリンシプルは人々を引き付ける一貫して楽しい体験を作るスタートポイントとして使用すべきです。Surfaceアプリケーションは次の5つのプリンシプルからデザインされています。

1. Simple (Light and open)

Surfaceの体験は過度に飾り立てたり装飾しません。
とてもシンプルで単純なエクスペリエンスの開始アイコンはSurfaceの開始の位置を誘導しています。遊び心のある有機的なアトラクトモード（以下の図の待機画面のこと）とは対照的に、写実的でミニマルな開始アイコンはそれがナビゲーションポイントであることを指し占めています。

2. Organized (Hierarchical and structured)

最も大切な要素は最も視覚が重要です
Surfaceのランチャーは視覚的にアプリケーションのアイコンやタイトル、説明文にフォーカスできるように整理、構造化されています。このランチャーは繊細で（いくつかの背景に配置した際に？）組織的な本来の意味を持続させます。

vai:Working with Visual Weight in Your Designs
http://sixrevisions.com/graphics-design/visual-weight-designs/

3. 本当のデジタル（いつも通りに誠実に）

Surfaceは適切な時だけ物理世界をエミュレートし、誠実にデジタルメディアを反映させたデザインスタイルを使用します。
アトラクト状態は現実世界と水のインタラクションに基づいています。それは通常実現可能な現実世界に装飾されたデジタルな粒子と鮮やかな反射を加え、デジタルメディアに忠実な体験を作り出します。

4. コンテンツ指向

コンテンツはいつも体験の中心にあります。コントロールと装飾は二の次です
以下の図に示す写真コンテンツはエクスペリエンスの最も大切な部分です。エレメントメニューインジケーター（コンテキストメニューのようなもの）は写真に触れた時にのみ表示します。ユーザーはエレメントメニューのアイコンをタッチした時に選択肢を出すことができます。

5.Lively (Soulful and responsive)

Surfaceは常に反応がよく、アニメーションやモーションはコンテンツをより良くし、コンテンツにスクリーン上で活力をもたらします。
Surfaceのトランジションは体験を生き生きさせます。ここに示すアプリケーションのローディングトランジション（原書でアプリケーションの起動ローディングを指している）はSurfaceが起動に反応している方法を説明します。アプリケーションアイコンはユーザーの指の下で僅かに拡大し、ランチャーは縮小し、ぼやけ、そしてローディング進行率を示すためにローディングバーがアイコンの下に現れます。

セクション3.1 : インタラクションデザインガイドライン

インタラクションデザインはユーザーの振る舞いや反応、タッチ、動きを持ったソフトウェア体験の相互作用を定義します。それらのインタラクションガイドラインは直感的で魅力的な均一のSurfaceアプリケーションを作る上で包括的な全体像を含むデザイン原則と関連しています。
プリンシプルの中にある相互関連性の重要な取り決めがあります。けれど、ガイドラインのどの程度の重要性かは、作成したアプリケーションのタイプによって決まります。

1. 何人かの人と同じ時間を使った体験を想像する

Surfaceは50箇所以上のタッチを同時に認識して反応します。それは指やオブジェクトスクリーンをタッチした際にわかります。これは何人かの人々をSurfaceの周りに集めたり、アプリケーションを共有したり、孤独な活動をソーシャルな体験に向上させることを可能にしています。

a. 360度の水平展開のアプリケーションデザインを使用する

Surfaceはタッチの方向を認識します。指の方向とオブジェクトがはいちされている位置がスクリーンとの接触によってわかります。開発者が特定の人がスクリーンのどちら側なのかを判断することができます。

  • ディスプレイの一方方向だけから向かい合うことを避けて、全員がコンテンツを使えるようにしてください。

  • ユーザーはコンテンツの正面を変えることができます。画面の特定の方向にコンテンツをロックしません。

  • Surface2.0 SDKのSacatterViewコントロールを使うことは360度の体験をすぐに可能にします。![](/images/surface/007.png" width=“140”/>

  • 全ての人がアプリケーションの主要要素に全ての方向から確実に届いて使えるようにします。

  • いくつかの顧客向けアプリケーションではユーザーに対して特別なスクリーンの方向が要求されるかもしれません。これは一般的にアプリケーションのユーザービリティを制限しますので、慎重に検討してください。

  • 例えば、共同販売（？）アプリケーションは販売員が常に筐体の近くにいて、顧客は常に反対側にいることが要求されるかもしれません。これは顧客の初期のニーズを満足させるように見えるかもしれませんが、社会的なアピールを制限させるように、アプリケーションを低下させます。

  • インターフェイスはSurfaecの全ての方向から本当にアクセスできます。様々な方向でアプリケーション開発の開始からアプリケーションを使用とテストから始めます。たくさんの人々が同じ時間をテストプロセスを通してアプリケーションを共有することを保証します。

  • もし方向が自由なアプリケーションだったら（天地を持っていなかったら）、ユーザーはアプリケーションの中で天地を変えることができます。![](/images/surface/010.png" width=“140”/>

  • Surfaceアプリケーションはユーザーが使用する新しいコンテンツとインターフェイス要素に向かい合わなくてはいけません。開発者は指の方向とコンテンツの方向を使用して、コンテンツと要素をポイントに関する妥当な前提をコントロールします。

  • もしアプリケーションがまだ天地の方向を持っていたらユーザーにアプリケーションの方向を変える方法を提供します。

  • 簡単なflipボンタはユーザーが誤って触ってしまいやすく、体験が台無しになります。Surfaceランチャーはサイドのハンドルが、グループ化されたコンテンツが回転する前にユーザーに簡単に慎重に実行することを要求します。

b. 垂直に設計された180度のアプリケーションを使用する

  • 新しいコンテンツとインターフェイス要素をスクリーンの下を向いて、正しい位置に置きます。

  • 新しいコンテンツが上下のある物体に見えるようにしてください。

  • 人々がどのように水平スペースを使うのかを理解してください。

    • 水平設定のスクリーンスペースは何人かの同時に使用するユーザーのためにカラムを区切られます。

c. ユーザーがどのようにスクリーンのスペースを使用するのか理解する

アプリケーションはひとりのユーザーが見たり、探したり、コンテンツを触ったりすることよりも簡単に多くのユーザーが同時に使える設計にします。

  • 重要なアプリケーション全体の変更が発生した際に、誰の目にも明らかにします。

  • ユーザーのタッチインタラクションが突然他のユーザーエクスペリエンスに影響しないことを確認してください。

    • 例えばペイントアプリケーションで、一人のユーザーが消しゴムコントロールを選択したら、全員のタッチが予期せずにコンテンツを消し始めたとしたら問題です。

  • ユーザーが動かしたりコントロールを使えるようにします。ディスプレイの片側に共有コントロールを接続しないでください。

  • 配置によってコンテンツの所有をはっきりさせます。もし新しいコンテンツが特定のユーザーに所属したらスクリーンのユーザーの前に配置してしてください。もしグループ共通コンテンツの部分だったら中央に配置してください。

d. 異なるコラボレーションレベルの違いをサポートします

3つの異なるコラボレーションのレベルがあります。

  • 高度に協力的な：ユーザーは同じタスクを互いに助けあいゴールを達成します。
  • やや協力的な：ユーザーはゴールを達成するためにタスクを分けて作業する。これは分割統治法として知られています。
    via:http://e-words.jp/w/E58886E589B2E7B5B1E6B2BBE6B395.html
  • 協力を必要としない：ユーザーは異なるゴールを達成するために別々のタスクに従事します。

あなたのアプリケーションでどのようにして異なるコラボレーションを最高のサポートを行うかを理解してください。

  • 何人かのユーザーが同時にコンテンツとコントロールを使えるようにしてください。

    • 全員が共通コントロールを使うことを要求したとしても進行を止めないでください。

  • 機能要素エリア毎にスクリーンを分けないでください。

  • アプリケーションが特別なタスクを実行するために一方の側面を指定し、他の側面には違う機能を指定する時には紛らわしくなります。

e. ユーザーがどのようにアプリケーションを実行するのか理解します

Surfaceは多くのユーザーが同時に使用できるように最適化されていまが、アプリケーションは１人のユーザーにとっても使えるように設計すべきです。特定の人がアプリケーション使えるようにさせ、他の人へ体験を共有するために参加を促すことができます。

  • 何人かのユーザーが機能的に影響しないことを保証します。

    • １人のユーザーが他のユーザーの参加無しでもエクスペリエンスを楽しみことができるようにします。
    • 新しいユーザーが参加しても、既にアプリケーションを使っているユーザーを中断させないで参加できるようにします。
    • １人のユーザーが他のユーザーの体験を中断せずに離脱しても少数の人数が継続できることを確認してください。

  • 体験を想像します。それはユーザーが同時にシェアした時の何人かの人と一緒に生き生きとする経験は楽しく、効果的です。

  • 適切な場合、ユーザーのタスクを分けたり、ユーザー自身が協業か異なるゴールの達成のためにスクリーンをシェアするかどうかを決めることができるようになるかもしれません。

2. 直接的なタッチインタラクションの使用

マウスとキーボードのGUIとは対照的に、Surfaceはコンテンツを操作するためにタッチとジェスチャーを使用します。直接的なタッチインタラクションはすぐにユーザーがすぐさま直感的に自身の操作フェードバックを理解することを助け、ユーザーをそれらの体験に通じやすくします。間接的にコンテンツを操作するためにハードウェアかソフトウェアボタンの使用は大概、ユーザーに同じ感覚を与えません。

a.直接的なタッチインタラクションと間接的なタッチインタラクション

直接的なタッチインタラクションは指か物理的なオブジェクトによってアプリケーション内の仮想コンテンツの物理的な運動である。直接的なタッチインタラクションは常にアプリケーションのChrome（表層）と抽象的なジェスチャーを信頼しています。例えば、間接的なタッチインタラクションはボタンやスライダー、メニュー、シンボルを描画するジェスチャーを含むことができます。直接的なタッチインタラクションはSurface内での使用ではインタラクションの型を好みます。それはそれらのインタラクションがエクスペリエンス指向のコンテンツをより直感的に想像することを助けるからです。

  • 直接的なタッチインタラクションを置き換えるために装飾やコントロールを使用しないでください。
    • 例えば、アイテムを回転させるための回転ボタンを使用しないでください。

b.一本指でドラックやフリックを可能にする

  • 全ての移動可能なコンテンツは一本指でドラックやフリックのインタラクションを可能にしてください。
  • 一貫性のあるドラッグやフリックは、全てのコンテンツが常に基本的なのインタラクション操作ができることをユーザーに明確にさせます。

c.タッチ向けのアプリケーションの設計

  • インタラクティブな要素は指やオブジェクトにとって適切なサイズでなければいけません。
    • 幾つかのアイテムはユーザーのタッチに反応します。タッチの対象となるものは少なくとも18mmの縦横のサイズであるべきです。
    • タッチ対象の間は少なくとも3mmの間を持たせます。![](/images/surface/028.png" width=“140”/>
    • インタラクションな要素は手や腕やオブジェクトがスクリーンを覆ってインタラクション要素を持つ関連のあるコンテンツを妨げないように配置します。

d.マルチタッチへの応答

  • Surfaceは同時に50箇所以上のタッチを認識して反応します。
  • アプリケーションはマルチタッチに反応しなければなりません。
  • ユーザーはあらゆる体験においてマルチタッチのインタラクションが使用出来ると予期します。それはアプリケーションの自身の場所だけとは限りません。

3. 体験を引き立てるために物質的なオブジェクトを使用する

連続して途切れないサーフェイスの体験がフィジカルとバーチャルな世界を融合させることによって、ユーザーは没入することになります。

a. タグオブジェクトの使用

Surfaceの主要な差別化要因として、物体の認識機能があります。オブジェクトはユーザーがアプリケーションの体験に繋がることを手助けします。この方法は昔ながらのUIでは不可能です。 システムが素早く正確に認識することを助けることができる特別なオブジェクトを配置します。タグは赤外線を吸収したりエリアを取り込む幾何学的な配列から成り立つユニークなパターンです。タグオブジェクトがスクリーンに置かれた時、ビジョンシステムはタグを読み取り、値や位置、方向を決定します。

  • 共有や自身のスペースを向上させるためのオブジェクトの使用
    • 例えば、教育アプリケーションはオブジェクトを各生徒のレッスンの進捗を割り当てるためにオブジェクトを使用するでしょう。
  • はしゃいだり愉快な体験のためのオブジェクトの使用
    • 例えば、ゲームの駒は異なる駒に様々なアニメーションを与えます。プレイヤーがスクリーン上に駒を配置した時、タグがプレイを促すアニメーションを引き起こします。
  • ユーザーと他のユーザーとのフィジカルな設定を作るためにオブジェクトを使用する。

タグ付けされたオブジェクを利用するアプリケーションがすべきこと

  • タグオブジェクトにすぐさま反応する。
  • この即座の反応はユーザーにデバイスが動いていることを知らせます。
  • 視覚的な反応を作ることはオブジェクトに適しています。
  • バーチャルな効果を伴った明確な物質的なオブジェクトとの繋がり（？）
  • 体験を強化して裕福にするオブジェクトの使用は、タグオブジェクトの存在を必須にしてはいけません。
  • 赤外線を反射しないオブジェクトの使用はアプリケーションとの接続ができません。
  • もしオブジェクトの赤外線反射が要求される場合、これらの連絡先をフィルタリングするために、オブジェクトの位置や形の知識を使用します。

b. 非タグオブジェクトの使用

非タグオブジェクトはブログ（Blob）として参照されます。Surfaceはスクリーンに置かれた赤外線（IR）を反射するオブジェクトを見つけることができます。非タグオブジェクトからのコンタクトは、例えば全ての手がスクリーンに置かれた場合にブロブとして登録された他のオブジェクトからのコンタクトと同じになります。

アプリケーションは非タグオブジェクトを以下のように利用すべきです。

  • 非タグオブジェクトの存在に直ぐ反応してください。この機敏な反応でユーザーにデバイスが動作していることを知らせられます。
  • スクリーンにオブジェクトが置かれたら常に視覚的なサインで認識していることを表示してください。たとえそれが特別なものでなくとも。
  • ブロブプロパティからオブジェクトの形やサイズを特定できるとことを期待しないでください。全てのオブジェクトの形は楕円形で、サイズは赤外線が反射したオブジェクトの一部を示しています。

c. 物質的なオブジェクトであるかのようにみせる

スクリーンではオブジェクトは移動中の微かな物理特性や運動の慣性、自然な感じの衝突で、矛盾の無い感覚を作ることを助けるべきである。

  • 現実の操作から始まるインタラクティブなメタファーを利用してください。そして、現実世界で可能なことを超えて、デジタルで起こりえることを囲い込んでください。
    • 例えば、フォトアプリケーションでフリックで写真を移動させることができるでしょう（現実の動きを模倣して）。そして、ユーザーは簡単な操作で写真を拡大することもできます。（この場合は仮想空間だけで可能ですが）
  • mass(?)や加速、摩擦、粘性、重力を利用して状態推移の現実世界を模倣してください。
    • 例えば、SDKにあるScatterViewコントロールは簡単にそれらの効果を可能にします。
  • オブジェクトとコンテンツの慣性を使用してください。

これらは各アプリケーションの体験を通して矛盾の無い体験を作るのに貢献します。Surface SDKの慣性処理は慣性を実行しやすくします。

4. 常にタッチに反応すること

ユーザーは動かない何かを試すことがあり（？）、それを受けて、視覚的なフィードバックがそれらを学習し、問題解決かポジティブな方向へ促すことを助けるべきです。

a. ユーザーを視覚的なヒントと間に合わせのクロムで誘導させる

  • ユーザーにインタラクションがすべきことについての視覚的なヒントを提供する。

    • 例えば、ランチャーの回転ハンドルは、視覚的なヒントを使用しています。それはコントロールを回転させるためのタッチインタラクションであることです。

  • インタラクションを誘導するために、間に合わせのクロムを使用します。間に合せのクロムはコントロールが必要なときだけ公開されることを意味します。

    • 例えば、フォトアプリケーションで、ElementMenuがスクリーンに常にいるよりは、個々の写真をタッチして現れるべきです。

b. 即時の喜びと達成感を確保する

  • 視覚的にタッチを認識する タッチの視覚化は素早く正確にアプリケーションがタッチを視覚的に認識することを見越しておく。
    • すべてのコンテンツはタッチに反応し、即時視覚化しなければならない。
    • タッチは深さや、白熱光か他の可視化を認識することができる。
  • アプリケーションは即時にタッチポイントに即時に反応しなければならない。
  • ユーザーに体験を制御させ、過度のオート操作を提供してはいけない。

c. 魅力のある知覚的フィードバックを提供する

ビジュアルやサウンド、モーション、フィジカルインタラクションを通して、ユーザーが感知する魅力的なフィードバックを提供する

  • シナリオに適して、楽しませるビジュアルを盛り込む。
  • ユーザーが何か起こったのかを理解するのを、助けるアプリケーションに適したサウンドを盛り込む。
  • ビジュアルが合図を送り、ユーザーをアプリケーションの新しい環境やポイント、効果を導くヒントを伝える。
    • 例えば、アプリケーションはアニメーションを使って、インタラクションを教え、機能を導くヒントを伝えることができる。

d. 視覚的なヒントとタッチインタラクションを教えるためのガイダンスアニメーションを使用する

  • 目に見えないコンテンツに対して視覚的なヒントを提供する。直感的に、非階層アプローチの探索はSurfaceの体験の基本です。そして、時々ユーザーがそれらをガイドする手がかりとヒントを要求します。

    • 例えば、ランチャーアニメーションはアプリケーションのアイコンがスクロール・インするのを表示します。そして、アイコンがランチャーがスクロール可能だということ、追加のコンテンツがあることを示すために縮みます。

  • ユーザーの謝った行為を防ぐために、視覚的なヒントを提供します。

    • 例えば、ユーザーが取り出せないディスプレイの範囲外のコンテンツを外側に移動することを許可しません。

  • 機能を明らかにするためにガイダンスアニメーションを使用します。

    • 例えば、音楽を探すアプリケーションで、アルバムのジャケットがScatterViewItem です。ユーザーがそれらをタッチすることができ、フリックするとアルバムのコンテンツが明らかになります。アプリケーションが起動した時、ジャケットは特定の場所にアニメーションし、幾つかのアルバムは追加コンテンツがあることをデモンストレーションのためにひっくり返ります。

5. コンテンツに基づいた体験を作る

コンテンツ指向のアプリケーションは探索と発見を促します。コンテンツにフォーカスされた体験はユーザーが使う上でより直感的に楽しくあります。

a. コンテンツをインターフェイスとする

  • ダイレクトタッチインタラクションを、ボタンやメニューやスライダーのようなUIコントロールに置き換えないでください。
  • スクリーンを不必要で余分なUIコントロールとクロムで散らかさないでください。
  • プライマリインタラクションとしてタッチを取って代わらないでください。
    • プライマリインタラクション（タッチ）を置き換えると行った方法で、外部の入力デバイスをSurfaceと接続しないでください。
  • アプリケーションはそれを置き換えることなく、Surfaceのタッチエクスペリエンスをサポート、推奨しなければなりません。

b. インタラクティブな要素は特定しやすいようにする

  • 視覚的なタッチコンテンツのサインは、ユーザーがインタラクティブでない何かをタッチすることを誤らないように正確であるようにしてください。
    • 例えば、非活性ボタンは必ず視覚的な活性ボタンとは異なるようにしてください。
  • 大きなインターフェイスの要素だと、より速くユーザーがインタラクティブを特定できるようにしてください。
  • オブジェクトがインタラクティブかどうかを示すのを助けるような、深度（重なり）を使用してください。

c. エクスペリエンスに重点を置く

  • アプリケーションのいくつかの機能を減らしてください。個々のアプリケーションのシナリオをユーザーが使える必要性に対応する（？）。
  • 個々の機能とユーザーに明らかなそれらのタスクに、焦点をあてた機能のセットに重点をおいてください。
  • ユーザーが決めるのに時間がかかったり複雑さを減らすために、似たような選択肢は制限してください。
    • 複製されたコントロールといくつかの機能を提供するインターフェイスは混乱させます。
    • たくさんの選択肢が必要となった時は、ElementMenuを使用してください。
      • シンプルで組織化された階層的な構造
      • ユーザーはタップとスライドでメニューを通してナビゲートすることができます。

d. 行動と学習を統合する

  • もし使用上の注意が必要であれば、それらとアプリケーションの流れを統合して、コンテンツから注意を外さないようにしてください。
  • 主要機能はすぐに見つかるようにしてください。

6. トランジションの注意

a.トランジションは滑らかで流れるようでなければいけません

滑らかなトランジションはユーザーにそれがあることの文脈（背景）を知らせます。

  • 滑らかな各トランジションはユーザーに連続したフローをし続けます。
  • 不快なトランジションは避ける。
    • 滑らかなトランジションは、ユーザーを適用させ続けることを助けます。
  • 突然現れたり、消えたりすることはありません。
  • 各オブジェクトと視覚的な要素の変更は、滑らかに活動させ以降して、無くなるか途中で変わるかします。

b.意図的ではないものか有害な主要トランジションかを避ける

  • ユーザーにより、破壊と明確に意図した作動された大きな変更を要求する。
    • 例えば、アクセスポイントは、アプリケーションを離脱するか始めるための明確な入力を要求します。この２ステップの方法は想いもしない予期しない起動を引き起こします。
  • フレンドリーで歓迎するアプリケーションの環境を作成します。それはユーザーが簡単に探したり、実験するために招待します。

セクション 3.2: ビジュアル＆モーションデザインガイドライン

このセクションでは、ビジュアルデザインとモーションデザインに関する個々のデザインガイドラインを提供します。

1. 方向とレイアウト

Surfaceでのビジュアル要素のレイアウトは、興味深い機会に360度のマルチユーザーインターフェイスを提供します。ほとんどのアプリケーションでは、ほとんどの人はディスプレイのどの側からでも、読んだり、理解したり、スクリーンのオブジェクトと相互にやり取りしたりできるべきです、いつでも。Surfaceにしばし「絶対的な方向」はありません。それどころか明確な上、下、左または右はありません。各ユーザーの相対的な位置の観点で考えることがベストです。どこにオプジェクがいても回転されたり、配置されたり、デバイスを使っているユーザーから離れたりするかもしれません

a. アプリケーションの方向

アプリケーションが起動された時、デフォルトの方向が最もデバイスの周囲にいるユーザーにとってメリットがあることを確実にします。

水平での展開

  • もしアプリケーションが自由な方向のコンテンツを持つことができたら、コンテンツが回転でき、動かせることをユーザーに示すべきです。
  • もしアプリケーションが特定の方向に向かなければならないのであれば、ランチャーと同じ方向に従うべきです。

垂直での展開

  • アプリケーションはスクリーンの下に向かってのみ正しい方向に置くことができます。そして、アプリケーションは（水平と同じように）ランチャーと同じ方向に従うべきです。

b.フリーグリッドレイアウト

多くのビジュアルデザイナーはグリッドをベースにしたレイアウト作成を学んできました。360度のSurfaceの性質は、グローバル（？）、ワイドスクリーン、グリッドシステムを用いないレイアウトにとって良いものです。これにはビジュアルレイアウトの新しい考え方を必要とします。Surface SDKのScatterViewコントロールは、すぐに簡単な方法でグリッドフリーグローバルレイアウトを作成できます。それはユーザーに準備させ、コンテンツを探索することを勇気づけます。ScatterViewは目に見えないオブジェクトのコンテナーを演じます。いくつかのコンテンツは、デフォルトでスクリーンの端に向かって正しい方向に向くことになります。好奇心として、ダイレクトタッチインタラクションとして、探索としても演じます。

ただ、レイアウトは常にグリッドフリーを必要としません。例えば、LibraryContainerコントロールは、すぐにグリッドフリーレイアウトのセクションの順番で作成します。そして、コンテンツは簡単にソートされ、フィルター、体系化されるでしょう。アプリケーションはユーザーに決めさせることができます。異なる視覚的な組織化の方法を、いつ切り替えるかどうかを。（LibraryContainerは以下の図のようにコンテンツを束にしたり、一覧のように並べかえることができます。）

c.格子レイアウト

グリッドをベースにしたレイアウトは、まだ立場を持っており、現在のSurfaceアプリケーションに役立つことができます。格子状のレイアウトは、生産性やアクティビティ、データのソーティングに適しており、簡単に視覚的なリズムを生み出すことができます。Surfaceの体験に向けたレイアウトグリッドはローカル（特有な個々のコンテンツアイテム）にも、グローバル（ワイドスクリーン）にも可能です。

  • ローカルグリッド 特別なオブジェクトに適用するレイアウトシステムがあります。画面の全体にではなくです。特に役立つローカルグリッドの実装はScatterViewItemの内部で行われます。ScatterViewを用いて360度のアプリケーションを作ることが可能になります。しかし、ローカルグリッドは体系化と構造を与えるScatterViewの内部で利用できます。

  • グローバルグリッド グローバルグリッドはコンテンツとアプリケーション全体のコントロールの範囲を決定します。ワイドスクリーンのグローバルグリッドは、複製されたコントロールが各ユーザーに用意された時、又はスクリーンの両側に配置された時に役立ちます。簡単に調査し、体系化することを可能にしている間に、しばし、スクリーンの一方方向に向かってUI全体を押し進めます。それが、ユーザーの共同を難しくさせます。もしグローバルグリッドで要素をレイアウトしているとしたら、各ユーザー、各側へのコンテンツの方向の考察を気にかけてください。

2. 深度

Z軸か深度を使用して、コンテンツの編成と視覚的な優先順位付けがよりパワフルになります。深度は要素の表面を背景から分離することを助けます。そして、操作可能なものとそうでないものを明確に分離することも助けます。Surfaceアプリケーションは深度をあらゆる場所の体験と様々な状態のアトラクト（水の波紋がある画面のことです）、ランチャーそしてアプリケーションのトランジションに使用します。

  • 深度を優先度、順番、コンテンツアイテム間の集中を表すために使用します。
  • 浅く、かすかで、上品な深度の見え方を維持してください。
  • オブジェクトとコンテンツにうまくタッチできると認識するために深度を使用してください。タッチに成功した指に向かって浮いてるコンテンツのような錯覚を与えてください。それらのタッチされたアクティブなオブジェクトは最も高い深度を確保してください。
  • コンテンツとタッチ可能な領域を視覚的に示したコントロール内部で深度を使用してください。

a. 2.5次元の深度の作成

2.5次元はシミュレーターや、本当の3次元ジオメトリックスを使わない深度で錯覚させる技術に代表されます。いくつかの技術は特別なXAMLを用いた3次元ツールとハイパフォーマンスなWPFを無しで実現されます。

i. 拡縮

拡縮は深度をシミュレーションすることができます、特に他の技術と結合して。拡縮はタッチ入力の成功を登録させるために望ましい方法です。それは、少し拡大を増加させ（または錯覚のために）、オブジェクトが指に帯磁する印象を与えます。異なるレベルの深度で拡縮が大きな違うと、深い背景の見かけに繋がることがあります。ユーザーに没頭した体験を維持するため、小さな微かな拡大の変化を使います。

ii. ドロップシャドー

かすかなドロップシャドーは簡単に深度を示すのに効果的な方法です。しかし、重すぎにすることは重要ではありません。ダークシャドーはコンテンツの下を目立たなくさせることができます。そして、とても大きな補正値は、ディスプレイからオブジェクトが繋がってないのではと感じさせることができます。

iii. 透過

透過は、上のオブジェクトを通して低いレベルのオブジェクトを表示するに深度を利用することができます。この技術は少ない数のオブジェクトに対しては有効です。その一方で、透過にはレンダリングするための計算が高くなることがあります。

iv. 遠近感を与える

奥行きの付与は、着色、彩度の縮小、両方またはいずれか一方の離れたオブジェクトをシミュレーションするためにコントラストの低下を使用します。深度を伝達するための明るさのかすかな低下は、すぐに効果を出すことができます。![](/images/surface/053.png" width=“140”/>

b. 3次元の深度の作成

本当の3Dは現実の3次元ジオメトリックのレンダリングを使用します。このため、現実的なキューブの回転やシェイプ、カスタム3Dモデリングなどなどを有効（可能）にします。3DはXAMLやWPFを利用して生み出すことができるとはいえ、それは逆にアプリケーションのパフォーマンスに影響を与えることになります。本当の3DはXNAを使用したSurfaceで作成、配信されるのがベストです。それはMicrosoftの3Dのコアでゲームエンジンです。

真の3Dはインターフェイスの革新の多くの機会を与えます。しかし、3Dコンテンツをデザインする時には注意が必要です。2次元のタッチSurfaceで3Dのオブジェクトをコントロールすることは難しく混乱させることがあります。3Dは以下を常に避けるべきです。幾つかのテキストやラベルが3Dの表面上に配置され、読むことが難しくなるコンテンツの作成を。

3Dの深度を使用してスクリーン上のオブジェクトを説明はできないと考えます。しかし、それよりむしろバーチャル空間はでアプリケーションの中でユーザーを導きます。

c. 視覚的な手がかりとしての深度

深度はタッチ入力が操作可能な領域を示すことにも使用することができます。これはユーザーが、他のタッチしたことよりも異なる結果になることを理解することを助けます。例えば、ヘッダーかコンテンツのタイトルバーはドラッグできるように見えます。しかしオブジェクトの中のリストアイテムはドラッグした時にスクロールします。コントロールの一部分を、それらの領域をユーザーが特定することを助けることができる他の要素の上か下かに表示します。それらの目的を簡単に理解させます。（？）

3. 形状

Surfaceのコンテンツの形状は機能を視覚的に示さなければなりません。

a. 境界と端

アプリケーションのエッジとコーナーのスタイルは、ユーザーの趣味に合うのエクスペリエンスの感情を与えます。

  • Style 1: 平面

Surfaceのアクセスポイントとランチャーは簡潔、フラット、シンプルでデジタルであることが重要です。この様式はアクセスポイントとランチャーが、Surfaceの体験をナビできる操作可能な要素として示します。それらのナビゲーションコントロールはコンテンツの次（補助的な）です。それらナビは注意をそららさず、ユーザーが次の体験を得ることを助けます。

  • Style 2: 自然

アトラクト状態は容積、自然な形状に基づいています。それらは試しのタッチを勧めます。丸みを帯びた自然な形状は一般的に親しみやすさや見つけやすさ、没入感に優れています。

それら（平面と自然）の様式のバランスはアプリケーションに適した体験を得ることを助けます。

b. 罫線と輪郭

Surfaceのインターフェイスは、一般的に自由なアウトラインで、コンテンツのフォーカスを維持します。もしインターフェイス要素がアウトラインを要求したら、最小2pxの罫線を維持してください。回転や拡縮した時にベストな結果を生み出します。

4. テクスチャー

一般的に、奇麗に装飾されたテクスチャーの使用はSurfaceの体験では推奨されません。装飾的なテクスチャーはコンテンツを損なう傾向があります。コンテンツは常にエクスペリエンスのコアであるべきです。概して単に美学の理由で利用されるテクスチャーが作る体験は本当のデジタルではありません。

テクスチャー自体がコンテンツであるアプリケーションもいくつかはあるかもしれません。もしテクスチャーがアプリケーションで使用しなくてはいけないとしたら、ミニマムで一貫性を維持し、常にタッチと探索を推奨することにフォーカスさせます。

テスクチャーが視覚的なヒントとしてユーザーへアプリケーションの使用を助けるために演じている間は、他の多くのビジュアルデザインテクニックが同じゴールを達成ことができます。それは、ナビゲーションスペース、シェイプ、フォーム、形状、配色などなど。視覚的なヒントとしてのテクスチャーの使用に変わるものを探索してください。

5. 配色

デザイナーは実証された配色デザインのガイドラインに従わなくてはいけません。そして、彼らがハンドリングしている特定のブランドの要求を考慮しなくてはいけません。それにはいくつかの追加のガイドラインがあります。Surfaceのディスプレイに色彩再現を最適化させることです。

a. 配色の利用

  • デザインプロセスの中で全ての配色を試験します。反復の試験は一貫性や明るさやSurfaceのスクリーンで最適化された配色を獲得するベストな方法です。試験のためにデスクトップモニターに頼らないでください。

  • 背景色に真っ白な色は使わないでください。

  • まぶしさや飽和したトーン（色調）は狭い範囲で目の疲労を減少させることの最良の方法です。

  • ハイコントラストや真っ黒や真っ白はアンチエイリアス（表面要素の端が背景の上でかすかに混ざり合う）の有効性を減少します。文字が見えづらいようにさせ、回転したときにオブジェクトとコンテンツの端にギザギザの段々の効果を発行させます。

  • 全てのアクションに対してステージを背景のように扱います。それは繊細で快適でありながら地味であるべきです。

  • 慎重に、繊細な傾斜をつけます。コントラストを減らした配色は繊細な傾斜は１つの統一されたトーンとして平坦にし、表示されるようになるはずです。

  • バンディング（プリンタで印刷するときにトナーが少ないなどの理由で濃淡の縞が発生すること）の確認のためにもSurfaceのディスプレイで色調の傾斜をテストしてください。

  • 実験や反復そして探索はSurfaceのディスプレイの特性を良く理解することになります。先入観を持たずに、確立された配色パターンに対して、新たなアプローチをとってください。

b. Surfaceカラー

管理者はSurfaceのカラースキームのデフォルトを制御します。国際的なカラースキームはアプリケーションでレンダリングされるSurfaceコントロールのデフォルトカラーを決定します。アプリケーションの追加要素のスタイルにも同じ配色を使用することができます。また一方で、それらを使ったアプリケーションのいくつかの要素に影響を及ぼすSurfaceカラーを上書きすることができます。

Surfaceには既に定義された4つの配色パターンがあり、Microsoft.Surface.Presentation.Palettes名前空間で定義されています。

  • Light palette
  • Dark palette
  • LightHighContrast palette
  • DarkHighContrast palette

6. タイポグラフィー

Surfaceアプリケーションのタイポグラフィーは意味のある優雅でなくてはいけません。Surfaceの体験の中心にあるシンプルなインターフェイス要素とコンテンツを伴って、スクリーン上のテキストそれ自体がインターフェイスとしてさらに振る舞う機会を持ちます。

a. Segoe360

Segoe360はSurface用に特別に設計された書体です。Segoe360をアプリケーション内で使用を強く推奨される理由は以下の通りです。

  • Segoe360は3つの大きさ（レギュラー、イタリック、ボールド）があります。

  • Segoe360のレギュラーは、Segoe UIとSegoe UI Semiboldの間の新しい大きさであり、Surfaceでより存在感を持つように設計されています。

  • 文字はどのアングルから見ても区別しやすいように変更され、どの方向からも読みやすくなりました。例えば、小文字のl（エル）は大文字のI（アイ）よりもより区別しやすくなり、小文字のq（キュー）は小文字のb（ビー）が回転した時よりも区別しやすくなっています。

  • トラッキング（全体の文字間隔）はより読みやすくするために増加し、スクリーンに最適化されました。特に小さな文字に対して。

  • カウンター（aやeのような文字の閉じているエリア）は小さいサイズでも可視性が保たれるように広くしました。

  • Segoe360は西ヨーロッパや東ヨーロッパ、トルコ、バルト、ギリシャ、キリルの文字セットをサポートしています。

Segoe360の最小サイズ

  • インターフェイス要素のラベルには12pt
  • 本文や文章には16pt

b. 書体の選択

SurfaceアプリケーションではSegoe360が推奨されますが、常に個々のブランドやシナリオにフィットするわけではないかもしれません。

代替の書体を選択する際には、回転や視認性、適用性を考慮する必要があります。サンセリフ体（文字の端にある飾りがない書体のことです）は概してセリフ体（逆に飾りがある書体のこと）よりも推奨されます。わずかな飾りや横幅の一貫性、そして気前のよいナビゲーションスペース（？）が理由です。Surfaceに代替の書体を選定して使用する時は充分に注意してください。最終的な選考の前にSurfaceのディスプレイで可読性を必ずテストしてください。

  • アプリケーションの開発中、その前から、全てのアングルでテキストのレンダリングを評価してください。

  • 全てのを大文字か小文字で使用するのは避けてください。文章の場合、大文字はより自然に、読みやすく、めったに挑戦的なトーンを伝えません。

  • セリフ体が視覚のブランドエクスペリエンスの無くてはならない一部であれば、可読性を高めるために30ptかそれ以上に設定してください。

  • ハイコントラストな植字は可読性を損ないます。黒背景に白い文章は縁がざらつき、かわいそうなリーディングエクスペリエンスとなります。

  • 曲線状のパスに沿って文章を配置することは避けてください。

  • ほとんどのSurfaceのオブジェクトとコントロールは自由なスケールを持つことを忘れないでください。最小スケール限界を実行したオブジェクトは最大テキストの可読性を維持する必要が時々あります。

  • フォントレンダリングのテストをSurface自身で行うことの代わりはありません。読みやすさのテストは行わなければなりません。文章が回転や拡縮しているときもです。

フォントサイズの最小の選択肢

  • インターフェイス要素のラベルには12pt

  • 本文や文章には16pt

  • 軽い書体（薄いか狭い幅）には30pt

  • セリフ体（文字の線の終わりにある"拡張"を含むもの - ひげのこと）には30pt

7. イコノグラフィー

アイコンはエクスペリエンスを支えることができますが、使用する意図が必要です。

a. 視覚的な手がかりとしてのアイコン

アイコンは視覚的に機能を伝えることに役立ちます。ボタンや他のコントロールの機能は常にユーザーにとって明らかでは限りませんし、小さなコントロールの上でテキストラベルを使うことが常に適してるとは限りません。そのような場合には、シンプルでありながらアイコンはテキストボタンラベルの補足として使用することができます。40個以上のサンプルセットがSurface 2.0 SDKで配布されています。

適切なダイレクトタッチインタラクションが可能である場合には、機能の手がかりとしてアイコンを使用したり、アイコンボタンを使用しないでください。例えば、ランチャーの隅に置かれた回転ボタンを配置するより、すでにランチャーは回転しやすくあります。ランチャーはユーザーに操作を促すために繊細な回転矢印を使用しています。

b. カスタムアイコンの作成

もしアプリケーションでサンプルアイコンに含まれていないアイコンが必要であれば、次のカスタムアイコン開発のガイドラインに従ってください。

  • アイコンはシンプルな矩形でなくてはいけません。

  • アイコンは限らせた細かさでなくてはいけません。

  • アイコンは拡縮可能でなくてはいけません。

  • アイコンは現実世界のメタファーを利用しなければいけません。

  • アイコンは同じよう重量感でなくてはいけません。

8. モーションデザイン

モーションデザインはどのようにものがスクリーン上を動くのかを定義した、Surfaceのエクスペリエンスの重要な１つです。アニメーションは常にコンテンツと全体の体験をサポートします。モーションデザインは「アニメーション」と「感情、エネルギー、コネクションそして反応性を伝える効果」を提供します。それらは視覚的なヒント、行動を促すきっかけ、コンテンツの探索を招待することを提供します。

a. トランジション

トランジションは文脈を与え、ユーザーがどこにいるのかの視覚的なヒントを提供します。それらはユーザーがメンタルマップを作成する助けになります。どのようにコントロールを使うのか、長く表示されていない時でも、スクリーン上のどこにオブジェクトがあるのかを忘れないために、トランジションは助けになります。![](/images/surface/066.png" width=“480”/>

トランジションはナビゲーションコンテキストを提供する深度を利用した幾つかのモード（アトラクト・ランチャー・アプリケーション）の間を移動するモデルとなります。例えば、ランチャーに入るためにアトラクトを離れたときに、アトラクトはZスペースを押しのけます（ランチャーの後ろに移動します）。ランチャーからアプリケーションを起動したときに、ランチャーはZスペースを戻り、アトラクトはもっと遠くに戻ります。これはユーザーに体験を通して移動する方法に関する重要な文脈を提供します。

トランジションの言語や機能や文字、スタイルが適したモデルを開発します。開発中のアプリケーションの種類を検討し、フィットして適したトランジションを作成してください。

ゲームで発生するトランジションは楽しく面白くあるでしょうし、健康管理アプリケーションでのトランジションは手短に簡潔であるべきでしょう。

トランジションがしなければならないこと：

  • シームレスであること
  • 意味を持つ
  • 参考になる
  • 適切である
  • 時間に注意してください。コンテンツにアクセスするためだけに長いトランジションを強要させユーザーにフラストレーションを与えないでください。
  • 前後関係のあるナビゲーションを用意してください。
  • アプリケーションの物語を強化してください。

b. 視覚的なヒントのためのトランジション

モーションデザインはユーザーが観察を通して即座に学べるツールを提供します。チュートリアルや長ったらしいデモンストレーションを無しで。

例えば、ランチャーが後ろのフェードインしてくるコンテナーをロードしている時に、アプリケーションアイコンはスライドし、背景のコンテナーの端に到達したらアプリケーションのアイコンは縮みます。ユーザーはこの動き見て、見えてるものよりもオプションがあることを理解します。スライドの動きはコンテンツがスクロール可能だということのヒントになります。

もし、ランチャーのコンテナーがスクリーン上にトランジションもなく突然現れたりしたら、難しくもないのに動かないように見えてしまいます。ユーザーにコンテンツが移動可能で、現在表示されているものよりも多くのオプションが使用可能だということを知らせることは難しいでしょう。そのため、視覚的に機能を示唆する方法のためにトランジションを使用することには、ともて価値があります。

c. アニメーションのガイドライン

アニメーションガイドラインはユーザーにどのようにしてタスクを達成するための特有のタッチ操作を行うのかを教えます。それらは、特定のボタンアイコンやコンテンツの一部で使われ、ユーザーへ視覚的にタスクを説明するためフィードバックを提供する方法を伝えます。

例えば、アクセスポイントはユーザーに特定のタッチ操作を教えるためにアニメーションガイドラインを使用します。誰かがアクセスポイントをタッチしたとき、視覚的なインジケーターやアクションワードがアクセスポイントから外に動きます。もしユーザーがアクセスポイントをスライドするか、アクションワードをタップしたら、それらがSurfaceの次の体験へと誘導します。

d. 周囲のアニメーション

アンビエントアニメーションは、システムが生きて、起動、待機していることを示すために使用される繊細なアニメーションです。それらは、ブランドとアプリケーションの魅力を強化することができます。アンビエントアニメーションはあえて控えめで上品で、繊細で自然なエフェクトを使用します。

背景の繊細なアンビエントアニメーションはSurfaceのエクスペリエンスに明るい本質を与えます。ユーザーにアプリケーションがレスポンスティブで動いていることを確実にするためにアンビエントアニメーションを使用してください。

セクション 3.3: サウンドデザインガイドライン

Surface向けのサウンドデザインはSurfaceのデザイン原則から大きく引き出さなければいけません。アプリケーションでサウンドを使用するか作る場合に、次のガイドラインを忠実に守ってください。

  • シンプルで繊細なサウンドにしてください。

  • サウンドが本当のデジタルであることを保証してください。

  • 思慮深いサウンドを使用してください。サウンドはしばしば公共な場で聞こえづらいことがあります。もしサウンドが高圧的であったり、ユーザーの気に障るようであれば、ユーザーがスピーカーをミュートにするかアプリケーションを削除できるようにしてください。

  • サウンドはSurfaceShellやランチャーでのサウンドでも一貫性のあるボリュームにしてください。もしサウンドがアプリケーションのまっただ中で突然上がったら、ユーザーがスピーカーをミュートにするかアプリケーションを削除できるようにしてください。

セクション 3.4: 言語と文章のデザインガイドライン

Surfaceの体験は基本的にわずかなインターフェイステキストを要求しますが、これは開発しているアプリケーションにより変化するでしょう。文章はコンテンツ指向であり、思慮深く使用されるべきです。