
У меня в Фигме, огромное число проектов по работе. Бывало такое, что меня спрашивают по задаче: «Лёш, слушай, я помню мы делали для клиента отдельную страницу оформления заказа, скинь, плиз, фигму, а то я не нашла». Окей, полез искать, и провозился в поисках 15 минут, после чего вспомнил, что искал не там...
Свою продуктивность в Фигме организовать легко, всю мою проблему решают папки, в которые всё можно разложить по проектам. Папки решают проблему дезориентации. Но к папкам есть доступы только у дизайнеров. А проекты нужны менеджерам для демонстрации или проверки, тестировщикам, фронтенд разработчикам. Всем раздать доступы не получится. А постоянное дёргание «скинь ссылку на Фигму» утомило, отвлекает от работы.
Начал думать, как бы всем и сразу дать ссылки на все проекты, да еще так, чтобы не запутать. Сначала хотел дать общий файл с перечисленными ссылками. Ссылок оказалось 137. Мне самому было плохо от этого, а ориентироваться в списке просто невозможно.
Я подумал, а зачем мне промежуточное решение в виде документов или Эксель таблиц, если конечная потребность — это файл Фигмы. Нужно в этой же Фигме сделать список всех файлов.
Если я в фигме, то список можно сделать нагляднее, показать проекты, связи между ними.
Сначала я придумал, как можно визуализировать файл Фигмы:

Я отобразил его виджетом. Каждый файл — это преимущественно клиент, то есть компания, для которой разрабатывался персональный дизайн B2B-площадки. Для быстрого поиска глазами я разместил логотип компании. Менеджеры чаще ищут именно по компаниям и знают их логотипы наизусть.
Название файла — чаще всего это название компании.
Список ключевых страниц в файле, это могут быть отдельные проекты, которые были выполнены по заказу компании. Или просто большие проекты, в котором наработки и идеи могут пойти для всех клиентов.
Индикатор персонального решения говорит о том, что для этой компании реализован большой проект.
Ссылка на готовый сайт компании — реализация фронтенд разработчиков.
У некоторых клиентов есть только лого и название — это значит что для них были выполнены базовые работы.

Все виджеты, то есть все файлы я рассортировал по папкам:




На скриншотах видны стрелки. Ими я показал связанные проекты.
Все разработки выполнены в едином визуальном стиле. Правила визуального стиля диктует UI кит. UI кит — это составляющая дизайн-системы под названием B2B Движение.

Если смотреть в масштабе, то получилась карта. Интерактивная карта по всем проектам и файлам. С иллюстрацией связей между файлами.

Ну и вишенкой на торте тут является встроенный в Фигму поиск по странице, чтобы им воспользоваться нужно зажать клавиши ⌘ + F, если у пользователя MacOS или Ctrl + F, если Windows. Такую подсказку я расположил вверху карты, ее можно увидеть при большом отдалении, что логично:

Поиск работает замечательно:

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


