# ШІ — рутинний помічник викладача ### Каркас доповіді · Методичне об'єднання викладачів комп'ютерних дисциплін **Тернопільський фаховий коледж ТНТУ ім. Івана Пулюя · 2026** --- > **Загальний хронометраж: ~13 хвилин** > > | Блок | Час | > |------|-----| > | Вступ | 1.5 хв | > | Кейс 1 — HTML/CSS урок | 2.5 хв | > | Кейс 2 — Moodle XML | 1.5 хв | > | Кейс 3 — Рецензування | 2 хв | > | Кейс 4 — Документи у .md | 2.5 хв | > | Кейс 5 — Складні проєкти | 2 хв | > | Висновок | 0.5 хв | --- ## 🎙 ВСТУП · 1.5 хв **[Риторичне запитання залу]** > Скільки годин на тиждень ви витрачаєте на підготовку матеріалів — > написання конспектів, складання тестів, перевірку робіт, оформлення документів? *[Пауза. Дати залу подумати.]* Я не кажу про час на саме викладання. Я кажу про **рутину** — ту частину роботи, яка не потребує педагогічного досвіду, але з'їдає левову частку нашого часу. Саме цю рутину я почав передавати ШІ. **Сьогодні я покажу 5 конкретних кейсів** — не теорію, не огляд інструментів, а те, що я реально використовую у своїй роботі. Все що ви побачите — було згенеровано за допомогою Claude *(або назви інструмент який використовуєш)* і зайняло у рази менше часу, ніж якби я робив це вручну. **Головна теза:** > ШІ не думає за тебе — він виконує чорнову роботу, > поки ти займаєшся педагогікою. --- ## 📦 КЕЙС 1 — Розробка навчального уроку · 2.5 хв **[Демонструємо: `css-positioning-lesson.html`]** Тема — **Позиціонування в CSS**. Аудиторія — перший курс, початківці. Що я попросив ШІ зробити: - Розбити тему на логічні блоки - До кожного блоку — інтерактивне демо прямо у браузері - Після кожного блоку — контрольне питання - Правильна відповідь — у прихованому акордеоні **[Показати живу демонстрацію — перемикач position, слайдери top/left, демо z-index]** Результат: самодостатній HTML-файл. Студент відкриває у браузері — і одразу бачить, клікає, перевіряє себе. Без Moodle, без інтернету, без залежностей. **[Показати: `css-positioning-lab.html`]** Окремо — лабораторна робота. Три завдання з наростаючою складністю, стартовий HTML-код, підказки в акордеонах, критерії оцінювання. > Час на створення таких двох файлів вручну — **кілька годин**. > З ШІ — **один детальний запит і 2 хвилини очікування**. --- ## 🗂 КЕЙС 2 — Тести для Moodle · 1.5 хв **[Демонструємо: `css-positioning-moodle.xml`]** По тій самій темі — 10 питань у форматі **Moodle XML**, готових до імпорту. Питання різних типів: одиночний вибір і множинний вибір. Кожне питання містить: - чіткий контекст або фрагмент коду - правдоподібні варіанти-пастки - пояснення до кожної відповіді — правильної і хибних **[Показати структуру XML у редакторі або браузері]** Імпорт у Moodle — три кліки: Банк питань → Імпорт → Moodle XML. > Замість того щоб годинами складати питання і вручну вводити їх у систему — > я описую тему і рівень складності, ШІ генерує XML. --- ## 🔍 КЕЙС 3 — Рецензування студентських робіт · 2 хв **[Демонструємо: `case3-ai-code-review.md`]** Це сценарій, про який рідко говорять, але він економить найбільше часу. Я надаю ШІ код студента і прошу: - знайти типові помилки по темі уроку - пояснити кожну помилку навчально, не критично - запропонувати виправлення **Наприклад, після уроку з позиціонування ШІ перевіряє:** - чи є `position: relative` на батьку при `absolute` на дочірньому - чи не використав студент `z-index` без `position` - чи не переплутав `display: none` і `visibility: hidden` там де це важливо Рівні фідбеку — короткий, детальний, рубричний — я обираю залежно від потреби. **Важлива деталь:** > Я не копіюю відповідь ШІ студенту напряму. > Я використовую її як чернетку — редагую, додаю контекст. > Це економить **70% часу**, але фідбек залишається моїм. --- ## 📝 КЕЙС 4 — Навчальні матеріали у форматі Markdown · 2.5 хв **[Демонструємо: `case4-cheatsheet-student.md` у VS Code з preview]** По тій самій темі позиціонування — шпаргалка для студента. Все головне на одній сторінці: таблиця значень, приклади коду, типові патерни. **[Демонструємо: `case4-guide-teacher.md`]** І окремо — розгорнутий матеріал для викладача: рекомендований порядок пояснення, живі приклади для демонстрації, методичні нотатки, зведена таблиця помилок. Зверніть увагу на формат — це `.md`, не `.pptx`. **[Демонструємо: `case4-md-vs-pptx-promo.md`]** Хочу окремо сказати про це. Для дисциплін де вивчається програмування, Markdown — практичніша альтернатива PowerPoint: - Код у файлі — **живий**, його можна скопіювати і запустити - Відкривається **скрізь** — VS Code, GitHub, будь-який текстовий редактор - **Легко оновити** — змінив рядок, зберіг, готово - Студент зберігає у **своєму репозиторії** — матеріали завжди під рукою І окремий навик для студентів — `README.md` для проєктів на GitHub. Роботодавці дивляться на репозиторій. Гарний README — це вже +1 до враження. --- ## 🚀 КЕЙС 5 — ШІ як помічник складних проєктів · 2 хв **[Демонструємо: `case5-complex-projects.md`]** Останній кейс — і, мабуть, найвражаючий. ШІ дозволяє ставити студентам завдання, які раніше були б нереалістичними для їхнього рівня. Не тому що ШІ робить все за них — а тому що він знімає технічні бар'єри. Студент може сфокусуватися на **ідеї, логіці і результаті**, а не витрачати тижні на вивчення незнайомого API. **Напрямки, які ми вже пробували або плануємо:** - 🎮 Робота з 3D-моделями у браузері — без встановлення спеціального ПЗ - 🌍 Геолокація та інтерактивні карти — реальні, практичні застосунки - 🎓 Навчальні платформи — студенти роблять інструменти для себе і своїх груп - 🎵 Мультимедіа у браузері — аудіо, відео, обробка зображень - 🤖 ШІ всередині проєкту — не просто "використати ChatGPT", а вбудувати AI в логіку застосунку - 📊 Реальні дані та API — погода, фінанси, новини - 🧩 Ігри та симуляції — платформери, алгоритми з анімацією, мультиплеєр > Проєкт, на який без ШІ пішов би **семестр** — > студент з ШІ реалізує **за кілька тижнів**. > При цьому він вчиться більше, бо стикається зі складнішими задачами. *[Пауза.]* Власне, у мене є студенти, які вже реалізували подібні проєкти. **Пропоную передати їм слово. 🎤** --- ## ✅ ВИСНОВОК · 0.5 хв *[Після виступу студентів — або якщо студентів немає]* Підсумовуючи п'ять кейсів: | Кейс | Що зекономлено | |------|----------------| | Урок з інтерактивом | Години на верстку і демо | | Тести для Moodle | Складання і введення питань | | Рецензування | 70% часу на фідбек | | Матеріали у Markdown | Оновлення і підтримка | | Складні проєкти | Технічні бар'єри для студентів | ШІ не замінює викладача. Він забирає **рутину** — і повертає нам час на те, що справді важливо: пояснення, діалог, натхнення. > **Дякую за увагу.** > Готовий відповісти на запитання — і поділитися всіма файлами з сьогоднішньої доповіді. --- ## 📎 Додаток — усі файли доповіді | Файл | Опис | |------|------| | `css-positioning-lesson.html` | Інтерактивний урок | | `css-positioning-lab.html` | Лабораторна робота | | `css-positioning-moodle.xml` | Тести для Moodle | | `case3-ai-code-review.md` | Рецензування робіт | | `case4-cheatsheet-student.md` | Шпаргалка для студента | | `case4-guide-teacher.md` | Матеріал для викладача | | `case4-md-vs-pptx-promo.md` | MD як альтернатива PPTX | | `case5-complex-projects.md` | Складні проєкти | | `conference-script.md` | Цей файл — каркас доповіді | --- *Тернопільський фаховий коледж ТНТУ ім. Івана Пулюя* *Методичне об'єднання викладачів комп'ютерних дисциплін, 2026*