A Different Way to Create the Microsoft Viva Connections App Package

Posted on April 1st, 2021

Background

If you're just tuning in now, this post is one in a series I'm working on on better understanding and customizing the Connections app in the Microsoft 'Viva' family of 'Employee Experience' apps for Teams (if you're not familiar with Viva Connections, here's a short overview video from Microsoft).

Important Repitition:

I covered this in my last post but it's really important to restate: Microsoft has provided a detailed guide to setting up Viva Connections. Inside they list a few optional-but-highly-recommended "pre" steps to getting Viva Connections up and running. Basically, Viva Connections is about embedding a SharePoint Modern Communications site into a custom side-loaded app into Teams. As a result, you need to actually have a SharePoint site to embed. In addition, because this Viva Connections app is likely going to be rolled out to your entire company, it makes sense to set up and use a site that is configured as a Home Site.

Even if you decide to ignore those and just embed a standard Modern Communication site, you'll still need to generate the pacakge for Viva Connections, so let's dive into that.

Building Viva Connections

Once the aforementioned two "prerequisite" steps are done, Step 3 and 4 in the guide speak about using PowerShell to create the deployment package. It links to this script and also requires you to download the 'SharePoint Management Shell' for PowerShell. However, if that's not something you're comfortable doing, there's good news - there's a way to skip all this and create your app package manually. This package is doing nothing more than creating a custom App Package for Teams - very similarly to the same kind as if you were developing your own internal company Teams app, using App Studio or Visual Studio or heck, even Notepad. This document describes the package in more detail. In a nutshell, this app package consists of a single zip file with three contained files:

  1. A manifest.json - this is a file structured using the "JSON" notation (a way to define a document that's computer-readable but also human-understandable)
  2. A larger icon to appear in certain context menus in Teams
  3. A smaller icon to appear in the left menu so users can actually access "Viva Connection" (or whatever you choose to call your own internal version of it)

I mentioned above that there is at least one other way to get to this final output. I'll cover another one in another post, but here's one option for now at least, that can bypass the PowerShell approach. Essentially, I've put together a sample manifest. Download it and just modify as you like (provided you know what you're doing!) or, if you'd like to see the final version, here is the same file together with some sample "Contoso" icons already packaged into a zip file. Most important is to make sure the web addresses match your tenant, especially the parts I've marked "MyTenant" (do a find-and-replace to get them all).

Warning: There is some risk using this approach! Because it's not the 'official' way to generate the package, there's a chance that Microsoft might change what the PowerShell script does (i.e. what the final manifest looks like - as an example, the searchUrl property only got released in version 1.8 of the manifest file). As a result, use with caution, but I'll try keep this file updated over time if/when any major changes occur.

If you'd like more info on what all these bits in the manifest do, see my earlier post on the topic.

For the rest of the steps to getting the app deployed, you can go back to the guide and carry on from Step 5.