{"id":5781,"date":"2021-01-20T14:42:35","date_gmt":"2021-01-20T22:42:35","guid":{"rendered":"https:\/\/officedevblogs.wpengine.com\/?p=5781"},"modified":"2021-01-20T14:42:35","modified_gmt":"2021-01-20T22:42:35","slug":"guides-and-tools-to-design-your-microsoft-teams-app-effectively","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/guides-and-tools-to-design-your-microsoft-teams-app-effectively\/","title":{"rendered":"Guides and tools to design your Microsoft Teams app effectively"},"content":{"rendered":"

Design matters.\u00a0That\u2019s why\u00a0<\/span>we\u2019re sharing<\/span>\u00a0<\/span>the\u00a0<\/span>new<\/span>\u00a0<\/span>Microsoft Teams UI Kit<\/span><\/a>\u00a0<\/span>and\u00a0<\/span>Microsoft Teams\u00a0UI\u00a0Library<\/span><\/a>\u00a0<\/span>to help designers, product managers, and developers quickly\u00a0<\/span>understand the<\/span>\u00a0key design considerations\u00a0<\/span>for making quality Teams apps\u00a0<\/span>and also<\/span>\u00a0<\/span>simplify the process by prov<\/span>iding\u00a0<\/span>templates and tools to\u00a0<\/span>use<\/span>.\u00a0<\/span>Those\u00a0<\/span>early<\/span>\u00a0<\/span>moments<\/span>\u00a0<\/span>where<\/span>\u00a0users interact with and experience\u00a0<\/span>an app\u00a0<\/span>will\u00a0<\/span>play a large role\u00a0<\/span>in\u00a0<\/span>whether\u00a0<\/span>it\u2019s\u00a0<\/span>added to\u00a0<\/span>the<\/span>\u00a0proverbial<\/span>\u00a0\u201c<\/span>toolbox\u201d \u2026<\/span>\u00a0<\/span>or\u00a0<\/span>marked for a quick uninstall<\/span>ation<\/span>.\u00a0<\/span>Th<\/span>e\u00a0<\/span>pressure\u00a0<\/span>is<\/span>\u00a0<\/span>even\u00a0<\/span>higher for apps<\/span>\u00a0<\/span>built for\u00a0<\/span>platforms in addition to Teams,<\/span>\u00a0as designers need to\u00a0<\/span>learn and\u00a0<\/span>think through UI\/UX on\u00a0<\/span>the platform as well<\/span>.\u00a0<\/span>We want to make the design\u00a0<\/span>experience as s<\/span>eamless<\/span>\u00a0as possible \u2013 whether you\u2019re\u00a0<\/span>a designing a<\/span>n app at a large ISV, small start<\/span>up, or just a \u201cmaker\u201d<\/span>\u00a0at your company.\u00a0<\/span>\u00a0<\/span><\/p>\n

Guidelines for designing apps on Microsoft Teams<\/h3>\n

Millions of people use and rely on Teams each day to\u00a0come together\u00a0<\/span>and\u00a0<\/span>get work done.\u00a0<\/span>Every chat, meeting, and\u00a0<\/span>experience is centered on the UI\/UX\u00a0<\/span>principles\u00a0<\/span>we\u00a0<\/span>made\u00a0<\/span>for the platform \u2013 and so it\u2019s\u00a0<\/span>key<\/span>\u00a0that as\u00a0<\/span>you<\/span>\u00a0design<\/span>\u00a0your Teams\u00a0<\/span>app<\/span>\u00a0<\/span>you\u2019re building<\/span>\u00a0an experience that Teams user<\/span>s understand<\/span>. But we know it<\/span>\u2019s<\/span>\u00a0challenging to learn\u00a0<\/span>all the different entry points<\/span>, interfaces, and capabilities that Teams offers \u2013 so we\u2019ve\u00a0<\/span>compiled\u00a0<\/span>the\u00a0<\/span>Microsoft Teams UI Kit on Figma<\/span><\/a>\u00a0to\u00a0walk you through each key design consideration to\u00a0help you design the best experience for users to\u00a0interact with your app.\u00a0Our guide covers\u00a0important\u00a0design\u00a0topics including:<\/span>\u00a0<\/span><\/p>\n