Пошаговое руководство: создание клона Khan Academy с Adalo

Почему Adalo идеален для создания образовательного приложения

Adalo — конструктор приложений без кода для веб-приложений и нативных приложений iOS и Android с одной версией на всех трех платформах, опубликованной в Apple App Store и Google Play. Это идеальное решение для создания платформы обучения в стиле Khan Academy, где вам нужно управлять курсами, отслеживать прогресс студентов и безупречно доставлять образовательный контент на все устройства ваших учащихся.

Для образовательного приложения наличие в app store имеет критическое значение — студенты ожидают загружать инструменты обучения прямо из Apple App Store или Google Play, как они это делают с Khan Academy или Coursera. С Adalo вы также можете использовать push-уведомления для напоминания учащимся о новых уроках, стимулирования завершения курсов и повышения вовлеченности на протяжении всего образовательного пути.

Создание онлайн-платформы обучения, подобной Khan Academy, никогда не было более доступным. С Adalo, конструктором приложений на базе ИИ для веб и нативных мобильных приложений, вы можете создать полнофункциональную образовательную платформу для iOS, Android и веб без написания ни одной строки кода — все из одной версии приложения. В то время как традиционная разработка пользовательских приложений часто стоит десятки или сотни тысяч долларов в зависимости от объема и тарифов команды, Adalo значительно ускоряет сроки доставки. Это подробное руководство проведет вас через создание платформы обучения в стиле Khan Academy от проектирования базы данных до публикации на нескольких платформах.

Для образовательного приложения присутствие в app store имеет важное значение — студенты ожидают загружать инструменты обучения прямо из Apple App Store или Google Play, как они это делают с Khan Academy или Coursera. С Adalo вы также можете использовать push-уведомления для напоминания учащимся о новых уроках, стимулирования завершения курсов и повышения вовлеченности — все без написания кода.

Почему Adalo подходит для создания образовательной платформы

Adalo создает веб-приложения и нативные приложения iOS и Android на основе базы данных — одна версия на всех трех платформах, опубликованная в Apple App Store и Google Play. Это идеальный выбор для создания платформы обучения в стиле Khan Academy, где вам нужно управлять курсами, отслеживать прогресс студентов и безупречно доставлять контент на все устройства без поддержки отдельных кодовых баз.

Ada, конструктор искусственного интеллекта Adalo, позволяет вам описать то, что вы хотите, и генерирует ваше приложение. Magic Start создает полные основы приложения из описания, а Magic Add добавляет функции на естественном языке.

Возможности платформы масштабируется для обслуживания приложений с миллионами активных пользователей в месяцбез верхнего предела. В отличие от оболочек приложений, которые испытывают ограничения скорости под нагрузкой, специально разработанная архитектура Adalo сохраняет производительность в масштабе — критически важно, когда тысячи студентов могут одновременно получать доступ к вашей платформе в часы пиковой активности обучения.

Предварительные условия и первоначальная настройка

Шаг 1: создайте учетную запись Adalo и проект

1. Посетите Adalo.com и создайте бесплатный аккаунт
2. Нажмите «Создать новое приложение» в вашей панели управления
3. Выберите между «Мобильное приложение» или «Веб-приложение» (мобильное приложение рекомендуется для максимального охвата)
4. Назовите ваше приложение (например, «LearnPro» или «EduHub»)
5. Выберите «Начать с нуля» для создания пользовательской функциональности или используйте Волшебное начало для создания полной основы приложения из простого описания — скажите, что вам нужна образовательная платформа с курсами и викторинами, и она автоматически создаст структуру вашей базы данных, экраны и потоки пользователей

Бесплатный план Adalo предназначен для создания и тестирования; ознакомьтесь с текущими ограничениями плана на странице цен Adalo.

Шаг 2: Настройте параметры приложения

1. Нажмите на кнопку Параметры значок на левой панели
2. В разделе «Информация о приложении» добавьте:
   • Описание приложения
   • Значок приложения (рекомендуемый размер 512x512px)
   • Изображение экрана-заставки
3. Установите ориентацию приложения (Портретная для мобильного обучения)
4. Настройте параметры конфиденциальности и условия использования

Шаг 3: Установите тему дизайна

1. Перейдите на страницу Брендинг в настройках
2. Выберите основной цвет (например, синий для доверия и обучения)
3. Выберите вторичный цвет для призывов к действию (например, зеленый для прогресса)
4. Выберите читаемое семейство шрифтов для образовательного контента
5. Установите стили заголовков и размеры текста для доступности

Khan Academy сообщает о служении более 180 миллионам учащихся (189,6 млн в уч. году 24–25) в 190+ странах—Годовой отчет | Центр новостей.

Создание структуры базы данных

Шаг 4: дополните коллекцию пользователей

1. Нажмите на кнопку База данных значок на левой панели
2. Нажмите на стандартную коллекцию «Пользователи»
3. Добавьте эти свойства (нажмите «+ Добавить свойство» для каждого):
   • Полное имя (Текст)
   • Фотография профиля (Изображение)
   • Тип пользователя (Текст) — значения: «Студент», «Инструктор», «Администратор»
   • Биография (Текст — многострочный)
   • Последовательность обучения (Число)
   • Общее количество баллов (Число)
   • Зарегистрированные курсы (Связь с курсами)
   • Завершенные уроки (Связь с уроками)
   • Дата присоединения (Дата и время - Автоматически)

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

Шаг 5: Создайте коллекцию "Courses"

