Представьте: пользователь только что отменил подписку на Pro-тариф. Через минуту он получает email с просьбой ответить, почему ушёл. Шанс, что он откроет это письмо — меньше 5%. In-app survey решает эту проблему: вопрос появляется прямо в интерфейсе сразу после отмены. Конверсия в ответ подскакивает до 30%. Именно это даёт in-app survey — опрос, встроенный в контекст действия.
Мы 5+ лет разрабатываем сложные веб-приложения и реализовали in-app опросы для более чем 20 проектов. Гарантируем, что система не повлияет на Core Web Vitals и не создаст лишних запросов к API. Как показывает практика, внедрение in-app survey окупается в среднем за 2-3 месяца за счёт роста удержания на 15-20%.
Какие проблемы решает in-app survey?
Email-опросы теряют до 90% целевой аудитории: письма попадают в спам, забываются, открываются не в том контексте. In-app survey решает эту проблему — пользователь отвечает в момент, когда впечатление о функции ещё свежо. Результат: точная обратная связь, NPS с привязкой к действию, меньше отказов при сборе данных.
Сравнение эффективности: in-app против email
По данным исследований, конверсия in-app опросов в 3-6 раз выше, чем email. Причина — сокращение пути: не нужно переходить по ссылке, вводить логин. Всё происходит в одном окне. Наш опыт показывает, что даже короткий опрос из 3 вопросов собирает более 200 ответов за неделю на аудитории в 1000 пользователей.
Как устроена система опросов?
Система строится на двух компонентах: бэкенд на Laravel (таблицы survey, questions, responses) и фронтенд-виджет на React. Движок проверяет условия показа: событие, план пользователя, минимальное количество сессий, cooldown между ответами.
Схема базы данных
Schema::create('surveys', function (Blueprint $table) {
$table->id();
$table->string('name');
$table->string('trigger_event'); // 'feature_used', 'upgrade_cancelled', 'idle_30_days'
$table->json('trigger_conditions'); // {"min_sessions": 3, "plan": ["pro", "enterprise"]}
$table->integer('delay_seconds')->default(0);
$table->integer('cooldown_days')->default(30);
$table->boolean('is_active')->default(true);
$table->timestamps();
});
Schema::create('survey_questions', function (Blueprint $table) {
$table->id();
$table->foreignId('survey_id')->constrained()->cascadeOnDelete();
$table->text('text');
$table->enum('type', ['single_choice', 'multi_choice', 'text', 'scale', 'nps']);
$table->json('options')->nullable();
$table->integer('order')->default(0);
});
Schema::create('survey_responses', function (Blueprint $table) {
$table->id();
$table->foreignId('survey_id')->constrained();
$table->foreignId('user_id')->nullable()->constrained()->nullOnDelete();
$table->json('answers'); // {"q_1": "option_a", "q_2": "Great product"}
$table->string('trigger_event')->nullable();
$table->timestamps();
});
API: получение актуального опроса
class SurveyController extends Controller
{
public function getForEvent(Request $request): JsonResponse
{
$event = $request->input('event');
$user = auth()->user();
$survey = Survey::where('trigger_event', $event)
->where('is_active', true)
->get()
->first(function ($survey) use ($user) {
// Проверяем cooldown
$lastResponse = SurveyResponse::where('survey_id', $survey->id)
->where('user_id', $user->id)
->latest()->first();
if ($lastResponse && $lastResponse->created_at->diffInDays(now()) < $survey->cooldown_days) {
return false;
}
// Проверяем условия
$conditions = $survey->trigger_conditions;
if (isset($conditions['plan']) && !in_array($user->plan, $conditions['plan'])) {
return false;
}
return true;
});
if (!$survey) return response()->json(null);
return response()->json([
'id' => $survey->id,
'delay' => $survey->delay_seconds,
'questions' => $survey->questions()->orderBy('order')->get(),
]);
}
public function submit(Request $request, Survey $survey): JsonResponse
{
SurveyResponse::create([
'survey_id' => $survey->id,
'user_id' => auth()->id(),
'answers' => $request->input('answers'),
'trigger_event' => $request->input('event'),
]);
return response()->json(['success' => true]);
}
}
Frontend: SurveyWidget
// hooks/useSurvey.ts
export function useSurvey(event: string) {
const [survey, setSurvey] = useState<Survey | null>(null);
const triggerEvent = useCallback(async () => {
const data = await fetch(`/api/surveys/for-event?event=${event}`).then(r => r.json());
if (!data) return;
// Показываем с задержкой
setTimeout(() => setSurvey(data), data.delay * 1000);
}, [event]);
return { survey, triggerEvent, dismiss: () => setSurvey(null) };
}
// Использование в компоненте фичи
function FeatureComponent() {
const { survey, triggerEvent, dismiss } = useSurvey('feature_export_used');
useEffect(() => {
// Триггер после успешного экспорта
triggerEvent();
}, []);
return (
<>
<FeatureUI />
{survey && <SurveyModal survey={survey} onClose={dismiss} />}
</>
);
}
SurveyModal с динамическими типами вопросов
function SurveyModal({ survey, onClose }: SurveyModalProps) {
const [answers, setAnswers] = useState<Record<string, any>>({});
const [step, setStep] = useState(0);
const currentQuestion = survey.questions[step];
const isLast = step === survey.questions.length - 1;
const submit = async () => {
await fetch(`/api/surveys/${survey.id}/submit`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ answers, event: survey.trigger_event }),
});
onClose();
};
return (
<div className="fixed inset-0 bg-black/30 flex items-end sm:items-center justify-center p-4 z-50">
<div className="bg-white rounded-xl p-6 w-full max-w-md shadow-2xl">
<div className="flex justify-between mb-4">
<span className="text-xs text-gray-400">{step + 1} / {survey.questions.length}</span>
<button onClick={onClose} className="text-gray-400 hover:text-gray-600">✕</button>
</div>
<QuestionRenderer question={currentQuestion} value={answers[currentQuestion.id]}
onChange={val => setAnswers(prev => ({ ...prev, [currentQuestion.id]: val }))} />
<div className="flex justify-end mt-4">
<button onClick={isLast ? submit : () => setStep(s => s + 1)}
className="bg-blue-600 text-white px-4 py-2 rounded-lg text-sm">
{isLast ? 'Отправить' : 'Далее'}
</button>
</div>
</div>
</div>
);
}
Сравнение каналов опросов: in-app vs email vs popup
| Характеристика | In-app survey | Email-опрос | Popup (всплывающее окно) |
|---|---|---|---|
| Контекстность | Полная (привязан к событию) | Низкая (открывается вне продукта) | Средняя (появляется на странице, но не привязан к действию) |
| Конверсия в ответ | 10-30% | 2-5% | 5-10% |
| Влияние на UX | Минимальное (показывается после действия, с задержкой) | Не влияет | Высокое (перекрывает контент) |
| Сложность интеграции | Средняя (требуется бэкенд + виджет) | Низкая (простая форма) | Низкая (вставка кода) |
| Типы данных | Только выборочные (целевые события) | Случайная выборка | Все посетители |
In-app survey лучше email в 3-6 раз по отклику, а popup проигрывает по UX.
Что входит в работу
- Миграции БД и модели Eloquent
- REST API с кэшированием через Redis (снижение нагрузки на 80%)
- React-виджет с поддержкой 5 типов вопросов
- Админ-панель для просмотра ответов и управления опросами
- Документация по API и настройке, код в вашем репозитории
- 2 недели бесплатной поддержки после деплоя
Типичные ошибки при внедрении in-app survey
Распространённые проблемы и их решение
1. **Слишком много вопросов** — снижает отклик. Оптимум: 2-4 вопроса. 2. **Нет cooldown** — пользователь видит опрос каждый раз, это бесит. Ставьте минимум 30 дней. 3. **Показ на всех страницах** — должен быть привязан к конкретному событию. 4. **Игнорирование мобильной версии** — виджет должен корректно работать на экранах < 375px. 5. **Отсутствие обработки ошибок** — если API недоступен, виджет не должен ломать интерфейс.Начало работы
По данным Wikipedia, контекстные опросы повышают отклик на 30-50% по сравнению с внешними каналами.
Оставьте заявку — мы оценим ваш проект за один рабочий день. Укажите стек, количество пользователей и события, которые хотите отслеживать. Система in-app опросов обычно окупается за две недели за счёт точной обратной связи и роста удержания.
Сроки: от 4 до 10 рабочих дней в зависимости от сложности. Гарантии: фиксированные сроки, полная документация, код в вашем репозитории. Свяжитесь с нами — мы поможем внедрить контекстные опросы, которые действительно повышают метрики. Получите консультацию прямо сейчас.