РАЗРАБОТКА БРАУЗЕРНОЙ ИГРЫ «ПОИСК ПРЕДМЕТОВ» ДЛЯ ПРОВЕРКИ ЗНАНИЙ ПО АНГЛИЙСКОМУ ЯЗЫКУ С ПОМОЩЬЮ JAVASCRIPT

Вильданов Алмаз Нафкатович1, Павлов Дмитрий Артемович2
1Уфимский университет науки и технологий, Нефтекамский филиал, доцент кафедры ММиИБ, к.ф.-м.н.
2Уфимский университет науки и технологий, Нефтекамский филиал, студент 1 курса ПМиИ

Аннотация
В этом исследовании обсуждается процесс создания учебного игрового приложения, в жанре игры «Поиск предметов», с помощью которого проверяются знания английского языка по определенной теме. Придуман алгоритм создания такой игры и описан соответствующий код. Подобные игры могут использоваться в качестве дополнительных упражнений для проверки знаний, повторения изученного материала или подготовки к экзаменам по иностранному языку. Такой игровой формат проверки знаний иностранного языка в виде игры «Поиск предметов» поможет стимулировать интерес учащихся и вызывать у них больше энтузиазма к изучению иностранного языка. Данная статья предназначена для преподавателей информатики, которые могут использовать ее для организации проектов и исследовательской работы, проведения дополнительных занятий или самостоятельной работы школьников и студентов. Она также будет полезна учащимся, которые увлекаются программированием.

Ключевые слова: , , , , ,


Рубрика: 05.00.00 ТЕХНИЧЕСКИЕ НАУКИ

Библиографическая ссылка на статью:
Вильданов А.Н., Павлов Д.А. Разработка браузерной игры «Поиск предметов» для проверки знаний по английскому языку с помощью JavaScript // Современные научные исследования и инновации. 2023. № 8 [Электронный ресурс]. URL: https://web.snauka.ru/issues/2023/08/100665 (дата обращения: 21.04.2024).

Изучение иностранного языка – достаточно трудоемкое занятие, тем более для ребенка. Заинтересовать его можно, облачив обучение в игровую форму. Интерактивные игры несут в себе образовательный потенциал, создают условия для проявления учащимися учебной инициативы [1]. Предлагаемая статья описывает процесс создания увлекательной игры на поиск предметов с помощью HTML, JavaScript и css. Суть игры следующая:

  • создается игровая сцена, где находятся различные предметы, и игрок должен найти предметы, названия которых соответствуют определенным словам из изучаемого иностранного языка;
  • учащийся видит название какого-то объекта (насекомого) на английском языке, например, «locust»;
  • игрок должен найти этот объект (саранча) и кликнуть по нему;
  • если игрок нажал на нужный предмет, объект считается найденным и исчезает с экрана;
  • на экране появляется название следующего объекта, и т.д.

Такая игра, несомненно, поможет учащемуся проверить и закрепить свои знания английских слов, и будет интереснее, чем простое заучивание иностранных слов.

Игра «Поиск предметов» может быть полезной в обучении и образовательных целях по нескольким причинам:

  • мотивация и интерес: игровой формат проверки знаний по иностранному языку может стимулировать мотивацию учащихся и вызывать больший интерес к изучению языка. Участие в игре и достижение целей внутри игрового контекста может быть более привлекательным и захватывающим, чем традиционные методы обучения;
  • повторение и закрепление: игра предоставляет возможность повторить и закрепить изученный языковой материал. Поиск предметов, связанных с определенными темами или грамматическими конструкциями, позволяет учащимся активно применять свои знания и запоминать их более эффективно;
  • самостоятельное обучение: игровое приложение может быть использовано в качестве инструмента самостоятельного обучения. Учащиеся могут использовать его для повторения и тренировки в любое удобное для них время, что способствует развитию самоорганизации и самостоятельности;
  • вариативность и адаптивность: игровое приложение может быть настроено на различные уровни сложности и тематики, позволяя адаптировать его под индивидуальные потребности и уровень владения языком каждого учащегося. Это обеспечивает гибкость и возможность персонализации образовательного процесса;
  • расширение словарного запаса: в игре могут использоваться различные предметы, объекты или символы, которые игрок должен найти. Это помогает расширять словарный запас и знакомить с новыми терминами и понятиями;
  • обучение конкретным темам: игра «Поиск предметов» может быть адаптирована для обучения конкретным темам или предметам. Например, она может быть использована для изучения географии (поиск географических объектов), биологии (поиск животных или растений) или истории (поиск исторических артефактов).

