Extend your meeting experience with custom meeting apps (V1)

1. 28. January 2022 | #TeamsCommunityDay | teamscommunityday.de | @TeamsDay

2. 28. January 2022 | #TeamsCommunityDay | teamscommunityday.de | @TeamsDay

3. 28. January 2022 | #TeamsCommunityDay | teamscommunityday.de | @TeamsDay

4. Microsoft
Teams Meeting
Apps
Extend your meeting experience with
custom apps

5. About me
• Markus Moeller
• Microsoft 365 Developer Expert
• Microsoft MVP
• Avanade Germany
• @moeller2_0
• https://mmsharepoint.wordpress.com
• Proud dad of 1 (2yrs)

6. 28. January 2022 | #TeamsCommunityDay | teamscommunityday.de | @TeamsDay
Vielen Dank an unsere Sponsoren!
Many thanks to our sponsors!
Join us at ScriptRunner Lounge

7. Agenda
• Teams extensebility – Overview
• Meeting Apps
• Pre-/Post-Meeting Experience
• In-Meeting Experience
• Stage View
• Meeting Lifecycle

8. Bots
Help users get tasks done in calls,
conversations and online meetings
Connectors
Post rich updates to channels
Personal apps
All content across all teams
and channels in one place
Tabs
Surface rich content within
Teams
Activity feed
Engage users via feed
notifications
Messaging extensions
Allow users to query and share
rich cards in conversations
Scope
of
Teams Development
Meeting Apps
Enhance online Meeting
experience with Tabs and bots
MS Graph
Gateway to your data in
Microsoft cloud

9. Meeting Experience
Pre-Meeting, Post-Meeting, In-Meeting

10. A Teams Meeting App
recording and playback
participant names
helping with
pronunciation

11. Prerequisites
• A meeting with at least one participant
• A physical Teams Desktop client for in-meeting side panel
• Device permissions (when using mic or camera)
• A Teams Tab app with specific
• Teams manifest

12. Options for Teams Meeting Apps (Tabs)
• Pre-Meeting / Post-Meeting experience
• In-Meeting experience
• Currently modern physical desktop Teams client only
• Side Panel
• Dialog box
• Stage (initiated from side panel but shared for all)

13. Tab manifest

14. Meeting Stage
Sharing in stage view

15. Vote for a movie in side
panel and watch it
“together” in meeting’s
stage view

16. Prerequisites
• A meeting with at least one participant
• A physical Teams Desktop client for in-meeting side panel
• You also cannot share from mobile clients right now
• Although see shared app in browser, too, „frameContext“ is not detected right
...
• A Teams Tab app with specific
• Teams manifest
• App in stage view has individual runtimes per user
• Sync needs to be implemented!

17. Meeting Lifecycle
Action when a meeting starts or ends

18. Requesting emoji
feedback
at the end of a meeting
with a Teams Meeting
lifecycle event bot

19. Prerequisites
• A Teams channel enabled Azure bot
• A meeting with at least one participant
• Permissions to access the chat (for the bot)
• Client „developer preview“ enabled
• A Teams Bot app with specific
• Teams manifest

20. The manifest
{
"$schema": "https://developer.microsoft.com/en-us/json-schemas/teams/v1.9/MicrosoftTeams.schema.json",
"bots": [
{
"botId": "{{MICROSOFT_APP_ID}}",
"needsChannelSelector": true,
"isNotificationOnly": false,
"scopes": [
"team",
"personal",
"groupchat"
]
}
],
"webApplicationInfo": {
"id": "{{MICROSOFT_APP_ID}}",
"resource": "https://RscPermission",
"applicationPermissions": [
"OnlineMeeting.ReadBasic.Chat"
]
}
}

21. Code snippets

22. Detect frameContext

23. The meeting ID

24. Handling meeting events (lifecycle)

25. Resources I – Pre-/Post-/In-Meeting Experience
• https://mmsharepoint.wordpress.com/2021/09/07/meeting-apps-in-
microsoft-teams-1-pre-meeting/
[BlogSeries]
• https://github.com/pnp/teams-dev-samples/tree/main/samples/tab-
meeting-record-name -
[PnP Sample]
• https://github.com/mmsharepoint/tab-meeting-stageview-vote-movie
[Vote Movie sample]
• https://docs.microsoft.com/en-us/microsoftteams/platform/apps-in-
teams-meetings/teams-apps-in-meetings
[Microsoft Documentation]

26. Resources II – Meeting Lifecycle
• https://mmsharepoint.wordpress.com/2021/10/09/meeting-
feedback-with-microsoft-teams-meeting-app/
[BlogPost]
• https://github.com/pnp/teams-dev-samples/tree/main/samples/bot-
meeting-lifecycle-feedback
[PnP Sample]
• https://docs.microsoft.com/en-us/microsoftteams/platform/apps-in-
teams-meetings/create-apps-for-teams-meetings?tabs=dotnet#real-
time-teams-meeting-events
[Microsoft Documentation]