Оптимизация проекта Figma на примере большого банковского приложения
Расскажем, как мы провели оптимизацию и ускорили работу больших файлов Figma в три раза. Подтолкнули нас к этому тормозящие и не открывающиеся файлы у команды на проекте. Особенно это ощутили ребята с не самым мощным железом: файлы загружались по пять-десять минут.
Спасибо за статью, у меня 3 вопроса:
1. Итак, вы решили не делить один большой файл с макетами приложения на несколько файлов. Не боитесь наступить на те же грабли, на которые наступили при создании UI-кита в одном файле с макетами? Насколько понял, у вас проект рос, растёт и будет расти. Собственно, сколько оптимизацией одного файла не занимайся, макетов будет всё больше и больше. В итоге у вас просто закончится место в файле и вы вынуждены будете дробить всё на несколько файлов. Вы специально ждёте этого момента? :)
2. Что с бэкапами? Если что-то критичное случится (тьфу-тьфу) на конкретной страничке файла, то бэкапить придётся весь файл со всеми страницами. А если придётся бэкапиться на несколько недель, а то и на месяц назад, то в трубу улетает весь труд за несколько недель/месяц. От этой мысли страшно не становится?)
3. Что там у вас по autolayout? Уже юзаете его в компонентах или ждёте пока фигма доведёт его до ума?
peace 🙌🏻
При таких объемах (в одном проекте например) и если предположить, что это еще будет рости дальше (возможно в разы), то заниматься заниматься дизайном (в статике) уже выглядит избыточным. В какой то момент такое количество экранов (которые в итоге отличаются допустим на 2-3 элемента) будет настолько большим, что поддерживать будет нереально.
Адекватный выход, похоже, это писать код — и объем работы сократится и поддержка проще и быстрее, места меньше, навигация проще и с версиями все понятно.
При этом не обязательно дизайн-студии брать всю разработку. Если сам процесс разработки организован нормально, то UI layer можно писать отдельно от моделей. Это в любом случае хорошая практика
Отвечу от Mish, так как я принимал участие в процессе.
1. В ходе оптимизации мы вынесли мастер-компоненты в отдельные файлы. Теперь можем делить файл с макетами на любое количество частей методом дублирования и удаления лишних разделов. Мы не стали пока этого делать, так как скорость работы системы и так выросла. При необходимости поделить — сделаем это за 5–10 минут.
2. В фигме есть история версий. В день автоматически делаются десятки бэкапов. Каждый из них хранится на сервере Figma. Можно восстановить файл таким, какой он был вчера вечером или в полдень 19 декабря 2019 года.
3. Autolayout очень любим и активно пользуемся на каждом проекте. При помощи пары лайфхаков можно делать удобные штуки. Например такие: