Идею этой сказки, а может и не сказки, поймёт не только взрослый, но даже карапуз!
Э. Успенский, «Пластилиновая ворона»
Когда я был маленьким крокодилом, я никогда не лазил по пожарным лестницам.
Э. Успенский, «Чебурашка и крокодил Гена»
У меня хорошая новость для тех, кто не любит выстукивать на клавиатуре буковки!
Обычная программа — это текст. Но есть язык, в котором программа собирается из блоков, как собирается игрушка из кубиков Лего.
Сборка домика из набора конструктора Лего
- Знакомьтесь — это язык программирования Скретч!
- Если Скретч-приложение ещё не установлено у вас на компьютере, пройдите в раздел Установка Скретч.
- Откройте Скретч-приложение, и вы увидите на экране:
- Всё это называют средой программирования:
Среда программирования:
- исполнитель
- среда исполнителя
- СКИ
- поле для сборки программы
Исполнитель находится в центре, но его можно перетащить мышкой в любое место его среды
Исполнитель может работать в двух режимах: командном и программном.
В командном режиме исполнитель получает команду, выполняет её и ждёт следующую. Чтобы задать команду на исполнение, нужно щёлкнуть на ней в СКИ.
Задание. Щёлкните в СКИ на команде 
, и вы увидите, как кот сместится на 10 шагов.
В программном режиме исполнитель получает программу — последовательность команд и выполняет по порядку все команды в неё входящие.
Программы собираются из блоков в поле программы, и именно этот режим интересен для нас — программистов!
Задача 1 (1 кук). Поскорее «окунуться» в Скретч.
«Сначала дело, потом умные слова» — говорит роботландский Лисёнок. — Хорошо! Давайте без лишних слов погрузимся в мир программ Скретча!
Для начала повторяйте за мной!
- Перетащите мышкой блок с командой
в поле для сборки программы. Щёлкните на этом блоке. Программа (состоящая из одной команды) сработает, кот сместится на 10 шагов.
Исполнитель смещается на 10 шагов
- А если нужно сделать 20 шагов? Перетащите ещё одну команду и соедините два блока вместе. Щелчок на нашей программе (на любом блоке), и кот смещается на 20 шагов.
Исполнитель смещается на 10 шагов, а потом ещё на 10
- На самом деле второй блок не нужен. В белом окошке любого блока можно менять значение.
Щёлкаем, кот смещается на 20 шагов.
Исполнитель смещается на 20 шагов
- Воспользуемся блоком . Он расположен в СКИ в группе Управление. Этот блок резиновый! В него можно поместить сколько угодно блоков, и то, что им охвачено, повторяется непрерывно.
Задано непрерывное повторение команды движения
- Не будем больше щёлкать на программе!
Добавьте в начало программы блок . Он расположен в СКИ в группе События.
Посмотрите, над средой исполнителя расположены две кнопки: — зелёный флажок и красный восьмиугольник.
Флажок запускает программу, если она начинается с блока . Восьмиугольник останавливает выполнение.
Щёлкаем на флажке!
Кот непрерывно повторяет команду движения и уходит из среды
- Жалко кота! Добавим в программу ещё одну команду: . Она расположена в группе Движение.
Щёлкаем на флажке и видим, что кот совершает бесконечную прогулку, не покидая среды, но…
- Упс! Почему справа налево кот идёт вверх ногами? Дело в том, что когда кот отталкивается, он поворачивается. Стиль поворота задаётся в паспорте исполнителя.
Чтобы открыть паспорт кота, нажмите в разделе Спрайты, и измените стиль вращения:
Меняем стиль вращения в паспорте исполнителя
Теперь кот не будет ходить подобно мухе по потолку! Проверьте.
Сохраним работу на диске (Файл/Сохранить как) и продолжим.
Спрайты, костюмы, скрипты, звуки
Спрайт — газированный напиток, со вкусом лайма и лимона, принадлежащий американской компании The Coca-Cola Company.
Википедия
А у нас в Роботландии предпочитают чай с сухариками!
Но… Дело в том, что исполнитель в Скретч (тот самый кот, которого мы заставили бегать туда-сюда) является спрайтом!
Спрайт (англ. Sprite — фея; эльф) — графический объект в компьютерной графике. Спрайт может свободно перемещаться по экрану под управлением программы.
- Если вы думаете, что исполнителем в среде Скретч может быть только фирменный кот, вы ошибаетесь!
- Удалим кота и назначим исполнителем летучую мышь.
- Удалить спрайт из среды можно разными способами.
- Можно взять инструмент Ножницы и щёлкнуть этим инструментом на коте:
Берём ножницы и щёлкаем на коте
- Можно открыть контекстное меню на исполнителе и выбрать в нём позицию Удалить:
Удаляем через контекстное меню спрайта
Контекстное меню — это меню, связанное с тем объектом, на котором щёлкают правой кнопкой мыши.
- Можно открыть контекстное меню на паспорте исполнителя и выбрать в нём позицию Удалить:
Удаляем через контекстное меню паспорта спрайта
Важно! При удалении спрайта программа, которая для него написана, тоже будет удалена.
Итак, кот удалён (вместе со своей программой). Выбрать новый спрайт можно разными способами:
Выбрать спрайт можно из библиотеки, нарисовать в редакторе, загрузить из файла, получить с видеокамеры компьютера
Выбираем в библиотеке спрайтов в группе Животные изображение летучей мыши.
Щёлкаем на нужном изображении (выделяем его) и нажимаем Ok
Задача 2 (2 кука). Изобразить полёт летучей мыши.
Можно заставить спрайт мыши, как ранее спрайт кота, двигаться в среде, отталкиваться от краёв и поворачиваться в сторону движения.
Программа, составленная для кота, будет прекрасно работать и для мыши! Тогда зачем мы её удалили вместе с котом?
Но такое движение далеко от реального! Почему? Кот, когда идёт, должен двигать лапками, а мышь — крыльями!
Вы, конечно, знаете, как устроены мультики — нам показывают друг за другом несколько фаз движения, глаз не успевает разглядеть их по отдельности, и рисунки сливаются в мультик.
Отдельные фазы движения персонажа. При быстрой смене фаз отдельные картинки сливаются, и мы видим бегущего зайца
- Чтобы показать полёт, нужно иметь не одно, а несколько изображений, с разными положениями крыльев!
- Скретч прекрасно понимает наши мультяшные желания, и в нём каждый спрайт может иметь несколько «костюмов»!
- Откройте вкладку Костюмы. Оказывается у летучей мыши уже предусмотрено два костюма:
Костюм спрайта — это один из предусмотренных вариантов его изображений. При помощи смены костюмов удобно программировать мультипликацию
Теперь легко собрать код, отвечающий за смену костюмов.
Сколько времени будет ждать исполнитель по команде ? Если вы не знакомы с десятичными дробями, то вот краткое пояснение.
| 1 секунда | одна секунда |
| 0.1 секунды | одна десятая часть секунды |
| 0.2 секунды | две десятых частей секунды |
| 0.3 секунды | три десятых частей секунды |
| 0.4 секунды | четыре десятых частей секунды |
Число 0.2 в два раза больше числа 0.1 и в два раза меньше числа 0.4.
Получается, что программа полёта состоит из 2-х частей — части, отвечающей за передвижение и части, отвечающей за смену костюмов. Эти части собраны под двумя отдельными «шапочками»:
Программа полёта мыши
Обе части программы запускает флажок, и они работают одновременно или, как говорят программисты, параллельно. Подробнее о параллельности (когда она нужна, а когда нет) будет рассказано в уроке 2.
Задача 3 (1 кук). Добавить в мультик бегемота на водопое.
https://www.youtube.com/watch?v=BaYl6whyh5M
Для бегемота нарисовано 6 костюмов, картинки эти находятся в папке practical/sprlib/. Имена файлов: hippo1.png, hippo2.png,… hippo6.png:
Посмотрите: водопой бегемота правдоподобнее полёта мыши! Почему так? …
А можно ли добавить ещё одного исполнителя в среду? Да!
Скретч допускает сколько угодно исполнителей-спрайтов в среде, и для каждого спрайта записывается собственная программа работы.
Делаем так:
- Загружаем новый спрайт с адреса practical/sprlib/hippo1.png. Эта картинка автоматически становится первым костюмом.
- Переходим на вкладку Костюмы и загружаем оставшиеся 5 костюмов.
Загружаем спрайт бегемота из 6 костюмов.Устанавливаем исполнителя-мышь слева сверху, а исполнителя-бегемота справа внизу
Групповая загрузка
Заметим, что загрузить все 5 костюмов можно, как обычно при работе с файлами, за один раз, выделяя нужные картинки.
Щелкаем по первой картинке, затем по последней с нажатой клавишей Shift
- Если файлы в поле выбора идут не подряд, то щёлкаем по первому, выделяя его, затем добавляем к выделению другие файлы щелчками с нажатой клавишей Ctrl.
- Загрузка анимированного gif
- Анимированный gif — это графический файл с расширением gif, содержащий набор картинок одинакового размера и сценарий смены этих картинок при показе на экране.
- Если загрузить анимированный gif в качестве спрайта, он автоматически будет разделён на составляющие картинки-костюмы.
Автоматическое разделение анимированного gif на костюмы
Часть программы полёта мыши, отвечающая за смену костюмов, вполне подойдёт и для бегемота. Копируем её:
Выделяем паспорт мыши. На вкладке Скрипты перетаскиваем нужный код мыши на паспорт бегемота (отпускаем, когда курсор мыши оказывается на паспорте бегемота)
Проверяем, выполнилось ли копирование:
Выделяем паспорт бегемота, и на вкладке Скрипты видим скопированный код
Запускаем мультик, нажимая зелёный флажок.
Мышь летит, бегемот пьёт. Красота! У вас получилось?
Ещё раз отметим:
- Каждым спрайтом управляет отдельная программа.
- Программа может состоять из нескольких частей.
- Программы находятся на вкладке Скрипты.
- Чтобы увидеть программу спрайта, нужно щёлкнуть на паспорте этого спрайта (выделить паспорт).
Задача 4 (1 кук). Пусть дополнительно мышь и бегемот, когда на них щёлкают, издают звуки.
Сначала займёмся мышью.
- Выделяем паспорт мыши.
- На вкладке Звуки выбираем пиктограмму Выбрать звук из библиотеки ().
- Выбираем в библиотеке звуков в группе Эффекты звук boing.
1. Выделяем паспорт мыши 2. Открываем библиотеку звуков
3. Выбираем звук для мыши (нажимая , можно прослушать звук)
Дополним программу мыши ещё одним фрагментом:
Новый фрагмент будет играть звук, когда щёлкают на исполнителе.Звук в блоке Играть звук выбираем из выпадающего списка
- Мы уже видели, что программа спрайта может состоять не из одного, а нескольких фрагментов.
- Каждый из них начинает работать при наступлении события, обозначенного в его заголовке.
- Первые два фрагмента начинают работать после щелчка на зелёном флажке (), третий — после щелчка на спрайте в среде.
- Отдельные фрагменты, из которых состоит программа, называют в Скретч скриптами.
Script (скрипт) в переводе с английского означает сценарий. Хорошая замена словосочетанию «фрагмент программы»!
Пора заняться бегемотом. Перетаскиваем созданный для мыши скрипт на паспорт бегемота — так можно копировать скрипты от одного исполнителя к другому.
Копируем «мышиный» скрипт
- Остаётся загрузить для бегемота другой звук, например, wah beatbox и установить его в команде:
- Сохраним работу на диске (Файл/Сохранить как).
- А дальше?
- Прочитайте, что сегодня узнали (чтобы знания хорошо уложились в голове).
- Выполните зачёт (проверим, как знания уложились).
- Приступайте к практике (заставим знания работать).
О важности раздела Проекты учебника
Освоить любой предмет без практики невозможно. Освоить без практики программирование — просто немыслимо. Поэтому Кукарача настоятельно рекомендует выполнять задания, собранные в учебнике на специальных страницах Проекты.
Кроме того, в описания проектов будут выноситься важные технические подробности, без знакомства с которыми невозможно получить качественную программу.
— Ребята! В проектах учебника важны не только условия. Не пропустите важные моменты! Они могут быть.
Самое важное про Скретч:
| 1 | Исполнителем может быть любой рисунок, свободно перемещаемый по среде. Исполнителя в Скретч называют спрайтом. |
| 2 | Среда — прямоугольное поле, в котором находится исполнитель. Поле-среду в Скретч называют сценой (ведь в среде, как на сцене действуют исполнители-спрайты). |
| 3 | Исполнителей может быть много. |
| 4 | Программа составляется для каждого исполнителя отдельно. |
| 5 | Программа состоит из скриптов. |
| 6 | Скрипт запускается по событию. Cобытие задаётся в первом блоке скрипта (блок-шапочка). |
| 7 | Два события являются особенными: нажатие на зелёный флажок и нажатие на красный восьмиугольник. Флажок считается командой запуска всего проекта (кроме того, флажок останавливает все скрипты проекта, если они работали до момента его нажатия).Восьмиугольник оставливает работу проекта (всех его скриптов). |
| 8 | Скрипты с одинаковыми шапочками работают параллельно (одновременно). |
Игра на чистом JavaScript за 20 минут
На JS можно создавать сложные и простые игры любых жанров. Мы расскажем как создать 2D игру на JavaScript и HTML5 всего за 20 минут.
Для создания веб игр на языке JavaScript используется технология Canvas, которая позволяет выполнять JavaScript код в HTML5 документе. Вы можете более детально ознакомиться с этой технологией посмотрев видео ниже:
На html странице прописывается лишь тег канвас, а также подключение JS файла, в котором будет происходить обработка всей функциональности. К примеру, HTML файл может выглядеть следующим образом:
В JS файле необходимо найти нужный канвас по id и указать способ работы с ним.
var cvs = document.getElementById(«canvas»);
var ctx = cvs.getContext(«2d»);
Добавление изображений и аудио
Далее необходимо загрузить все изображения, а также аудио файлы, которые будут использоваться в игре. Для этого используйте класс Image и Audio соответсвенно. Ниже вы можете скачать все необходимые картинки, а также аудиофайлы к игре.
- Скачать аудио файлы можно по этой ссылке;
Код добавления изображений и аудио в игру:
var bird = new Image();
var bg = new Image(); // Создание объекта
var fg = new Image(); // Создание объекта
var pipeUp = new Image(); // Создание объекта
var pipeBottom = new Image(); // Создание объекта
bird.src = «img/bird.png»; // Указание нужного изображения
bg.src = «img/bg.png»; // Аналогично
fg.src = «img/fg.png»; // Аналогично
pipeUp.src = «img/pipeUp.png»; // Аналогично
pipeBottom.src = «img/pipeBottom.png»; // Аналогично
// Звуковые файлы
var fly = new Audio(); // Создание аудио объекта
var score_audio = new Audio(); // Создание аудио объекта
fly.src = «audio/fly.mp3»; // Указание нужной записи
score_audio.src = «audio/score.mp3»; // Аналогично
Рисование объектов
Чтобы нарисовать объекты, а также добавить функционал к игре необходимо прописать функцию, которая будет постоянно вызываться. Такую функцию вы можете назвать как вам будет угодно. Главное, вам нужно вызвать эту функцию из вне её хотя бы один раз, а внутри неё прописать метод requestAnimationFrame, который будет вызывать функцию постоянно.
function draw() {
// Какой-либо код
requestAnimationFrame(draw); // Вызов функции постоянно
}
draw(); // Вызов функции из вне
Весь код игры стоит помещать в этот метод, ведь в нем он будет постоянно обрабатываться и игра будет выглядеть живой и анимированной.
Чтобы отследить нажатие игрока на какую-либо клавишу, необходимо использовать отслеживание событий — addEventListener. К примеру, чтобы отследить нажатие на любую клавишу на клавиатуре надо прописать следующий код:
// При нажатии на какую-либо кнопку
document.addEventListener(«keydown», someMethod);
// Вызывается метод someMethod
function someMethod() {
// Изменяем что-то в коде
}
Видео урок
Это были лишь небольшие азы перед созданием самой игры. Предлагаем вам ознакомиться с небольшим видео уроком, в ходе которого вы создадите небольшую 2D игру на чистом JavaScript'е.
Весь JS код игры
Ниже вы можете посмотреть на полностью весь код JavaScript файла, который был создан в ходе видео урока выше:
var cvs = document.getElementById(«canvas»);
var ctx = cvs.getContext(«2d»);
var bird = new Image();
var bg = new Image();
var fg = new Image();
var pipeUp = new Image();
var pipeBottom = new Image();
bird.src = «img/bird.png»;
bg.src = «img/bg.png»;
fg.src = «img/fg.png»;
pipeUp.src = «img/pipeUp.png»;
pipeBottom.src = «img/pipeBottom.png»;
// Звуковые файлы
var fly = new Audio();
var score_audio = new Audio();
fly.src = «audio/fly.mp3»;
score_audio.src = «audio/score.mp3»;
var gap = 90;
// При нажатии на какую-либо кнопку
document.addEventListener(«keydown», moveUp);
function moveUp() {
yPos -= 25;
fly.play();
}
// Создание блоков
var pipe = [];
pipe[0] = {
x : cvs.width,
y : 0
}
var score = 0;
// Позиция птички
var xPos = 10;
var yPos = 150;
var grav = 1.5;
function draw() {
ctx.drawImage(bg, 0, 0);
for(var i = 0; i < pipe.length; i++) {
ctx.drawImage(pipeUp, pipe[i].x, pipe[i].y);
ctx.drawImage(pipeBottom, pipe[i].x, pipe[i].y + pipeUp.height + gap);
pipe[i].x--;
if(pipe[i].x == 125) {
pipe.push({
x : cvs.width,
y : Math.floor(Math.random() * pipeUp.height) - pipeUp.height
});
}
// Отслеживание прикосновений
if(xPos + bird.width >= pipe[i].x
&& xPos = cvs.height — fg.height) {
location.reload(); // Перезагрузка страницы
}
if(pipe[i].x == 5) {
score++;
score_audio.play();
}
}
ctx.drawImage(fg, 0, cvs.height — fg.height);
ctx.drawImage(bird, xPos, yPos);
yPos += grav;
ctx.fillStyle = «#000»;
ctx.font = «24px Verdana»;
ctx.fillText(«Счет: » + score, 10, cvs.height — 20);
requestAnimationFrame(draw);
}
pipeBottom.onload = draw;
Больше интересных новостей
Как создать викторину «Своя игра» в PowerPoint
Отвечать на вопросы викторины всегда увлекательно! Видишь клеточки с названиями категорий и стоимостью вопросов — и неизбежно испытываешь ностальгию. Вспоминаются домашние вечера перед телевизором, когда мы ломали голову над очередным вопросом вместе с игроками.
Благодаря современным технологиям вы буквально за 10-20 минут можете создать викторину наподобие «Своей игры» и сыграть в нее с друзьями. В этой статье мы расскажем, как сделать такую викторину в PowerPoint. Начинайте придумывать вопросы!
Кроме того, вы получите подробную пошаговую инструкцию по созданию викторины с нуля и бесплатный шаблон викторины в формате PPT.
Итак, приступим!
Этап 1: Создаем игровое поле
- Откройте PowerPoint и создайте новую презентацию.
- На вкладке Дизайн выберите и примените понравившуюся тему оформления.
- Создайте новый слайд и добавьте на него таблицу (Вставка → Таблица).
- Создайте таблицу с пятью колонками и пятью строками.
- Увеличьте размер таблицы, чтобы она заняла весь слайд, и заполните ячейки.
- Измените цвет игрового поля, чтобы оно еще больше походило на оригинальное поле из «Своей игры». Для этого выделите таблицу и нажмите Заливка на панели инструментов в разделе Стили таблиц.
Когда вы выполните все шаги, игровое поле будет выглядеть примерно так:
В каждую ячейку вставлена гиперссылка, которая ведет на соответствующий вопрос.
Разбираемся с макетами слайдов
У каждого слайда в PowerPoint есть свой макет. Например, Титульный слайд или Заголовок и объект.
Вы можете выбрать необходимый макет, кликнув правой кнопкой мыши на уменьшенное изображение слайда в левой части экрана.
- Вы также можете редактировать и создавать новые макеты слайдов при помощи инструмента Образец cлайдов (Slide Master).
- Работа с макетами и использование режима Образец cлайдов очень важны при создании подобной викторины, ведь она состоит из большого числа похожих слайдов.
- В основном у вас будут слайды двух типов:
- Слайд с вопросом. На нем будет размещен текст вопроса и кнопка Узнать ответ для проверки правильности ответа игрока.
- Слайд с правильным ответом. На нем будет содержаться ответ на вопрос и кнопка Домой, ведущая обратно на игровое поле.
Если вы внесете какие-либо изменения через Образец cлайдов, они будут автоматически применены ко всем слайдам этого типа в презентации.
Например, вы можете поменять цвет фона, положение текста или размер шрифтов, затем переключиться в обычный режим просмотра и увидеть, что все изменения были применены.
Этап 2: Создаем макеты слайдов для вопросов и ответов
Макеты, описанные ниже, уже включены в подготовленный нами шаблон для викторины.
Если вы хотите самостоятельно создать макеты, выполните следующие шаги:
- Перейдите на вкладку Вид и выберите Образец слайдов.
- Нажмите Вставить макет.
- Кликните по макету правой кнопкой мышки и нажмите «Переименовать».
- Добавьте кнопку на слайд. Перейдите на вкладку Вставка, нажмите Фигуры и выберите Управляющие кнопки из выпадающего списка. Выберите настраиваемую управляющую кнопку и добавьте ее на слайд.
- В Настройке действия выберите Перейтина по гиперссылке: следующий слайд и нажмите ОК.
- Кликните правой кнопкой мышки по кнопке, нажмите Изменить текст и напишите слово «Ответ» (или «Узнать ответ» — как больше нравится).
- По аналогии со слайдом с вопросом создайте слайд с ответом. Правой кнопкой мышки кликните по левой панели с образцами слайдов и нажмите Вставить макет. Назовите новый макет «Правильный ответ».
- Добавьте кнопку Домой и вставьте гиперссылку, которая будет вести на слайд с игровым полем. В нашем случае это Слайд 2.
- Выйдите из режима Образец слайдов, нажав кнопку Закрыть режим образца на верхней панели инструментов, или перейдите во вкладку Вид и выберите Обычный режим просмотра.
Этап 3: Добавляем слайды и расставляем ссылки на игровом поле
Итак, у нас уже есть титульный слайд и слайд с игровым полем. Кроме того, мы сделали макеты слайдов для вопросов и ответов.
- Создайте третий слайд. Кликните правой кнопкой мышки и выберите ранее созданный макет Вопрос.
- Создайте четвертый слайд. Кликните правой кнопкой мышки и выберите ранее созданный макет Правильный ответ. У вас должно получиться так:
- У вас получилась пара вопрос-ответ. Продублируйте слайды 3 и 4 столько раз, сколько активных клеток на игровом поле. В нашем примере поле состоит из 20 клеток. Итоговое количество слайдов вместе с первыми двумя будет равняться 42.
Примечание: Рекомендуем на слайдах с вопросами вместо самих вопросов сперва написать черновые обозначение (например, Категория 1, Вопрос на 200). Так вам будет проще расставить гиперссылки.
Соедините клетки игрового поля с соответствующими слайдами:
- Выделите цифры в клетке игрового поля, кликните правой кнопкой мышки и выберите Гиперссылка (или нажмите Ctrl+K).
- В открывшемся окне в левой панели выберите Место в документе и укажите нужный слайд (например, Категория 1, Вопрос на 200).
- Нажмите ОК, чтобы вставить гиперссылку.
Ограничиваем навигацию
Перейдите во вкладку Переходы. Выберите все слайды за исключением первого и снимите галочку с пункта Смена слайда: по щелчку. Это обеспечит навигацию по гиперссылкам и кнопкам в вашей игре вместо перехода на следующий слайд по щелчку мышки.
Этап 4: Добавляем интерактивные вопросы
Вы можете добавить в викторину аудио, видео, а также PowerPoint анимации и эффекты переходов между слайдами. Вы можете использовать любые эффекты, какие вам нравятся, чтобы сделать игру более увлекательной.
Добавляем изображения к вопросам
Просто перетащите любую картинку в презентацию из папки на вашем компьютере. Лучше всего использовать изображения в формате PNG с прозрачным фоном.
Либо перейдите на вкладку Вставка, нажмите Рисунки (или Изображения из интернета), чтобы добавить изображение, дополняющее вопрос (или призванное озадачить участников).
Вы можете добавлять разные эффекты, например, тень, отражение или подсветку. Выберите вкладку Формат и нажмите Формат рисунка. При желании можно добавить анимацию.
Правильный ответ: Он чувствует себя не в своей тарелке
Загружаем музыку и настраиваем автопроигрывание
Перетащите аудиофайл на слайд или нажмите Вставить → Аудио.
Кликните на иконку аудиофайла и перейдите во вкладку Воспроизведение. Установите Начало: автоматически.
Мы рекомендуем использовать аудиофайлы длиной 15 секунд или меньше. Кстати, Musopen.org — отличный сайт, где можно легально и бесплатно скачать музыку.
Правильный ответ: Соловей
Добавляем видеовопросы
Перетащите видео на слайд с вопросом или перейдите во вкладку Вставка и нажмите Видео.
По аналогии с аудиофайлом, перейдите во вкладку Воспроизведение и установите Начало: автоматически.
Субтитры помогут сделать этот вопрос более понятным для всех участников. Просто добавьте текстовое поле под видео и вставьте текст вопроса. В этом видеовопросе для текста мы использовали анимацию Появление с задержкой в 9 секунд. Таким образом, текст появляется после того, как игрок успеет понять смысл видео.
Правильный ответ: Итальянский
Другие улучшения
Вот несколько советов, как еще улучшить вашу игру:
- Добавьте эффекты перехода для слайдов с вопросами («Выцветание» или «Увеличение»), используя режим Образец слайдов.
- Добавьте эффект «Перелистывание» на слайды с ответами, чтобы они выглядели так, будто вы переворачиваете карточку.
- Добавьте триггеры, чтобы скрыть клетки с отвеченными вопросами (вы увидите их в образце презентации, который прилагается к этой статье. В веб-презентации в формате HTML5 их не будет видно).
- Добавьте аудиотриггеры на слайды с вопросами. Например, звуки победы или поражения. Используйте эти звуки во время игры, чтобы было веселее.
- Добавьте второй тур викторины и финал и вставьте ссылки на них на слайд с игровым полем первого тура.
Протестируйте получившуюся игру
Убедитесь, что все ссылки и эффекты работают корректно. Запустите презентацию, нажав F5 (Показ слайдов → С начала), и просмотрите игру целиком. Проверьте каждую гиперссылку на игровом поле и удостоверьтесь, что они ведут на правильные вопросы.
Выложите игру в интернет
С помощью iSpring Converter Pro вы можете опубликовать свою викторину в интернет всего за один клик в виде веб-файла, как в этой статье.
А если вы хотите поделиться игрой через ссылку или вставить код в ваш блог или веб-сайт (как в этой статье), очень удобно использовать облачный сервис iSpring Cloud. Ваша викторина будет доступна для просмотра на любых устройствах, даже если у получателей нет PowerPoint.
Не забудьте проверить ее работоспособность после публикации.
Сыграйте в свою игру
А теперь самое интересное! После того как вы создали игру и разместили ее в интернете, пришло время пригласить друзей и сыграть! Вам понадобится два или более игроков, лист бумаги и карандаш для записи счета.
Запустите игру и станьте ее ведущим. В оригинальной телевизионной версии этой игры конкурсанты жмут на большую кнопку, чтобы ответить. Поскольку мы не находимся в студии, конкурсанты могут просто хлопать в ладоши.
Правила игры просты:
- Первый игрок выбирает категорию и сложность вопроса. Например, Президенты США, 300.
- Ведущий кликает на выбранную клетку игрового поля и зачитывает вопрос вслух. Например: «Медвежонок Тедди был изобретен после того, как этот американский президент отказался на охоте застрелить медведя, привязанного к дереву».
- После того как ведущий прочитает вопрос, любой из участников может хлопнуть в ладоши, чтобы ответить. Например, предположить, что это был Теодор Рузвельт.
- Если ответ верный, игрок получает количество очков, полагающееся за этот вопрос, и может выбрать следующий.
- Если ответ неверный, игрок получает штрафные очки, при этом другой игрок может попытаться ответить на вопрос.
- После того как все вопросы на игровом поле будут отвечены, начинается подсчет очков. Игрок с наибольшим количеством очков побеждает.
Посмотрите, какая игра получилась у нас:
Чтобы узнать больше об официальных правилах игры, прочитайте официальную страничку оригинальной игры Jeopardy! на Википедии, а также страничку о «Своей Игре».
В «Свою игру» можно играть где угодно: хоть в садике, хоть в офисе. Цель викторины — не только проверить знания и скорость реакции, но и разрядить обстановку и сблизить участников.
Если у вас возникли трудности с составлением вопросов, посмотрите записи прошедших телевизионных игр.
Скачайте готовый шаблон
Скачайте готовый шаблон викторины «Своя игра» от iSpring. Если вам нужна помощь с созданием викторины в PowerPoint — дайте знать специалистам поддержки iSpring.
Пошаговая инструкция по созданию игры в Android Studio
Android Studio – официальная среда разработки приложений под ОС Андроид. Также она доступна пользователям Windows, Linux и Mac OS X. Мы расскажем, как создать в этой среде простую 2D-игру без применения специальных движков. Однако прежде чем приступать к работе, нужно в достаточной степени изучить саму программу.
Начало
Пользователи среды могут программировать на языках Java, C++ и Kotlin. Планируется, что последний со временем полностью заменит привычный Java, который пока остается основным. Для работы потребуется от 3 (минимум) до 8 Гб (желательно) оперативной памяти плюс дополнительный гигабайт для Android Emulator. Свободного места на жестком диске должно быть не меньше, чем 2 Гб.
Процесс установки Андроид Студио мало чем отличается от других программ
Если используется Microsoft Windows, подойдут версии 2003, Vista, 7–10. Для OS X нужен Mac от 10.8.5 до 10.13 / 10.14 (High Sierra/Mojave). Для Linux – KDE или GNOME. Изготовление приложения проходит в несколько этапов:
- создаем новый проект;
- разрабатываем пользовательский интерфейс;
- добавляем навигацию, действия, дополнительные опции;
- тестируем программу в эмуляторе.
Если собираетесь работать с Java, обязательно установите последнюю версию JDK. Скачать ее можно на официальном сайте. Помимо главной программы, для работы также потребуются элементы Андроид SDK – скрипты, библиотеки, документы, файлы. Эти компоненты будут скачаны автоматически. В установочный комплект также входит Андроид Emulator.
Проверяйте количество свободного места на диске
Следующим шагом станет определение адресов Студио и СДК. Их предлагается установить в отдельные папки. Перед началом инсталляции стоит убедиться, что на выбранном диске достаточно места. Сама Studio требует не так много свободного пространства, а вот элементы SDK занимают больше 3 Гб. Это минимум, так как затем потребуется дополнительная площадь для обновлений.
Каждое приложение, сделанное под Андроид, должно состоять из четырех точек входа:
- Service. Компонент, обеспечивающий работу в фоновом режиме. Он отвечает за выполнение удаленных и длительных операций при выключенном визуальном интерфейсе.
- Activity. Элементы интерактивного управления. Через класс Intent передается информация о намерениях пользователя. Активности устроены по подобию веб-страниц. Intent выполняет функцию ссылок между ними. Запускается приложение посредством activity Main.
- Broadcast receiver. «Широковещательный приемник» передает намерения одновременно разным участникам.
- Content provider. «Поставщик содержимого» передает нужную информацию из БД SQLite, файловой системы и других хранилищ.
Разработка приложения начинается с нового проекта. В меню последовательно выбираем Tools, Android, SDK Manager. В нашем примере последней версией является Андроид API 26. Выбирайте новейшую версию, поставив напротив нее галочку, и приступайте к скачиванию.
Выбирайте новейшую версию Андроид SDK
После нажатия New project появится форма нового проекта. В поле Application name выбираем FirstGame, Company domain – оставим без изменения. Путь к проекту Project location должен быть целиком на английском языке. В следующем окне оставьте галочку только напротив Phone and Tablet.
В этом окне определяется версия ОС для мобильных и планшетов
Теперь выберем версию ОС, с которой сможет запускаться игра. Чем ниже она будет, тем больше пользователей получат доступ к приложению. С другой стороны, разработчику тогда доступно меньше опций. Поочередно выбираем Empty Activity, Next, Next, Finish. Проект готов к работе.
С каждым запуском Студио открывается вкладка «Совет дня» (Tip of the day). Для начинающих программистов от этой опции мало толку, но по мере знакомства со средой рекомендации начнут казаться интересными и полезными.
Вообще, для новичков многое будет выглядеть таинственно и даже страшновато. Не стоит бояться трудностей. Накапливайте опыт и непонятное быстро станет простым и ясным. В конце концов, это не изучение языка программирования.
Типичный сценарий
Простая игра строится по определенной схеме. Для взаимодействия с пользователем предусмотрены следующие элементы:
- Основной дисплей. На нем разворачиваются события. По завершении процесса рекомендуется реализовать переход к таблице рекордов, если результат оказался достойным этой «доски почета».
- Меню. С помощью этого инструмента выбирают действия и делают настройки. Он обеспечивает переход к другим элементам. Меню обычно появляется сразу после заставки. Пользователю предлагается выбор дальнейших действий: приступить к игровому процессу, ознакомиться с инструкцией и правилами, просмотреть текущие рекорды и т. д.
- Заставка. Представляет собой краткий анонс или рекламу с изображением логотипа. Демонстрируется в начале или во время пауз. Приветствуется использование хотя бы простой анимации.
- Справка. В этом разделе меню описывают правила. Если текст не помещается в окне целиком, необходимо обеспечить возможность прокрутки.
- Счет. Здесь отображаются текущие рекорды участников. В данном разделе можно просмотреть список в любой момент, не дожидаясь, когда сам там окажется. Также здесь бывает доступна информация о текущем игровом счете, но последний обычно можно наблюдать на основном дисплее.
- Настройки. Пользователь должен иметь возможность поменять игровые параметры, свой аватар и логин или зарегистрироваться в качестве нового участника.
Это основные инструменты стандартного игрового сценария. При разработке приложения какие-то можно убирать или добавлять дополнительные. Чтобы обеспечить появление этих шести экранов, нужно реализовать соответствующее число активностей.
В MenuActivity будут содержаться кнопки и другие элементы, запускающие остальные подпрограммы. SplashActivity потребуется для вывода заставки. Через несколько секунд автоматически запустится MenuActivity. Остальные активности: GameActivity (основной), SettingsActivity (настройки), ScoresActivity (счет) и HelpActivity (справка с возможностью прокрутки).
Рекомендуется также задать базовый class BaseActivity, включающий общедоступные компоненты. Для каждой Activity требуется отдельный разметочный файл с набором нужных элементов.
Первоначальной задачей разработчика является освоение работы с активностями. Для получения доступа к ресурсам и настройкам, используемым Activity, нужно сделать контекст приложения.
Здесь прибегают к помощи метода getApplicationContext().
Import Android
Import Android – опция, позволяющая автоматически обновлять библиотеки (public static, public void, public class, override public void и др). Такая потребность часто возникает при использовании фрагментов кода. Можно воспользоваться традиционной комбинацией Import Android – Alt + Enter.
Этим простым методом обновления импорта public static, override public void, public void и прочих нужных для работы вещей воспользоваться несложно.
Однако существует и более интересный вариант – автоматический Import Android. Для его реализации нужно последовательно выбрать в меню File, Settings, Edito, AutoImport.
Остается поставить флажки напротив нужных пунктов. Теперь Import Android будет обновляться самостоятельно.
Автоматический Import Android позволяет быстро обновлять public static, public void и другие инструменты
Пример разработки простой 2D-игрушки Андроид
Наша игра Android Studio развивается по известному сюжету. Пользователь управляет космическим кораблем, уворачивающимся от метеоритов (астероидов). Последние падают с верхней части экрана, корабль – движется внизу вправо или влево, в зависимости от решений участника. При столкновении аппарата с космическим объектом объявляется Game Over.
Начнем с открытия проекта. Для этого последовательно выберем в меню программы File, New, New Project. Придумываем проекту название, вводим домен и место, где будет храниться папка. Окно, появившееся после нажатия Next, лучше оставить без изменений. В следующем выбираем Empty Activity и движемся дальше. Кликнув по клавише Finish, мы получим готовый проект.
Следующим шагом станет скачивание необходимых картинок и копирование их в папку drawable. Это изображения корабля и метеоров. После этого нужно создать layout. Открываем Text в activity_main.xml и вставляем следующий код:
Код для layout
MainActivity, GameView, SpaceBody
Для редактирования класса MainActivity меняем определение, придав ему следующий вид: public class MainActivity extends AppCompatActivity implements View.OnTouchListener {.
После этого нужно задать перемены для нажатия левой (public static boolean isLeftPressed = false) и правой (public static boolean isRightPressed = false) кнопок. Следующие действия мы расписывать не будем.
В итоге MainActivity должен принять следующий вид:
Код для MainActivity
Разобравшись с классом MainActivity, переходим к GameView. В определение добавляем extends SurfaceView implements Runnable. Теперь нужно задать разрешение. У современных гаджетов разные параметры. Дисплей старого мобильника не может сравниться с новым большим планшетом.
Чтобы добиться одинакового изображения на любом устройстве, поделим монитор на одинаковые «клетки» 20х28 (первый показатель – горизонталь). Если эти части будут распределены неравномерно, картинка получится сжатой или растянутой. Задаем переменные:
Переменные для «уравнивания» графики
Для метода run() устанавливается бесконечный цикл, стартующий с update(). Задачей последнего является вычисление новых координат космического корабля. По окончании расчетов на экране будет сформирован сам аппарат (draw()). Control() завершает цикл, обеспечивая паузу на 17 миллисекунд. Затем снова запускается run(). Выглядеть это будет так:
Бесконечный цикл для run()
Чтобы появился сам корабль и астероиды, нужен родительский class SpaceBody. Зададим переменные и методы:
Код для родительского класса SpaceBody
Теперь отдельный класс Ship для корабля:
Код космического корабля
После этого останется произвести компиляцию и запуск программы. На дисплее Android Studio должен возникнуть корабль, который можно кнопками перемещать вправо и влево. Следующим шагом станет добавление астероидов. Для этого разработаем class Asteroid, тоже являющийся дочерним для SpaceBody. Зададим переменные:
Код для метеоров
Суть в том, чтобы астероиды произвольно возникали в разных точках «потолка» экрана и двигались с непредсказуемой скоростью. Мы задали код, определяющий столкновение метеоров с кораблем. Добавим астероиды в GameView:
Вписываем астероиды в GameView
На этом изготовление элементарной 2D-игры можно считать завершенным. Остается скомпилировать и запустить программу. Ничто не мешает добавлять в нее новые опции. Например, стрельбу по метеорам или постоянное ускорение их движения. Но это уже тема отдельного разговора.