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

Что такое мобильное приложение

Мобильное приложение — это программа, работающая на планшетах и смартфонах. С помощью программ владелец такого устройства решает практические задачи: соединяется с интернетом, публикует фотографии в социальных сетях, редактирует текст или изображения, командует танковыми бригадами, пропалывает огороды или слушает музыку. Приложение включает front- и back-end. Front-end — это компоненты программы, с которой взаимодействует клиент. Back-end, или серверная часть — это компоненты, с которыми взаимодействует разработчик. Условно говоря, front-end находится на устройстве пользователя, а back-end на личном или арендованном сервере владельца программы. Пользователи смартфонов и планшетов загружают приложения с сайтов разработчиков или из магазинов. Самые известные магазины — Google Play и App Store. Аудитория считает приложения из магазинов безопасными, так как модераторы проверяют программы перед публикацией. При выборе конструктора обратите внимание на две позиции. Во-первых, сервис должен обеспечивать хостинг приложения. Во-вторых, выбранный ресурс должен обеспечить возможность управления приложением и его публикацию в Google Play, App Store и других популярных магазинах.

Набросок приложения

Представьте, что вы строите дом. Вы никогда этого не делали, но научиться можно, просто надо начать с азов. И первый шаг — рисунок дома на бумаге. Создание мобильного приложения тоже начинайте с наброска. Нарисуйте то, каким вы видите приложение. Даже не надо сразу пытаться сделать это красиво. Добавить шапку-хэдер, меню и рубрики, напишите название, нарисуйте логотип, расположите кнопки регистрации и входа в приложение. Теперь подумайте, какие элементы и функции вы хотите добавить в приложение. Подумайте над поведением пользователя в меню. Пусть этим пользователем пока являетесь вы сами, но подумайте, куда кликнете сначала, а куда потом? Что хотите видеть на первой странице? Нужен ли личный кабинет? В какой момент захочется вернуться на главную страницу? Зафиксируйте то, что придумали на этом этапе. Нарисуйте экраны и стрелками между экранами проложите путь пользователя. На экранах схематично расположите места, где будет текст, фотографии, иллюстрации, кнопки. Это будущие элементы приложения. Очень важно на этом этапе не увлекаться и не придумывать много функций. Делайте проще, выделяйте только основные роли, придумывайте минимальный набор функций. Допустим, в приложении будут администратор и пользователь. Вот и придумайте, что каждому из них нужно в приложении.

База данных

Ваш дом стал обретать узнаваемые черты на наброске. Теперь надо добавить коммуникации, чтобы он начал функционировать. В случае с приложением — это данные и база, в которой они хранятся. Без данных приложения не будет. Ноукод-платформы для создания приложений сами делают и наполняют базу данных. Это таблицы со столбцами и строками, похожие на Excel. Но чтобы сделать базу данных, сначала поймите, какие пользователи им будут пользоваться и какие данные нужны. Например, вы делаете приложение для записи в автосервис. Здесь клиенты записываются к мастерам, а мастера видят запросы и составляют себе расписание. В приложении два типа пользователей — мастер и клиент. Их называют роли. Самих пользователей может быть много, допустим 10 мастеров и сколько угодно клиентов, а роли всего две — клиент и мастер. Клиенты будут заказывать у мастеров услугу, выбирая дату и время. Из этого формируются заказы. Так в приложении выделились 4 составляющие для формирования базы данных: мастер, клиент, услуга, заказ. Составляющие, на которых строятся данные, разработчики называют сущности. Каждая сущность записывается в отдельную таблицу. У каждой сущности есть свои «черты» — атрибуты. Они в таблице записываются столбцами. А данные сущностей и атрибуты вносятся внутрь таблицы, в строки. У сущности №1 — мастер — атрибуты: имя и фамилия, фото-аватар, номер телефона в автосалоне, опыт работы в годах, перечень услуг. У сущности №2 — клиент: имя и фамилия, номер телефона, почта. У сущности №3 — услуга: название, описание, цена. У сущности №4 — заказ: дата и время, услуга (или услуги), стоимость, мастер, клиент. Внутри базы данных возникнут связи. Сущности, выделенные для приложения, будут встречаться внутри приложения, пересекаться и иногда менять друг друга. Базы данных, в которых одна таблица определенным образом связана с другой в разработке, называются реляционными базами данных.

