Проекты

QT — что это за фреймворк и почему мы выбрали его для детского приложения с видео

QT — что это за фреймворк и почему мы выбрали его для детского приложения с видео

Коротко о проекте

  • 01
    Заказчик

    Детский клуб раннего развития Baby Cool

  • 02
    Задача
    • Быстро и с минимальными вложениями создать детское приложение с видео для iOS и Android
    • Администраторам должно быть удобно загружать длинные видеоролики
    • Предусмотреть механизм платной подписки
  • 03
    Решение

    Разработать мобильное приложение на Qt, фреймворке C++

  • 04
    Результат
    • За 5 месяцев разработали мобильное приложение
    • UX/UI приложения ориентировано на детскую аудиторию
    • За счет Qt сэкономили бюджет и ускорили разработку: одна команда выпустила приложение сразу для двух платформ
    • Благодаря Qt framework упростили интеграцию с платежными системами: основные банковские решения написаны на С++, как и Qt
    • Настроили систему непрерывной загрузки видео: ролики можно загружать целой коллекцией, независимо от их размера и скорости интернета
    • Систему можно масштабировать в будущем

Что такое Qt

Qt framework написан на С++. На нем разрабатывают кроссплатформенные приложения — от английского cross-platform. Они работают одновременно на нескольких операционных системах: iOS и Android, Windows и Linux. Это ускоряет сроки разработки и экономит бюджет: команда пишет программный код для одного приложения вместо двух.

Чтобы улучшить качество и упростить разработку сложных программ, разработчики обычно пишут код в интегрированных средах разработки (IDE). Это специальные редакторы с полезными инструментами, такими как компилятор, отладчик и другими. К наиболее популярным IDE для Qt относятся: Qt Creator, CLion, Visual Studio Code, Code: Blocks, Eclipse.

Qt framework можно использовать не только с языком C++. С помощью модулей-обвязок разработчики могут писать код для приложений на более удобных для них языках, сохраняя при этом всю мощь и функциональность Qt.

Вот некоторые из модулей для Qt, которые можно использовать в том числе на платформах Windows и Linux, а также интегрировать в Qt Creator:

PyQt и PySide (Python). Популярный модуль для Qt, поддерживающая версии Qt 4 и Qt 5. PyQt предоставляет полный доступ ко всем функциям Qt, включая GUI, сетевые возможности, работу с файлами и многое другое.

PySide является официальной обвязкой для Qt. Как и PyQt, она поддерживает версии 4 и 5 и предоставляет доступ ко всем функциям Qt. PySide 2 поддерживает Qt 5, а PySide 6 — Qt 6.

Qt for Perl (Perl Qt) позволяет использовать Qt с языком программирования Perl. Perl Qt предоставляет интерфейс для работы с графическим интерфейсом и другими возможностями.

Kotlin/Native for Qt позволят использовать Qt с языком программирования Kotlin.

Rust Qt Binding Generator обеспечивает интерфейс для использования Qt с языком программирования Rust, чтобы создавать кроссплатформенные приложения и программы, используя возможности Qt и безопасность Rust.

QML и JavaScript. QML — это не совсем обвязка, это язык декларативного программирования, интегрированный в Qt. С использованием QML можно создавать интерфейсы на основе JavaScript и писать код для пользовательских интерфейсов в Qt Quick.

Qt Jambi. Это официальная обвязка Qt для Java. Она обеспечивает доступ ко всем функциям фреймворка из Java-кода. Ею поддерживается версия 4 и 5.

Эти обвязки значительно расширяют возможности разработчиков, позволяя использовать Qt с различными языками программирования и создавать кроссплатформенные приложения с богатым графическим интерфейсом и функциональностью для Windows, Linux, Android и других ОС.

