Приклади

П'ятнадцять реальних, опублікованих опитувань, які можна спробувати прямо тут — не скриншоти, не макети. Кожен нижче — це справжній робочий віджет, що завантажує свою реальну конфігурацію полів наживо, точнісінько так, як це відбувалося б на сайті реального клієнта.

Повсякденні сценарії

Контактна форма

Однорядкові поля з реальною перевіркою формату email (Validations.basicEmailValidation), плюс необов'язкове текстове поле.

Опитування NPS

Матриця 0–10 як основна оцінка, у парі з текстовим полем з умовним заголовком, питання якого змінюється залежно від оцінки.

Відгук після покупки

Оцінка + група чекбоксів + необов'язковий коментар — форма, яку використовує більшість опитувань після замовлення/оформлення.

Юзабіліті сайту

Оцінка + радіокнопки + текстове поле, побудовані навколо питання «чи знайшли ви те, що шукали», а не покупки.

Відгук про захід

Випадний список (яка сесія), оцінка та текстове поле для коментаря — поширена форма після вебінару чи заходу.

Заявка на роботу

Два однорядкові поля, випадний список для вибору ролі та обов'язкове текстове поле — мінімальна форма прийому заявок.

Відгук про ресторан

Два окремі поля оцінки (їжа, обслуговування) разом із групою чекбоксів і текстовим полем — показує, що один тип поля можна використати в опитуванні двічі.

Пріоритизація функцій

Група чекбоксів + слайдер діапазону — використовується для оцінки інтересу, а не для збору рейтингу.

Звіт про помилку

Починається з інформаційного блоку форматованого тексту, далі випадний список + обов'язкове текстове поле — форма для прийому звернень підтримки/багів.

Опитування за тригером

Опитування при виході

Радіокнопки + текстове поле — короткий опитувальник, який зазвичай пов'язують із тригером показу при виході з сайту.

Привітальне опитування

Радіокнопки + випадний список, взагалі без вільного тексту — короткий опитувальник, який зазвичай пов'язують із тригером затримки показу.

Демонстрації розширених стилів

Ці чотири приклади навмисно використовують кастомний CSS по максимуму, щоб показати, що взагалі можливо поверх стандартної теми — див. Розширені стилі, щоб зрозуміти, як це працює.

Райдужна тема

Градієнтний фон і градієнтна кнопка надсилання — все зроблено через кастомний CSS на слотах formContainer/buttonSubmit.

Перевернута форма

Одне оголошення — transform: rotate(180deg) на контейнері форми — і вся форма перевертається.

Ретро 90-х

Неонові кольори, пунктирна рамка та заголовок шрифтом Comic Sans — кастомний CSS застосований до окремих слотів і типів полів.

Обери свій шлях

Звичайні радіокнопки, переоформлені в розкладку з карток через власний контейнер слота radioGroup.