В примере с автосалоном, атрибуты сущности «услуги» появятся в сущности «заказы», как и атрибуты сущности «мастер» и «клиент». И каждый заказ будет отличаться — новый мастер, клиент, услуга, дата. А каждая услуга одна и та же, мастер — тоже. А вот клиенты разные. Набросать такую базу данных можно рядом с эскизом приложения. Также можно перенести ее в бесплатную программу Miro (https://miro.com/). Это виртуальная доска, на которой визуализируются данные и взаимосвязи. Там на виртуальных стикерах напишите названия сущностей и пропишите под ними столбиом их атрибуты.

Архитектура приложения

Теперь давайте доставим на место строительства будущего дома стройматериалы, сделаем фундамент и каркасы стен, полов, крыши, этажей. Поэтому с нарисованным эскизом приложения отправляйтесь за компьютер, чтобы нарисовать макет мобильного приложения. На сленге разработки макет называется вайрфрейм. Вайрфрейм помогает точно увидеть и объяснить, как будет выглядеть и работать мобильное приложение. Вы сразу поймете, как придуманные роли взаимодействуют с приложением и как реализуются функции. Для первого вайрфрейма вполне подойдет понятный, простой и бесплатный облачный сервис Figma (https://www.figma.com/), который работает через браузер и с компьютера. В сервисе есть рабочая область (frame), размер которой соответствует мобильному экрану.

Переносите в программу один за другим нарисованные на листах экраны приложения. Также схематично виртуальными фигурами нарисуйте шапку-хэдер, меню, логотип, напишите название, кнопку регистрации\входа. Готов стартовый экран. Затем переходите к созданию второстепенных экранов. Например, с главного экрана через кнопку «Войти» пользователь попадает на экран ввода данных аккаунта. Сделайте на этом экране ту же шапку-хэдер и два поля ввода для адреса почты и пароля. Соедините стрелочкой кнопку «Войти», которую вы нарисовали на первом экране, и второстепенный экран с формой входа в аккаунт. По такому же принципу изобразите все экраны, которые придумали для приложения.

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

Сервисы для создания мобильных приложений для Android и iOS

Mobincube (https://www.mobincube.com)

С помощью мобильных конструкторов можно разработать приложения с разной функциональностью. Вы можете выбрать универсальный сервис или конструктор, предназначенный для создания приложений определенного типа. Если хотите универсальный вариант, то попробуйте конструктор Mobincube. Mobincube позволяет создать приложение бесплатно, но в нем будет ограниченная функциональность и ограничение по количеству пользователей. Минимальная стоимость платного тарифа составляет 4,99 евро в месяц. При этом добавляется поддержка ASO (это как SEO, но для магазинов приложений), а также возможность удалить водяной знак сервиса. Сервис гарантирует полную поддержку монетизации, но на минимальном тарифе в приложении будет показываться сторонняя реклама. Избавиться от нее можно на более дорогих тарифных планах.

Все действия по созданию приложения в Mobincube выполняются в удобном визуальном редакторе. Сервис поддерживает все необходимые возможности, включая тонкую настройку дизайна, добавление видео и аудио. Можно редактировать исходный код создаваемого приложения, встраивать WEB, добавлять пуши, подключать Google Analytics, работать с базами данных и многое другое. Можно воспользоваться шаблонами или создать приложение с нуля. Для тех, кто не хочет возиться с ручными настройками, здесь есть удобный пошаговый мастер. Когда приложение будет готово к тестированию, вы можете создать предварительный просмотр и загрузить его на свое собственное устройство. Очередь весьма большая, поэтому придется подождать несколько часов, пока приложение будет сформировано. После этого вы сможете загрузить тестовое приложение двумя способами — ввести ссылку на приложение в адресной строке браузера смартфона или отсканировать QR-код.

После создания приложения мы сможем воспользоваться инструментами из раздела Tools:

• Облако — помогает просто и быстро управлять содержимым приложения.
• Монетизация — активируйте эту опцию, чтобы зарабатывать деньги с помощью своего приложения.
• Firebase Push и аналитика — это мощный и бесплатный инструмент Google, позволяющий отправлять пользователям PUSH-уведомления. Пуши позволяют анализировать, как используется ваше приложение.
• Инструменты оптимизации — выведите свое приложение в топ и получите больше загрузок.
• Частный бренд — с помощью этой службы вы можете настроить идентификатор своего приложения во всех доступных магазинах приложений. Например, «com.mybrand.app_name» вместо настройки по умолчанию Mobincube.
• Статистика — эта функция показывает статистику загрузок вашего приложения. Вы можете фильтровать данные (по операционной системе, источнику загрузки и периодам загрузки).

7 конструкторов, аналогичных Mobincube

• Create My Free App (http://www.createmyfreeapp.com/free-ecommerce-mobile-app-builder.php) — с помощью этого конструктора можно бесплатно написать приложение для интернет-магазина или кафе.
• MobiCommerce (http://www.mobicommerce.net/) — используйте этот конструктор, если ваш магазин работает на CMS Magento или PrestaShop. Стоимость можно узнать по запросу. Есть демонстрационная версия с ограниченной функциональностью.
• Appy Pie (http://www.appypie.com/e-commerce-app-builder) создает приложения, совместимые с платформами PrestaShop, WooCommerce, Shopify и другими. Инструмент платный, но есть бесплатный тарифный план с ограниченными возможностями, работающий 15 дней.
• iBuildApp (http://russia.ibuildapp.com/) предлагает русскоязычный интерфейс кабинета.
• Apptuse (https://apptuse.com/) создает приложения для iOS и Android, совместимые с 3Dcart, CS-Cart, Drupal Commerce, Magento, PrestaShop и другими популярными ecommerce-платформами. Стоимость использования стартует от 49 долларов в месяц. Также ваше приложение интегрируется с Google Analytics.
• Elite mCommerce (https://www.elitemcommerce.com/) позволяет создать приложения для интернет-магазинов на PrestaShop и Magento. Стоимость использования стартует от 99 долларов в месяц.
• BiznessApps (https://www.biznessapps.com/) предназначен для создания приложений разных типов для Android и iOS. Стоимость использования стартует от 300 долларов в месяц для реселлеров и 99 долларов в месяц для одного бизнеса. В течение 30 дней вы можете отказаться от использования конструктора и получить потраченные средства назад.

AppsGeyser (http://www.appsgeyser.com)

Зачем создавать приложение для информационного ресурса, если вы используете адаптивную верстку или мобильную версию сайта? Если пользователь один раз посетил ваш мобильный или адаптивный сайт, это не значит, что он сделает это еще раз. Но если пользователь установил приложение, он знает и ценит публикуемую вами информацию. Клиент собирается регулярно получать ее с помощью специальной программы. Помните, что приложение — это дополнительный канал продвижения проекта, который может стать дополнительным инструментом монетизации. AppsGeyser позволяет создать приложение для сайта без программирования. Есть бесплатная версия, но многие важные разделы, включая Edit, доступны только по подписке, цена которой составляет 5 долларов в месяц. И есть еще один нюанс. С помощью AppsGeyser вы сможете создавать приложения только для Android.

AppsGeyser обещает готовое комплексное приложение с множеством функций и быстрым доступом к web-сайту. Есть поддержка apk, включая вкладки социальных сетей, push-уведомления, монетизацию, поддержку любых URL-адресов. Можно предоставить пользователям приложения мгновенный доступ как ко всему сайту, так и только к избранным страницам. В личном кабинете AppsGeyser вы можете следить за количеством установок, создавать push-уведомления, опубликовывать приложение в магазинах, монетизировать свою идею с помощью рекламы, а также отредактировать приложение. Сгенерированный QR-код поможет быстро и просто скачать приложение. Вы также можете разместить специальный код на своем сайте, чтобы уведомлять своих посетителей о том, что у вашего сайта есть приложение для устройств на базе Android. Доступ к самым необходимым функциям можно получить только после приобретения платной подписки. Сюда входят:

• Возможность скачивания apk-файла и загрузки приложения в магазины.
• Редактирование приложения, включая визуальный редактор.
• Полноценные настройки монетизации.
• Статистика.
• Пуши.
• Бэкапы.

6 конструкторов, аналогичных AppsGeyser

• AppsMakerStore (http://appsmakerstore.com/) позволяет создавать приложения разных типов: от программ для электронных магазинов до решений для контент-проектов. Конструктор делает приложения для iOS и Android. Для новичков есть информативное руководство по использованию конструктора. Сервис платный, но цены узнать можно только по запросу.
• Appsbar (http://www.appsbar.com/) — это бесплатный сервис для создания приложений для Android и iOS с простой функциональностью.
• Buildfire (http://buildfire.com/) — условно-бесплатный сервис, с помощью которого можно создать приложения разного типа. Для использования конструктора оплата не требуется, но если вы захотите опубликовать приложение в магазинах, придется подписаться на платный тариф, цена которого стартует от 159 долларов в месяц.
• AppYet (http://www.appyet.com/) — бесплатный конструктор Android-приложений. Вы можете публиковать созданные программы в Google Play и монетизировать их с помощью рекламы.
• Appery (https://appery.io/) — платный конструктор для создания универсальных приложений. Вы можете оценить его функциональность, воспользовавшись бесплатным тестовым периодом доступа в течение 30 дней. Стоимость использования стартует от 25 долларов в месяц.
• Good Barber (http://www.goodbarber.com/) позволяет разрабатывать приложения для Android и iOS. Стоимость использования составляет 25 евро в месяц, но, прежде чем платить, им можно воспользоваться бесплатно в течение 30 дней.

Возможность блокировки новых приложений в магазинах

Обратите внимание, что большинство мобильных устройств по умолчанию блокирует установку приложений из неизвестных источников. Если пользователь скачает программу с вашего сайта или с сайта-конструктора приложений, то при попытке установить ее он увидит предупреждение о нарушении безопасности. Часть клиентов наверняка откажутся от установки программы. Чтобы решить эту проблему, опубликуйте приложение в App Store, Google Play или в других популярных магазинах.

Вместо заключения

С помощью предложенных сервисов действительно можно создавать работоспособные функциональные приложения. Эти приложения можно использовать для решения различных задач, от налаживания деятельности интернет-магазина до распространения контента и обучения вашей аудитории. Созданные в конструкторах приложения можно опубликовать в Google Play и App Store, редактировать, монетизировать с помощью рекламы или платных установок. Но и переоценивать предложенные сервисы не стоит. Их очевидным недостатком остается шаблонность. Речь идет как о дизайне, так и о функциональности программ. Кроме того, доступ к платформам с приличной функциональностью платный. Но попробовать создать мобильное приложение самостоятельно, чтобы понять, насколько оно необходимо вашему бизнесу, не только можно, но и нужно.