Microsoft Teams системы разработки приложений

Быстро узнайте об основах разработки Teams приложения. Всесторонние рекомендации и примеры можно найти в Microsoft Teams пользовательского интерфейса (Figma).

Макет

Teams для обеспечения последовательных и элегантных связей между компонентами дизайна зависит от макета сетки. Базовый блок сетки с 4 пикселями позволяет компонентам последовательно масштабироваться во всех размерах отображения в Teams.

Концептуальное изображение Teams макета.

Аватары

Аватар — это графическое представление человека, команды, бота или объекта в Teams. Группа аватаров часто используется для передачи живой активности или представления реестра таким образом, чтобы сохранить вертикальное пространство.

Концептуальное изображение Teams аватаров.

Значки

Основной значок приложения может пройти долгий путь для передачи вашего бренда Teams пользователям. Получение правильного оформления значка также важно для публикации приложения в Teams магазине.

Вы также можете использовать значки пользовательского интерфейса Fluent во всем приложении:

Концептуальное изображение Teams значков.

Тип

Teams использует пользовательский интерфейс Segoe для своей рампы типа и различных размеров шрифтов и весов для создания иерархии и обеспечения читаемости.

Концептуальный образ Teams типографии.

цвета;

Teams и настольные компьютеры поддерживают темы по умолчанию (светлые), темные и высоко контрастные, а Teams поддерживают светлые и темные темы. Каждая тема имеет свою цветовую схему.

Образ концепции Teams цветов.

Форма и высота

Вы можете использовать форму и высоту для создания дополнительной иерархии в приложении.

Концептуальные формы и высоты.

Копирование и контент

Чтобы почувствовать себя частью Teams, ваша копия приложения в целом должна следовать этим принципам голосовой поддержки Майкрософт:теплый и расслабленный, четкий и ясный, и готовы протянуть руку.

Концептуальное изображение копирования и контента.