|
|
@@ -0,0 +1,160 @@
|
|
|
+# ОТЧЁТ О РАЗРАБОТКЕ И ФУНКЦИОНИРОВАНИИ ОБРАЗОВАТЕЛЬНОГО ВЕБ-ПОРТАЛА «УМНЯША»
|
|
|
+
|
|
|
+**Дата составления:** 22 июня 2026 г.
|
|
|
+
|
|
|
+**Владелец проекта:** Сергеева Алёна Николаевна
|
|
|
+
|
|
|
+**Адрес сайта:** [sergeeva26.beget.tech](http://sergeeva26.beget.tech).
|
|
|
+
|
|
|
+**Направление:** развивающие онлайн-игры для детей дошкольного и младшего школьного возраста
|
|
|
+
|
|
|
+---
|
|
|
+
|
|
|
+## 1. ВВЕДЕНИЕ
|
|
|
+
|
|
|
+В рамках работы над проектом был разработан и развёрнут интерактивный образовательный веб-портал **«УмНяша»** — авторская платформа, объединяющая семь развивающих игр, систему мотивации, рекомендации для родителей и инструменты обратной связи. Проект ориентирован на гармоничное развитие детей в возрасте **до 10 лет** через игровую деятельность.
|
|
|
+
|
|
|
+**Ключевая идея проекта:** превратить процесс обучения в увлекательное путешествие, в котором каждый правильный ответ поощряется, а каждый навык — тренируется в комфортной визуальной среде.
|
|
|
+
|
|
|
+---
|
|
|
+
|
|
|
+## 2. ЦЕЛИ И ЗАДАЧИ ПРОЕКТА
|
|
|
+
|
|
|
+### 2.1. Цель
|
|
|
+Создание безопасной, эстетичной и педагогически выверенной цифровой среды для всестороннего развития ребёнка.
|
|
|
+
|
|
|
+### 2.2. Задачи
|
|
|
+
|
|
|
+| № | Задача | Реализация на сайте |
|
|
|
+|---|--------|---------------------|
|
|
|
+| 1 | Развитие памяти | Игра «Найди пару» (Мемори) |
|
|
|
+| 2 | Формирование математических навыков | Игра «Весёлый счёт» (4 режима) |
|
|
|
+| 3 | Развитие логического мышления | Игра «Найди лишнее» |
|
|
|
+| 4 | Знакомство с понятием времени | Игра «Учим время» |
|
|
|
+| 5 | Тренировка наблюдательности | Игра «Найди тень» (2 режима) |
|
|
|
+| 6 | Развитие пространственного мышления | Игра «Ходилка» (Пятнашки 3×3) |
|
|
|
+| 7 | Расширение кругозора | Игра «Викторина» |
|
|
|
+| 8 | Мотивация ребёнка | Система достижений и конфетти |
|
|
|
+| 9 | Информирование родителей | Раздел «Советы для родителей» |
|
|
|
+| 10 | Обратная связь | Раздел «Отзывы» с рейтингом |
|
|
|
+
|
|
|
+---
|
|
|
+
|
|
|
+## 3. СТРУКТУРА САЙТА
|
|
|
+
|
|
|
+Портал построен по принципу **одностраничного приложения (SPA)** с вкладочной навигацией. Все разделы доступны из единого меню:
|
|
|
+
|
|
|
+| Вкладка | Назначение |
|
|
|
+|---------|------------|
|
|
|
+| 🏠 **Главная** | Приветствие, обзор игр, информация об авторе |
|
|
|
+| 🎮 **Игры** | Игровое поле с выбором из 7 активностей |
|
|
|
+| ⭐ **Отзывы** | Форма оценки и лента отзывов пользователей |
|
|
|
+| 📚 **Советы** | Рекомендации для родителей по организации игрового процесса |
|
|
|
+| 🏆 **Достижения** | Личный кабинет наград и прогресс-бар |
|
|
|
+
|
|
|
+---
|
|
|
+
|
|
|
+## 4. ХАРАКТЕРИСТИКА ИГРОВОГО БЛОКА
|
|
|
+
|
|
|
+Ниже представлена сводная таблица реализованных игровых механик:
|
|
|
+
|
|
|
+| Игра | Развиваемый навык | Механика | Система мотивации |
|
|
|
+|------|-------------------|----------|-------------------|
|
|
|
+| 🧩 **Найди пару** | Зрительная память, концентрация | Переворот карточек, поиск совпадений (8 пар) | Счётчик ходов, конфетти при победе |
|
|
|
+| 🔢 **Весёлый счёт** | Арифметические навыки | Решение примеров (➕➖✖️➗) на время | Режим «Аркада» (30 с), серия правильных ответов |
|
|
|
+| 🧠 **Логика** | Аналитическое мышление | Поиск лишнего предмета в ряду (5 элементов) | 3 жизни, таймер 5 с на вопрос, серия до 20 |
|
|
|
+| ⏰ **Учим время** | Понимание часов | Сопоставление эмодзи-часов с цифровым временем | Счётчик правильных ответов |
|
|
|
+| 🌓 **Найди тень** | Наблюдательность | Два режима: «Найди тень» и «Найди предмет» | 3 жизни, бонусы за скорость, таймер |
|
|
|
+| 🧩 **Ходилка** | Пространственное мышление | Классические «Пятнашки» 3×3 | Счётчик ходов, алгоритм проверки решаемости |
|
|
|
+| ❓ **Викторина** | Эрудиция, кругозор | 15 вопросов с 4 вариантами ответа | Таймер 10 с, статистика ✅/❌ |
|
|
|
+
|
|
|
+---
|
|
|
+
|
|
|
+## 5. СИСТЕМА ДОСТИЖЕНИЙ И ГЕЙМИФИКАЦИИ
|
|
|
+
|
|
|
+Для повышения вовлечённости реализована **система из 9 достижений**, которые открываются по мере прогресса пользователя:
|
|
|
+
|
|
|
+| № | Иконка | Название | Условие получения |
|
|
|
+|---|--------|----------|-------------------|
|
|
|
+| 1 | 🧩 | Мемори-мастер | Найти все пары за ≤15 ходов |
|
|
|
+| 2 | 🔢 | Математический гений | 10 правильных ответов подряд |
|
|
|
+| 3 | 🧠 | Логик | 5 лишних предметов подряд |
|
|
|
+| 4 | ⏰ | Знаток времени | 10 правильных ответов подряд |
|
|
|
+| 5 | 🌓 | Наблюдатель | Набрать ≥20 очков в «Найди тень» |
|
|
|
+| 6 | 🧩 | Скоростной сборщик | Собрать пазл за ≤20 ходов |
|
|
|
+| 7 | ❓ | Эрудит | 8 правильных ответов подряд в викторине |
|
|
|
+| 8 | 👣 | Первые шаги | Сыграть в любую игру 3 раза |
|
|
|
+| 9 | 🏅 | Любознайка | Открыть все достижения |
|
|
|
+
|
|
|
+Дополнительно реализованы:
|
|
|
+- **Общий прогресс-бар** (в процентах);
|
|
|
+- **Конфетти-анимация** при победах и регистрации;
|
|
|
+- **Сохранение статистики** в `localStorage` (привязка к пользователю).
|
|
|
+
|
|
|
+---
|
|
|
+
|
|
|
+## 6. ПОЛЬЗОВАТЕЛЬСКАЯ СИСТЕМА
|
|
|
+
|
|
|
+На сайте реализована **регистрация и авторизация** со следующими возможностями:
|
|
|
+
|
|
|
+- создание личного аккаунта (имя ребёнка, email, пароль);
|
|
|
+- вход по логину/email;
|
|
|
+- персональное сохранение достижений и статистики;
|
|
|
+- кнопка «Выйти» для завершения сессии;
|
|
|
+- валидация полей и защита от дубликатов email.
|
|
|
+
|
|
|
+Все данные пользователей хранятся локально на стороне клиента с соблюдением требований согласия на обработку персональных данных.
|
|
|
+
|
|
|
+---
|
|
|
+
|
|
|
+## 7. ПЕДАГОГИЧЕСКАЯ ЦЕННОСТЬ
|
|
|
+
|
|
|
+В разделе **«Советы для родителей»** представлены научно обоснованные рекомендации:
|
|
|
+
|
|
|
+- **Дозирование нагрузки:** 15–20 мин (4–6 лет), до 30 мин (7–8 лет), до 40 мин (9–10 лет);
|
|
|
+- **Принцип похвалы:** акцент на старании, а не только на результате;
|
|
|
+- **Совместная игра** как инструмент укрепления доверия;
|
|
|
+- **Свобода выбора** — ребёнок сам решает, в какую игру играть.
|
|
|
+
|
|
|
+Каждая игра сопровождается описанием развиваемого навыка, что позволяет родителям осознанно подбирать активности под индивидуальные потребности ребёнка.
|
|
|
+
|
|
|
+---
|
|
|
+
|
|
|
+## 8. ТЕХНИЧЕСКИЕ ОСОБЕННОСТИ
|
|
|
+
|
|
|
+| Параметр | Значение |
|
|
|
+|----------|----------|
|
|
|
+| Технологии | HTML5, CSS3, Vanilla JavaScript |
|
|
|
+| Адаптивность | Полная поддержка мобильных устройств (media queries для 768 px и 480 px) |
|
|
|
+| Хранение данных | `localStorage` (пользователи, достижения, отзывы, статистика) |
|
|
|
+| Анимации | CSS-keyframes (плавающие иконки, конфетти, переходы) |
|
|
|
+| Доступность | Семантическая разметка, крупные кликабельные области, контрастные цвета |
|
|
|
+| Хостинг | beget.tech |
|
|
|
+
|
|
|
+---
|
|
|
+
|
|
|
+## 9. ЗАКЛЮЧЕНИЕ
|
|
|
+
|
|
|
+Проект **«УмНяша»** представляет собой законченное педагогическое решение, сочетающее:
|
|
|
+
|
|
|
+✅ **Семь разнонаправленных игр** для комплексного развития;
|
|
|
+✅ **Современный визуальный стиль** — тёплая палитра, плавные анимации, дружелюбные эмодзи;
|
|
|
+✅ **Систему мотивации**, удерживающую интерес ребёнка;
|
|
|
+✅ **Информационную поддержку родителей** через раздел советов;
|
|
|
+✅ **Персонализацию** через систему аккаунтов и достижений.
|
|
|
+
|
|
|
+Сайт полностью готов к использованию в качестве **дополнительного образовательного инструмента** как дома, так и в рамках начальной школы или детского развивающего центра.
|
|
|
+
|
|
|
+---
|
|
|
+
|
|
|
+## 10. КОНТАКТНАЯ ИНФОРМАЦИЯ
|
|
|
+
|
|
|
+🌐 **Адрес сайта:** [sergeeva26.beget.tech](http://sergeeva26.beget.tech).
|
|
|
+
|
|
|
+👩🏫 **Владелец и разработчик:** Сергеева Алёна Николаевна.
|
|
|
+
|
|
|
+📧 **Обратная связь:** доступна через форму отзывов на сайте.
|
|
|
+
|
|
|
+---
|
|
|
+
|
|
|
+*«Играй, развивайся, расти умным вместе с "УмНяша"!»* 🌟
|