Дизайн лендингов — удалённая работа в Москве

Платформа: Figma. Нужно разработать дизайн лендинга в Figma на основании готового технического задания и брендбука. Важно: нужен не просто красивый визуальный концепт, а полноценный дизайн-макет, который затем можно без лишних доработок и неоднозначностей передать верстальщику. Что уже есть: — подробное ТЗ по структуре и содержанию страницы; — брендбук; — библиотека собственных фотографий компании; — тексты и основная логика страницы. Что необходимо сделать: Разработать дизайн лендинга в Figma. В первую очередь проектируем мобильную версию страницы — mobile first. После согласования мобильной версии необходимо разработать десктопную адаптацию. Важно предусмотреть корректное отображение страницы на наиболее распространенных разрешениях экранов, а не делать макет только под один фиксированный размер. Подготовить макет таким образом, чтобы его было удобно передавать в верстку. Ожидаем: — понятную структуру Figma-файла; — использование компонентов и повторно используемых элементов; — единообразные стили шрифтов, цветов, кнопок, полей, карточек и т. п.; — логичные отступы и сетку; — продуманное адаптивное поведение блоков; — отсутствие элементов, которые технически сложно или неоправданно дорого реализовывать на сайте без веской причины. Желательно использовать Auto Layout и другие стандартные инструменты Figma, упрощающие дальнейшую верстку. Верстальщик должен иметь возможность открыть макет и максимально однозначно понять размеры, интервалы, состояния и поведение элементов. Работа с фотографиями. У нас есть собственная библиотека фотографий. Необходимо: — просмотреть библиотеку и подобрать наиболее подходящие фотографии под соответствующие блоки лендинга; — при необходимости выполнить базовую обработку: кадрирование, коррекцию композиции, света/контраста и т. п.; — подобрать правильные пропорции изображений для разных блоков; — предусмотреть отдельное кадрирование там, где изображение на мобильной и десктопной версиях должно использоваться по-разному. Также важно учитывать будущую скорость загрузки сайта. Не нужно без необходимости использовать изображения существенно большего разрешения, чем требуется для их отображения на странице. Желательно заранее продумать размеры и пропорции исходников таким образом, чтобы после экспорта и оптимизации изображения не создавали лишнюю нагрузку на страницу. При этом требуется сохранить нормальное качество изображения в том числе на современных экранах с высокой плотностью пикселей. Адаптивность. При проектировании необходимо учитывать как минимум: — мобильные телефоны разных размеров; — планшетные/промежуточные ширины, если на них меняется поведение блоков; — ноутбуки; — стандартные десктопные мониторы; — широкие экраны. Нет необходимости рисовать отдельный макет для каждого разрешения, но дизайн должен строиться на понятных правилах адаптации, которые затем сможет реализовать верстальщик. Особенно важно заранее определить: — максимальную ширину контента; — поведение боковых полей; — изменение количества колонок; — переносы текста; — поведение фотографий; — расположение CTA-кнопок; — изменения в блоках при переходе с desktop на mobile. Результат работы. На выходе ожидаю: — полностью готовую мобильную версию лендинга; — полностью готовую десктопную версию; — продуманную адаптивную логику; — структурированный Figma-файл, готовый к передаче верстальщику; — используемые компоненты и стили; — подготовленные/отобранные фотографии для страницы. При отклике, пожалуйста, пришлите примеры именно лендингов или коммерческих сайтов, которые после вашего дизайна были реально сверстаны и запущены. Будет преимуществом опыт работы с performance-лендингами, где дизайн должен не только хорошо выглядеть, но и помогать конверсии. Отдельно напишите, пожалуйста: — работаете ли вы по принципу mobile first; — используете ли Auto Layout и компоненты в Figma; — занимаетесь ли подбором и базовой подготовкой фотографий; — учитываете ли особенности дальнейшей адаптивной верстки при создании макета.