1. Нажмите + Добавить коллекцию
2. Назовите ее «Курсы»
3. Добавьте эти свойства:
   • Название курса (Текст)
   • Описание курса (Текст — многострочный)
   • Изображение курса (Изображение)
   • Категориям (Текст) — значения: «Математика», «Наука», «Гуманитарные науки», «Информатика», «Искусство»
   • Уровень сложности (Текст) — значения: «Начинающий», «Промежуточный», «Продвинутый»
   • Предполагаемая продолжительность (Число) - в часах
   • Всего уроков (Число)
   • Количество зачисленных (Число)
   • Цена (Число) - Установите 0 для бесплатных курсов
   • Выделено (Истина/Ложь)
   • Опубликовано (Истина/Ложь)
   • Дата создания (Дата и время - Автоматически)

Шаг 6: Создайте коллекцию "Lessons"

1. Нажмите + Добавить коллекцию
2. Назовите её "Lessons"
3. Добавьте свойства:
   • Название урока (Текст)
   • Описание урока (Текст — многострочный)
   • URL видео (Текст) — Adalo рекомендует MP4 (H.264) или ссылки на самостоятельно размещенные видео для компонента Video; для YouTube используйте YouTube компонент (Ссылки YouTube/Vimeo могут не воспроизводиться в собственных сборках). Компонент видео | Компонент YouTube
   • Миниатюра видео (Изображение)
   • Порядок уроков (Число)
   • Продолжительность (Число) — в минутах
   • Стенограмма (Текст — многострочный)
   • Ресурсы (Текст - многострочный) - Ссылки на PDF-файлы, упражнения
   • Бесплатный предпросмотр (Истина/Ложь)
   • Дата создания (Дата и время - Автоматически)

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

Шаг 7: Создание коллекции "Викторины"

1. Нажмите + Добавить коллекцию
2. Назовите её "Викторины"
3. Добавьте свойства:
   • Название викторины (Текст)
   • Описание викторины (Текст)
   • Проходной балл (Число) - процент, необходимый для прохождения
   • Ограничение по времени (Число) - в минутах (0 для неограниченного времени)
   • Всего вопросов (Число)
   • Допустимые попытки (Число)

Шаг 8: Создание коллекции "Вопросы"

1. Нажмите + Добавить коллекцию
2. Назовите её "Questions"
3. Добавьте свойства:
   • Текст вопроса (Текст — многострочный)
   • Тип вопроса (Текст) - Значения: "Множественный выбор", "Верно/Неверно", "Краткий ответ"
   • Правильный ответ (Текст)
   • Вариант A (Текст)
   • Вариант B (Текст)
   • Вариант C (Текст)
   • Вариант D (Текст)
   • Объяснение (Текст — многострочный)
   • Баллы (Число)

Шаг 9: Создание коллекции "Прогресс"

1. Нажмите + Добавить коллекцию
2. Назовите её "Прогресс"
3. Добавьте свойства:
   • Процент завершения (Число)
   • Потраченное время (Число) — в минутах
   • Оценка викторины (Число)
   • Завершено (Истина/Ложь)
   • В закладках (Истина/Ложь)
   • Последний доступ (Дата и время)
   • Дата завершения (Дата и время)

Шаг 10: Создание коллекции "Достижения"

1. Нажмите + Добавить коллекцию
2. Назовите её "Achievements"
3. Добавьте свойства:
   • Название значка (Текст)
   • Описание значка (Текст)
   • Значок (Изображение)
   • Тип значка (Текст) - Значения: "Серия", "Курс завершен", "Мастер викторин", "Ранняя пташка"
   • Требование (Число) - например, 7 для еженедельной серии
   • Стоимость в баллах (Число)
   • Дата получения (Дата и время - Автоматически)

Платформы с геймификацией могут повысить вовлеченность при хорошем дизайне; влияние варьируется в зависимости от контекста — критично для сохранения знаний в образовании.

Шаг 11: Установите связи в базе данных

1. В Курсы коллекции:
   • Добавить связь с Пользователями: "Инструктор" (Много Курсов → Один Пользователь)
   • Добавить связь с Уроками: Один-ко-Многим (Один Курс имеет много Уроков)
   • Добавить связь с Пользователями: "Зарегистрированные Студенты" (Много-ко-Многим)
   • Добавить связь с Викторинами: Один-ко-Многим
2. В Уроки коллекции:
   • Добавить связь с Курсами: Много-к-Одному (Много Уроков → Один Курс)
   • Добавить связь с Прогрессом: Один-ко-Многим
3. В Викторины коллекции:
   • Добавить связь с Courses: Many-to-One
   • Добавить связь с Questions: One-to-Many
4. В вопросы коллекции:
   • Добавить связь с Викторинами: Много-к-Одному
5. В Прогресс коллекции:
   • Добавить связь с Пользователями: Много-к-Одному (Много записей Прогресса → Один Пользователь)
   • Добавить связь с Уроками: Много-к-Одному (Много Прогресса → Один Урок)
6. В Достижения коллекции:
   • Добавить связь с Пользователями: Много-ко-Многим (Пользователи могут получить много достижений)

Узнайте больше о построение реляционных баз данных для образовательных платформ.

Создание аутентификации пользователей и адаптации

Шаг 12: Создайте экран приветствия

1. Переименуйте экран по умолчанию в "Welcome"
2. Добавьте Изображение компонент для вашего логотипа (по центру)
3. Добавьте Текст (Заголовок): "Учитесь чему угодно, когда угодно"
4. Добавьте Текст (Подзаголовок): "Присоединяйтесь к тысячам учащихся, овладевающих новыми навыками"
5. Добавьте две Кнопки:
   • "Начать" → Ссылка на экран "Регистрация"
   • "У меня есть учетная запись" → Ссылка на экран "Вход"
6. Оформите брендовыми цветами и обеспечьте адаптивность для мобильных устройств

Шаг 13: Создание экрана регистрации

1. Добавить новый экран с названием "Регистрация"
2. Добавьте Форму компонент:
   • Подключитесь к коллекции Users
   • Включите поля: адрес электронной почты, пароль, полное имя
   • Добавьте Выбор изображения для Фото профиля (опционально)
