Общие сведения об адаптивных карточкахAdaptive Cards Overview

Адаптивные карточки — это открытый формат обмена данными, который обеспечивает унифицированную и согласованную передачу содержимого пользовательского интерфейса между разработчиками.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.

ЦелиGoals

Цели, которых можно достичь с помощью адаптивных карточек:The goals for Adaptive Cards are:

  • Портативность. Карточки подходят для любого приложения, устройства и инфраструктуры пользовательского интерфейса.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
  • Автоматическая стилизация. Карточки адаптируются к интерфейсу ведущего приложения и стилю бренда.Automatically styled - To the Host application UX and brand guidelines

Для разработчиков карточекFor Card Authors

Адаптивные карточки — отличный вариант для разработчиков:Adaptive Cards are great for card authors:

  • Одна схема. Вы работаете с одним форматом, что сводит к минимуму затраты на создание карточки и максимально расширяет область применения.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.
  • Соответствие внутренним показателям производительности. Вы обеспечиваете соответствие своим показателям производительности, так как карточки ориентированы непосредственно на вашу инфраструктуру пользовательского интерфейса.Native performance - You get native performance as it targets your UI framework directly.
  • Безопасность. Содержимое доставляется в виде защищенных полезных данных, чтобы вы не открывали свою инфраструктуру пользовательского интерфейса для необработанных данных разметки и скриптов.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

Мы стремимся сделать адаптивные карточки выразительными и универсальными, но не хотим создавать инфраструктуру пользовательского интерфейса.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 2019Build 2019 Session

Приведенный ниже семинар на конференции Microsoft Build демонстрирует различные варианты использования адаптивных карточек.The following session at the Microsoft Build conference showcases Adaptive Cards in a variety of use cases.