Scratch — это блочный программный язык и визуальная среда, разработанные Массачусетским технологическим институтом (MIT) для обучения и введения детей в мир программирования. Он позволяет создавать интерактивные проекты, игры и анимации, используя графический интерфейс и перетаскивание блоков кода.
На самом деле в «Скретч» все не так сложно, как кажется на первый взгляд. Да, эта среда разработки отличается от высокоуровневых языков программирования, но именно блочный способ работы с кодом позволяет Scratch завоевывать сердца миллионов.
Сегодня вы узнаете, как можно быстро и легко создать игру по мотивам игры Rainbow Friends. В уроке мы пошагово разберем, как создаются радужные друзья в Scratch, какие блоки нужно использовать для наладки их взаимодействия и как в итоге запустить эту игру.
Если вам удобнее смотреть урок в видеоформате, запускайте ролик от школы программирования «Пиксель», который размещен внизу статьи.
Рисуем главных персонажей
Если вы пропустили современные тренды, то напоминаем, что основная сюжетная линия игры про радужных друзей заключается в том, что однажды ночью автобус, полный пассажиров, свернул не на ту дорогу и попал в аварию, в которой все игроки потеряли сознание. Очнувшись, они попадают в незнакомую комнату в доме, который кишит монстрами. Целью игроков станет выполнение заданий и побег от монстров.
Созданием именно такого хоррора мы с вами и займемся.
Сначала нам необходимо нарисовать всех главных персонажей. Чтобы сэкономить время, можно взять только трех: Блю (Синий), Грин (Зеленый) и Оранж (Оранжевый или Рыжий).
Начнем наше программирование в Scratch с рисунка Грина, то есть Зеленого. Несложно догадаться, что для его изображения будет использован именно зеленый цвет. Для этого выбираем его в палитре. Выбирайте любой оттенок, который вам нравится, ведь это ваша игра, и выглядеть она должна в соответствии с вашими желаниями!
Сегодня мы будем много рисовать кистью, так как форма монстров очень произвольная, и ее сложно создать, используя геометрические фигуры. Кликаем на кисть и начинаем рисовать силуэт Грина.
Главная особенность Грина в том, что у него неестественно длинные руки и очень короткие ноги.
Если у вас не получается нарисовать силуэт без отрыва кисти — не страшно. Можно останавливаться и составлять форму из нескольких линий, главное — не забывайте соединять их, чтобы потом можно было воспользоваться инструментом заливки.
Теперь берем инструмент заливки и нажимаем на пространство внутри контура. Теперь наш монстр должен полностью окраситься в зеленый цвет. Если после нажатия на заливку все пространство стало зеленым, это значит, что в контуре есть пробелы, обратите на это внимание.
У каждого уважающего себя монстра должны быть глаза. Для этого выбираем инструмент «круг» и растягиваем небольшие кружки в тех местах, где, по вашему мнению, должны быть глаза.
Тем же самым способом рисуем зрачки, только круги будут в несколько раз меньше и черного цвета. Чтобы персонаж был максимально идентичен оригинальному герою, можно сделать зрачки разного размера.
Теперь настала очередь рта, пожалуй, самой пугающей части любого монстра. Просто берем кисть и рисуем черную улыбку.
Внутри нее так же кистью прорисовываем белым остроконечные зубы.
Следующий шаг — длинный красный язык, как у змеи.
После чего нам нужно объединить все элементы с помощью функции «группировать». Следующим действием перенесем персонажа в центр игрового поля и переименуем его, назвав словом «Зеленый». Отлично, мы уже на самом деле программируем радужных друзей и наш первый монстр готов к тому, чтобы стать элементом игры.
Оранжевый
Следующий монстр — Оранж. Чтобы его создать, выбираем нужный цвет и с помощью кисти рисуем необходимый контур.
Этот монстр похож на динозавра с короткими ручками и очень длинным хвостом. При этом вы можете немного его видоизменять, ведь это будет полностью ваша игра. Создаем контур и заливаем его, как и в первом случае, но только оранжевым цветом.
Глаз у нас будет один, ведь монстр стоит боком. Также добавляем зрачок.
Последний штрих — острые зубы, которые тоже нужно нарисовать кистью. Теперь выделяем все, что мы нарисовали, и добавляем в центр поля, называем этот спрайт кодовым именем «Оранжевый».
Теперь Грин и Оранж вместе находятся в одной комнате. Но скоро мы добавим к ним еще одного «соседа».
Синий
Последний монстр, который будет в нашей игре — Блю. Он синего цвета и имеет корону на голове. Как и в первые два раза, рисуем контур, который в целом напоминает человека, и заливаем синим цветом понравившегося оттенка.
Рот этого персонажа тоже черный, а самое важное — у него нет зубов. Но зато у него есть небольшая капелька, которая вытекает изо рта. Это элемент, напоминающий нам о том, что персонаж немного сошел с ума. Рисуем каплю белым.
Далее рисуем два глаза. Но в одном зрачок будет стандартным и круглым, а в другом это будет перекрестие, которое можно нарисовать инструментом «Линия». Последним штрихом будет золотая корона, которую тоже рисуем с помощью кисти. Теперь группируем спрайт и называем его словом «Синий».
Рисуем аватар наблюдателя
Кого должен пугать монстр? Конечно же, нас. Поэтому мы должны нарисовать себя как наблюдателя. Мы можем обозначить себя кубиком для простоты. Для этого выбираем серый цвет и инструмент прямоугольник, после чего рисуем вертикальный прямоугольник. Следующий шаг — копируем прямоугольник и поворачиваем его на 90 градусов.
Соединяем детали вместе, затем дважды отражаем их по вертикали и горизонтали и получаем наш аватар наблюдателя (или игрока).
Еще нам нужен фон. Он должен быть очень простым и ненавязчивым, чтобы не отвлекать внимание от игры, поэтому выбираем приглушенный темно-коричневый цвет, растягиваем огромный прямоугольник по всему игровому полю.
Игра по мотивам «Радужных друзей»: программируем персонажей
Теперь добавляем блоки, которые будут выполнять свой функционал. Выбираем следующие блоки друг за другом:
- Когда флажок нажат.
- Необходимо показаться.
- Установить размер 40%.
Копируем эту команду и дублируем на всех монстров, параллельно расставляя их на игровом поле так, чтобы в начале игры можно было выбрать, против какого монстра мы будем играть.
Далее нужно выбрать блок «перейти в X:(-157), Y: 5». И добавим условие: если мышь нажата и спрайт касается указателя мыши (то есть мы выбрали определенного монстра), то нам нужно спрятаться.
Далее пишем вторую команду: когда спрайт Грина нажат — передать новое сообщение «начало Зеленый», затем показаться и установить размер 50. Далее — перейти в новые координаты в правый верхний угол х: 145, у: 87. Затем цикл «повторять всегда» — плыть 1 секунду в случайную точку, и, если касается края, нужно оттолкнуться. Таким образом мы настроили совершенно произвольное движение нашего персонажа.
Если у вас возникают вопросы, как именно это должно выглядеть, можете обратиться к видеоролику, который расположен внизу статьи.
Теперь копируем часть скрипта с верхнего условия и переносим его в настройку для второго персонажа, которого зовут Оранжевый. Ставим блок «перейти в координаты X:149, Y: 11» в связке со скопированным условием.
Затем возвращаемся к Грину и копируем вторую команду, затем вставляем ее в скрипт Оранжевого. Только теперь необходимо изменить сообщение на «начало Оранжевый».
Теперь поступаем аналогично с настройками Блю. Копируем часть с условием, но перед этим вставляем: перейти в координаты X:(-10), Y: 15. Затем условие. И целиком переносим вторую команду, при этом меняем сообщение на «начало Синий».
IT для детей: делаем первый запуск собственной игры
Давайте посмотрим, что у нас получилось. В начале игры нам доступно 3 монстра, и тот, на которого мы кликаем, становится активным, начиная свое беспорядочное движение по полю. В это время остальные стоят на месте.
Теперь нам надо сделать так, чтобы при выборе одного монстра остальные варианты пропадали. Для этого переходим к Грину и пишем программу: «когда я получу сообщение», «начало Оранжевый», цикл «повторять всегда», «спрятаться».
Аналогичные команды прописываем для Блю. Теперь мы видим, что, если мы выбираем Синего или Оранжевого, Зеленый пропадает. Дублируем эту команду на скрипт к Оранжевому и меняем сообщения на «начало Синий и Зеленый». И так же делаем с Блю, меняем сообщение на «начало Зеленый и Оранжевый». Проверяем. Теперь, если мы наводим курсор мыши на одного монстра, другие должны пропадать с экрана.
Переходим к кубику, которым мы сейчас управляем. Прописываем условие «когда флажок нажат, надо спрятаться».
Появится нужно тогда, когда монстр будет выбран. То есть когда появится сообщение «начало Зеленый». После этого надо показаться. Затем переходим в координаты X:(-180), Y: (-110) и устанавливаем размер 35. Затем ставим бесконечный цикл «повторять всегда», в котором мы пропишем движение кубика.
Всего нашему аватару игрока будет доступно 4 направления. Поэтому внутрь цикла закидываем 4 условия «если, то». Если клавиша вверх нажата, то изменить Y на 10, если клавиша вниз нажата, то изменить Y на -10, если клавиша вправо нажата, то изменить X на 10, если клавиша влево нажата, то изменить X на -10. И еще одно условие: если касается Зеленого, передаем новое сообщение «Конец». Также добавляем новую команду: когда я получу сообщение «Конец», «спрятаться» и «стоп все».
Давайте попробуем все это запустить. Если наш кубик коснулся зеленого монстра и движение остановилось, значит, все выполнено верно на 100%.
Но помимо зеленого монстра у нас еще синий и оранжевый, поэтому дублируем нашу команду и меняем условия: когда получу сообщение «начало Оранжевый» и в конце если касается Оранжевого. И так же делаем для синего: если получу сообщение «начало Синий», и в конце если касаюсь Синего.
Таким образом, при выборе любого из монстров у нас начнет работать программа для управления кубиком и его остановки при касании монстра.
Программирование для школьников: улучшаем созданную игру
Теперь надо добавить небольшой элемент, который внесет азарта этой игре. Этим элементом станет секундомер. Для этого добавим команду в скрипт кубика. Нам необходимо создать переменную, которую мы назовем «время». Когда мы получим «начало Зеленый», задать значение переменной «время», равное нулю.
После чего поставим цикл «повторять всегда», и внутри будем изменять значение времени на 1, но с интервалом в 1 секунду. В результате у нас появится реальный секундомер.
Так как у нас есть не только Грин, дублируем эту команду дважды и меняем сообщение на «начало Синий» и «начало Оранжевый».
Давайте протестируем нашу игру. Если секундомер работает, значит, все сделано верно!
Осталось сделать оповестительную табличку, которая сообщит о том, что мы проиграли. Для этого создаем новый спрайт и с помощью инструмента «Текст» пишем слово «Конец» ярким красным цветом.
Скрипт у этого спрайта очень простой. Когда флажок нажат, надо спрятаться, а когда получено сообщение «Конец», надо показаться и перейти в центр, то есть в координаты 0 по X и Y.
И снова проверяем игру! Если персонажи двигаются, секундомер работает, а при соприкосновении с ними появляется надпись «Конец» — ваша игра готова.
Если вам понравилось создавать пошагово игру на «Скретч», то приглашаем на обучение в школу программирования «Пиксель». Здесь дети с младшего возраста изучают кодинг, создают свои игры и анимации. В будущем это помогает им изучать высокоуровневые языки программирования, а получение ИТ-знаний в раннем возрасте становится мощной базой для превращения в высококлассного ИТ-специалиста.
Кроме курсов по «Скретч», школьники изучают здесь 3D-моделирование, Roblox, Python, компьютерную грамотность, web-дизайн и т. д. Отправляйте ребенка на обучение в «Пиксель», чтобы он в будущем смог быстрее определиться с тем, какое ИТ-направление ему больше подходит. Обучение в Pixel проводят опытные специалисты онлайн или в очном формате. А группы набираются небольшие, чтобы можно было уделить внимание каждому ребенку.