3. Добавьте Раскрывающийся список для типа пользователя:
   • Варианты: "Я студент", "Я инструктор"
   • Установить по умолчанию "Студент"
4. Добавьте Флажок: "Я согласен с условиями обслуживания"
5. Настроить действия кнопки отправки:
   • Создать учетную запись пользователя
   • Если Тип пользователя = "Инструктор" → Перейти к "Настройке инструктора"
   • Если Тип пользователя = "Студент" → Перейти к "Выбору интересов"

Шаг 14: Создать экран входа

1. Добавить новый экран с названием "Вход"
2. Добавьте Форму компонент:
   • Поле ввода электронной почты
   • Поле ввода пароля
3. Добавить кнопку отправки: "Войти"
   • Действие: Выполнить вход пользователя
   • Перейти к: экран "Главная" (создадим его далее)
4. Добавьте Button (Кнопку): "Забыли пароль?" → Перейти к сбросу пароля
5. Добавьте Текстовая ссылка: "Нет учетной записи? Зарегистрируйтесь"

Шаг 15: Построить выбор интересов студента

1. Добавить новый экран "Выбор интересов"
2. Добавьте Текст: "Что вы хотите изучать?"
3. Добавьте Пользовательский список категорий курсов:
   • Отобразить название категории и значок
   • Разрешить выбор нескольких вариантов
   • Используйте Флажок или компоненты переключателей
4. Добавьте Button (Кнопку): "Продолжить" → Перейти к "Главной"
   • Обновить профиль пользователя с выбранными интересами

Шаг 16: Создать экран настройки инструктора

1. Добавьте новый экран "Instructor Setup"
2. Добавьте Форму для обновления текущего пользователя:
   • Биография (Text Area)
   • Опыт (Ввод текста)
   • Ссылки веб-сайта/социальных сетей (Текст)
   • Фото профиля (средство выбора изображения)
3. Добавьте Button (Кнопку): "Завершить настройку" → Перейти к "Панели инструктора"

Создание интерфейса студента

Шаг 17: Создайте главный экран студента

1. Добавьте новый экран "Home"
2. Добавьте панель навигации с:
   • Логотип приложения
   • Значок Поиск
   • Значок профиля → Ссылка на экран "Профиль"
3. Добавьте Текст (Приветствие): "Добро пожаловать обратно, [Logged In User > Full Name]"
4. Добавьте раздел: "Продолжить обучение"
   • Пользовательский список текущих курсов в процессе
   • Фильтр: Progress > User = Logged In User AND Progress > Completed = False
   • Показать миниатюру курса, название и полосу прогресса
5. Добавьте раздел: "Рекомендуется для вас"
   • Пользовательский список курсов, соответствующих интересам пользователя
   • Показать изображение курса, название, рейтинг, количество уроков
6. Добавьте раздел: "Популярные курсы"
   • Пользовательский список отсортированные по количеству записей
   • Отображайте карточки с горизонтальной прокруткой
7. Добавьте нижнюю навигацию:
   • Значок "Главная" → Текущий экран
   • Значок "Обзор" → Экран "Обзор курсов"
   • Значок "Прогресс" → Экран "Мое обучение"
   • Значок "Профиль" → Экран "Профиль"

Посмотрите эти шаблоны мобильных приложений для дизайнерского вдохновения.

Шаг 18: Создайте экран "Обзор курсов"

1. Добавьте новый экран "Обзор курсов"
2. Добавьте Поисковая строка компонент:
   • Подсказка: "Поиск курсов..."
   • Поиск в: Courses > Course Title
3. Добавьте Горизонтальная прокрутка для фильтров категорий:
   • Button (Кнопку) чипы для каждой категории (Математика, Наука и т.д.)
   • Нажмите для фильтрации списка курсов
4. Добавить опции фильтра:
   • Раскрывающийся список: Сортировать по (Популярные, Новые, Рейтинг, Цена)
   • Раскрывающийся список: Уровень сложности
   • Переключатель: Только бесплатные курсы
5. Добавьте Пользовательский список отфильтрованных курсов:
   • Показать изображение курса, название, инструктора, рейтинг, цену
   • Нажмите → Перейдите на экран "Детали курса"

Шаг 19: Создайте экран "Детали курса"

1. Добавить новый экран "Детали курса"
2. Передайте текущий курс в качестве параметра
3. Добавьте раздел заголовка курса:
   • Изображение: Текущий курс > изображение курса
   • Текст (Название): Current Course > Course Title
   • Текст: Current Course > Instructor > Full Name
   • Текст: "★ [Rating] • [Enrollment Count] студентов"
   • Текст: Current Course > Course Description
4. Добавьте Button (Кнопку) (условно):
   • Если пользователь не записан: "Записаться сейчас" или "Купить за $[Price]"
   • Если записан: "Продолжить обучение"
5. Добавьте раздел "Что вы изучите":
   • Текст выделение ключевых результатов
6. Добавьте раздел "Содержание курса":
   • Пользовательский список уроков (Current Course > Lessons)
   • Показать номер урока, название, продолжительность
   • Значок блокировки для неопубликованных уроков при отсутствии доступа
7. Добавить раздел "Отзывы":
   • Отображать оценки и комментарии студентов

Этап 20: Создание экрана проигрывателя видеоуроков

1. Добавить новый экран "Проигрыватель урока"
2. Добавьте Video компонент:
   • URL видео: Текущий урок > URL видео
   • Установить автозапуск видео
   • Полная ширина, адаптивная высота
3. Добавить информацию об уроке под видео:
   • Текст (Название): Текущий урок > Название урока
   • Текст: Текущий урок > Описание урока
   • Button (Кнопку): "Отметить как завершено" (условная видимость если не завершено)
4. Добавить элементы управления навигацией:
   • Button (Кнопку): "← Предыдущий урок"
   • Button (Кнопку): "Следующий урок →"
