Кросс-платформенная

Дизайн библиотека состоит из структурированных Figma файлов с ссылками на документацию. Разработан для нативной разработки iOS, Android и WEB. Для разработчиком каждой платформы отдельные репозитории с едиными CDN токенов.

Унифицированные токены, атомы и компоненты

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

Единые гайды и шаблоны

Все компоненты сопровождают ссылками на документацию и примеры и использования компонентов. Так же все компоненты сопровождены комментариями частых ошибок и цели использования компонента.

Figma+Code

Дизайн система состоит из Figma файлов слинкованных библиотек и такой же структурой для iOS, Android и web версий библиотеки.

Единая система опций

Все атомы и компоненты переключаются в Figma и на каждой платформе опциями. Для мобильных платформ есть демо приложения дизайн системы с GUI, для web используется storybook.

Вариативные атомы и компоненты

Широко и гибко описанные компоненты позволяют избежать ошибок и нереализуемых решений.

Tokens, sizing & etc

Все имеет свое место, отдельный файл библиотеки в figma для дизайнеров и отдельный CDN для разработчиков чтобы включать в код на разных платформах.

Семантика и гайдлайны

Все атомы и компоненты пронизаны семантикой, понятно описывающей соотношения между объектами и их применение. Одинаково хорошо для разных платформ для разработчиков и дизайнеров.

Универсальные токены

Превращены в токены: шрифты, иллюстрации, иконки, палитра, тема приложения, размеры, элевейшены, отступы, сетки. Это позволило быстрее и независимо поддерживать и обновлять файлы для дизайнеров и разработчиков.

‍

Аксессабилити и гайдлайны HID, Material, W3C

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

Учтённые технологии

Voice over, talk back, without mous, scale interface. Реализованная библиотека так же тестировалась на обратную своместимость браузеров и версий мобильных ОС.

Учтённые гайдлайны

HID и Material для разработки мобильных приложений, использование масштабирование интерфейсов и шрифтов. W3C параметров для изменяемого и адаптивной веб версии.

‍

Шаблоны

Шаблоны компонентов* и расположения

Помимо raw (сырых или оригинальных) гибких компонентов, собраны часто используемые шаблоны и комбинации использования компонентов с дополнительным описанием. Сохранены шаблоны с частым расположением элементов относительно экранных форм.

*Не содержит шаблоны финального приложения т.к. это дизайн система. Они хранятся в самом финальном приложении и его файлах.