Дизайн landing page у Figma

Мета

Створити адаптивний, сучасний дизайн лендингу з перемикачем мов UA/EN, формами лідів і заявок на вакансії, у стилі референсів для компанії AdAlchemists. Сфера діяльності компанії - аффілейт маркетинг (Google - реклама мережа google ads через яку налаштовується реклама. Nuntra - напрямок товарів котрі рекламуються, по іншому БАДи).

Обсяг робіт

• Дизайн у Figma: сторінка(и), компоненти, авто-лейаути, змінні/стилі (кольори, типографіка, spacing).
• Адаптивні фрейми: 1440/1280 (desktop), 768 (tablet), 390/360 (mobile).
• Компонентна система: хедер/футер, кнопки, поля форм, картки вакансій, поп-ап заявки.
• Інтерактивний прототип: ховер-стани, плавний скрол до «Вакансії», відкриття поп-апу.
• Моушн-референс: анімований херой із логотипом (опис руху/кадри/специфікації для подальшої реалізації).
• UI Kit: палітра, шрифти, сітка, іконки, стани елементів, правила відступів.
• Передача: посилання на Figma-файл з правами view/comment + експорт стилів/змінних.

Референси стилю

• https://devils.inc/
• https://www.traffbraza.com/

Контент і структура

4.1 Шапка

• Назва команди, кнопки перемикання мови UA / EN, кнопка Join the team / Хочу в команду (скрол до блоку «Вакансії»).

4.2 1-й блок (герой, анімація)

• Анімація з логотипом і текстом(щось середнє між тим, як реалізовано у devils.inc і traffbraza.com):
  • UA: Повний стек для топ-баєрів Google Ads.
  • EN: The full stack for top Google Ads buyers.

4.3 2-й блок (інфраструктура)

• Опис нашої інфраструктури (УТП, підхід подібні до devils.inc):
  1. EN: Multiple white-page types • UA: Різні типи white-page
  2. EN: Internal billing solutions • UA: Внутрішні платіжні рішення
  3. EN: Unlimited account farming • UA: Необмежений фарм акаунтів
  4. EN: Agency accounts, no fees • UA: Агентські акаунти без комісій
  5. EN: Unlimited caps with guarantors • UA: Необмежені капи з гарантами
  6. EN: Private offers, direct partners • UA: Приватні офери, прямі партнери
  7. EN: Truly unlimited budgets • UA: Справді необмежені бюджети
  8. EN: Full reporting automation • UA: Повна автоматизація звітів
  9. EN: Account setup support, verification • UA: Саппорт заливу акаунтів та верифікація
  10. EN: Launch scheme testing team • UA: Відділ тестування заливу
  11. EN: Tech tasks: 1h avg • UA: Техзадачі: 1 год

4.4 3-й блок (фокус і метрики)

• Текст заголовку Google + Nutra:
  1. 2000+ лідів щодня на гео / 2000+ leads daily per GEO
  2. 10k+ чистий середній заробіток баєра / 10k+ average net profit per buyer
  3. $m+ місячний оборот команди / $m+ monthly team turnover
  4. 35+ гео в роботі / 35+ GEOs

4.5 4-й блок (лід-форма «Шукаєте трафік?»)

• Ліва частина — заголовок
  • EN: Looking for quality Google Ads traffic?
  • UA: Шукаєте якісний трафік з Google Ads?
• Ліва частина — текст
  • EN: Leave a request — our biz dev team will contact you to start the cooperation.
  • UA: Залиште заявку — наша біздев-команда зв’яжеться з вами, щоб розпочати співпрацю.
• Права частина — форма заявки
  • Поля: Ім’я; Нік у Telegram; Назва компанії; Посилання на сайт компанії; Коментар (за бажанням).

4.6 5-й блок (Вакансії)

• Секція вакансій у форматі «pin-board»: картки з булавками, горизонтальний скрол, анімація котра показує що можно прокрутити в бік  + у кожній кнопка «Join the team / Хочу в команду». Нижче заголовки та текст карток
  1. Media Buyer
     • UA: Працюєш у нутрі 1+ рік і маєш $10k+ з будь-якого джерела? Так — беремо і переводимо під Google Ads.
     • EN: 1+ year in Nutra and $10k+ on any source? Yes—we’ll onboard you and transition you to Google Ads.
  2. Teamlead with team
     • UA: Ведете 3 або більше баєрів від 6 місяців? Дамо приватні офери, ставки та інфраструктуру — допоможемо перейти у Google Ads.
     • EN: Managing 3 or more buyers for at least 6 months? We’ll provide private offers, payouts, and infrastructure—transition to Google Ads.
  3. Tech department
     • UA: Вмієш кодити, але хочеш розвиватися в аффіліейт маркетингу?
     • EN: Can you code but want to grow in affiliate marketing?
  4. Affiliate department
     • UA: Вмієш згладжувати кути? Знаєш, як працювати з партнерами легко й просто? Ти свій у цій сфері?
     • EN: Can you smooth things over? Make partner relations easy? Are you at home in affiliate?
  5. Support department
     • UA: Немає досвіду, але хочеш розвиватися? Готовий продуктивно працювати й вивчати всі тонкощі?
     • EN: No experience but want to grow? Ready to work productively and learn all the nuances?
• Поп-ап із формою подачі заявки
  • Поля: Ім’я; Нік у Telegram; Вакансія (підтягується автоматично); Завантаження CV; Коментар (за бажанням); Звідки про нас дізналися:
    • Побачив(ла) рекламу
    • Прочитав(ла) на форумах
    • Розповіли друзі
    • Інше
  • Кнопка про політику конфіденційності: увімкнена галочка обов’язкова; якщо зняти — заявку надіслати не можна.

4.7 Підвал

• Назва команди з анімацією, кнопка Join the team / Хочу в команду (скрол до блоку «Вакансії»).

Вимоги до дизайну

• Стиль і кольори: візуальний стиль та палітра мають відповідати кольорам і айдентиці логотипа. На базі логотипа сформувати:
  • первинну/вторинну палітри, нейтральні відтінки, градієнти (за потреби);
• Типографіка: шрифтову систему підібрати під айдентику (2–3 ієрархічні рівні); задати стилі у Figma (Text Styles).
• Загальний підхід до motion: у кожному блоці передбачити мікровзаємодії та вхідні анімації елементів. Стиль і кольори — згідно з айдентикою логотипа (логотип у вкладенні).
• Сітка та композиція: 12-колонкова сітка для desktop, адаптивні сітки для tablet/mobile; базовий контейнер 1200–1280 px; чіткі відступи.
• Компоненти та стани: кнопки, інпути, селекти, чекбокси/радио, теги, картки вакансій, поп-ап; варіанти станів: default/hover/pressed/disabled/focus/error/success.
• Перемикач UA/EN: помітний у хедері на всіх брейкпойнтах.
• Адаптивність: макети для 1440/1280 (desktop), 768 (tablet), 390/360 (mobile); правила поведінки блоків.
• UI Kit: палітра з токенами, типографіка, сітка, іконографіка, відступи/радіуси/тіні; документація застосування кольорів (фон/текст/бордери/акценти).

Посилання на лого команди:

https://drive.google.com/drive/folders/1W84dIKw-wGntEP-nARe0gO6-RXLSyEWa?usp=sharing