5. Добавить вкладки для дополнительного контента:
   • Вкладка: "Обзор" - Показать описание
   • Вкладка: "Ресурсы" - Загружаемые материалы
   • Вкладка: "Транскрипт" - Полный транскрипт видео
   • Вкладка: "Заметки" - Заметки студента (текстовое поле)
6. Добавьте Button (Кнопку): "Пройти тест" (если тест существует для этого урока)

Этап 21: Создание экрана прохождения теста

1. Добавить новый экран "Пройти тест"
2. Добавить заголовок теста:
   • Текст (Название): Текущий тест > Название теста
   • Текст: "Вопрос [Текущий номер] из [Всего вопросов]"
   • Индикатор прогресса: Визуальный прогресс теста
   • Таймер: Если тест ограничен по времени (Текущий тест > Лимит времени)
3. Добавить отображение вопроса:
   • Текст: Текущий вопрос > Текст вопроса
   • Изображение: Если вопрос содержит изображение
4. Для вопросов с множественным выбором:
   • Переключатели для вариантов A, B, C, D
   • Сохранить выбранный ответ во временную переменную
5. Добавить навигацию:
   • Button (Кнопку): "Предыдущий вопрос"
   • Button (Кнопку): "Следующий вопрос"
   • Button (Кнопку): "Отправить тест" (на последнем вопросе)
6. При отправке:
   • Рассчитать оценку (подсчитать правильные ответы)
   • Создать запись Прогресс с оценкой теста
   • Перейти на экран "Результаты теста"

Этап 22: Создание экрана результатов теста

1. Добавить новый экран "Результаты теста"
2. Отображать краткую информацию о производительности:
   • Текст (Крупный): "[Оценка]%"
   • Текст: "Вы ответили правильно на [Количество правильных] из [Всего вопросов]"
   • Значок: Индикатор прохождения/непрохождения
3. Показать разбор правильных/неправильных ответов:
   • Пользовательский список из вопросов
   • Показать ответ пользователя в сравнении с правильным ответом
   • Показать объяснение для каждого вопроса
4. Добавить кнопки действий:
   • Button (Кнопку): "Повторить тест" → Вернуться к тесту
   • Button (Кнопку): "Продолжить обучение" → Следующий урок
   • Button (Кнопку): "Повторить урок" → Вернуться к видеоплееру

Этап 23: Создание панели управления учащегося

1. Добавить новый экран "Мое обучение"
2. Добавить обзор прогресса:
   • Текст: "Всего курсов: [Количество зарегистрированных курсов]"
   • Текст: "Завершено: [Количество завершенных]"
   • Текст: "В процессе: [Количество незавершенных]"
   • Текст: "Серия обучения: [Пользователь > Серия обучения] дней"
3. Добавить вкладки:
   • Вкладка: "Все курсы" - Список зарегистрированных курсов
   • Вкладка: "В процессе" - Отфильтрованный список
   • Вкладка: "Завершено" - Завершенные курсы с сертификатами
4. Для каждого курса в списке:
   • Показать миниатюру курса
   • Отобразить процент прогресса
   • Показать кнопку "Продолжить" или "Повторить"

Построение интерфейса инструктора

Этап 24: Создание панели управления инструктора

1. Добавить новый экран "Панель инструктора"
2. Добавить обзор метрик:
   • Текст: "Всего курсов: [Количество]"
   • Текст: "Всего учащихся: [Сумма зачислений]"
   • Текст: "Средний рейтинг: [Среднее значение]"
   • Текст: "Зачисления в этом месяце: [Количество]"
3. Добавить быстрые действия:
   • Button (Кнопку): "Создать новый курс" → Экран "Создание курса"
   • Button (Кнопку): "Просмотреть аналитику"
4. Добавьте Пользовательский список курсов инструктора:
   • Показать изображение курса, название, количество зачислений
   • Нажать → Перейти на экран "Управление курсом"

Этап 25: Создание экрана "Создание курса"

1. Добавить новый экран "Создать курс"
2. Добавить многоэтапную форму или интерфейс с вкладками:
   • Вкладка 1: Основная информация
     • Название курса (текстовое поле)
     • Описание курса (область текста)
     • Изображение курса (выбор изображения)
     • Категория (раскрывающийся список)
     • Уровень сложности (раскрывающийся список)
   • Вкладка 2: Цены
     • Цена (числовое поле)
     • Бесплатный курс (флажок)
   • Вкладка 3: Содержание
     • Добавить уроки (список с добавлением/удалением)
     • Название урока, URL видео, длительность
   • Вкладка 4: Оценка
     • Создать тест (ссылка на конструктор тестов)
3. Добавьте Button (Кнопку): "Сохранить черновик" → Создать курс (Опубликовано = Нет)
4. Добавьте Button (Кнопку)"Опубликовать курс" → Создать курс (Published = True)

С Волшебное добавление, вы можете описать новые функции, которые вам нужны—например, "добавить систему генерации сертификатов"—и ИИ автоматически добавит необходимые компоненты и логику.

Шаг 26: Создание экрана управления курсом

1. Добавить новый экран "Управление курсом"
2. Добавить статистику курса:
   • Всего зачислений
   • Процент завершения
   • Средние баллы по тестам
   • Оценки студентов
3. Добавьте Пользовательский список уроков:
   • Функция переупорядочивания перетаскиванием (если доступна)
   • Кнопки редактирования/удаления для каждого урока
   • Button (Кнопку): "Добавить новый урок"
4. Добавьте Пользовательский список зачисленных студентов:
   • Имя студента, дата зачисления, прогресс
5. Добавить кнопки действий:
   • Button (Кнопку): "Редактировать сведения о курсе"
   • Button (Кнопку): "Добавить тест"
   • Button (Кнопку): "Снять с публикации курс"

Шаг 27: Создание экрана для создания урока

