service
Дизайн SaaS-платформи для онбордингу simpl.cx
Задача
Спроєктувати UX/UI дизайн SaaS-платформи simpl.cx для створення інтерактивних відео-турів онбордингу з кабінетом клієнта, адмін-панеллю та вбудованим JS-віджетом.
Зроблено
Аналіз
Прототипи
Дизайн
Кабінет користувача
Головний дашборд клієнта надає швидкий огляд усіх призначених онбординг-маршрутів (Journeys): скільки курсів пройдено повністю, а які перебувають у процесі вивчення. Картки останніх переглянутих проєктів містять наочні кругові індикатори прогресу для зручного повернення до навчання.
Вхід і реєстрація
Лаконічні екрани входу та реєстрації для клієнтського порталу виконані у чистій світлій стилістиці з синіми акцентами бренду. Мінімум полів та зрозуміла валідація дозволяють користувачу за лічені секунди перейти до перегляду навчальних матеріалів.
Вхід
Реєстрація
Проєкти
Розділ проєктів у кабінеті користувача структурує всі доступні навчальні програми та продукти компанії. Перехід усередину проєкту відкриває тематичні категорії та послідовність відео-маршрутів із відображенням тривалості й статусу проходження.
Усі проєкти
Сторінка проєкту
Перегляд маршруту (Journey View)
Інтерактивний плеєр маршруту поєднує покроковий відеоряд із прогрес-баром етапів, текстовим описом, додатковими файлами (Resources) та квізами для перевірки знань. Якщо у користувача виникають питання, він може прямо з вікна перегляду надіслати запит у підтримку або забронювати дзвінок із менеджером.
Плеєр маршруту
Запит на допомогу
Завершення відео
Чекпойнт та матеріали
Планування зустрічі
Фінал маршруту
Інші сторінки
Додаткові екрани кабінету користувача охоплюють керування профілем, зміну пароля безпеки та видачу спільного доступу колегам для перегляду проєктів.
Налаштування профілю
Надання доступу
Зміна пароля
Вбудований віджет JS
Окремою фічею сервісу є компактний JS-віджет, який вбудовується поверх будь-якого сайту чи вебдодатка клієнта. Користувач може запускати інтерактивні відео-підказки, читати описи, завантажувати ресурси та звертатися по допомогу без переходу на зовнішню платформу.
Згорнута кнопка віджета
Вибір категорії
Відеоплеєр у віджеті
Корисні матеріали
Меню запуску віджета
Список маршрутів
Опис етапу
Форма допомоги
Давайте працювати разом.
Готові втілити ваше бачення у життя? Давайте об'єднаємося для вашого наступного проєкту та разом створимо щось незабутнє.
Адмін-панель
Дашборд адміністратора агрегує аналітику по всій платформі: загальну кількість завантажених відео, створених проєктів, маршрутів та активних користувачів. Інтерактивний графік переглядів за день, тиждень або місяць та стрічка останніх дій команди дозволяють відстежувати залученість клієнтів.
Вхід і реєстрація в адмін-панель
Окремі форми авторизації та створення акаунту для адміністраторів і авторів контенту з корпоративною поштою.
Вхід в адмінку
Реєстрація автора
Медіатека
Вбудоване сховище файлів дозволяє авторам організовувати відеоролики та презентації по папках, завантажувати нові матеріали через drag-and-drop і швидко перевикористовувати їх у різних онбординг-маршрутах.
Усі медіафайли
Завантаження відео
Створення папки
Вміст папки
Каталог маршрутів
Пропрацьовано всі стани розділу маршрутів (Journeys): від порожнього екрана під час першого запуску та створення категорій до таблиці активних і чернеткових сценаріїв із метриками переглядів.
Порожній стан
Список категорій
Створення категорії
Маршрути в категорії
Конструктор маршрутів
Покроковий редактор дозволяє легко зібрати інтерактивний маршрут: задати назву, додати відеоролики з медіатеки, прикріпити корисні посилання та налаштувати контрольні точки (Checkpoints) із тестовими запитаннями для перевірки користувача.
Новий маршрут
Вибір відео з файлів
Налаштування тесту
Порожній редактор
Доданий відеокрок
Додавання чекпойнту
Фінальний заклик до дії (CTA)
На завершальному етапі маршруту автор може налаштувати цільову дію для користувача (Final Call to Action) — наприклад, перехід за посиланням, бронювання дзвінка або відправку форми, а також захист від випадкового виходу без збереження змін.
Сценарій маршруту
Попередній перегляд
Налаштування CTA
Вихід без збереження
Керування проєктами в адмінці
У розділі проєктів адміністратор об'єднує окремі маршрути у цілісні навчальні простори для різних продуктів або клієнтських команд і генерує код для вбудовування віджета.
Список проєктів
Додавання маршруту
Порожній проєкт
Наповнений проєкт
Підписка та налаштування
Службові розділи платформи охоплюють вибір тарифного плану SaaS-підписки, керування учасниками команди та розподіл ролей доступу.
Тарифні плани
Команда проєкту
Особисті дані
Налаштування акаунту
Запрошення учасника























































