Chapter 07 - Design, Connect, and Engage: Embark on Your Journey with Adaptive Cards

Adaptive Cards Unleashed: Crafting Dynamic Interactions on Microsoft Teams and Beyond!

author image
Amit Puri

Advisor and Consultant

Posted on 01 Oct 23

Previous Chapter 07/11 Next Chapter

Adaptive Cards are a versatile way to present rich, interactive content across various platforms and applications. Designed with an open framework, these cards allow developers to create a single user interface (UI) that can be rendered consistently across multiple apps and services, such as Microsoft Teams, Outlook, and Windows Notifications. The content of an Adaptive Card is described using a JSON format, ensuring flexibility and customization. This means that, based on the platform or service, the card can adapt its appearance and functionality to provide the best user experience. Whether it’s collecting feedback through a survey, displaying dynamic content updates, or facilitating complex workflows, Adaptive Cards streamline user interactions, making them more engaging and intuitive. Their platform-agnostic nature ensures a consistent and seamless experience, regardless of where they are being viewed.

Adaptive Cards: Revolutionizing User Interactions in Modern Applications

Adaptive Cards are a modern UI framework that allows developers to create interactive and rich content that can be rendered consistently across various platforms and applications. In the context of Microsoft 365, Teams, and Power Platform, Adaptive Cards play a pivotal role in enhancing user interactions and streamlining workflows.

Adaptive Cards in Microsoft 365:

  1. Outlook Actionable Messages: Adaptive Cards can be integrated into Outlook emails as actionable messages. This allows users to interact with the content directly from their email, such as approving a request, filling out a survey, or updating a CRM entry without leaving the Outlook interface.
  2. SharePoint Integration: Adaptive Cards can be used within SharePoint lists and libraries, enabling dynamic content display and user interactions directly from SharePoint sites.

Adaptive Cards in Microsoft Teams:

  1. Bots and Conversations: Within Teams, Adaptive Cards can be used to enhance bot interactions. For instance, a bot can send an Adaptive Card to collect user input or display search results in a structured format.
  2. Task Modules: These are modal pop-ups in Teams. Adaptive Cards can be used within task modules to gather detailed input from users or display rich information.
  3. Meeting Extensions: Adaptive Cards can be integrated into Teams meetings, allowing participants to interact with content during the meeting, such as polls or feedback forms.

Adaptive Cards in Power Platform:

  1. Power Automate: Adaptive Cards can be used as part of Power Automate flows. For example, a flow can be set up to send an Adaptive Card to a Teams channel when a new item is added to a SharePoint list.
  2. Power Apps: While Power Apps has its UI framework, developers can integrate Adaptive Cards to display data or collect input in specific scenarios, especially when consistency across multiple platforms is desired.
  3. Power Virtual Agents: Adaptive Cards can enhance chatbot interactions in Power Virtual Agents, allowing for richer dialogues and more structured data collection.

Designing and Templating: Adaptive Cards are described using a JSON format, making them highly customizable. The Adaptive Card Designer, available online, offers a visual interface for creating and previewing cards. Additionally, the templating feature allows for dynamic content to be injected into cards, ensuring they can be reused in various contexts with different data sets.

Discover the various types of Adaptive Cards, encompassing universal cards and their specific actions. Dive into the utilization of Microsoft Graph and the crafting of adaptive cards, combined with task modules, to tackle challenges within Teams.

  • Get acquainted with the range of Adaptive Cards and their corresponding actions.
  • Explore card design, display, adaptive card generation, and template usage.
  • Grasp the synergy between adaptive cards and Microsoft Graph.
  • Uncover methods to embed adaptive cards within the Bot Framework.
  • Comprehend the role of adaptive cards in enhancing Outlook actionable messages.
Now, available on
Amazon Kindle Amazon Kindle
India UK Canada Australia

Adaptive Cards are transforming the way users interact with content across Microsoft 365, Teams, and Power Platform. By offering a consistent and interactive UI framework, they bridge the gap between various services and platforms, ensuring users have a seamless and engaging experience. As Microsoft continues to invest in this technology, it’s evident that Adaptive Cards will play an even more significant role in the future of collaborative work and business processes.

Read about the next chapter 08 - Empower Your Apps: Power Apps and Dataverse

Go back to chapters listing on Book - Citizen Development in Microsoft 365

Previous Chapter 07/11 Next Chapter

Review this book

Goodreads link

If you are interested in Citizen Development, refer to this book outline here on A Guide to Citizen Development in Microsoft 365 with Power Platform, Now, available on, Select the Amazon marketplace based on your location to purchase and read the book on Kindle or on the web
Amazon Kindle India Amazon Kindle US Amazon Kindle UK Amazon Kindle Canada Amazon Kindle Australia

If you wish to delve into GenAI, read Enter the world of Generative AI

Also, you can look at this blog post series from various sources.

  • Hackernoon
  • Hashnode
  • Medium
  • Stay tuned! on Generative AI Blog Series

    We are advocating citizen development everywhere and empowering business users (budding citizen developers) to build their own solutions without software development experience, dogfooding cutting-edge technology, experimenting, crawling, falling, failing, restarting, learning, mastering, sharing, and becoming self-sufficient.
    Please feel free to Book Time @ topmate! with our experts to get help with your Citizen Development adoption.

    Share on