Выполнила: студентка группы ИС 1.23 Сидикова Махлиё Руководитель: Козырева В.В.
Актуальность темы исследования обусловлена недостаточной эффективностью существующих образовательных приложений для изучения языков (до 80% пользователей прекращают занятия в первый месяц) и необходимостью поиска баланса между обучением и вовлекающим геймплеем. Создание гибридного продукта с глубокой интеграцией игровых механик и анимированного персонажа требует специализированной методологии, объединяющей педагогические задачи с приёмами удержания внимания «цифровой» аудитории.
Цель исследования — разработать, реализовать и экспериментально проверить концепцию мобильного приложения для изучения иностранных языков с игровыми механиками и анимированным персонажем, направленную на повышение мотивации и эффективности обучения. Задачи исследования: Проанализировать тенденции геймификации в образовании и критерии интеграции игровых механик с учебным контентом. Провести сравнительный анализ существующих языковых приложений, выявить их недостатки. Разработать концептуальную модель приложения, связывающую образовательные модули с системой прогрессии, наград и анимированным персонажем. Реализовать ключевые модули приложения на Flutter с персонализированным учебным планом. Провести тестирование прототипа, оценив вовлечённость и качество усвоения материала.
Объект исследования — процесс разработки мобильных образовательных приложений с интеграцией игровых механик. Предмет исследования — методы, принципы и архитектурные решения интеграции игровых механик в мобильные приложения для изучения языков, обеспечивающие баланс между обучением и игровым опытом.
« Duolingo » является эталоном глубокой интеграции геймификации в образование благодаря разбиению контента на «навыки», системе ежедневных целей ( streak ), виртуальной валюте и режимам соревнований. Эффект этого подхода — формирование устойчивой привычки к регулярным занятиям. « Memrise » использует геймификацию как усилитель педагогики: короткие видео с носителями дают аутентичный контекст, а игровая система «сада памяти» превращает заучивание в визуально приятный процесс. Тем самым игровые элементы интегрируются внутрь обучения, а не навешиваются сверху.
В российском приложении Lingualeo ключевой геймификацией является персонаж-компаньон Лев Лео, создающий эмоциональную связь, а также рейтинг и баллы. Однако слабая игровая проработка и перегруженный интерфейс снижают удержание пользователей.
В ходе разработки были использованы: Visual Studio Code Dart Flutter Figma ( создание дизайна) Сторонние средства и плагины : Live Server Open Server Firebase Hive Rive
Т ребования к функциональным характеристикам Регистрация и авторизация пользователей Личный кабинет с прогрессом Модули: слова, грамматика, аудирование Система очков опыта, уровней и игровой валюты Анимированный персонаж (меняет настроение и внешний вид) Ежедневная серия и таблица лидеров Требования к интерфейсу Интуитивность Единообразие элементов Адаптивность под разные экраны Отзывчивость (не дольше 0,3 сек) Визуальная привлекательность без перегруженности
Требование Как реализовано Интуитивность Нижнее меню (5 иконок), жесты « свайп » между экранами. Ежедневный квест подсвечен анимацией. Время входа новичка — 15 секунд. Минимализм Одновременно на экране не более 3–4 интерактивных элементов. Персонаж (LingvoDragon) занимает ~20% экрана, никакой рекламы. Адаптивность Единая вёрстка под iOS и Android. Интерфейс подстраивается под экраны от 4,7" до 6,8". Эргономичность Кнопки ответов (A/B/C) — в нижней трети экрана, под большой палец. Управление одной рукой.
Мобильное приложение состоит из 5 основных экранов, переключение между которыми осуществляется через нижнюю навигационную панель: Обучение Слова Профиль Магазин Таблица лидеров Для удобства пользователя на главном экране реализованы быстрые переходы к последним темам и ежедневным заданиям. Все файлы и ресурсы приложения организованы в следующие папки и файлы: lib / - папка с основным кодом приложения на Dart (модели, экраны, виджеты) assets / - папка с ресурсами (изображения, иконки, анимации персонажа) assets / words / - JSON-файлы с лексическими темами assets / grammar / - JSON-файлы с грамматическими правилами assets / audio / - аудиофайлы для модуля аудирования lib / models / - классы данных (пользователь, слово, урок) lib / viewmodels / - бизнес-логика (MVVM) lib / views / - экраны и виджеты интерфейса lib / services / - сервисы ( Firebase, Hive, анимация персонажа)
Загружает слова по теме из JSON-файла dart class WordRepository { Future<List<Word>> loadWordsByTopic (String topicId ) async { String jsonString = await rootBundle.loadString ('assets/words/$ topicId.json '); List<dynamic> jsonList = json.decode ( jsonString ); return jsonList.map ((json) => Word.fromJson (json)). toList (); } Сохраняет прогресс: знает пользователь это слово или нет void saveProgress (String wordId, bool known) { var box = Hive.box ('progress'); box.put ( wordId, known ); }
Расширение для адаптивного дизайна во Flutter import ' package:flutter / material.dart '; extension ResponsiveExtension on num { double w( BuildContext context) => this * MediaQuery.of (context). size.width / 375; double h( BuildContext context) => this * MediaQuery.of (context). size.height / 812; double sp ( BuildContext context) => this * MediaQuery.of (context). textScaleFactor ; double r( BuildContext context) => this * MediaQuery.of (context). size.width / 375; } Главное приложение Flutter class _ LingvoDragonAppState extends State< LingvoDragon App> { static bool isDarkMode = false; static void toggleTheme () { isDarkMode = ! isDarkMode ; } @id86240433 (@override) Widget build( BuildContext context) { return MaterialApp ( title: ' LingvoDragon ', debugShowCheckedModeBanner : false, theme: AppTheme.lightTheme, darkTheme : AppTheme.darkTheme, themeMode : isDarkMode ? ThemeMode.dark : ThemeMode.light, home: const SplashScreen (), ); } }
Обработчик формы авторизации Получение данных пользователя из Firestore DocumentSnapshot userDoc = await _ firestore.collection ('users').doc( userId ).get(); if (! userDoc.exists ) { throw Exception(' Пользователь не найден в базе данных.'); } Map<String, dynamic> userData = userDoc.data () as Map<String, dynamic>; String username = userData ['username']; int totalXP = userData [' totalXP '] ?? 0; Сохранение данных в сессии (локально) Аналогично PHP- сессии: SharedPreferences или провайдер состояния // _ saveSession ( userId, username); print(' Успешный вход: $ username, XP: $ totalXP '); } on FirebaseAuthException catch (e) { if ( e.code == 'user-not-found' || e.code == 'wrong-password') { throw Exception(' Неверный email или пароль.'); } else { throw Exception(' Ошибка авторизации: ${ e.message }'); } } }
В ходе тестирования мобильного приложения были использованы следующие методы: Функциональное тестирование – проверка работоспособности ключевых функций: регистрация и авторизация, модули «Слова», «Грамматика», «Аудирование», начисление очков опыта, повышение уровня, ежедневная серия, магазин и анимированный персонаж. Тестирование пользовательского интерфейса – проверка удобства и корректности отображения интерфейса на разных устройствах ( Android и iOS ) и разрешениях экрана. Тестирование проводилось вручную : выполнялись все сценарии с точки зрения обычного пользователя, выявлялись неудобства в использовании. Также проводилась визуальная проверка соответствия элементов дизайну в Figma. Отладка осуществлялась с помощью инструментов Visual Studio Code (отладчик, точки останова) и горячей перезагрузки Flutter ( hot reload ), что позволило оперативно находить и исправлять ошибки.
Цель работы — разработать, реализовать и экспериментально проверить концепцию мобильного приложения для изучения иностранных языков с игровыми механиками и анимированным персонажем, направленную на повышение эффективности обучения и пользовательской мотивации. В ходе работы были реализованы основные функции: регистрация и авторизация, модули «Слова», «Грамматика» и «Аудирование», система очков опыта, уровней и игровой валюты, анимированный персонаж, ежедневная серия, таблица лидеров и офлайн-режим. Для хранения данных использованы Firebase и Hive. Разработка велась на Flutter ( Dart ) с кроссплатформенной поддержкой Android и iOS.
« Разработка мобильного приложения для изучения иностранных языков с использованием игровых механих. »
