アダプティブ カードの概要Adaptive Cards Overview

アダプティブ カードは、カード交換のオープン フォーマットであり、開発者は一貫性のある共通した方法で UI コンテンツを交換できます。Adaptive Cards are an open card exchange format enabling developers to exchange UI content in a common and consistent way.

そのしくみHow they work

カードの作成者は、単純な JSON オブジェクトとしてそのコンテンツを記述します。Card Authors describe their content as a simple JSON object. 次に、ホストの見た目や操作感に自動的に対応して、そのコンテンツはホスト アプリケーション内でネイティブにレンダリングされます。That content can then be rendered natively inside a Host Application, automatically adapting to the look and feel of the Host.

たとえば、Contoso ボットは、Bot Framework からアダプティブ カードを作成でき、Skype に配信されると Skype カードのような見た目と操作感になります。For example, Contoso Bot can author an Adaptive Card through the Bot Framework, and when delivered to Skype, it will look and feel like a Skype card. その同じペイロードが Microsoft Teams に送信されると、Microsoft Teams のような外観になります。When that same payload is sent to Microsoft Teams, it will look and feel like Microsoft Teams. アダプティブ カードのサポートを開始しているホスト アプリが増えるなか、その同じペイロードはこれらのアプリケーションの中で自動的に区別されるものの、そのアプリに対しては完全にネイティブのようになります。As more host apps start to support Adaptive Cards, that same payload will automatically light up inside these applications, yet still feel entirely native to the app.

ユーザーは使い慣れた操作感に満足でき、Users win because everything feels familiar. ホスト アプリではユーザー エクスペリエンスを制御できます。Host apps win because they control the user experience. また、カードの作成者も、追加の作業を行わなくても、より多くの人にコンテンツを届けることができます。And Card Authors win because their content gets broader reach without any additional work.


アダプティブ カードの目標は次のとおりです。The goals for Adaptive Cards are:

  • ポータブル - どのようなアプリ、デバイス、および UI フレームワークでも可能Portable - To any app, device, and UI framework
  • オープン - ライブラリとスキーマはオープン ソースで、共有されますOpen - Libraries and schema are open source and shared
  • 低コスト - 定義と使用が簡単Low cost - Easy to define, easy to consume
  • 表現力豊か - 開発者が好むロングテールのコンテンツを対象としていますExpressive - Targeted at the long tail of content that developers want to produce
  • 純粋な宣言型 - コードは必要ありませんPurely declarative - No code is needed or allowed
  • 自動スタイル設定 - ホスト アプリケーションの UX およびブランド ガイドラインに対応Automatically styled - To the Host application UX and brand guidelines

カードの作成者の場合For Card Authors

アダプティブ カードは、カードの作成者にとって最適です。Adaptive Cards are great for card authors:

  • 1 つのスキーマ - 単一のフォーマットにより、カードの作成にかかるコストを最小限に抑え、使用できる場所の数を最大化します。One schema - You get a single format, minimizing the cost of creating a card and maximizing the number of places it can be used.
  • より豊かな表現力 - ペイント用の豊富なパレットが揃っているため、コンテンツを自分の表現したいものに近づけることができます。Richer expression - Your content can more closely align with want you want to say because you have a richer palette to paint with.
  • 広範なリーチ - コンテンツはより広範なアプリケーションに届きます。新しいスキーマを学習する必要がありません。Broad reach - Your content will work across a broader set of applications without you having to learn new schemas.
  • 入力コントロール - カードを表示しているるユーザーからの情報を収集するための入力コントロールをカードに含めることができます。Input controls - Your card can include input controls for gathering information from the user that is viewing the card.
  • ツールの強化 - オープン カード エコシステムは、だれとでも共有されるより優れたツールを意味します。Better tooling - An open card ecosystem means better tooling that is shared by everyone.

エクスペリエンスの所有者の場合For Experience Owners

