Дизайн сайта из Figma в Tilda
Часть 1
Доброго времени суток! В этой статье речь пойдет о моем опыте создания дизайна сайта в Figma и его импорте в Tilda. Здесь будет сказано о том, с какими трудностями я столкнулся и как их решал.
После того как был проведен анализ конкурентов и сделал портреты пользователей я приступил к созданию прототипа.
И так первое о чем мне бы хотелось сказать это размер фрейма который я установил в figma, а именно 1440px на 1080px так же использовал свою стандартную сетку для этого размера:
Но у tilda есть свой собственный размер (это 1200px в ширину) и своя установленная сетка которую нельзя изменить, предоставлю её ниже:
Я думаю вы хотели бы знать об этом заранее, до того как начали разрабатывать дизайн для tilda, а не после того как все уже готово (как это было в моем случае). Эта сетка необходима для того что бы при импорте в tilda все встало ровно.
После того как целиком был создан дизайн сайта в figma нужно было импортировать его в tilda, на удивление здесь все произошло без проблем, на всякий случай демонстрирую как это сделать:
После чего мы переходим в tilda создаем zero блок, в нем нужно будет удалить все лишнее
Затем жмем 3 точки справа вверху и импорт
Вводим наш токен
Возвращаемся в figma копируем код страницы, которую хотим перенести в tilda, для этого на нужно выделить страницу нажать пкм и копируем код как на скриншоте
Переходим обратно в tilda, и вставляем нашу ссылку в верхний пункт
Поздравляю! вы перенесли дизайн из фигмы в тильду!
Во второй части я расскажу какие проблемы у меня возникли с анимациями на tilda и как я их решил.