Обзор дизайн-систем созданных в Figma

Мудрость от нашего сообщества

Мы в Figma оптимистично настроены в отношении дизайн-систем… на случай, если вы не читали об этом в наших публикациях на этой неделе ?. 2018 год будет замечательным годом, поскольку мы развиваем DesignSystems.com в учебный ресурс сообщества, для обсуждения этого вопроса. Мы также хотим поддержать наших пользователей в их работе по созданию дизайн-систем при помощи Figma. Я никогда не забуду, как Václav Vančura – дизайнер Microsoft, демонстрировал слои, расположенные на слоях и компонентах, которые он вложил и ограничил… Прямо как черепаха на другой черепахе и так далее, до бесконечности. Это было сложнее, чем все, с чем мы сталкивались прежде. Мы любим, когда люди раздвигают пределы нашей технологии. Вслед за запуском DesignSystems.com, мы хотим показать вам публикации сообщества о создании в Figma таких систем дизайна, как показал Václav. Без широкой базы наших пользователей мы не могли бы придумать такие функции, как ограничения и Team Library. И мы будем продолжать адаптировать их к вашим разнообразным контекстам использования. Ждите больше продуктов в 2018 году! (P.S. Мы не платили или не спонсировали эти публикации, но мы ценим время и усилия, которые были потрачены на их написание ☺️.)

Делая первый большой шаг —    Gusto

Быстрый взгляд на структуру дизайн-системы Gusto Здесь, дизайнер Will Newton рассказывает о самом страшном вопросе, связанном с дизайн-системами: «С чего мы начинаем?» Gusto – организация, в которой он работает, занимается расчетом заработной платы и HR-технологиями. Компания использовала простые строительные блоки для преодоления этого первого препятствия.

Построение дизайн-системы маркетинга и коммуникаций—  Square

GIF-файл активов дизайна коммуникаций Square в Figma В этой публикации, дизайнер коммуникаций Zach Grosser демонстрирует, как маркетинговая команда на платежном процессоре Square построила собственную внутреннюю систему дизайна с такими элементами, как цветовые палитры и логотипы.

Расширение возможностей не дизайнеров при помощи дизайн-систем - Virta Health

Virta позволяет просто перетаскивать компоненты для создания дизайна Virta Health, названные восходящим стартапом Сан-Франциско, помогают бороться с диабетом и имеют удобный дизайн. В этой статье дизайнер Joey Banks рассказывает о всех этапах построения дизайн-системы – от первоначальной ревизии компонентов до финальных макетов. Он также делится секретами, как система дизайна Virta изменила способ обмена идеями между инженерами и продакт-менеджерами.

Сила вложенных компонентов —  OpenText

Руководство по объединению вложенных компонентов и кнопок состояний Thomas Lowry – ведущий дизайнер корпоративной IT-компании OpenText, подробно расписывает использование вложенных компонентов для создания более функциональной системы дизайна. Это похоже на работу Вацлава в Microsoft.

Атомный дизайн и Figma  —  SetProduct.com

В этой публикации, Roman Kamushken – дизайнер сайта SetProduct.com (наборы интерфейса для создания сайтов) использует принципы атомного дизайна, как основу для создания своей дизайн-системы — от слов (заголовки, иконки и т.д.), фраз (кнопки), до предложений (карточки) и глав (экраны). Спасибо Katie Gregorio.

---

Перевод статьи Carmel DeAmicis