mtsdesign
Бренд МТСНаправленияДизайн-системаМетодологииГайдлайныКоманда и вакансииБлог
mtsdesign
Бренд МТСДизайн-системаМетодологииКоманда и вакансииБлог
НаправленияUX/UI продуктовый дизайнГрафический дизайнПромышленный дизайнИнтерьерный дизайн
behancetelegramvkyoutube
© 2024 ПАО «МТС»
Все права защищены
Политика обработка файлов cookie
18+

Мобильные приложения

ВСЕ СТАТЬИМобильные приложения

  • Общая информация
  • Как подключить компоненты в Figma
  • Как подключить компоненты в коде
    • Подключение iOS-компонентов
    • Подключение Android-компонентов
    • Как переопределить цвета в компонентах?
  • Компоненты 2.0
    • App Icon
    • App Navigator
    • Avatar
    • Badges
    • Count Indicator & Notification
    • Banners
    • Buttons Family
      • Button
      • Bottom Button
      • Button Price
      • Cell Button
      • Icon Button
      • Icon Button Set
      • Icon Button Set Alternative
      • Swipeable Button
    • Calendar Family
      • Calendar Plain
      • Calendar Range
    • Card Background
    • Cells
    • Chips Family
      • Choice Chip
      • Choice Сhip Multiselect
      • Form Chip
    • Context Menu
    • Сontrol List
    • Empty Screen
    • Dividers
    • Form Family
      • Input
      • Dropdown
      • Textarea
    • Messages
    • Modal Family
      • Action Sheet
      • Modal Cards
      • Modal Select
      • Modal Page
    • Nav Bar
    • Pagination Dots
    • Passcode
    • Profile
    • Range
    • Search
    • Segmented Control
    • Selection Controls
    • Slider
    • Slider Alternative
    • Snackbar
    • Spinner
    • Splash Screen
    • Stories
    • Success Page
    • Tabbar
    • Tabs
    • Text List
    • Toast
    • Tooltip

Card Background

Описание

Card — это контейнер, который может содержать внутри себя различный контент: заголовок, описание, изображение, кнопки, бейдж и другие элементы в зависимости от контекста использования.

Ресурсы

  • Компонент в Figma
  • Документация iOS
  • Документация Android

Спецификация

Примеры использования

Темная тема

G1.0 → G2.0

Дизайн-система перешла на визуальный язык Granat 2.0. Старая версия Granat 1.0 перестанет поддерживаться в январе 2025 года.

Ресурсы 1.0

  • Компонент в Figma
  • Документация iOS
  • Документация Android
Перейти в следующую статьюCells

Библиотеки

Базовые компоненты

Цвета, шрифты, сетки

Иконки

Интерфейсные и продуктовые иконки и правила их разработки

Мобильные приложения

Компоненты для создания мобильных, планшетных и авто приложений

Веб-витрины и приложения

Компоненты для адаптивных веб страниц и приложений

Заглушки

3D иллюстрации и примеры экранов заглушек