1. Добавить новый экран "Добавить урок"
2. Добавьте Форму подключено к Урокам:
   • Название урока (Текстовое поле)
   • Описание урока (Текстовая область)
   • URL видео (Текстовое поле) - Поддержка YouTube/Vimeo
   • Миниатюра видео (Выбор изображения)
   • Порядок урока (Числовое поле)
   • Продолжительность (Числовое поле в минутах)
   • Транскрипция (Текстовая область)
   • Ресурсы (Текстовая область - markdown или ссылки)
3. Добавить связь с родительским курсом
4. Button (Кнопку): "Сохранить урок" → Создать урок → Вернуться назад

Реализация отслеживания прогресса и геймификации

Шаг 28: Настройка автоматического отслеживания прогресса

1. На экране плеера урока добавить Обратный отсчет:
   • Продолжительность: 95% длины видео
   • По завершении таймера → Создать/обновить запись прогресса:
     • User = Logged In User
     • Урок = Текущий урок
     • Завершено = Истина
     • Дата завершения = Сейчас
2. При нажатии кнопки "Отметить как завершено":
   • Создать/обновить запись прогресса с теми же значениями
   • Проверить, все ли уроки в курсе завершены
   • Если да → Выдать значок завершения курса
3. Обновить полосу обучения пользователя:
   • Проверить дату последней учебной деятельности
   • Если сегодня или вчера → Увеличить полосу
   • Если разрыв > 1 дня → Сбросить полосу на 1

Шаг 29: Создание системы достижений

1. Создать пользовательские действия, которые срабатывают на вехах:
   • Первый урок завершен: Выдать значок "Начало работы"
   • Полоса на 7 днейНаграда "Боец недели"
   • 30-дневная серияНаграда "Мастер месяца"
   • Первый курс завершенНаграда "Завоеватель курсов"
   • Идеальный результат в викторинеНаграда "Мастер викторин"
2. Для каждого создания достижения:
   • Создать запись о достижении
   • Связать с вошедшим в систему пользователем
   • Добавить баллы к общему количеству баллов пользователя
   • Отправить push-уведомление с поздравлением пользователю

Шаг 30: Построение экрана достижений

1. Добавить новый экран "Достижения"
2. Добавить заголовок со статистикой пользователя:
   • Текст (Большой): "[User > Total Points] Баллов"
   • ТекстУровень [Calculated Level]
   • Индикатор прогрессаПрогресс к следующему уровню
3. Добавьте Пользовательский список достижений:
   • Фильтр: Вошедший в систему пользователь > Достижения
   • Сортировка по: Дата получения (Сначала новые)
   • Показать значок достижения, название, описание, дату
4. Добавить раздел "Заблокированные достижения":
   • Показать неполученные достижения в оттенках серого
   • Показать требование для разблокировки

Шаг 31: Создание экрана "Таблица лидеров"

1. Добавить новый экран "Таблица лидеров"
2. Добавить селектор периода времени:
   • Кнопки"На этой неделе", "В этом месяце", "За все время"
3. Добавьте Пользовательский список пользователей:
   • Сортировка по: Всего баллов (Выше всего)
   • Ограничить топ 50–100
   • Показать номер рейтинга, фотографию профиля, имя, баллы
   • Выделить строку вошедшего в систему пользователя
4. Показать текущий рейтинг пользователя:
   • ТекстВаш рейтинг: [Position]

Узнайте, как геймификация повышает вовлеченность в образовательных приложениях.

Проектирование пользовательского опыта

Шаг 32: Внедрение адаптивного дизайна

1. Для каждого экрана проверьте представления на мобильных устройствах и планшетах:
   • Нажмите Предпросмотр (Текст: «Активно», «Приостановлено», «Ожидание проверки»)
   • Протестировать на экранах разных размеров
2. Отрегулировать макеты:
   • Используйте Адаптивная ширина параметры
   • Расположите элементы вертикально на мобильном устройстве
   • Использовать горизонтальную прокрутку для списков карточек
3. Убедитесь в размере целей касания:
   • Минимум кнопок 44x44 пикселя
   • Адекватное расстояние между интерактивными элементами
4. Оптимизируйте изображения:
   • Сжимайте перед загрузкой
   • Используйте подходящие размеры
   • Учитывайте состояния загрузки

Дизайн, адаптивный к мобильным устройствам, критически важен для охвата учащихся, которые все чаще получают доступ к контенту через смартфоны и планшеты. Визуальный конструктор Adalo — описываемый пользователями как «столь же простой, как PowerPoint» — делает адаптивные корректировки дизайна простыми.

Шаг 33: Добавьте состояния загрузки и пустые состояния

1. Для каждого компонента списка:
   • Добавьте Текст: «Загрузка...» (отображается во время загрузки данных)
   • Добавьте сообщение для пустого состояния: «Пока нет курсов. Просмотрите наш каталог, чтобы начать!»
2. Для видеокомпонентов:
   • Добавьте индикатор загрузки
   • Добавьте сообщение об ошибке, если видео не загружается
3. Для отправки форм:
   • Отключите кнопку отправки при обработке
   • Показывайте сообщения об успехе/ошибке

Шаг 34: Настройте функцию поиска

1. На экране «Просмотр курсов»:
   • Поисковая строка фильтрация коллекции «Курсы»
   • Поиск по: названию курса, описанию курса, имени инструктора
   • Обновляйте список результатов в реальном времени
2. Добавьте историю поиска (опционально):
   • Сохраняйте последние поиски
   • Отображайте как быстрые чипсы выбора
3. Добавьте фильтры, которые работают с поиском:
   • Категория + поиск
   • Диапазон цен + поиск

Шаг 35: Реализуйте добавление в закладки

1. Добавьте значок закладки на экраны уроков
2. При клике:
   • Обновите запись прогресса
   • Установите Bookmarked = True/False (переключение)
