Ужасы работы с Figma. Что нужно предусмотреть, прежде чем начинать вести большой проект

Небольшая заметка о том, с какими проблемами я столкнулась, начав работать в Figma.

Так, по заявлению Figma на их сайте, говорит старший менеджер по дизайну в Twitter. Сотрудничать то легко, а что на счет того, как в ней работать?

Figma позиционирует себя как супер-инструмент для совместной работы дизайнеров интерфейсов. Об этом они сообщают чуть ли не в каждом блоке на своем сайте. Но если копнуть глубже, то позаботившись о дизайн-отделах и корпорациях всего мира, Figma ну совсем забыла позаботится о комфорте каждого дизайнера в отдельности.

Я застала еще те бородатые времена, когда дизайнеры интерфейсов страдали, работая над своими проектами в Photoshop. В 2010 году в мир дизайнеров перевернулся, так как на рынок вышел его величество Sketch (забегая немного вперед, я до сих пор считаю его идеальным инструментом для одиночной работы). Это был действительно новый инструмент, адаптированный специально для проектирования и дизайна интерфейсов. Единственным минусом было отсутствие кроссплатформенности. В этот момент Adobe напрягся и, с небольшим отставанием, в 2015 году выкатил на рынок Adobe XD. Но он не успел как следует закрепиться на рынке и получить свою порцию славы.

В 2016 году выходит первый релиз Figma. Ребята серьезно постарались и выкатили не только кроссплатформенный сервис для дизайна интерфейсов, но и запилили крутую фишку в виде совместной работы над проектами. В этот момент рынок ахнул от удивления и все дружно мигрировали на Figma. Началась великая борьба тех, кто топит за Sketch и тех, кто топит за Figma.

Так вышло, что до декабря 2020 года я активно состояла в клубе «Я за Sketch», работала в связке Sketch+Zeplin или верстала сама по памяти. Но обстоятельства сложились так, что над следующим своим проектом мне нужно было работать в Figma, на которую я переходила со слезами на глазах. Спустя пол года работы в Figma я до сих пор иногда сижу на подоконнике с чашкой кофе и мечтаю о Sketch. И сейчас расскажу почему.

Начнем с маленькой (в прямом и переносном смысле), но довольно болезненной для меня вещи. История операций, которую хранит Figma. Она маленькая. Очень маленькая. Под историей операций я подразумеваю, сколько действий вы можете отменить с помощью Ctrl+Z.

Не знаю как остальные, но я довольно часто возвращаю макет в первоначальное состояние (почему так, расскажу чуть позже), проработав над ним минут 30-40. Figma позволяет отменить всего 100 последних действий, причем в эти действия включают в себя не только смещение, изменение настроек и т.п., но и фокус на элементе. То есть если вы прокликали 5 элементов, вы уже истратили 5 "жизней" из 100. Переключились на другой элемент - получите «-1». В итоге 100 действия в процессе активной работы я совершаю в среднем за 10 мин.

Речь идет о поиске страниц, артбордов, слоев и элементов. Хочешь пользоваться поиском - пили компоненты и ищи их в Assets, а страницы и артборды ищи в ручную. Sketch в этом плане милашки и позаботились о юзабельности.

Казалось бы, такая мелочь, а насколько сильно облегчает жизнь. В моем проекте более 60 страниц, на каждой из которых минимум 15-20 артбордов, бывает, что количество переваливает за 50. Мне дико сложно ориентироваться в проекте без поиска по дереву.

А вот мы и приехали к одной из причин негодующих дизайнеров по всему миру и почему я возвращаю макеты в исходное состояние, вместо того чтобы плодить версии. Десктопное приложение Figma ничем не отличается от вкладки браузера: приложение написано на Electron, что влечет за собой такую вот особенность. Так что нет смысла прокачивать свой ПК оперативкой, работая с Figma, вы все равно не выйдете за рамки дозволенного.

Если при работе с файлом (файлами) ваше приложение будет подбираться к потреблению 2GB, вы увидите предупреждение, а если перевалит, то вы просто потеряете к нему доступ, он перестанет открываться и нужно будет вытаскивать из истории менее тяжеловесную версию (то, что история версий тоже может просто крашнуть приложение, идет бонусом).

Все это значит, что вы потеряете если не весь проект, то последние изменения точно. Ответы поддержки на множественные сообщения недовольных по поводу ограничения памяти - отдельная история. Нет никакой речи о том, чтобы проработать этот вопрос, вам просто говорят «ну перенесите часть макетов в другой проект», «ну удалите большие изображения и скрытые слои».

И не забудьте, что компоненты тащат за собой все элементы, которые есть в родителе (подтверждение этому есть в официальной документации). То есть компоненты не переиспользуются (что было бы логично), а дублируются, и когда вы вставляете его 3 раза, вместо одного комплекта элементов, вы получаете 3, просто связанных между собой.

Лично для меня это прям вообще адок еще тот. Я пишу много комментариев к макетам для разработчиков, которые в дальнейшем будут их верстать, казалось бы, идеальный функционал: включил, когда нужно, когда не нужно — скрыл, и места лишнего не занимают, но блин НЕТ!

Мой проект растет, память заканчивается, но я просто не могу его разделить, потому что комменты не привязываются к артборду или элементу. Они остаются висеть в пустом пространстве проекта, и вы не можете их ни перепривязать, ни передвинуть. Единственное, что вам остается — наслаждаться ими в списке Unattached Comments.

Теперь приходится писать комментарии отдельными текстовыми слоями, но все мы помним причину №3 (да-да, про те самые ограничения).

Да, этот пункт имеет 2 стороны медали, но все же, для меня это больше минус, чем плюс. Я считаю, в подобных инструментах режим автономной работы просто необходим.

Почему? Тут отдельный список причин.Одна из которых - зависимость от состояния серверов. Лежат сервера? Ну можете тоже спокойно прилечь, Figma будет лежать вместе с вами, работа встанет. Недавно такая история происходила стабильно каждый день, Figma либо вообще отваливалась, либо проекты грузились нереально долго. И это не скрасило даже то, что таким образом Figma видимо масштабно внедряли градиентный лоадер (который почему-то почти сразу выпилила 🤔). Шутка, изменения конечно были довольно обширными, но сути это не меняет.

Плюс такой подход не дает вам возможность свалить куда-нибудь в леса и творить в окружении птичек и деревьев. Нет интернета - нет работы. Figma все решила за вас, вы обязаны жить в цивилизованном мире.

Заранее оценивайте масштабы проекта и сразу дробите его на несколько отдельных проектов как можно мельче. Не допускайте тяжеловесов, иначе будете мучаться потом как я, и рискуете вообще потерять доступ к файлу.

Также продумайте дерево элементов и страниц и нейминг, ведь ориентироваться в проекте придется на глаз. Никакого поиска- только хардкорд. Как вариант, в названиях страниц и артбордов можно использовать смайлики, если найдете подходящие. Или разбейте страницы по цветам и используйте пустые страницы для группировки. Например так:

К сожалению юзабельность Figma очень низкая, по сравнению например со Sketch. У них продумана каждая мелкая деталь, которая упрощает работу с инструментом, там ты действительно кайфуешь от работы. Так как мне есть с чем сравнить, с Figma мне все еще сложно найти общий язык. По мимо прочего мне так же не нравиться организация файлов и визуальная составляющая, но это уже совсем другая история. Ребята сильно вкладываются в коллективную работу и за это большое спасибо, но к сожалению совершенно игнорируют потребности каждого отдельного пользователя.