Viva Connections is the new gateway to other Viva services within Microsoft’s new suite of employee experience tools and resources. The Dashboard, specifically, shows users little summaries of other Viva services as a way conveniently track one metrics and jump right into relevant resources.
Administrators can create their own Cards for the Dashboard, by adding Card designer Cards to the Dashboard. These take any Adaptive Card schema that you can make yourself from scratch or by editing one of the many templates that are available.
However, this built-in Card designer Card has no way to connect to any data sources from apps like Salesforce, ServiceNow, Github, Jira etc. So in this article we’re going to take a look at how you can integrate any of your favorite workplace apps for Viva Dashboard.
Adding apps to your Viva dashboard
The magic word is Card maker. This is another Card that’s similar to the one that’s built-in, but actually draws in live data from your apps. Simply add it from the App Source store to your SharePoint instance, and then add the Card maker Card to your dashboard.
Once you’ve added the Card, click the pencil icon to enter the configuration pane. You will see that there is a Generate a Card Share URL button that will generate a unique ID for your Card. Click that and you’ll be brought to the (so far empty) Adaptive Card designer. In the next steps we’ll now focus on ways you can bring in your apps into this Viva Connections.
Option 1: Browsing apps that have built-in Adaptive Cards
To start the easiest option would be to add an app that already comes with a fully thought-out Adaptive Card. All you do with any of them is link them with your account and you’re done. Browse available apps →
Let’s say for our example we go with Github, so we go to that app listing and click on Install now. This will put the Github Card on your Digital Assistant Board, where you then click on Link accounts to sign into your Github account.
How to connect to an app
This will show you one of those familiar authorization screens that you need to complete. For other apps, the process would be similar.
Then you’re back to your Board and your Card should now show some Github issues that are assigned to you. Now you have a choice, either you refine your Card design in the Adaptive Card designer, or you take the Card as is.
If you choose to edit it, click on the ··· button in the top right-hand corner of the Card and then on Edit in Designer. If you’re happy with the way it is, simply click Share.
This will generate the Card Share URL you will need to copy and then paste into the configuration pane of your Viva dashboard Card maker Card.
And that’s it, your first Adaptive Card connected to a 3rd party app on Viva dashboard.
Option 1½: Refine the Adaptive Card
If you above you elected to Edit in Designer, you will be entering the Adaptive Card designer where you can make modifications (see how in this guide). This designer also has the same Share menu that lets you copy and paste the unique Card Share URL to your Viva Connections dashboard.
Option 2: Start with an Adaptive Card template instead
Apart from apps with built-in Adaptive Cards, you can also make your own Cards and then pick a Connector. This gives you more options of interactive Cards that you can customize even further to create a bespoke experience for your users. To start, browse from over 20 available templates and then click Open this Adaptive Card below whatever Card best suits your needs.
Then, once in the Adaptive Card designer, just click on the Connect to data source button and select your desired app to connect with. If not connected already, you’ll be prompted to do so automatically.
All the Adaptive Card samples support the Card view (called Summary view) and Quick View that Viva Connections dashboard supports. You can browse available apps from the App Directory.
Option 3: Generate an Adaptive Card from Zapier
Another alternative to get Adaptive Cards from your favorite apps into Viva Connections Dashboard is to pick one of the thousands of apps the automation platform Zapier offers. You can generate Adaptive Cards lists in Zapier using the Digital Assistant Zapier app. Just use this as the “action” block when editing your Zap and any app can be transformed into an Adaptive Card list.
Once your trigger app gets triggered the first time, your new Adaptive Card list will automatically show up on your Digital Assistant Board. As above, you can simply invoke the Share menu, receive your Card Share URL and paste into a new Card maker Card on your Viva Connections dashboard.