Сторінка студента
Дізнайтеся, як створити сторінку студента, що покращує навчальний досвід.
Інтерфейс студента — це основа вашого курсу. Чистий, зручний для користувача дизайн допомагає студентам зосередитися та підтримує мотивацію, перетворюючи випадкових відвідувачів на відданих учнів.


Власні теми та налаштування дають змогу адаптувати вигляд і стиль вашої сторінки студента, створюючи вишуканий і привабливий дизайн усього за кілька кліків. У цьому посібнику ви дізнаєтеся, як ефективно налаштувати цю сторінку, перетворивши її на центральний хаб, що відображає стиль вашого курсу та забезпечує безперебійний навчальний досвід.
Що таке сторінка студента? На платформі Salebot сторінка студента — це персоналізована панель керування, яка виступає як основний робочий простір для вашого курсу. Вона об’єднує всі інструменти, необхідні учню, даючи йому змогу:
Отримувати доступ до всього контенту та матеріалів курсу,
Відстежувати свій прогрес у модулях і уроках,
Проходити уроки та надсилати домашні завдання,
Взаємодіяти з інструкторами або фасилітаторами.
Це інтегроване середовище створене для того, щоб спростити навчальний шлях, допомагаючи студентам залишатися зосередженими, організованими та мотивованими.

Чому сторінка студента важлива?
Сторінка студента структурує та спрощує процес навчання. Вона дає студентам змогу:
Швидко знаходити потрібні матеріали та продовжувати навчання з того місця, де вони зупинилися.
Легко відстежувати свій прогрес, переглядаючи, які завдання виконано, а які ще очікують на виконання.
Отримувати зворотний зв’язок від інструктора, що сприяє більш персоналізованому та ефективному навчанню.
Де налаштувати сторінку студента
Конструктор курсу доступний у тарифному плані “Businnes”.
Щоб почати, перейдіть до розділу “Курси” в MaviBot.

Далі виберіть курс, для якого ви хочете налаштувати сторінку студента, і перейдіть до його налаштувань.

Після цього ви перейдете на головну сторінку налаштувань курсу, де потрібно відкрити “Сторінка студента”.

Тепер, щоб почати налаштовувати сторінку студента, знайдіть значок шестерні, щоб відкрити меню налаштувань.

Коли ви натиснете на значок шестерні, відкриється меню з налаштуваннями для стандартної (власної) теми, вашої власної (редагованої) теми, а також додатковими налаштуваннями й можливістю додати власні кнопки.

Основна тема
Основна тема сторінки студента складається з попередньо встановлених, готових тем, які дають змогу налаштувати сторінку всього за кілька кліків.

Крок 1: Виберіть колірну схему для Основна тема
Ви можете обрати з 7 світлих тем і 2 темних тем.
Коли застосовано власну тему, кольори всіх основних елементів сторінки оновлюються, зокрема:
Фони (зображення обкладинки, фон сторінки, індикатор прогресу, блоки уроків)
Кнопки
Заповнення індикатора прогресу
Межі, контури тощо.
Крок 2: Виберіть рівень радіуса кутів
a) Нульовий радіус — усі кути та елементи сторінки матимуть квадратний вигляд.

b) Середній радіус — кути та елементи матимуть заокруглений або овальний вигляд.

c) Максимальний радіус — усі кути та елементи сторінки матимуть повністю заокруглені краї.

Чудово!
Тепер ви знаєте, як швидко налаштувати основну тему сторінки студента.
Якщо ви хочете додати додаткові кнопки, завантажити власне зображення обкладинки або застосувати до сторінки унікальну колірну схему, рекомендуємо перейти до наступних розділів цієї статті.
Власна тема
Налаштування у вкладці “Власна тема” дають змогу застосовувати до елементів сторінки студента власні унікальні та різноманітні колірні схеми.

Зверніть увагу
Основну тему та Власну тему можна використовувати разом.
Наприклад, ви можете використати налаштування у вкладці Власна тема, щоб застосувати кольори лише до кількох елементів, а решту сторінки оформити відповідно до вибраної Основної теми.
Колір фону
Це налаштування змінює колір фону всієї сторінки, за винятком окремих елементів.

Натисніть на квадрат, щоб відкрити палітру кольорів і вибрати потрібний колір.

Окрім широкої палітри кольорів для кожного елемента, ви також можете регулювати інтенсивність кольору за допомогою шкали прозорості.
Колір накладання фону
Використовуйте налаштування накладання фону, щоб застосувати єдиний колір до основних візуальних контейнерів на сторінці:
a) індикатора прогресу;
b) окремих блоків уроків;
c) області зображення обкладинки курсу.

Акцентний колір
Налаштування акцентного кольору дають змогу змінити колірну схему основних виділених елементів на сторінці студента, зокрема:
a) кнопок навігації уроків;
b) заповнення індикатора прогресу;
c) меж, фону номерів уроків та подібних елементів.

Колір тексту на фоні сторінки
Це налаштування дає змогу вибрати привабливу колірну схему для тексту, що відображається на фоні сторінки.

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

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

Додаткові налаштування
У додаткових налаштуваннях сторінки студента ви можете завантажити зображення для використання як обкладинку сторінки.

Зверніть увагу
Зображення, завантажене як обкладинка сторінки студента з вашого пристрою, не повинно перевищувати 15 МБ.
Крок 1: Завантаження зображення
Ви можете завантажити зображення безпосередньо з комп’ютера.

