Дизайн · опубликован 01.10.2026

Сверстать анимированный HTML5-баннер 1887×100 px по готовому макету (макет в Gimp XCF)

Бюджет 6 000 ₽ — 6 000 ₽ Срок 31.10.2026

Описание

Требуется специалист по HTML5-баннерам / frontend-верстальщик для подготовки анимированного баннера, который будет размещён на стороннем сайте. Исходные данные

  • � есть готовый макет баннера в формате GIMP XCF
  • � исходный размер: 1887 × 100 px
  • � баннер уже согласован владельцем сайта в статичном PNG-виде
  • � баннер размещает программист стороннего сайта
  • целевая ссылка уже передана владельцу сайта. Задача: Сделать HTML5-версию баннера с лёгкой, плавной циклической анимацией в правой части. В правой части расположены четыре отдельных объекта/изображения виндеров: красный, синий, белый и коричневый. Нужно, чтобы они автоматически и плавно менялись местами по кругу. Стартовый порядок: красный → синий → белый → коричневый. Далее каждые 2 секунды порядок сдвигается на одну позицию: синий → белый → коричневый → красный
  • белый → коричневый → красный → синий
  • коричневый → красный → синий → белый. После этого цикл повторяется. Требования к анимации: — плавный горизонтальный циклический сдвиг без рывков
  • � длительность перехода между позициями: ориентировочно 0,35–0,6 секунды
  • � задержка между сменами: около 2 секунд
  • � без звука, видео, всплывающих элементов, раскрытия баннера и тяжёлых эффектов
  • � предпочтительно CSS-анимация
  • JavaScript — только при объективной необходимости
  • � без внешних библиотек, CDN, внешних шрифтов и внешних ресурсов
  • � баннер должен выглядеть аккуратно как в неподвижном первом кадре, так и во время анимации. Адаптация на сайте: — рабочая ширина баннера: от 962 до 1887 px
  • � на ширине 1887 px высота баннера — 100 px
  • � при уменьшении ширины до 962 px баннер должен пропорционально уменьшаться до 51 px по высоте
  • � на экранах менее 980 px сайт отображает фиксированный макет шириной около 980 px и уменьшает его целиком, поэтому отдельную мобильную версию делать не требуется
  • � необходимо проверить читаемость и корректность анимации как минимум на ширинах: 1887, 1440, 1200, 1024 и 962 px. Что нужно передать по итогам: Готовый HTML5-баннер в формате, пригодном для установки программистом сайта: HTML/CSS/JS и папка с ассетами либо ZIP-архив. Все исходные файлы проекта, чтобы баннер можно было при необходимости изменить в будущем. Статичный PNG fallback в размере 1887 × 100 px
  • при необходимости — вариант для минимального отображаемого размера 962 × 51 px. В отклике прошу указать: — 2–3 примера сделанных вами HTML5-баннеров с анимацией
  • � используете ли вы CSS-анимацию или JavaScript и почему
  • � стоимость и срок
  • � что конкретно входит в стоимость
  • � сколько раундов правок включено
  • � сможете ли вы извлечь и подготовить отдельные элементы из XCF-файла или нужны отдельные PNG-слои от меня

Нужна помощь?

Напишите в поддержку Telegram. Поможем с оплатой, сделками, профилем и публикациями.

Поддержка