Этот раздел описывает, какие настройки доступны в редакторе сценария KYC → Web SDK, как они влияют на виджет и на каком экране отображаются. Все изменения сразу видны в превью справа, а пользователи увидят их в встраиваемом виджете.
Вкладки редактора: «Общие», «Цвет», «Текст», «Языки» и «Liveness». Вкладка «Liveness» появляется, только если в сценарии есть шаг проверки liveness. Превью переключается между видом для телефона и для компьютера; кнопка «Сбросить настройки» возвращает оформление к исходному.
1) Цветовая тема
Верхний переключатель задаёт, в какой теме проектируется интерфейс:
- Тёмная / Светлая — выбранная тема используется в превью и как дефолт при запуске виджета (если не переопределена параметром
themeпри инициализации). - Логотипы и цвета настраиваются отдельно для каждой темы (см. «Общие» и «Цвет»).
2) Общие
Вкладка «Общие» отвечает за логотип, ссылки на ваши документы и камеру компьютера:
- Логотип
- Для тёмной темы — вариант логотипа, который хорошо читается на тёмном фоне.
- Для светлой темы — отдельный вариант для светлого фона.
Форматы — PNG, JPEG, JPG, SVG; размер файла — не больше 50 КБ, файл больше редактор не примет.
Рекомендации: PNG/SVG с прозрачным фоном, без тонких светло‑серых линий на светлой теме и наоборот — ради хорошей читаемости.
- Условия использования — ссылка на ваши условия использования.
- Политика конфиденциальности — ссылка на вашу политику конфиденциальности. Обе ссылки показываются на стартовом экране виджета.
- Разрешить использование камеры десктопного ПК (чекбокс)
- Включено — пользователю доступно прохождение на этом устройстве (кнопка «Продолжить на этом устройстве»), камера и загрузка фото работают в браузере ПК.
- Выключено — предлагается перейти на телефон по QR‑коду/ссылке; съёмка выполняется на мобильном устройстве.
3) Цвет
Вкладка «Цвет» задаёт фирменные цвета виджета: 9 цветов в трёх группах. Набор задаётся отдельно для тёмной и светлой темы — переключите тему вверху редактора.
| Группа | Цвета |
|---|---|
| Фон | «Основной фон», «Фон вторичный», «Активный фон» |
| Текст | «Текст основной», «Текст вторичный» |
| Главный цвет | «Начальный», «Начальный (доп.)», «Успех», «Ошибка» |
Советы по контрасту: — Проверяйте читаемость кнопок и инпутов на всех состояниях (hover/active/disabled). — Сохраняйте достаточную контрастность текста к фону (WCAG 2.1 AA).
4) Текст
Вкладка показывает поля того экрана, который сейчас открыт в превью справа: пролистайте шаги сценария стрелками и правьте тексты нужного экрана. Отдельно доступны общие элементы и тексты отказов. Ниже — основные экраны.
4.1. Стартовый экран (онбординг + QR)
Здесь задаются:
- Заголовок («Проверка личности»).
- Вводные пункты‑инструкции (подготовить документ, включить камеру, убедиться в освещении и т.п.).
- Юридическая приписка о согласии на обработку ПДн (настраивается как обычный текст).
- Блок с QR‑кодом и подписи к нему (а также альтернативная ссылка «Скопируйте эту ссылку…»).
- Подпись кнопки «Продолжить на этом устройстве» (появляется, если разрешена камера ПК в «Общих»).
Пункты инструкций добавляются кнопкой «Добавить пункт» и удаляются значком корзины; порядок пунктов не меняется.
4.2. Инструкции для фотографирования документа
Отдельный экран с подсказками как правильно сфотографировать документ. Примеры типовых пунктов:
- Достаньте документ из обложки;
- Положите документ на ровную поверхность;
- Держите телефон вертикально;
- Документ должен быть виден полностью, не обрезайте края.
Старайтесь формулировать короткие и понятные требования. Избегайте двусмысленности: «не должно быть бликов/пальцев, перекрывающих поля» лучше вынести отдельным пунктом.
4.3. Инструкции для селфи с документом
Подсказки как сделать селфи с документом:
- Возьмите документ в руку и смотрите в камеру в момент фотографирования;
- Документ и ваше лицо должны быть полностью видны (документ — рядом с лицом, не закрывает части лица).
4.4. Проверка на liveness
Тексты экрана проверки liveness правятся здесь, как и у других шагов. Цвет маски лица на этом экране задаётся во вкладке «Liveness» — см. раздел 6.
4.5. Тексты статусов/успеха
Здесь можно изменить подписи на экранах после выполнения шага (например, «Спасибо, мы приняли ваш документ», текст кнопки «Продолжить» и т.п.). Если распознавание не удалось, виджет сам отрисует экран с указанием причины (см. раздел «Ошибки» в общем KYC‑разделе).
5) Языки
Во вкладке «Языки» отмечаются галочками языки интерфейса виджета: English, Spanish, Russian, German, French, Portuguese и другие. Порядок выбранных языков меняется перетаскиванием.
В виджете есть переключатель языка, пользователь выбирает из включённых. При открытии виджет берёт сохранённый выбор пользователя в этом браузере, затем язык браузера, иначе — английский; всё в пределах языков сценария. Подробнее — Подключение → Язык интерфейса.
Рекомендации:
* Включайте только те языки, которые релевантны вашей аудитории, чтобы не перегружать переключатель.
* Если вы используете собственные формулировки в «Текст», согласуйте перевод с локализаторами (для корпоративных формулировок).
6) Liveness
Вкладка есть, только если в сценарии есть шаг проверки liveness.
«Цвет маски» — цветовая схема, которой виджет раскрашивает маску лица на проверке liveness. Шесть вариантов: «Оригинал» (по умолчанию), «Лёд», «Сталь», «Мята», «Фиалка», «Золото».
Что где отображается в виджете
- Логотипы и цвета — на всех шагах (верхняя область/хедер, кнопки, иконки успеха/ошибки).
- Ссылки на условия и политику — на стартовом экране.
- Тексты — на соответствующих шагах сценария: вступление/QR → документ → селфи → успех/результат.
- Языки — в переключателе языка виджета.
- Цвет маски — на экране проверки liveness.
Если сценарии связаны
Сценарии можно связать в личном кабинете (KYC Редактор): сессия, начатая с одним из них, выбирает сценарий группы по первому документу пользователя. Виджет при этом остаётся виджетом сценария входа — того, чей scenarioId передан в setupKYC:
- от сценария входа — цветовая тема, логотипы, цвета, тексты, языки, «Условия использования» и «Политика конфиденциальности», «Разрешить использование камеры десктопного ПК», URL мобильного перенаправления в случае успеха, а также адрес вебхуков на ваш сервер («Бэкэнд колбэк URL») и секретный ключ сценария (им шифруется
clientKey, см. Работа с clientKey); - от выбранного сценария — шаги и их проверки, а также цвет маски лица на проверке liveness («Цвет маски» на вкладке «Liveness»).
Пока сценарий не выбран, первый шаг показывает документы всех связанных сценариев, сценарий входа — первым; панель «Какие документы подходят для верификации?» перечисляет документы и страны каждого сценария, рамка документа — от сценария входа. Когда документ выбрал сценарий, виджет показывает экран успеха и сразу продолжает шагами выбранного сценария.
Поэтому оформление и тексты настраивайте у сценария, scenarioId которого передаёте в виджет, а цвет маски liveness — у каждого связанного сценария с шагом liveness.
Практические советы по брендингу
- Загружайте два варианта логотипа — для тёмной и светлой темы.
- Для логотипов используйте SVG или PNG с прозрачным фоном, файл — до 50 КБ.
- Проверьте контраст кнопок и полей во всех состояниях.
- Тексты делайте короткими, требования — по пунктам.
- На экранах с камерой обязательно напоминайте про полную видимость документа и отсутствие бликов/перекрытий.
Где править поведение виджета (неоформительские параметры)
Оформление и тексты настраиваются здесь, в редакторе Web SDK. Технические параметры запуска (scenarioId, clientKey, theme, successCb, closeCb) передаются при инициализации виджета на стороне вашего сайта или приложения — см. Подключение и Работа с clientKey.
Готово. После сохранения настроек Web SDK все новые сессии KYC начнут отображать виджет с вашим брендингом и текстами.
