Want to embed Microsoft Teams in your app? Here’s how

Tomas Chladek

Daniel Carrasco

During our session at Ignite 2022 this year, From low code to pro code: building collaborative apps to power an evolving workplace, we are showcasing how developers can integrate Microsoft Teams capabilities into custom applications by leveraging the Microsoft ecosystem.

By using Azure Communication Services and Microsoft Graph APIs, this experience demonstrates how audio, video, telephony, meetings, chat, SMS, email, calendars, presences, and user discovery can be used to build a custom app to allow communication and collaboration with external customers and employees. A powerful aspect of this scenario is that Teams users and non-Teams users interact with each other on the same platform.

Taking the first steps to creating an application like this may seem intimidating. But we’re here to show you how.

Fictional application showing details for communication between Teams users and external customers

Building blocks to create a collaborative app, powered by Microsoft Teams, Azure Communication Services and the Microsoft Graph API

Here’s a breakdown of the building blocks powering individual demonstrated capabilities so you can pick and choose what you need for your app and start building your own.

Integrating Teams Phone capabilities

Let’s start by integrating Teams Phone capabilities. In our demo, we showed an embedded dialpad to represent phone capabilities for Teams users, allowing them to place and receive calls, transfer calls, and mute or unmute calls. This embedded experience is now possible thanks to Azure Communication Services Support for Teams users allowing developers to integrate telephony into custom apps and leverage the Teams phone number assigned to Teams users. You can utilize calling APIs of Azure Communication Services to perform one-to-one and group phone calls as Teams user with this feature, while honoring assigned Teams user policies.

 

Adding Teams Phone capabilities

Adding Teams Phone capabilities

Integrating Teams meetings capabilities

Whether you want to have a meeting with customers (non-Teams users) or interacting with colleagues (Teams users), you can achieve this by enabling communication as external users from Azure Communication Services. And by working with the Microsoft Graph API, you can schedule Teams meetings with the OnlineMeeting APIs and invite participants to the encounter.

Moreover, with the Calling APIs of Azure Communication Services, you can control ongoing calls directly from the custom application. This allows you to add and remove participants, enable/disable video, share screen, mute/unmute and many more.

Calling controls from meetings

Calling controls from meetings

Other Teams users can join the same session and interact seamlessly with internal and external people from their Teams app when you enable this functionality. Teams users would also see all calls, meetings and chat in their Teams client history. In addition, the Teams Admin Center will track all calls made with the custom application.

 

Screen sharing experience

Screen sharing experience

Integrating Teams chat

Instant messaging is a key functionality of any custom app, especially when Teams users want to communicate and collaborate in the moment. To embed this capability, you can leverage the Messages API in Graph. With this API you can send and receive Teams messages, add mentions, share attachments, inline-images, cards and all the functionalities instant messaging in Teams has to offer.

Teams chat capabilities

Teams chat capabilities

Integrating Teams user presence and org information

Because communicating is just a component of effective collaboration, you can complement Azure Communication Services features with the richness the Graph API has to offer. You can, for example, integrate capabilities into your app to provide richer information for users, such as finding the right employee. You can fetch and filter specialists in a specific topic by searching the company directory roles of people in your organization. You can get this information via the User API of Microsoft Graph API and do additional filtering based on the Presence API of Microsoft Graph API. After identifying who is the proper specialist, you can list more details about the user with the User API of Microsoft Graph API mentioned before. Initiation of the communication is then connected to a simple chat, call or Teams meeting.

Presence and organizational information

Presence and organizational information

Extending Teams capabilities with SMS and email notifications

Azure Communication Services brings exciting capabilities that boost Teams functionalities to very useful scenarios. For instance you can send and receive SMS notifications by leveraging the SMS APIs of Azure Communication Services. You can also leverage Email notifications functionality to send emails as an organization. You can achieve this with Email APIs of Azure Communication Services.

You can also leverage the Mail Microsoft Graph API to send and receive an email as Microsoft 365 user to more user specific scenarios.

After the subject and the message body is provided, you can use those APIs to customize, standardize and deliver the message within selected channels to the customer.

 

Multichannel experience with SMS and email

Multichannel experience with SMS and email

Adding calendar

Finally, you can get upcoming events from CalendarView APIs of Microsoft Graph with the details about upcoming meetings such as title, organizer, attendees, time and location. This information allows you to customize and tailor the experience to the flow of your users.

Image ACS ignite blog image 8

Basic calendar capabilities

Summary

As you learned in this blog, with Azure Communication Services and Microsoft Graph, you can enhance your product and integrate Teams embed capabilities (and more) into your app, delivering audio, video, telephony, meetings, chat, email, SMS, calendars, and insights for your customers.

As a recap:

Image Summary min

Action center for omnichannel communication

With these powerful APIs you can extend your application customized to the individual users and organizational processes with ease. You can customize the user interface to match your brand and theme.

There’s more!

There’s more to come. We’re excited to announce that we’re going to be publishing a series of content on how to build these experiences!

Each episode will focus on a specific capability with best practices and opportunities to maximize your value, so stay tuned for more.

What new experiences are you building next? We can’t wait to see them. And, be sure to check out other developer capabilities from Azure Communication Services announced at Ignite here.

0 comments

Discussion is closed.

Feedback usabilla icon