От дизайна к фронтенду: как передать макет в разработку

Чтобы все изображения и кнопки были на своих местах, анимации корректно работали, а шрифты на макете совпадали со шрифтами в интерфейсе, разработчику нужно больше, чем доступ к проекту в Figma. Мы в Friflex проектируем интерфейсы для миллионов пользователей, и, работая над проектами, очень внимательно следим, чтобы после программирования дизайн сох…

От дизайна к фронтенду: как передать макет в разработку
122122

Добавлю пару советов:

- Разберитесь как работают средства лейаутинга в выбранной технологии. Как происходит компоновка, как отрабатывается ресайзинг визуально. Хорошие разработчики не откажут ни в экскурсе, ни в наброске мини прототипа на поиграться. Зато вы будете с разрабами в одних системах координат, и не будет вопроса, почему нельзя 13.58 пикселя тут и 45.42 пикселя здесь.

- Излишняя кастомизация - зло. Старайтесь стандартизировать размерности/отступы и прочие паддинги. Анимации должны быть переиспользованы либо действительно необходимы.

- Минимальное поддерживаемое разрешение - супер важная характеристика, всегда продумывайте этот случай на этапе прототипа. Сэкономит кучу времени на разработку и отладку в дальнейшем.

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

6

Да и помните, что дизайнер находится в начале пищевой цепочки =) От качества и полноты работы дизайнера будет во многом зависеть качество разработки и скорость и качество тестирования.

6

и не будет вопроса, почему нельзя 13.58 пикселя тут и 45.42 пикселя здесь.

А почему вдруг нельзя? Современные движки вполне неплохо справляются с рендерингом любых размеров. Да и пиксели давно стали логическими, а не физическими. Иногда крайне удобно использовать 0.5 пикселя для лучшего выравнивания элементов. 🤷‍♂️