React Native от идеи до публикации

04.05.2020
Posted in blog-article
04.05.2020 admin

React Native от идеи до публикации

Пацан к успеху шёл. React Native от идеи до стора

От идеи до App Store: создание моего первого приложения для iOS с помощью React Native

Недавно я создал свое первое приложение для iPhone, принятое в Apple App Store. Это довольно интересно и увлекательно, я трудился чтобы у многих появилась возможность загрузить доступный и нужный продукт. Я попытался использовать структурированный подход для всего процесса создания/выпуска приложений, и описал процесс в этой статье.

Мотивация

Почему я вообще хотел создавать приложение для iOS? Ответ прост, мне нравится этим заниматься, делать и использовать это для себя и других. Создание приложения, загружаемого из App Store, делает его очень легким в использовании, очень просто загрузить приложение на свой телефон и начать им пользоваться. У меня есть немного опыта работы с React Native на одной из моих предыдущих работ, поэтому я был уверен, что смогу построить приложение самостоятельно.

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

App Идея

Я хотел построить приложение, которым я хотел бы пользоваться, и что бы другие тоже хотели им пользоваться. Также не хотелось создавать то, что уже существует, так как я хотел предоставить уникальное решение проблемы. Многие разработчики создают игры для App Store, но я не хотел этого делать, так как не играю в игры на своем iPhone, я нахожу, что игры, как правило, не очень положительно влияют на человека.

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

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

Я решил пойти дальше и создать журнал — приложение для плотоядной диеты (фото Jez Timms  по сайту Unsplash)

Планирование

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

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

Обратите внимание,акцент я ставлю на удержание приложения. Так как это было мое первое мобильное приложение, я хотел убедиться, что я не сделал все слишком сложно. Если бы я представил многофункциональное приложение,то скорее всего, приложение было бы не столь успешным.

Как только я составил представление о том, что я хотел бы создать, я начал перечислять функции, которые хотел бы иметь в приложении. Я классифицировал вещи под V1 и V2: 

V1-это функции, которые должны быть частью первой версии приложения; 

V2-функции, которые было бы здорово иметь в будущем выпуске;

Список функций, которые я планировал иметь в приложении для первой и второй версий приложения.

Дизайн

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

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

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

Рисунок каркасов для экранов в приложении.

Далее, я начал строить высококачественные проекты для приложения. Я сделал все это в Figma, и вы можете просмотреть проекты для себя. Я снял все значки с FlatIcon, заплатил за права на их использование.

Проекты для каждого экрана приложения.

Развитие

Я решил использовать знакомый язык для приложения, как я уже имел опыт работы с ним и не хотел изучать новый язык программирования. Также я решил, что сосредоточусь только на разработке для iOS, даже если React Native также позволяет создавать для Android. Решение сосредоточиться только на iOS, пришло потому что все работает так, как задумано и на iOS и на Android. А еще потому, что то, что работает на iOS, не означает, что будет работать на Android. Кроме того, поскольку у меня есть iPhone, а не Android, имеет смысл разработать на iOS, поскольку я мог бы протестировать приложение как в симуляторе, так и на физическом устройстве.

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

Я также настроил проект с непрерывной интеграцией/развертывания в Visual Studio — центр приложения, так, чтобы виден был каждый коммит, который я сделал, чтобы мой мастер создавал ветку приложение и отправлял его в iTunes подключение. iTunes Connect-это куда вы можете отправить свое приложение в App Store, а также проведение тестирования с помощью TestFlight.

Я выбрал Центр приложений Visual Studio для CI / CD проекта, потому что их бесплатный уровень был в состоянии удовлетворить все мои потребности с 240 минут времени сборки в месяц с максимальным временем сборки 30 минут на сборку. Я хотел использовать круг ки, но их свободный план не позволяет строит на macOS машин, который необходим для iOS. Я также рассматривал возможность использования Bitrise поскольку их UI/UX-это очень мило, но их максимальное время сборки-10 минут на сборку и мои построения шли чуть более 10 минут.

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

Apple имеет свой собственный пользовательский тест приложение под названием TestFlight как приложение, которая позволяет приглашать других пользователей, чтобы загрузить и протестировать приложение, прежде чем онo попадет в магазин приложений. У меня на самом деле не было хорошего пула заслуживающего доверия и заинтересованных людей, чтобы проверить мое приложение, но мне удалось заставить двух моих друзей загрузить мое приложение через TestFlight. Тестирование пользователей моего приложения на самом деле не является приоритетом для меня, так как я не имел высоких ожиданий.

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

Отправка В App Store

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

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

Скриншоты я отправил вместе с приложением

После того, как я отправил свое приложение на утверждение, я получил электронное письмо меньше чем через 24 часа, где говорится, что мое приложение было одобрено, и через несколько часов мое приложение можно будет найти в App Store!

Приложение MeatJournal в магазине приложений.

Краткие сведения

От идеи до выпуска, весь процесс занял у меня месяц. Кроме того, с точки зрения стоимости, я потратил $136 CAD на лицензию разработчика Apple и $15 CAD на права иконок, которые я использовал в приложении. Так что в общей сложности я потратил $151 CAD (прибл. $117 долларов США) на приложение. Лицензия Apple для разработчиков хороша на 1 год, после чего мне придется продлить лицензию.

Что дальше

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

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Contact

Давайте работать вместе!

Пишите нам и найдем точки соприкосновения, может станем партнерами, а может поможем вам зайти в нашу чудесную нишу

Вы разработчик?

Пишите! Нам постоянно нужны новые кадры, либо можем помочь в продвижении вашего приложения

Новичок?

Поможем быстро войти в нишу, не тратя годы на понимание

Давно в нише?

Рады будем пообщаться как на темы whitehat, так и blackhat тематики ^_^ + всегда есть что обсудить по поводу рекламных сетей

ПИШИ В TELEGRAM!

Contact