Задача

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

Этапы работы

Этап 1. Перенос блоков

  • Выбрать на сайте-доноре подходящие блоки: секции услуг, цены, отзывы, хедер и футер, формы.
  • Аккуратно перенести их в Figma в нужной последовательности (сверху вниз).
  • Дать блокам логичные названия в слоях.

Этап 2. Уникализация дизайна

  • Шрифты: заменить существующие на наши шрифты (предоставленны, допускается пара вариантов: основные и акцентные). Соблюдать шрифтовую иерархию (заголовки, подзаголовки, основной текст, кнопки).
  • Цвета: применить фирменную палитру (цвета приложены).
  • Контент: заменить тексты на наши (переданны).
  • Изображения и лого: вставить наши логотипы и картинки (предоставленны).

Этап 3. Мобильная версия

  • Адаптировать все десктопные блоки для мобильных экранов (ширина - 320-420px).
  • Ориентироваться на то, как аналогичные блоки выглядят на мобильной версии сайта-донора (поведение, перестроение, упрощение элементов, скрытие второстепенного).
  • Уменьшить размеры шрифтов, выстроить элементы в столбик, сохранить читаемость.

Требования к исполнителю / Знания и навыки

  • Умение работать в Figma с компонентами, стилями (text styles, color styles), сетками (auto layout, constraints).
  • Понимание сеточной структуры сайта (например, размеры колонок, расстояние между элементами).
  • Владение принципами шрифтовой иерархии (крупные заголовки, средние подзаголовки, мелкий текст).
  • Знание UI/UX - блоки должны быть логичными и приятными глазу: единые отступы, выравнивание, контрастность.

Формат сдачи

Ссылка на Figma-макет (читаемый / просмотровый). Слои подписаны, стили и шрифты хорошо организованы. Два состояния: Desktop + Mobile.

Адаптивная верстка заглушки сайта

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