アダプティブ カードは、サードパーティ コンテンツのエコシステムを活用したいアプリ開発者に最適です。その理由は次のとおりです。If you are an app developer who wants to tap into an ecosystem of third-party content you will love Adaptive Cards because:

  • 一貫したユーザー エクスペリエンス - レンダリングされるカードのスタイルを所有しているため、ユーザーに一貫したエクスペリエンスを保証できます。Consistent user experience - You guarantee a consistent experience for your users, because you own the style of the rendered card.
  • ネイティブ パフォーマンス - UI フレームワークが直接対象とされるため、ネイティブ パフォーマンスが得られます。Native performance - You get native performance as it targets your UI framework directly.
  • 安全 - コンテンツは安全なペイロードで配信されるため、UI フレームワークを生のマークアップやスクリプトに開く必要がありません。Safe - Content is delivered in safe payloads so you don't have to open up your UI framework to raw markup and scripting.
  • 実装が簡単 - シェルㇷ ライブラリの使用をやめて、サポートされた任意のプラットフォームで簡単に統合できます。Easy to implement - You get off the shelf libraries to easily integrate on any platform you support
  • ドキュメント不要 - 独自のスキーマを考案、実装、文書化する必要がないため、時間を節約できます。Free documentation - You save time because you don't have to invent, implement, and document a proprietary schema.
  • 共有ツール - カスタム ツールを作成する必要がないため、時間を節約できます。Shared tooling - You save time because you don't have to create custom tooling.

核となる設計原則Core Design Principles

アダプティブ カードは、設計を順調に進めるために役立つ一連の指針によって動作します。Adaptive Cards are driven by a set of guiding principles that have been useful for keeping the design on track.

ピクセル パーフェクトではなくセマンティックSemantic instead of pixel-perfect

純粋にピクセル パーフェクトなレイアウトではなく、できる限りセマンティックな値と概念に向けて取り組んできました。We have striven as much as possible for semantic values and concepts as opposed to pure pixel-perfect layout. セマンティックな表現の例が、色、サイズ、そして FactSet や ImageSet などの要素に表れます。Examples of semantic expression show up in colors, sizes, and in elements like FactSet and ImageSet. これらすべてにより、ホスト アプリケーションは、実際の外観についてよりよい決定を行えます。These all allow the host application to make better decisions about the actual look and feel.

カードの作成者はコンテンツを所有し、ホスト アプリケーションは外観を所有Card Authors own the content, Host App owns the look and feel

カードの作成者は伝えたいものを所有しますが、それを表示するアプリケーションはそのアプリケーションのコンテキストでカードの外観を所有します。The card authors own what they want to say, but the application displaying it owns the look and feel of the card in the context of their application.

シンプルなのに表現力豊かKeep it simple, but expressive

アダプティブ カードを表現力豊かで汎用的なものにしたいが、UI フレームワークを作成したくはありません。We want Adaptive Cards to be expressive and general purpose, but we don't want to build a UI framework. 目標は、Markdown がドキュメントに十分に表現力豊かであるのと同様に "十分に表現力豊か" な中間レイヤーを作成することです。The goal is to create an intermediate layer which is "expressive enough" in the same way Markdown is expressive enough for documents.

シンプルかつ表現力豊かであることを重視して、Markdown は、ドキュメント コンテンツの簡単で一貫した説明を作成しました。By focusing on keeping it simple and expressive, Markdown created an easy and consistent description of document content. 同様に私たちは、アダプティブ カードでは、カード コンテンツを説明する表現力に富んだ簡単な方法を作成できると考えています。In the same way, we believe that Adaptive Cards can create a simple, expressive means of describing card content.

迷ったら放っておくWhen in doubt, keep it out

後で追加するほうが、間違ったまま進むより簡単です。It is easier to add later than it is to live with a mistake. 何かを追加したほうがよいか迷った場合、追加しないことを選択しました。プロパティを追加する方が、サポートしなくてもよかったレガシでやっていくのより常に簡単です。If we found ourselves debating whether we should add something or not, we opted to leave it out. It is always easier to add a property than to live with a legacy we wish we didn't have to support.

Build 2019 セッションBuild 2019 Session

Microsoft Build カンファレンスの次のセッションは、アダプティブ カードのさまざまな使用事例を紹介します。The following session at the Microsoft Build conference showcases Adaptive Cards in a variety of use cases.