Microsoft Teams mockups / stencils for Adobe XD

Brass Contributor

Dear all, 

there are many references to the Teams app design guidelines and UI components already. However, there seems to be a lack of templates and stencils for UX designers using Adobe XD. Therefore I started to rebuild some of the layouts and components and want to share them here. 

Please note that I am no XD expert but use the application frequently to illustrate app concepts and create mockups quickly. I hope you'll find them useful as well. 

SAP C4 Integration – 2@2x.png

Microsoft Teams - Meeting App Charm@2x.png

You can grap the XD file from my OneDrive since the community doesn't accept the file type: 
https://1drv.ms/u/s!AqtzHS39l1K0kMR_1X8BJOMVpIwKjA?e=DBmSPs 

Regards,
Martin 

P.S. I'll try to include the icons soon. If anyone has a good source for this or any feedback in general please let me know. 

4 Replies

@Martin Müller 

Thankyou very much!

This looks awesome.
I also found these resources from Microsoft you might find helpful.
Icons: https://www.figma.com/community/file/836835755999342788
Microsoft Documentation:
https://docs.microsoft.com/en-us/microsoftteams/platform/concepts/design/design-teams-app-fundamenta...