Обучение не заканчивается получением каких-либо знаний, часто требуется не только знать и уметь, но и выработать определенный навык. Навыки вырабатываются с практикой, а ускорить процесс получения этой самой практики помогают тренажеры. Я уже писала про то, как можно сделать простые тренажеры в табличном редакторе или в консоли Python, а сегодня мы будем делать игру - тренажер в Scratch. Постараюсь написать подробно, чтоб с программой мог справиться даже тот, кто ни разу в жизни не программировал, но готов посидеть и разобраться вместе со своим ребенком. Тому, кто и сам умеет писать программы, достаточно прочитать идею, а тому, кто не хочет разбираться - приведу в конце статьи ссылку на готовый проект.
Где пишем?
Ничего на компьютер устанавливать не потребуется. Вполне достаточно прейти на сайт и найти там кнопочку "Начни создавать". Не будем ставить себе цель еще и английский за одно подучить, так что установим на сайте русский язык.
Опыт показывает, что к играм, написанным самостоятельно, люди оказываются очень лояльны, так что можно себе позволить на первый раз сделать очень простой сюжет (иначе мы закопаемся и совсем ничего не сделаем): по сцене бежит мышка, а ее пытается догнать кошка, но мышь бежит постоянно, а кошке, чтобы сделать прыжок, надо решить пример. Если коту удается догнать мышь, то победа наша.
Готовим участников и декорации.
В нижней правой части экрана находятся две синие кнопки. Правая нужна для добавления в игру заднего фона, а левая - для добавления героев. Нажмем на правую, в выпадающем списке находим и нажимаем лупу и ищем понравившуюся декорацию. В Scratch это называется сценой и я предлагаю сегодня выбрать сцену в виде театральной сцены, вдруг ребенок так лучше терминологию запомнит?
Первый герой игры - это кот, он уже создан, теперь добавим второго - мышь. В Scratch всё, что способно двигаться по экрану, называется спрайт.
Видим, что мышь добавилась прямо на кота, не беда, по местам их можно расставить прямо мышкой (компьютерной, зажимает левую кнопку и тащим).
Начинаем делать анимацию. Движение мыши.
Начнем писать программу с простого, то есть с мыши. Нажимаем на спрайт мыши, убеждаемся, что ее изображение появилось в правом верхнем углу белого поля и начинаем писать код.
В левой части экрана расположены доступные операторы (команды), находим среди них "идти 10 шагов" в блоке "движение" и перетаскиваем в удобное место белого поля.
Если теперь нажать на эту синюю надпись, то мышь сдвинется. Покажите это ребенку! Обратите внимание на то, что число 10 написано на белом фоне, значит вместо него можно написать другое число или переменную. Попробуйте написать вместо 10 единицу или 40, посмотрите что изменится.
Но нам, конечно, хочется, чтобы мышь двигалась без нашего участия. Нет ничего сложного в том, чтоб это организовать. Надо только сказать программе когда выполнять команду. В нашем случае всегда, так что находим в блоке "Управление" команду "повторять всегда". Внутри этой оранжевой "детальки" есть место для других команд, причем добавить их можно туда сколько угодно, хотя кажется, что место там есть только для одной. Помещаем туда нашу "идти 10 шагов", и, чтобы мышь не бежала слишком быстро, добавим еще "ждать 1 секунд". Если сейчас нажать на блок команд, то мышь будет двигаться до тех пор, пока от нее не останется виден один хвостик. Не хочется каждый раз за этот хвостик ее вытаскивать из-за кулис, вместо этого добавим в программу еще одну команду: "установить x в -40", выполняться она должна не на каждом шаге, а при запуске программы, так что расположить эту команду надо перед блоком "повторять всегда".
Спрайт мыши позволяет нам сделать анимацию более интересной, для этого добавим еще внутрь блока "повторять всегда" оператор "следующий костюм" из группе команд "Внешний вид". Костюм - это изображение спрайта, у данной мыши их два, и теперь они будут чередоваться каждую секунду.
Сделаем так, чтобы программа запускалась по нажатию флажка, расположенного над сценой. Для этого есть специальный оператор "когда флаг нажат", помещаем эту команду выше всех остальных.
Длину шагов и их частоту можно варьировать по своему усмотрению, пока предлагаю установить "идти 3 шагов", "ждать 0.5 секунд".
Мультик про мышь готов! Можно его запустить и посмотреть на полном экране.
Основная часть программы. Вопросы и шаги кота.
Нажмем на спрайт кота в правой нижней четверти экрана и убедимся, что перед нами открылся чистый лист с изображением кота в правом верхнем углу. Сразу начнем программу с оператора "когда флаг нажат", добавим "установить x в -140" и (пока еще пустой) блок "повторять всегда".
Теперь момент сложный для того, кто не занимался программированием. Надо понять, что если мы хотим пользоваться в программе какими-то данными, то эти данные приходится где-то хранить и уметь к ним обращаться. Для этого придумали переменные - что-то вроде ника/клички/погоняла наших данных. Возьмет наша программа число 5, назовет его "число_1" и везде вместо "5" может использовать "число_1". Кажется, что это очень неудобно, но это только кажется, потому что значение в "число_1" можно задавать автоматически, а вот "5" придется набирать каждый раз вручную. Набираемся немного терпения и разбираемся на примере.
Для начала переменные надо создать, для этого прокручиваем список команд почти до самого конца находим там и нажимаем белую кнопочку "Создать переменную", в появившемся окне задаем имя "число_1". Нам потребуется две переменных, так что аналогично делаем для "число_2".
Чуть ниже списка переменных находим команду "задать моя переменная значение 0", дважды перетаскиваем этот оператор на поле ввода кода. В выпадающем списке первого выберем "число_1", а второго "число_2".
А записывать в переменную мы будем случайное число, Scratch нам это позволяет. В группе "Операторы" находим "выдать случайное от 1 до 10".
Мне сейчас хочется, чтобы мои дети немного привыкали умножать за пределами таблицы Пифагора, поэтому число_1 задам не до 10, а до 20, а вы можете делать по своему усмотрению, хоть оба числа от 0 до 2, хоть оба трехзначных, только не перегните палку, если на решение примера ребенок будет тратить по 2 минуты, то вряд ли ему понравится игра.
Числа готовы, надо чтобы программа научилась задавать примеры. Тут будет еще один непривычный далекому от программирования человеку момент, чтобы что-то вывести на экран, надо сначала сделать из этого строку. Получившуюся строку мы вложим в уста кота. Я не буду словами описывать используемые операторы, предлагаю посмотреть фото. Прокомментирую только заполнение окошек. В первое переносим из области операторов нашу переменную число_1, во второе пишем знак умножения (если хотим точку в середине строки, то зажимает на клавиатуре ALT, убеждаемся, что нажат NumLock, набираем на дополнительной клавиатуре число 250, отпускаем ALT), в третьем окошке переменная число_2, а в четвертом - знак вопроса. А еще - будьте аккуратны когда добавляете один оператор в первое окошко второго, смотрите, чтобы при этом выделялось только первое окошко, а не два сразу и только тогда отпускайте левую кнопку мыши.
После того как вопрос задан, пользователь введет на него ответ. Если ответ правильный, то кот должен сделать шаг вперед. Там, где действия программы зависят от каких-то условий, используются условные операторы. Находим блок "если то", вставляем в шестиугольник между его словами зеленый шестиугольник "__= 50", в первое окошко этого зеленого оператора перетягиваем из области команд голубой овал с надписью "ответ", а вместо числа "50" овальный зеленый оператор умножения, а уже в него - оранжевые овалы с именами наших переменных.
А в белый зазор нам надо поместить список действий, которые поручено выполнять коту, если ответ окажется правильным. Ну, это мы уже делали с мышью: "идти 10 шагов" и "следующий костюм" помещаем друг за другом.
Собираем все блоки в одну программу и получаем
Теперь основная часть программы готова, можно дать ее "настроить" ребенку. Ну, скорости движения подправить, например, чтоб кот мышку догнать мог, но не слишком быстро. Можно разрешить поиграться с размерами героев, их меняют на панели под изображением сцены. Главное, когда ребенок все это будет делать, ему придется решать примеры, причем добровольно, а как надоест, он сам остановится.
Завершение работы программы, определение победителя
Осталось совсем чуть-чуть. Если кот догнал мышь, то он победил. Конечно, снова потребуется условный оператор "если то". На это раз в шестиугольник между "если" и "то" надо добавить оператор голубого цвета "касается указатель мыши ?" и вместо "указатель мыши" выбираем "Mouse1".
А что делать, если условие выполниться? Сообщить о победе! Можно оформить ее сообщением кота, а можно сделать чуть более яркой. Напишу про второй вариант.
В правой нижней четверти экрана нажимаем на панель "Сцена". В левом верхнем углу открываем вкладу "Фоны". Кликаем правой кнопкой мыши на "Theater" и в выпадающем меню выбираем "Дублировать". Кликаем мышью на созданный только что "Theater2" и добавляем на него текст "Победа" с помощью соответствующей кнопки, находящейся на панели в центральной части экрана. Аналогично делаем фон "Theater3" с надписью "Увы! Не в этот раз".
Возвращаемся на вкладку "Код", выбираем спрайт кота и велим ему в случае победы "переключить фон на Theater2" и остановить выполнение скриптов с помощью оператора "стоп все". А в самое начало программы добавим "переключить фон на Theater".
А в каком случае мы будем считаться проигравшими? (кстати, а надо ли? Может быть вашему ребенку больше понравится играть, если проиграть невозможно?) Предлагаю объявить поражение в том случае, если мышь успеет уйти со сцены. Возвращаемся в код, который мы писали для Mouse1 и добавим ей проверку на столкновение с концом сцены. В знакомый нам "если то" вставляем условие "касается указатель мыши?", заменив в нем "указатель мыши" на "край", а в белый зазор "переключить фон на Theater3" и "стоп все".
Вот такая игра получилась, не забудьте ее сохранить, для этого выберите "Файл" - "Сохранить на свой компьютер"
Ссылка на готовый проект.
Ну и, как я обещала вначале статьи, добавляю ссылку на готовый проект, его можно редактировать по своему усмотрению или играть в том виде, в котором он есть.
Буду рада любой обратной связи и замечаниям по содержанию, подаче материала, количеству и качеству иллюстраций. Возможно, это статья окажется не последней на тему создания игр в Scratch.