Sistema de diseño de aplicaciones de Microsoft Teams
Obtenga información rápida sobre los conceptos básicos del diseño de aplicaciones de Teams. Puede encontrar una guía completa y ejemplos en el Kit de interfaz de usuario de Microsoft Teams (Figma).
Diseño
Teams se basa en un diseño de cuadrícula para garantizar relaciones coherentes y elegantes entre los componentes de diseño. La unidad base de 4 píxeles de la cuadrícula permite que los componentes se escalen de forma coherente en todos los tamaños de pantalla de Teams.
Avatares
Un avatar es una representación gráfica de una persona, equipo, bot o entidad en Teams. A menudo se usa un grupo de avatares para transmitir actividad en directo o representar una lista de una manera que conserve el espacio vertical.
Iconos
El icono principal de la aplicación puede tardar mucho tiempo en transmitir la marca a los usuarios de Teams. También es importante que el diseño del icono sea correcto para publicar la aplicación en la Tienda Microsoft Teams.
También puede usar los iconos de interfaz de usuario de Fluent en toda la aplicación:
Tipo
Teams usa la interfaz de usuario de Segoe para su rampa de tipos y sus diferentes tamaños de fuente y pesos para ayudar a crear jerarquías y garantizar la legibilidad.
Colores
La versión web y la versión de escritorio de Teams admiten temas predeterminados (claros, oscuros y de contraste alto), mientras que la versión móvil de Teams admite temas claros y oscuros. Cada tema de Teams tiene su propia combinación de colores.
Forma y elevación
Puede usar la forma y la elevación para crear una jerarquía adicional en la aplicación.
Copia y contenido
Para sentirse parte de Teams, la copia de la aplicación en general debe seguir estos principios de voz de Microsoft: cálido y relajado, nítido y claro, y listo para ayudar.
Ver instrucciones completas de copia y contenido, incluida la escritura para bots (Figma)