Дизайн и вёрстка динамичного лендинга (B2B) с анимациями и интерактивом
20000 ₽
Ищем фриланс‑исполнителя, который сделает дизайн + вёрстку главной страницы (лендинг) для платежной системы (страница для мерчантов) с scroll-анимациями, микро‑интерактивом и подготовкой под мультиязычность через JSON.
1) Цель и сроки
- Цель: презентовать платежное решение для мерчантов и собирать заявки на подключение через форму.
- Сроки: дизайн (Figma) — до 7 календарных дней, вёрстка — до 4 дней после утверждения дизайна.
2) Объём работ
Исполнитель выполняет:
- Дизайн страницы в Figma (desktop + mobile + tablet).
- Вёрстку страницы (адаптивная “резиновая”, кроссбраузерная).
- Реализацию анимаций при прокрутке и интерактива (hover/click).
- Мультиязычность: все тексты вынесены в JSON + переключатель языка.
- Интерактивный блок “география” с картой (один материк).
3) Структура страницы (блоки)
Обязательные:
- Первый экран (value proposition): заголовок, подзаголовок, CTA «Подключиться», вторичный CTA «Посмотреть методы».
- О компании (кратко + доверие/опыт/цифры).
- География работы: Латинская Америка (точный список стран для интерактива предоставим).
- Методы оплаты (карточки/иконки/категории).
- Для кого: мерчанты (e-commerce, сервисы, маркетплейсы, SaaS и т.д.).
- Преимущества (скорость подключения, комиссии, anti‑fraud, надежность/аптайм и т.п.).
- Заявка на подключение (форма вместо “обратной связи”).
- Контакты (email/Telegram/адрес/время работы — дадим).
Дополнительные (нужно заложить в дизайн):
- «Как подключиться» (3–5 шагов: заявка → KYC → интеграция → тест → запуск).
- «Безопасность и соответствие» (тезисы: 3DS/шифрование/anti‑fraud — без юридических обещаний).
- «Интеграции и API» (API/webhooks/SDK + выгоды для разработчиков).
- «Тарифы / модель комиссий» (карточки планов или “индивидуально” + факторы).
- «Статус и надежность» (uptime/мониторинг/SLA/поддержка — если применимо).
- FAQ (5–8 вопросов: сроки подключения, документы, выплаты, возвраты/чарджбеки).
- «Партнёры/банки/провайдеры» и/или «Отзывы/кейсы» (если нет — секции-заглушки под будущее).
4) Анимации, интерактив, карта
- Scroll-анимации: плавные появления секций, stagger для карточек, параллакс/переходы; допускается использование GSAP ScrollTrigger (поддерживает trigger/scrub/pin-механику).
- Микро‑интерактив: выраженные hover/active/focus-состояния кнопок/карточек, tooltips, FAQ-аккордеон.
- География: интерактивная карта одного материка (Южная Америка/ЛатАм) — при наведении страна подсвечивается и показывается название (tooltip/лейбл); активные страны = наш список, остальные можно сделать приглушёнными.
5) Локализация (JSON) и переключатель языка
- Языки проекта: RU / EN / ES, но верстать и наполнять можно только на RU (переводы добавим сами через JSON).
- Все текстовые строки страницы должны храниться в JSON-файлах локализации (например locales/ru.json, locales/en.json, locales/es.json) с одинаковой структурой ключей между языками.
- В дизайне обязателен переключатель языка; размещение должно быть заметным: на desktop обычно в верхних углах, на mobile — above the fold или в меню (ожидаемый паттерн поведения пользователей).
6) Адаптивность и браузеры
- Адаптивная “резиновая” вёрстка под desktop/tablet/mobile.
- Кроссбраузерность: Chrome / Safari / Firefox / Edge (актуальные версии).
- Корректные состояния доступности: видимый focus для интерактивных элементов.
7) Что нужно сдать
- Figma: макеты (desktop+mobile), компоненты/UI-kit, состояния элементов (hover/active/focus), ассеты.
- Исходники вёрстки + инструкция по запуску (README).
- Подключенные анимации/интерактив (включая карту).
- Папка locales/-.json со всеми текстами (минимум полный ru.json) и готовность добавить en.json/es.json по тем же ключам.
8) Требования к кандидату
- Сильное портфолио по современным лендингам (желательно fintech/saas) + примеры работ со scroll-анимациями.
- Готовность уложиться в сроки (7 дней дизайн + 4 дня вёрстка).
Контакт:
@andrey_projectss