Тендеры и лиды
Информация
Figma продолжает выпускать обновления, в том числе и для дизайн-систем. Разберем важные обновления: слоты компонентов и Figma MCP.
Слоты компонентов
Слоты также позволяют дизайн-системам указывать, какие компоненты допустимы внутри слота. Таким образом, предоставляя дизайнерам гибкость, они всё равно работают в рамках и соответствуют одобренным системой шаблонам.
Преимущества и ограничения слотов.
Несколько дополнительных «плюсов» использования слотов в дизайн-системах:
• Слоты отражают принцип работы компонентов во фронтенд-фреймворках, поэтому они ближе к технической реализации.
• Компоненты становятся проще и чище, так как нет необходимости искать обходные пути для обеспечения гибкости.
• Сложные компоненты, такие как карточки и модальные окна, благодаря масштабируемости слотов проще адаптировать для разных команд.
• Соответствие системе улучшается, поскольку слоты дают дизайнерскую свободу в рамках заданных границ.
Теперь поговорим о «минусах» слотов:
• Для экземпляров слотов требуется тщательное планирование, чтобы избежать излишне сложных или неоднозначных дизайнов компонентов.
• Слоты не идеальны для строгих системных паттернов, таких как уведомления или сообщения.
• У новых пользователей системы будет уходить время на изучение того, как использовать слоты, не выходя за рамки дизайн-системы.
• Слоты увеличивают нагрузку на поддержку дизайн-системы, потому что необходимо определять экземпляры слотов, писать документацию и согласовывать код.
Примечание: слоты доступны только по программе раннего доступа для платных тарифов.
Сервер Figma MCP (Model Context Protocol)
Сервер MCP от Figma позволяет инструментам на базе ИИ, таким как Claude или Cursor, получать информацию из ваших файлов Figma. MCP создает общий контекст между дизайном и кодом и позволяет ИИ генерировать код компонентов, токены и даже документацию прямо из вашей дизайн-системы.
Возможно, вы думаете: «Что такое MCP?» По сути, MCP — это стандартизированный способ общения ИИ с внешними данными и инструментами, такими как Figma. Поэтому, когда сервер MCP включен, ИИ-агенты могут видеть структуру компонентов, дизайн-токены и соглашения по именованию вашей системы.
Хотя MCP может дать ИИ те же знания, что и у опытного члена команды дизайн-системы, его следует рассматривать как помощника, а не замену дизайнерам.
Преимущества MCP
MCP поддерживает дизайн-системы следующими способами:
• Генерирует код компонентов на основе контекста в Figma.
• Точно сопоставляет дизайн-токены (такие как цвета, отступы и типографику).
• Ускоряет рабочий процесс по документации, используя актуальный контекст из Figma.
• Поддерживает согласованность структуры компонентов и их именования.
Наша система сама подберет вам исполнителей на услуги, связанные с разработкой сайта или приложения, поисковой оптимизацией, контекстной рекламой, маркетингом, SMM и PR.
Заполнить заявку
13222 тендера
проведено за восемь лет работы нашего сайта.
Но у MCP есть ограничения для дизайн-систем, например:
• Он не может читать целые проекты; его лучше использовать для небольших частей системы.
• Он не может предполагать поведение при взаимодействии, если вы явно не опишете и не укажете его.
• Его вывод по-прежнему требует проверки и доработки опытным дизайнером/разработчиком.
Важное примечание:
Советы по использованию MCP 1. Начинайте с атомарных компонентов (например, кнопок), прежде чем переходить к более сложным.
2. Работайте с одним компонентом за раз, а не со всем проектом целиком.
3. Просите ИИ ссылаться на существующие компоненты, чтобы следовать вашим лучшим практикам.
4. Предоставляйте полный контекст (например, поведение компонентов и взаимодействия).
5. Избегайте использования «жестко заданных» значений (hard-coded) или отсоединенных компонентов (для проверки недостающих стилей используйте плагин Design Lint).
Если в выводе ИИ что-то выглядит неправильно, вы можете:
1. Проверить компоненты Figma на ошибки или недостающий контекст, а затем исправить их по мере необходимости.
2. Попросить ИИ заново сгенерировать компонент или документацию.
3. Показать ИИ скриншот проблемы и спросить, почему что-то не так.
Подписывайтесь на наш Telegram-канал.