Qt является не только фреймворком. Это также библиотека классов языка C++ и набор инструментов для создания графических интерфейсов (GUI). Qt предоставляет два основных набора инструментов:

  1. Qt for Application Development для создания кроссплатформенных приложений, работающих на Windows, Linux, macOS, Android и других ОС. Включает компоненты: Qt Framework, Qt Creator, Qt Quick и QML, Qt Widgets, Qt Mobility.
  2. Qt for Device Creation для разработки встраиваемых систем, работающих на устройствах: автомобильных развлекательных системах, медицинском оборудовании и других. Включает компоненты: Qt Framework, Qt for Device Creation Toolchain, Qt for Embedded Linux, Qt Automotive Suite.

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

Детский клуб хочет проводить развивающие занятия онлайн

Baby Cool — это детский клуб раннего развития. В нем проводятся занятия для детей: иностранные языки, шахматы, подготовка к школе и другие. Раньше обучение проводилось только очно, что ограничивало целевую аудиторию клуба.

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

Создали детское приложение с видео

Разработали концепцию, спроектировали UX/UI

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

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

главный экран приложения
Заказчику было важно, чтобы интерфейс приложения был логичным и не перегруженным деталями

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

Контент детского приложения разделен по возрастам: от 2 лет и старше. Когда пользователь выбирает другую возрастную группу, материал в разделах меняется соответственно возрасту. В рамках одного аккаунта взрослого в приложении можно создать несколько аккаунтов для детей разных возрастов.

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

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

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

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


Для контроля знаний разработаны тесты, а все пройденные курсы и занятия отображаются в личном кабинете

Написали приложение на Qt framework

После согласования дизайна с заказчиком приступили к программированию приложения. Мы выбрали Qt — это фреймворк на языке C++. Это решение позволило с помощью одной команды сделать приложение сразу для двух платформ. Если писать два нативных приложения, требуется две команды: Swift-разработчики для iOS и Kotlin-разработчики для Android.

Преимущества использования Qt framework:

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

Qt framework подходит для создания MVP и проверки гипотез. Если нужно проверить, как рынок реагирует на продукт, изучить реакцию пользователей разных платформ, стоит начать с кроссплатформенного решения. Модели поведения аудитории Apple и Android сильно отличаются. После проверки может оказаться, что продукт подходит именно пользователям Apple. Тогда можно сфокусировать ресурсы и бюджет на разработке одного нативного приложения.

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

Приложение на этапе тестирования

Нам понадобилось 5 месяцев для завершения разработки. Проектом занималась команда из 7 человек: дизайнера, двух Qt-разработчиков, бэкенда, фронтенда, тестировщика и проджект-менеджера. Сейчас приложение на этапе тестирования и наполнения контентом.

Чтобы упростить заказчику работу с контентом, мы реализовали административную панель не в приложении, а на отдельном сайте. Основной контент приложения — видео. При загрузке файлов такого типа на сервер может возникать ряд проблем:

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

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

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

Когда видео загружается, оно сразу транскодируется в форматы разного качества: 240, 360, 480, 720p и Full HD. Формат выбирается плеером приложения автоматически при воспроизведении видео и зависит от скорости интернета: чем она выше, тем лучше качество. Даже при плохом соединении видео продолжает воспроизводиться, но в меньшем разрешении.

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

Получите ответ по смс

Ваше сообщение успешно отправлено!
Представьтесь пожалуйста
Укажите номер, на который придет ответ
Нажимая на кнопку, вы даете согласие
на обработку персональных данных.

Перезвонить вам, чтобы ответить на вопросы?

Когда с вами связаться?

Связаться по телефону:+7 499 321-59-32

Нажимая на кнопку, я принимаю условия политики и пользовательского соглашения

Фото эксперта
Дмитрий

Проектный менеджер

Получите ответ на ваш вопрос в любимом мессенджере

Выберите удобный мессенджер и начните диалог прямо сейчас

Telegram WhatsApp

Рассчитать стоимость проекта

Расскажите о вашем проекте, чтобы мы могли проконсультировать вас.

Напишите ваше имя
Укажите ваш email

Выберите удобный для вас способ связи

Мы сразу получим ваш запрос и поможем в решении проблемы

Написать в Telegram

Написать в WhatsApp

Позвонить нам