Pro User
explore our new search
Viva Connections: Effective Design Samples for Adaptive Cards
Viva Connections
Feb 3, 2023 11:30 AM

Viva Connections: Effective Design Samples for Adaptive Cards

by HubSite 365 about Microsoft

Software Development Redmond, Washington

Pro UserViva ConnectionsM365 Hot News

Discover exclusive Microsoft experts Adaptive Cards design samples for Viva Connections

In this 14-minute developer-focused demo, Alex Clark shares a brief overview of Viva Connections Dashboard and Cards along with the Adaptive Card samples repo. Add an Adaptive Card template to a Dashboard page. Populate template with JSON from Adaptive Card Designer. Learn about Card JSON (the design) and Data JSON file (static data). Not shown is building out more robust “custom” cards – full SPFx ACE extensions that connect various end points, LOB systems, etc. Develop basic cards in Adaptive Card Designer or in VS Code.

Adaptive Cards are an open source design system used to create interactive and engaging experiences for users. Adaptive Cards for Viva Connections provide a library of pre-built card designs that can be used to quickly build custom experiences in the Microsoft Teams app. These cards have been designed with accessibility, scalability, and extensibility in mind so they can be adapted for use across multiple platforms and channels. Additionally, the cards are optimized for mobile devices making them easy to use on any device. With these cards you can easily add images, videos, buttons and other interactive elements into conversations or notifications within Teams.

This PnP Community demo is taken from the Viva Connections & SharePoint Framework Bi-weekly sync call recorded on January 12, 2023.

Demo Presenter

📺 Alex Clark (Microsoft) | @sharepointalex

Supporting materials