3. Создайте экран «Уроки в закладках»:
   • Пользовательский список записей прогресса
   • Фильтр: User = Вошедший пользователь И Bookmarked = True
   • Отображайте миниатюру урока, название, название курса

Интеграция внешних сервисов

Шаг 36: Настройте видеохостинг

1. Выберите сервис видеохостинга:
   • YouTube: Бесплатное хранилище, неограниченный объем, удобное встраивание
   • Vimeo: Проверьте текущие цены Vimeo; выберите уровень, который соответствует вашим потребностям в хранении и конфиденциальности
   • Самостоятельный хостинг: Выше стоимость, полный контроль
2. Загружайте видео курсов на выбранную платформу
3. Получайте URL-адреса встраивания или ID видео
4. Сохраняйте в поле Lessons > Video URL
5. Протестируйте воспроизведение в видеокомпоненте Adalo

Рассмотрите возможности интеграции Zapier в Adalo для бесшовных рабочих процессов управления видео.

Шаг 37: Интеграция обработки платежей (необязательно)

1. Установите компонент Stripe из Adalo Marketplace:
   • Перейдите на Marketplace
   • Поищите "Stripe"
   • Нажмите «Установить»
2. Получите API-ключи Stripe:
   • Создайте учетную запись Stripe
   • Перейдите в раздел Developers > API Keys
   • Скопируйте публикуемый и секретный ключи
3. Настройте Stripe в компоненте:
   • Добавьте компонент платежей/подключения Stripe и нажмите "Connect with Stripe" для авторизации; затем установите детали продукта/цены в компоненте
4. Добавьте экран платежей:
   • компоненты Stripe Payment компонент
   • Сумма: Current Course > Price
   • При успешном платеже:
     • Создайте запись о регистрации
     • Перейдите к содержимому курса

Шаг 38: Настройка уведомлений по электронной почте

1. Используйте Пользовательские действия (или Zapier/Make) для отправки электронных писем через поставщика (например, SendGrid); встроенного действия на стороне сервера для отправки писем нет.
2. Для продвинутых писем интегрируйте SendGrid:
   • Создайте учетную запись SendGrid (60-дневный бесплатный период, 100 писем/день; платный план требуется после этого), затем выберите платный план (Essentials начинается с $19,95/месяц)
   • Используйте интеграцию с Zapier:
     • Триггер: New User Created
     • Действие: Send SendGrid Email
3. Создайте шаблоны писем с брендированием
4. Протестируйте все потоки писем

Шаг 39: Добавление отслеживания аналитики

1. Аналитика:
   • Используйте встроенную интеграцию Mixpanel в Adalo (вставьте ваш токен Mixpanel в Adalo). Если вам требуется GA4, подключитесь через внешние инструменты (например, Zapier/Pipedream) или пользовательские скрипты для PWA
2. Отслеживайте ключевые события:
   • Регистрации на курсы
   • Завершение уроков
   • Отправки викторин
   • Регистрации пользователей
3. Создайте пользовательские панели мониторинга для:
   • Метрики вовлеченности пользователей
   • Популярные курсы
   • Показатели завершения
   • Доход (если применимо)

Шаг 40: Реализация push-уведомлений

1. Запросите разрешение на уведомления:
   • Добавьте действие при первом запуске приложения
   • Запросить разрешение на уведомления
2. Установить триггеры уведомлений:
   • Ежедневное напоминание об обучении: "Продолжайте вашу серию!"
   • Рекомендация нового курса: "New course in [Interest]"
   • Достижение получено: "You earned [Badge Name]!"
   • Обновления инструктора: "New lesson added to [Course]"
3. Настройте в Settings > Notifications:
   • Добавьте сертификаты уведомлений (iOS)
   • Настройте Firebase (Android)

Тестирование вашей платформы обучения

Шаг 41: Создание тестовых данных

1. Добавьте тестовых пользователей:
   • 5-10 учетных записей студентов
   • 2-3 учётные записи инструкторов
   • 1 учётная запись администратора
2. Создание примеров курсов:
   • 3-5 завершенных курсов по категориям
   • 10-15 уроков на курс
   • Комбинация бесплатных и платных курсов
3. Добавьте вопросы викторины:
   • Варианты множественного выбора, вопросы верно/неверно
   • Включите пояснения
4. Создавайте записи о прогрессе:
   • Имитируйте студентов на различных этапах завершения

Шаг 42: Тестирование основных пользовательских сценариев

Поток студента:

1. Регистрация → Выберите интересы → Просмотрите курсы
2. Зарегистрируйтесь в курсе → Смотрите урок → Отметьте как завершенное
3. Пройдите викторину → Просмотрите результаты → Перейдите к следующему уроку
4. Завершите курс → Получите достижение → Просмотрите сертификат

Поток преподавателя:

1. Зарегистрироваться как преподаватель → Заполнить профиль
2. Создайте новый курс → Добавьте уроки → Добавьте викторину
3. Опубликуйте курс → Просмотрите статистику регистраций
4. Отредактируйте содержание курса → Управляйте студентами

Шаг 43: Тестирование на различных устройствах

1. Используйте приложение Adalo Preview:
   • Установить TestFlight (iOS) или используйте Google Play внутреннее/закрытое тестирование (Android) для тестирования вашего приложения Adalo на реальных устройствах
   • Отсканируйте QR-код из редактора
   • Протестируйте все экраны и взаимодействия
2. Тестирование на разных размерах экрана:
   • Мобильный (375px, 414px)
   • Планшет (768px, 1024px)
   • Рабочий стол (1280px+)
3. Проверьте производительность:
   • Время загрузки видео
   • Плавность прокрутки списка
   • Отзывчивость отправки формы

После капитального обновления инфраструктуры Adalo 3.0 в конце 2025 года приложения работают в 3-4 раза быстрее чем раньше. Используйте X-Ray для выявления любых проблем с производительностью до того, как они повлияют на ваших пользователей.

