Тестове завдання на вакансію Product Design

Орієнтовний час виконання: 2–4 годин.

Мова інтерфейсу макета: англійська.

Макет мобільного Paywall (екран перед оплатою підписки)

• Базовий розмір екрана — 393×852 points (pt), стандартна логічна сітка iPhone 14/15/16.
• Дизайн має коректно адаптуватися в діапазоні ширин від 375pt (iPhone SE) до 430pt (iPhone Pro Max) — використовуйте constraints та auto-layout, щоб елементи не ламалися на краях діапазону. Перевірте макет мінімум на двох контрольних ширинах цього діапазону.
• Преміум підписка має виглядати як найкраща пропозиція та найбільш привабливий вибір.
• Достатньо створити статичний макет у Figma без анімацій чи складних інтерактивних елементів.

Що показати в макеті

• 1. Заголовок — основний привертаючий увагу текст, який мотивує до покупки.
• 2. Блок з описом переваг підписки, що включає ключові бенефіти та функції, які отримує користувач.
• 3. Назву плану/програми, наприклад «Wellness».
• 4. Три варіанти підписки:

•     1 місяць – $9,99;
•     3 місяці – $29,99;
•     12 місяців – $49,99 (виділити як найвигідніший та найкрутіший для користувача).

• 5. Кнопка для дії: «Get My Plan», «Start Now», «Subscribe Now» або аналогічна.
• 6. Елементи довіри (за бажанням): користувацькі рейтинги, відгуки, статистика типу «100k+ users», security badges, гарантії повернення коштів тощо.

Технічні вимоги

• Figma-файл з налаштованими правами доступу для перегляду за посиланням.
• Всі елементи систематизовані у логічні фрейми та зроблені як багаторазові компоненти (кнопка, картка тарифу, іконки переваг тощо — з варіантами станів, де це доречно).
• Auto-layout та constraints для забезпечення адаптивності.
• Виключно безкоштовні шрифти Google Fonts.
• Обрати колірну палітру та візуальні рішення, що відповідають тематиці здоров'я та душевного благополуччя (заспокійливі, природні тони).

Критерії оцінювання

• Візуальна ієрархія та переконливість пропозиції (чи виглядає обраний тариф як найкращий вибір).
• Якість систематизації: логічність фреймів, повторне використання компонентів.
• Коректність adaptivity-логіки на різних ширинах екрана.
• Розуміння продакшн-вимог до paywall.
• Якість UX-копірайтингу (заголовок, опис переваг, CTA).
• Дотримання технічних обмежень (шрифти, розмір екрана).

Результат надішліть на cv@aweb.ua