Игра «Поиск предметов» может быть эффективным дополнением к учебному процессу, способствуя развитию различных навыков и знаний у учащихся.

Предметы на экране будем создавать в дизайнере в виде изображений спрайта, с помощью использования холста (рисунок 1).

Рисунок 1. Рабочее поле игры

Подготовим изображения (рисунок 2). Рисунки лучше подготовить в формате .png, в котором поддерживается прозрачный фон.

Рисунок 2. Спрайты для игры

Объявим массив предметов:

const MASSIV = [

    "dragonfly",

    "grasshopper",

    "locust",

    "bee",

    "ladybug",

    "mosquito",

    "snail",

    "muse",

    "ant",

    "spider",

    "bug",

    "butterfly",

    "small_butterfly",

    "cockroach",

    "caterpillar"

];

Этот массив мы позже программно перемешаем, чтобы при каждом новом старте игры предметы появлялись в случайном порядке.

С помощь позиционирования разместим картинки на игровом поле (рисунок 1). Для этого укажем координаты спрайтов, например, для яблока:

#grasshopper {

position: absolute;

top: 0; left: 0;

margin: 530px 0 0 200px;

}

Координаты игрового поля, наоборот, укажем относительное позиционирование:

.sunsistem {

position: relative;

top: 0; left: 0;

}

Алгоритм игрового скрипта будет следующим [2]:

  1. Создаем список предметов, которые игрок должен найти (в данном примере это список насекомых на английском языке).
  2. Перемешиваем список случайным образом.
  3. Инициализируем переменную «индекс», которая отвечает за номер предмета в списке. Вначале он равен 0.
  4. С помощью конструкции addEventListener на нужную картинку, которая ищется первой, «вешаем» событие клика [3]. При клике на картинку она плавно исчезает (видимость равно ЛОЖЬ).
  5. Увеличиваем значение переменной-счетчика «индекс» на единицу и выводим на экран название следующего объекта.
  6. Назначаем то же самое событие на следующий объект, и т.д.
  7. Когда значение счетчика «индекс» достигает размера списка, это означает, что все заданные предметы были успешно найдены, и мы можем вывести на экран сообщение о завершении игры.

После завершения игры выводится на экран соответствующее уведомление (рисунок 3):

Рисунок 3. Окончание игры

Вы можете поиграть или ознакомиться с исходным кодом игры на платформе GitHub. GitHub – это веб-платформа, предназначенная для хранения кода и других программных проектов, совместной работы над ними и их обмена между разработчиками. Это отличное место для публикации интернет-проектов. Посмотреть код и проверить свои знания английского языка по теме «Насекомые» можно по адресу https://dmitrij-pavlov.github.io/project3/. Для использования приложения достаточно любого современного браузера.

Итак, игра «Поиск предметов» может быть полезной в обучении и в образовательных целях, поскольку она мотивирует, активизирует участие, повторяет и закрепляет материал, поддерживает самостоятельное обучение и обладает вариативностью и адаптивностью в контексте изучения иностранного языка.


Библиографический список
  1. Маринин, В. И. Интерактивная игра «Поиск предметов» // Экологическая культура в контексте современных реалий : Материалы Всероссийской научно-практической конференции, посвящённой 50-летию Научного совета по проблемам экологического образования Российской академии образования, Ульяновск, 23 октября 2020 года / Под общей редакцией Е.А. Гриневой, М.Н. Алексеевой. – Ульяновск: Ульяновский государственный педагогический университет им. И.Н. Ульянова, 2020. – С. 314-317.
  2. Вильданов А.Н. Разработка мобильных игр в жанре «Поиск предметов» с помощью MIT App Inventor // Инженерный вестник Дона, №8 (2019). URL: http://www.ivdon.ru/ru/magazine/archive/N8y2019/6139.
  3. Болгов А.Е. Обработчики событий как основа взаимодействия с пользователем // Научно-практические исследования. – 2020. – № 8-8(31). – С. 17-19.


Количество просмотров публикации: Please wait

Все статьи автора «alexan0308»


© Если вы обнаружили нарушение авторских или смежных прав, пожалуйста, незамедлительно сообщите нам об этом по электронной почте или через форму обратной связи.

Связь с автором (комментарии/рецензии к статье)

Оставить комментарий

Вы должны авторизоваться, чтобы оставить комментарий.

Если Вы еще не зарегистрированы на сайте, то Вам необходимо зарегистрироваться:
  • Регистрация