Figma для UX-редакторов: 12 плагинов, которые упрощают работ
Если работаете с текстами прямо в макетах, эти плагины спасут часы рутины и оставят последнюю нервную клетку в безопасности. Все проверены в работе и встроены в мой редакторский пайплайн.
Работа в фигме
DONE! — небольшая панелька, помогает отслеживать статус всей дизайн-задачи. Удобно адаптировать под пайплайн команды и добавлять исполнителей. Помогает редакторам синхронизироваться с дизайнерами и разработчиками.
Checkmark — вроде простой ту-ду-лист, но дьявол в деталях. Долго перебирал очень разные плагины, искал баланс между лаконичностью и возможностями. Checkmark поддерживает вложенные списки и редактирование всего листа через markdown-разметку, показывает общий прогресс, можно вставить гиперлинк (полезная штука, в других плагинах не встречал ни разу). Ещё в нём можно делать шаблоны чек-листов — это экономит время, когда команда переходит к детальной проработке макетов и подготовке к разработке.
Если же нужен максимально простой ту-ду-лист, подойдут Simple Tracked ToDo или Checklist.
Прототипирование и концептинг
Wireframe — большая коллекция разных вайрфреймов с веб-версиями и мобайлом. Плюс компоненты для флоу мапов. Очень помогает, когда нужно быстро набросать структуру, побрейнштормить или поконцептить.
Content Reel — архив ассетов для ранних этапов дизайна, когда нужно быстро заполнить экраны чем-то, что будет близко к финальному виду. Есть текстовые ассеты, например, даты разных форматов и номера телефонов, есть и графические — фотографии, иконки.
Autoflow — мегаудобная стрелка для организации макетов. Для неё можно настроить цвет, толщину и скругление, а чтобы нарисовать, достаточно выбрать два экрана через shift.
Работа с текстом
Frontitude — AI-плагин для создания и улучшения текста. Удобен, когда нужно «покрутить» текст, набросать разные варианты, уместить в ограничение по знакам. А ещё поддерживает гайдлайны — можно закинуть в него правила tone of voice, рекомендации для компонентов и категорий текстов (вроде ошибок), и он учтёт всё при генерации.
UX writing status — очень простая, но дико полезная штука. Внутри четыре статуса «сделать», «в работе», «ревью», «готово». Выделяете текст, нажимаете один из статусов, плагин маркирует текстовый слой слева в панели. Спасает от путаницы, когда сценарий длинный, состояний и текста много. И дизайнеры видят, что на каком этапе.
SPELLL — исправляет орфографические ошибки, можно добавлять свой глоссарий, чтобы плагин не ругался на одни и те же слова. Спасает от случайных опечаток, которые не заметил встроенный в фигму спелл-чекер.
Typograf — расставляет кавычки-ёлочки, распознаёт кавычки в кавычках, убирает двойные пробелы, корректно оформляет дроби, добавляет неразрывные пробелы между числом и стоящим слева словом. И много других полезных мелочей. Единственный минус — нет гибкой настройки под свои редстандарты.
Space>>cleaner — убирает повторяющиеся пробелы, неразрывные на обычные не заменяет. Пригодится, если Typograf конфликтует с редакторской документацией, а текст надо привести в порядок.
Другое
Better Font Picker — отдельная незакрываемая панель со всеми установленными шрифтами. Пригодится, когда нужно навести порядок в макете и поправить все шрифты, — не нужно будет каждый раз искать и выбирать нужный через правую панель фигмы.
Design Lint — в первую очередь дизайнерский инструмент, проверяет ошибки в стилях макетов. Но будет полезен редакторам, которые работают с макетами напрямую, чтобы проверять текстовые стили.