Шаг 44: Проведите тестирование приемлемости пользователем

1. Привлеките 5-10 бета-тестеров:
   • Смесь студентов и преподавателей
   • Различные уровни технических навыков
2. Предоставьте сценарии тестирования:
   • «Зарегистрируйтесь в курсе и завершите первый урок»
   • «Создайте новый курс с 3 уроками»
   • «Пройдите викторину и проверьте свои результаты»
3. Соберите отзывы:
   • Используйте формы обратной связи
   • Отметьте ошибки и точки путаницы
   • Соберите запросы функций
4. Совершенствуйте на основе обратной связи:
   • Исправьте критические ошибки
   • Улучшите неясную навигацию
   • Оптимизируйте экраны с медленной загрузкой

Публикация вашей платформы обучения

Шаг 45: Подготовьтесь к запуску

1. Завершите все содержание:
   • Добавьте политику конфиденциальности (требуется для магазинов приложений)
   • Добавьте условия обслуживания
   • Создайте страницы о программе/справки
2. Настройка интеграций для production:
   • Production-ключи Stripe (не тестовый режим)
   • Production-ключ Google Maps API
   • Production-аккаунт SendGrid
3. Оптимизация базы данных:
   • Проверьте все связи
   • Удалите тестовые данные
   • Установите соответствующие индексы

Шаг 46: Опубликуйте как Progressive Web App

1. Перейдите на страницу Публикация в настройках
2. Нажмите «Опубликовать в веб»
3. Выберите поддомен:
   • yourapp.adalo.com (требуется платный план — Starter или выше)
   • Или подключите пользовательский домен (требуется план Starter; проверьте текущие цены)
4. Приобретите пользовательский домен:
   • Стоимость: $10-45/год
   • Подключите через параметры DNS
5. Включите функции PWA:
   • Запрос на установку
   • Поддерживаются базовые возможности PWA; поведение в автономном режиме ограничено и должно быть протестировано для вашего варианта использования
   • Значок на главном экране

Узнайте больше о публиковать веб-приложения с Adalo.

Шаг 47: Опубликуйте в App Store

1. Требования:
   • Аккаунт Apple Developer ($99/год)
   • План Adalo Starter или выше (см. страницу с ценами Adalo для текущих планов, квот и опций публикации)
2. Подготовьте ресурсы:
   • Значок приложения (1024x1024px)
   • Скриншоты (разные размеры)
   • Описание приложения и ключевые слова
3. В Adalo:
   • Перейдите в Publishing > iOS
   • Нажмите «Опубликовать в App Store»
   • Заполните информацию приложения
   • Загрузите ресурсы
4. Отправить на проверку:
   • Apple указывает, что в среднем 90% отправок проверяются менее чем за 24 часа, хотя время варьируется в зависимости от приложения (например, неполные отправки могут замедлить проверку)
   • Мониторьте статус проверки

Проверьте руководство по публикации приложений iOS в магазины приложений.

Шаг 48: Опубликуйте в Google Play Store

1. Требования:
   • Учетная запись Google Play Developer ($25 единовременно)
   • План Adalo Starter или выше
2. Подготовьте ресурсы:
   • Графика функции (1024x500px)
   • Снимки экрана (телефон и планшет)
   • Описание приложения
3. В Adalo:
   • Перейдите в Publishing > Android
   • Нажмите «Опубликовать в Play Store»
   • Заполните сведения о приложении
   • Загрузите ресурсы
4. Отправить на проверку:
   • Google отмечает, что проверки могут занять до 7 дней или дольше (особенно для новых разработчиков или сложных отправок)

Прочитайте о успешной публикации приложений Android .

Понимание затрат и текущего обслуживания

Шаг 49: Рассчитайте общую стоимость владения

Затраты в первый год (примерно $500-$1,500):

Элемент	Стоимость
Подписка Adalo	Начиная с $36/месяц для веб и нативных мобильных приложений с неограниченным использованием
Имя домена	$10-15 в год
Apple Developer Account	$99/год
Google Play Developer Account	$25 единовременно
Видеохостинг (YouTube)	Бесплатно
Видеохостинг (Vimeo)	Проверьте текущие цены

Время создания контента: Переменная — ориентировочно 10-20 часов на один полный курс. Можно монетизировать для компенсации расходов.

Это значительно ниже, чем традиционная разработка пользовательских приложений, которая часто стоит десятки или сотни тысяч долларов в зависимости от объема и ставок команды. В отличие от предложения веб- и мобильного обертки Bubble (начиная с $69/месяц с использованием платежей на основе использования и ограничениями записей), Adalo $36/месяц начальная цена включает неограниченное использование и без ограничений на данные для платных планов.

Шаг 50: Планирование масштабирования и роста

1. Когда обновлять план Adalo:
   • Бесплатный → Starter: Когда готов к публикации с пользовательским доменом
   • Starter → Professional: Когда вам нужна большая емкость (например, более 1 опубликованного приложения, больше редакторов или дополнительные функции) — Starter уже включает встроенную публикацию
   • Professional → Team: Когда требуется несколько приложений или редакторов
   • Team → Business: Когда вам нужно Неограниченные редакторы приложений и до 10 опубликованных приложений
2. Соображения масштабирования базы данных:
   • С правильной настройкой отношений данных приложения Adalo могут масштабироваться более чем на 1 миллион активных пользователей в месяц
   • Используйте внешние коллекции для больших наборов данных
   • Также рассмотрите Интеграция Xano для расширенного масштабирования
3. Мониторинг производительности:
   • Отслеживайте время загрузки страницы
   • Контролируйте проблемы с буферизацией видео
   • Просматривайте процент завершения пользователями
   • Adalo поддерживает высокую доступность