Або завантажити зображення за посиланням із вашого файлового сховища.

Перевага завантаження зображення за посиланням із файлового сховища полягає в тому, що як обкладинку можна використати зображення будь-якого розміру.
Для отримання додаткової інформації про те, як користуватися файловим сховищем, зверніться до статті “Файлове сховище".
Крок 2: Висота обкладинки
Після завантаження зображення встановіть відповідну висоту обкладинки на сторінці студента.


Крок 3: Позиція зображення

Ви можете використовувати попередньо задані варіанти розташування щоб вирівняти зображення по ццентру, ліворуч, праворуч або знизу, або виберіть власні налаштування.

Пересуваючи круглий елемент керування, ви можете розташувати зображення саме так, як вам потрібно.
Крок 4: Розмір зображення

Поле поле розміру зображення приймає значення contain / coverа також числові значення в пікселях (px) та відсотках (%).
1) значення contain/cover

2) числові значення

Крок 5: Повторення зображення
Зображення може повторюватися вздовж осі Y, тобто вертикально; вздовж осі X, тобто горизонтально або без повторення.

Крок 6: Прапорці
Щоб покращити досвід студента на його особистій сторінці, ви можете ввімкнути відображення:
індикатора прогресу,
кількості виконаних уроків і
кількості затверджених домашніх завдань.

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

Щоб додати кнопку, відкрийте відповідну вкладку в налаштуваннях сторінки студента.

Потім натисніть “Додати кнопку”.
Після цього відкриється модальне вікно для налаштування кнопки, і введіть текст кнопки.

Тепер вкажіть цільове посилання (URL) для цієї кнопки.

Кольори кнопки автоматично успадковуватимуть палітру основної теми. Однак ви можете змінити це, встановивши власний колір як для фону, так і для тексту.

Потім натисніть “Зберегти”.

Кнопка тепер збережена й активна. Ви побачите її відображеною під індикатором прогресу на сторінці студента.

Ви можете додати кілька кнопок — для цього просто перейдіть до меню налаштувань і натисніть “Додати кнопку” під уже наявною.

Банери

Щоб просувати ключові ресурси, ви можете додати на сторінку студента клікабельні банери. Ці банери можуть посилатися на будь-яку вказану вами URL-адресу, наприклад бот у месенджері, групу спільноти, важливий документ або зовнішній вебсайт.
Давайте перейдемо до налаштування.
Крок 1: Відкрийте налаштування банера
У налаштуваннях сторінки курсу знайдіть і розгорніть “Банери” розділ.

Для цього натисніть на розділ у випадаючому меню налаштувань.:

Крок 2: Завантажте зображення.

Після завантаження зображення з’явиться в полі налаштувань.
Крок 3: Перейдіть до налаштувань зображення.

Для цього натисніть на значок шестерні у верхньому лівому куті завантаженого зображення, і відкриється модальне вікно налаштувань:

Крок 4: Задайте цільове посилання Введіть повну URL-адресу, куди студентів буде перенаправлено після натискання на банер. Це може бути вебсторінка, бот у месенджері або будь-який інший онлайн-ресурс.
Крок 5: Налаштуйте розміри банера Встановіть розмір відображення банера, ввівши значення ширини та висоти.
Важливо: Вводьте в ці поля лише числові значення (наприклад,
300). Не вказуйте одиниці, як-отpxабо%.
Крок 6: Збережіть налаштування Натисніть «Зберегти» щоб застосувати всі налаштування банера.
Налаштування завершено! Ваш клікабельний банер тепер активний. Він з’явиться праворуч на сторінці студента, під індикатором прогресу (за умови, що функцію банерів увімкнено).
Як додати кілька банерів
Ви можете додати кілька банерів на одну сторінку. Для цього завантажте зображення в налаштуваннях і налаштуйте його, як описано вище.
Якщо ви натиснете “Додати зображення” під уже завантаженим зображенням, новий банер з’явиться нижче раніше доданого банера на сторінці студента.
Виберіть варіант завантаження зображення під доданим банером (велика кнопка завантаження внизу):

Зображення було завантажено під раніше доданим банером.

На сторінці студента банер з’явиться в наступному рядку після раніше доданого.

Якщо ви натиснете кнопку “+” праворуч від уже завантаженого зображення, новий банер з’явиться в тому самому рядку, що й раніше доданий банер, на сторінці студента.
Натисніть кнопку “+” праворуч від завантаженого зображення в налаштуваннях сторінки.

Нещодавно завантажене зображення буде розміщено праворуч.

На сторінці студента банер буде відображено в тому самому рядку, що й попередньо завантажений.

Ви можете додавати банери як в одному рядку, так і в наступних рядках одночасно.


Усе готово! Тепер ви знаєте, як повністю налаштувати сторінку студента!
Попередній перегляд сторінки
Після налаштування сторінки студента не забудьте зберегти свій прогрес.

Після збереження налаштувань натисніть кнопку "Попередній перегляд".

Далі виберіть "Перейти на сторінку студента".

Ви перейдете до попереднього перегляду сторінки студента.

У режимі редагування панель попереднього перегляду дає змогу візуально перевірити фінальне розташування елементів. Ви можете побачити, як усі елементи — такі як індикатор прогресу, банери, кнопки та блоки уроків — розміщені та оформлені відповідно до ваших налаштувань.
Last updated