Техническое задание: Форма лидогенерации «Получить подарок»

Цель проекта

Повысить конверсию сайта за счёт внедрения отложенного всплывающего предложения. Форма должна срабатывать после определённого времени пребывания пользователя на сайте, мотивируя его оставить контактные данные для получения бонуса.

Страницы для внедрения

• Главная страница сайта
• Страница раздела «Проекты»

Функциональные требования

1. Триггер показа кнопки

• Через 60 секунд (1 минуту) после загрузки любой из целевых страниц в правом нижнем углу экрана должна плавно появляться кнопка с текстом «Получить подарок».
• Цвет акцентных элементов (кнопки, рамки, выделения): #ed3947.

2. Модальное окно с формой

При клике на кнопку «Получить подарок» открывается модальное окно с формой для заполнения. Поля формы:

• Фамилия (текстовое поле)
• Имя (текстовое поле, обязательное)
• Отчество (текстовое поле)
• Номер телефона (поле с валидацией, обязательное)
• Адрес электронной почты (поле с валидацией, обязательное)
• Комментарий (многострочное текстовое поле)

3. Согласие на обработку данных

• Под полями формы размещается чекбокс с текстом: «Я соглашаюсь на обработку моих персональных данных и принимаю условия политики конфиденциальности».
• Слова «политики конфиденциальности» должны быть кликабельной ссылкой. При клике открывается новое модальное окно с полным текстом данного документа.
• Отправка формы возможна только при активированном чекбоксе.

4. Отправка данных и обратная связь

• В конце формы - кнопка отправки «Получить подарок».
• После успешной отправки формы пользователь видит информационное сообщение во всплывающем окне: «Спасибо за заявку! Менеджер свяжется с вами для подтверждения условий вашего подарка».
• Форма должна валидироваться на стороне клиента (проверка заполнения обязательных полей, корректности email и телефона).

5. Интеграция с почтой

• После отправки формы на указанный заказчиком email-адрес должно приходить уведомление о новой заявке.
• Тема письма: «Подтвердить подарок».
• В теле письма должны отображаться все данные, заполненные пользователем в форме.

Технические примечания

• Код должен быть кроссбраузерным и адаптивным.
• Время до показа кнопки (60 секунд) должно легко настраиваться в коде.
• Учесть, чтобы форма не показывалась повторно пользователю, который уже её заполнил (использовать cookie или localStorage).