4. Стратегия расширения контента:
   • Запустить с 3-5 курсами (MVP)
   • Добавлять 1-2 курса ежемесячно в зависимости от спроса
   • Опросить пользователей о запросах по темам
   • Сотрудничать с экспертами в предметной области

Почему Adalo — это правильный выбор для платформ обучения

Создание образовательной платформы, подобной Khan Academy, традиционно требует месяцев разработки и бюджета в шесть цифр. Adalo полностью меняет это уравнение, делая это идеальным выбором для преподавателей, предпринимателей и организаций, стремящихся создавать учебные опыты.

Быстрая разработка без компромиссов: С помощью визуального конструктора Adalo вы можете создать функциональную платформу обучения за 2-5 недель согласно некоторым практикующим специалистам. Интерфейс перетащи-и-отпусти позволяет вам сосредоточиться на педагогике и контенте, а не на синтаксисе и отладке. Однако вы не жертвуете качеством — приложения Adalo включают встроенную мобильную функциональность, адаптивный веб-дизайн и профессиональный вид.

Экономичная цена для любого бюджета: Общие расходы за первый год составляют всего $500-$1500, включая подписки, хостинг и сборы в магазинах приложений. Сравните это с традиционной разработкой, где расходы сильно варьируются в зависимости от объема. Независимо от того, являетесь ли вы независимым преподавателем, проверяющим идею, или учреждением, создающим дополнительные инструменты обучения, цены Adalo масштабируются в соответствии с вашими потребностями от бесплатного уровня до корпоративного.

Функции, специально разработанные для образования: Встроенная в Adalo реляционной базой данных обрабатывает сложные структуры образовательных данных — студентов, курсы, уроки, отслеживание прогресса, викторины и достижения — без необходимости в опыте администрирования базы данных. маркетплейс компонентов предлагает видеоплееры, системы рейтинга и интерактивные элементы, необходимые для привлекательных учебных опытов.

Истинная многоплатформенная публикация: В отличие от конструкторов шаблонов, ограниченных веб-версией, Adalo позволяет вам публиковать на iOS, Android, и веб из одной сборки. Это имеет значение, потому что адаптивные мобильные приложения позволяют учащимся получать доступ к контенту где угодно. Одна сборка обновляет все три платформы одновременно — в отличие от конкурентов, чьи мобильные решения являются веб-обертками, требующими отдельного обслуживания.

Экосистема интеграций для роста: По мере роста вашей платформы интеграции Adalo с Stripe для платежей, Zapier для автоматизации и Xano для расширенных бэкендов означают, что вы можете добавлять сложные функции без перестройки. Начните с простого, масштабируйте стратегически.

Доказанный послужной список: На Adalo было создано более 3 миллионов приложений. Платформа поддерживает высокую доступность, обеспечивая надежный доступ ваших учащихся к учебным материалам.

Часто задаваемые вопросы

Почему выбрать Adalo вместо других решений для создания приложений?

Adalo — это приложение для создания приложений на базе ИИ, которое создает истинные нативные приложения для iOS и Android. В отличие от веб-оболочек, оно компилируется в нативный код и публикуется напрямую в Apple App Store и Google Play Store из единой кодовой базы — самая сложная часть запуска приложения выполняется автоматически.

Какой самый быстрый способ создать и опубликовать приложение в App Store?

Интерфейс Adalo с перетаскиванием и создание с помощью искусственного интеллекта позволяют перейти от идеи к опубликованному приложению за дни, а не месяцы. Magic Start генерирует полные основы приложений из описаний, а Adalo берет на себя сложный процесс отправки в App Store, чтобы вы сосредоточились на функциях и опыте пользователя.

Могу ли я создать образовательную платформу, подобную Khan Academy, без кодирования?

Да. С помощью Adalo вы можете создавать системы управления курсами, отслеживать прогресс учащихся, создавать плееры видеоуроков, викторины и функции геймификации, используя визуальный интерфейс и предварительно созданные компоненты — без написания кода.

Как я могу отслеживать прогресс учащихся и внедрять геймификацию?

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

Какие затраты связаны с построением образовательной платформы с помощью Adalo?

Затраты в первый год обычно составляют от 500 до 1500 долларов США, включая подписку Adalo (начиная с 36 долларов США в месяц), доменное имя (10–15 долларов США в год), учетную запись разработчика Apple (99 долларов США в год) и учетную запись разработчика Google Play (25 долларов США единовременно). Это значительно меньше, чем при традиционной разработке на заказ.

Могу ли я интегрировать видеохостинг и обработку платежей?

Да. Adalo поддерживает интеграцию видео через YouTube, Vimeo или самостоятельно размещаемые MP4-файлы с помощью встроенных видеокомпонентов. Для платежей интегрируйте Stripe через маркетплейс Adalo, чтобы принимать платежи за премиум-курсы прямо в вашем приложении.

Как Adalo справляется с масштабированием для больших баз учащихся?

Модульная инфраструктура Adalo масштабируется для обслуживания приложений с миллионами ежемесячно активных пользователей без верхнего предела. Платные планы не имеют ограничения на количество записей в базе данных, а переработка инфраструктуры Adalo 3.0 (конец 2025 года) сделала приложения в 3–4 раза быстрее, чем раньше.

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

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

Что более доступно — Adalo или Bubble?

Веб-приложение Adalo и конструктор мобильных приложений начинается с 36 долларов США в месяц с неограниченным использованием и без ограничений на записи в платных планах. Веб-приложение Bubble и предложение с мобильной оболочкой начинаются с 69 долларов США в месяц с использованием на основе платежей (рабочие единицы) и ограничения на записи, которые могут привести к непредвиденным затратам.

Нужен ли опыт кодирования для создания приложений в Adalo?

Опыт программирования не требуется. Визуальный конструктор Adalo описывается как «такой же простой, как PowerPoint». Magic Start и Magic Add используют искусственный интеллект для создания основ приложений и добавления функций из описаний на естественном языке.