Методическая разработка занятия

Клуб «Я тоже не понимал, а теперь - понял!»

Перевод с учительского на человеческий: через мемы и чат-боты (дэшборд спасателя собственных двоек)

📚 Информатика + Промпт-инжиниринг 🎓 8 класс (14–15 лет) ⏱ 2 занятия × 40 мин

🔥 Проблема

⚠️Непонимание ошибокУчитель успевает только поставить отметку, но не объяснить, где именно и почему решение неверно.
📉«Застой» сильных учениковЕсли задача решена быстро, нет персонального задания под уровень — ребёнок ждёт остальных.
😰Нарастающая тревожность«Я всё делаю неправильно, но никто не скажет как правильно».
🤯Напряжение в классе«Все вроде стараются, но непонятно, куда двигаться», спросить у учителя — «некогда».

🚀 Продукт

Команда учеников создает одностраничный сайт, который визуализирует одну школьную тему, которая раньше была непонятна для ученика, но потом он в ней разобрался и хочет поделиться этим с другими. Он состоит из одного HTML-файла с информацией, которая помогает разобраться в теме. Сайт может быть показан учителю, одноклассникам или родителям как наглядный итог работы.

Сценарий занятия: 6 спринтов

Ход занятия глазами учеников. Учитель — заказчик и навигатор, а не лектор.

Этап 1 «Погружение» (5 мин)

Погружаются в роль заказчиков и разработчиков; распределяют роли (копирайтер мемов, промт-инженер, UX-дизайнер).

Результат этапа: Распределенные роли, список тем-школьных кошмаров

Этап 2 «Сбор боли» (10 мин)

Собирают топ-3 самых непонятных школьных темы, переводя их на язык мемов и бытовых аналогий.

Результат этапа: Список тем с мемами (например, «Квадратные уравнения = Tinder для чисел»)

Этап 3 «Инжиниринг» (15 мин)

Формулируют базовый инженерный промпт объемом ~100 слов с тегами [ТЕМА], требованиями к стилю и запретными словами. Тестируют генерацию структуры чата.

Результат этапа: Промпт-шаблон .txt + скриншот неудачной первой попытки ИИ

Этап 4 «Верстка» (20 мин)

Генерируют готовый сайт по выбранной теме, экспортируют HTML-код, проверяют адаптивность под смартфон.

Результат этапа: Рабочая ссылка на сайт-чат

Этап 5 «Отладка» (10 мин)

Проводят тестирование на другой команде класса, фиксируют фидбек и вносят одно итерационное изменение.

Результат этапа: Заполненный опросник тестировщиков и обновленная версия страницы

Этап 6 «Защита» (10 мин)

Выступают перед классом-заказчиком, обосновывая логику промпта и показывая, как мем спасает от академической абракадабры.

Результат этапа: Презентация процесса (история диалога с ИИ) и финальный продукт

Что создают ученики

Материальный итог занятия, который можно открыть, показать и передать

💬

Одностраничный сайт-чат

index.html → GitVerse → Публичный URL

Цифровой образовательный ресурс

Состоит из одного HTML-файла с информацией, помогающей разобраться в теме
Формат чата: объяснение через диалог с ИИ, мемы и бытовые аналогии
Адаптивный дизайн: корректно отображается на смартфоне
Опубликован в публичном репозитории — доступен по постоянной ссылке
Может быть показан учителю, одноклассникам или родителям как наглядный итог работы

🔗 Посмотреть пример готового сайта ученика

Материалы и инструкции

Готовые методические материалы. Раскройте блок и нажмите кнопку для печати компактного PDF.

📋

1. Рабочий лист команды (Этапы 1-2)

Распределение ролей и сбор тем-кошмаров.

Посмотреть содержание

Блок А: Распределение ролей

Промт-инженер: _________________________
Копирайтер мемов: _________________________
UX-дизайнер: _________________________

Блок Б: Топ-3 темы-кошмара

Тема: _______________ | Мемная аналогия: _________________________
Тема: _______________ | Мемная аналогия: _________________________
Тема: _______________ | Мемная аналогия: _________________________

📝

2. Шаблон промпта (Этап 3)

Готовый шаблон инженерного промпта (~100 слов) с примером заполнения.

Посмотреть шаблон

Универсальный шаблон промпта:

"Ты — мой друг-одноклассник, который отлично разбирается в [ТЕМА]. Объясни мне эту тему так, будто мы болтаем на перемене. Используй:
- Простые слова и короткие предложения
- Мемы и бытовые аналогии
- Формат диалога: я задаю вопросы, ты отвечаешь
- Запрещено: сложные термины без объяснения, академический стиль
Создай HTML-страницу в формате чата".

✅ Пример заполнения (биология, тема «Митохондрии»):

"Ты — мой друг-одноклассник, который отлично разбирается в митохондриях. Объясни мне эту тему так, будто мы болтаем на перемене. Используй: простые слова и короткие предложения; мемы и бытовые аналогии (например, 'митохондрия — это электростанция клетки, она вырабатывает энергию как батарейка в телефоне'); формат диалога: я задаю вопросы, ты отвечаешь. Запрещено: сложные термины без объяснения, академический стиль. Создай HTML-страницу в формате чата".

🚀

3. Инструкция по публикации в GitVerse

Пошаговое руководство с иллюстрациями интерфейса.