Заполнить бриф Меню
Мы используем файлы cookie и Яндекс.Метрику для анализа и улучшения работы сайта. Продолжая пользоваться сайтом, вы соглашаетесь с политикой конфиденциальности.
Принять

Многошаговая форма с условиями на Tilda

Соберем многошаговую форму на Tilda, которая задает вопросы по ситуации клиента: следующие поля и шаги зависят от предыдущих ответов.
TILDA
ТЕХНИЧЕСКИЕ УСЛУГИ
Спроектируем ветвления, возврат между шагами, подсказки и валидацию. Согласуем, какие ответы и значения передаются в CRM вместе с контактом.
Последовательная анкета без лишних вопросов и заявка с сохраненными параметрами выбора пользователя.

Когда вопросы зависят от ответа

Раскладываем анкету на обязательные, условные и необязательные данные.

01 / Что проверим

Разным клиентам нужен разный набор полей. Сложный набор условий неудобно показывать одним длинным экраном, особенно на телефоне. Длинная анкета может отсеивать клиентов, которым нужна только небольшая часть доступных услуг.

02 / Что усилим

Длинная форма перегружает первый экран. Изменение первого ответа должно перестраивать следующие вопросы и корректировать итоговую заявку. После возврата на предыдущий шаг человек не должен заново заполнять уже введенные данные.

03 / Что настроим

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

Что именно выполняем

Сохраняем итоговые ответы и маршрут прохождения формы в отправляемой заявке. На приемке проверяем возврат на предыдущий шаг, смену ветки и отправку с телефона, чтобы менеджер получил именно выбранный пользователем вариант.

01 / Аудит страницы

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

02 / Усиление предложения

Настраиваем правила показа зависимых полей с учетом предыдущих ответов. После смены выбора скрытые вопросы не должны передавать устаревшие значения или блокировать отправку из-за невидимого обязательного поля.

03 / Настройка обращения

Валидация каждого этапа. Настраиваем обязательность полей в актуальной ветке, в том числе при скрытии вопросов после изменения предыдущего выбора. Карта формы начинается с правил: какой ответ раскрывает дополнительный шаг, какие поля становятся обязательными, что происходит при смене предыдущего выбора.

Технические решения

Практические подходы под конкретную задачу и ограничения проекта.

Карта веток

Описываем доступные пути до разработки. Сложная форма должна сокращать усилия пользователя, а не растягивать обычную заявку на множество бессмысленных шагов. Разбираем правила ветвлений и отдельно определяем, какие ответы нужны для расчета, а какие — только для разговора с менеджером.

Предсказуемый возврат

При смене раннего ответа очищаем потерявшие смысл зависимые значения. Сложную форму полезно прототипировать на реальных примерах клиента. Например, разным типам оборудования нужны разные характеристики, а частному заказчику может не подходить блок реквизитов компании.

Целостная отправка

Проверяем, какие данные видит получатель после прохождения каждой ветки. При изменении анкеты обновляем также карту полей внешнего получателя, иначе новая информация может перестать передаваться. Условно скрытые вопросы не должны неожиданно передавать старые значения, оставшиеся после смены ответа. Такие переходы отдельно воспроизводим в тесте.

Особенность 01

Различаем пустое поле и введенный ноль: это важно для расчетов и логики обязательных вопросов.

Особенность 02

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

Особенность 03

Обсуждаем необходимость сохранения черновика. После добавления ветки нужен новый проход тестовой матрицы, иначе скрытые условия могут конфликтовать.

Проверяем ограничения до начала работ и фиксируем устойчивое решение.

Скрытое поле тоже влияет на заявку

Не допускаем обязательных скрытых полей и устаревших ответов.
Тестируем по карте путей анкеты. На оценку влияют: число развилок, зависимости обязательных полей, количество шагов и способ передачи итогов.
Работаем итеративно: согласуем промежуточный результат до следующего этапа.

Как проходит работа

От первого запроса до стабильной публикации.

01 / Ветвления

Согласуем условия вопросов. Для начала нужны: список вопросов, схема веток, примеры ответов, необходимые поля заявки и требования по сохранению данных.

