flaton Mar 28 at 17:15

Как у нас происходит процесс передачи макетов разработчикам

Easy

5 min

1.6K

DesignPrototyping*Web design*Mobile applications design*

Tutorial

Comments 14

Sergedelacrua Mar 29 at 06:09

Иконки в вариантах для удобства использования... Это же наоборот путь страданий. В таком виде конкретную иконку нельзя найти поиском. Да и в целом тенденция всё запихать в варианты непонятно откуда.

KladislavVlenov Mar 31 at 07:31

В варианты иконки запихивают чтобы потом менять их внутри дочернего компонента. Например, когда второстепенная кнопка включает в себя иконку (дискета, корзина, трубка), гораздо проще и быстрее запихать в мастер кнопки вариант иконки и потом по селекту его менять.

А разработчику особо разницы нет, он также их пулом выгрузит в свг, лишь бы подписаны были правильно

Sergedelacrua Apr 1 at 22:51

Я про рисунок 7 в статье. Это же маразм - хранить все иконки в одном мастере. Если в команде больше 2 дизайнеров а в паке хотя бы 100+ иконок, я бы посмотрел какой это будет ад. Во всех приличных ДС иконки в отдельных мастерах хранят, еще и пишут в description ключевые слова, чтобы поиском было реальнее нужную иконку найти, а меняют через swap instance, что тоже легко выводится в пропсы компонента.

flaton Mar 31 at 15:12

Согласны с ответом выше. Варианты упрощают замену иконок через панель свойств, что особенно удобно в больших дизайн-системах.

Sergedelacrua Apr 1 at 22:55

Особенно удобно в больших ДС... Ой не могу... Рассмешили🤣 как раз в большой ДС с паком в over 1000 иконок и более менее развитой семантикой, например когда иконки могут быть разного начертания, там просто не реально запихнуть всю либу в варианты

flaton Apr 2 at 17:33

Да, действительно, вы правы по поводу организации иконок в больших дизайн-системах. Спасибо за комментарий!

В статье мы описывали кейс иконок для мобильного приложения, где разнообразие начертаний или размеров не требуется. Это просто удобнее и быстрее)

Sergedelacrua Apr 2 at 19:10

Вы же сами себе противоречите! Через комментарий назад, вот, мне не показалось: "Варианты упрощают замену иконок через панель свойств, что особенно удобно в больших дизайн-системах".

flaton Apr 3 at 09:16

Не показалось, сообщением выше мы согласились с вашим мнением из комментария и поста в тг, что ваш вариант организации иконок удобнее)

Мы просто отвечаем на ваш ответ в ветке комментариев.

Sergedelacrua Apr 3 at 12:28

👍

Sergedelacrua Apr 2 at 13:24

Вы меня вдохновили на пост. Так что вы ~~в телевизоре~~ на моем канале: https://t.me/uxflow/199

rpc1 Mar 29 at 20:15

Как разработчики забираю эти макеты? Используете ли какие-нибудь плагины для выгрузки макетов в Json или сразу код?

flaton Mar 31 at 15:13

Чтобы забирать макеты разработчики используют встроенные инструменты Figma и Dev Mode. Для экспорта в JSON можно применять плагины, например Figma to JSON.

KladislavVlenov Mar 31 at 07:32

Интересно, почему вы не используете секции для группировки макетов 🤔

flaton Mar 31 at 15:14

Секции используем, когда нужно детально показать развернутый флоу, включая все этапы и возможные сценарии. Например, процесс подключения устройства по Bluetooth: от поиска до успешного соединения или ошибки. Таким образом макеты становятся подробными и удобными для работы.

Для разделения макетов по их назначению применяем разделы (подробнее в «Структурируем макеты»).