02 / Реализация

Собираем шаги и переходы. Согласуем схему переходов и отображение прогресса, затем настраиваем условные поля и сохранение введенного там, где это поддержано выбранным решением. Прогоняем все конечные ветки, включая возврат назад и отказ от необязательного шага.

03 / Проходы

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

Портфолио студии

Наши проекты

Подборка реализованных сайтов на Tilda для IT-компаний, производителей, личных брендов, сервисов и проектов в сфере гостеприимства.

Все кейсы студии

Реальные кейсычасть проектов из портфолио студии

Разные нишиединый уровень проработки

Реальные сайтыструктура, дизайн и разработка

Стоимость и условия

Стоимость технической доработки зависит от исходной сборки, объёма изменений, адаптивных состояний, интеграций и необходимости работы с внешними сервисами.

Что нужно для оценки

Ссылка на сайт или проект Tilda, описание задачи, доступ к макету или визуальные примеры — если они есть.

Как определяем объём

Сначала проверяем, что реально решается средствами Tilda, а что требует внешнего API, сервера или отдельного сервиса.

Что получает клиент

Согласованный объём правок, адаптацию под устройства и проверку сценария, которого касается доработка.

Нам доверяют

Наши клиенты

Создаём и развиваем сайты для компаний и экспертов из IT, медицины, HoReCa, производства, образования, туризма и других направлений.

Отзывы клиентов
Часть брендов, с которыми мы работали

Команда Marmelad.digital

О студии

Веб-студия marmelad.digital разрабатывает сайты на Тильде для бизнеса и экспертов: изучаем задачу, проектируем структуру, создаём индивидуальный дизайн, настраиваем аналитику и закладываем основу для SEO-продвижения.

Подробнее о студии

Ключевые специалисты лично ведут проект — от первой структуры до публикации сайта.

Все ключевые этапы — внутри студии
Вадим Марков — разработка сайтов в студии Marmelad.digital

Разработка и техническая реализация

Вадим

Отвечает за структуру, сборку сайтов на Tilda, адаптив, анимацию, формы, аналитику и техническую SEO-подготовку. Следит, чтобы решения работали стабильно на всех устройствах и не усложняли дальнейшее развитие проекта.

  • Архитектура сайта
  • Разработка на Tilda
  • SEO и аналитика
Дарья Маркова — дизайн сайтов в студии Marmelad.digital

Дизайн и визуальная система

Дарья

Формирует визуальное направление проекта: типографику, композицию, сетку, графические акценты и мобильную версию. Дизайн помогает быстро понять предложение и передаёт характер бренда без шаблонных решений.

  • Арт-направление
  • Интерфейс и типографика
  • Мобильный дизайн
30+

реализованных B2B-проектов для IT, HoReCa, производства, медицины, образования и других направлений

7+

лет разрабатываем и запускаем сайты — от анализа и структуры до дизайна, интеграций и публикации

Пишем о разработке сайтов, дизайне и SEO

Публикуем разборы проектов, делимся рабочими решениями и показываем процесс студии на профильных площадках.

Частые вопросы о доработках на Tilda

Это то же самое, что квиз?

Здесь основная цель — заполненная анкета. Квиз может дополнительно давать рекомендацию. У условной формы цель — собрать сложные данные. У квиза дополнительно может быть рекомендация или результат подбора.

Ответы сохранятся при возврате?

В пределах сценария настраиваем нужное поведение. Межсессионное хранение оцениваем отдельно. Проверяем сохранение и пересчет зависимых значений после возврата к предыдущему вопросу.

Можно добавить загрузку файлов?

Проверим штатные возможности и ограничения выбранного маршрута. Загрузка файлов возможна только при поддержке конкретного виджета и безопасного приема вложений. Требования к формату и размеру согласуем заранее.
Как оценить сложность?
По числу веток, зависимостей и требованиям к получателю. Число веток и допустимых сочетаний важнее количества экранов: каждый конечный маршрут потребуется проверить.

Пришлите анкету с условиями

Опишите ветвления вопросов и покажите желаемую заявку. Превратим правила в схему шагов до разработки интерфейса.
Made on
Tilda