0:00 Да, это приложение для отслеживания менструального цикла зарабатывает 8 миллионов долларов каждый месяц. И я создал все приложение, не написав ни единой строчки кода. В этом видео я покажу вам, как именно я это сделал, шаг за шагом. Таким образом, к концу у вас тоже будет полностью функциональное приложение, готовое к работе и генерировать серьезный доход. Я не шучу. Но вот в чем проблема. Большинство инструментов, не требующих написания кода, позволяют только проектировать приложение. Они не настраивают серверную часть, учетные записи пользователей или обработку платежей. В результате у вас остается что-то, что выглядит хорошо, но на самом деле не работает. За последние пару месяцев я протестировал множество инструментов кодирования ИИ
0:46 , как вы видели в последних нескольких видео, и нашел лучший на данный момент инструмент, который прост в использовании для любого человека с нулевым опытом кодирования. Итак, вот как именно мы с вами собираемся шаг за шагом создать это приложение. Шаг первый: мы позволим ИИ сгенерировать идею приложения и создать полноценный план. На втором этапе мы создадим все основные функции, клонировав приложение для отслеживания менструального цикла и цикла Flow , одно из самых успешных приложений для здоровья в магазине приложений. На третьем этапе будет создана платежная система Stripe, и вы сможете начать зарабатывать деньги прямо сейчас. И не волнуйтесь, вам не нужно быть экспертом в программировании. Я бы не сказал, что я один из них, но я сделал это руководство невероятно простым для понимания, даже если вы никогда
1:31 раньше не создавали приложения. И то, что отличает этот метод от всех остальных, заключается в том, что мы используем только один инструмент ИИ, самый мощный на данный момент помощник по кодированию на основе ИИ . Это не просто какой-то базовый прототип. Мы создаем полную версию со всеми премиум-функциями, которые сделали оригинальное приложение Period Tracker ценным в миллионы долларов. И к концу этого видео, я обещаю вам, вы увидите, как легко превратить идею в реально работающее приложение, которое может приносить серьезный доход с помощью ИИ. Итак, давайте приступим. Инструмент искусственного интеллекта, который будет заботиться обо всем, что мы делаем сегодня, будет называться Lovable. Я привел ссылку ниже, так что вы можете зайти и ознакомиться. А
2:17 если вы нажмете на специальную ссылку в поле описания ниже, вы получите вдвое больше кредитов, так что у вас действительно будет достаточно кредитов для разработки приложения, которое мы создаем сегодня. Итак, первый шаг — объяснить Lovable, чего именно мы хотим. Итак, начнем с ввода запроса. Создайте полнофункциональное приложение для отслеживания менструального цикла с современным дизайном пользовательского интерфейса. Приложение должно включать в себя отслеживание менструального цикла и фертильности, отслеживание симптомов, режим беременности, а также информацию и обучение по вопросам здоровья. И вот так, с помощью нескольких простых слов и щелчка, Lovable приступает к работе. И за считанные секунды он генерирует полностью разработанное приложение под названием Harmony. И, честно говоря, ребята, это уже выглядит как что-то, что можно найти в магазине приложений сегодня. Впечатляет, не правда ли? Но нас интересует не
3:03 только внешность. Поэтому мы не собираемся останавливаться на достигнутом. Мы собираемся углубиться в него, усовершенствовать и добавить функции, которые сделают это приложение по-настоящему удобным. Итак, первое, что нужно исправить, это, конечно же, навигация. А сейчас, честно говоря, всё немного неуклюже. И поскольку никто не любит приложения, которыми сложно пользоваться, давайте исправим его и сделаем более интуитивным. Мы сообщим пользователям Lovable, что они должны иметь возможность перемещаться между различными разделами. отслеживание менструального цикла и фертильности, отслеживание симптомов, режим беременности, а также информация и просвещение в области здоровья. И мы просто ждем несколько секунд. И как вы видите, Lovable все реорганизует. И теперь вместо разрозненных опций у нас есть четыре четких раздела: отслеживание менструального цикла,
3:48 симптомы, беременность и информация. Да, честно говоря, это уже значительно облегчает навигацию, но не знаю, как вам, но что-то все равно кажется не совсем правильным. например, сверху есть дополнительная панель навигации с вкладками «календарь», « инсайты», «обучение» и «профиль», которые, по моему мнению, нам больше не нужны. Поэтому, вместо того, чтобы просто оставить все как есть и сбивать с толку наших пользователей, давайте немного наведем порядок и удалим первую навигацию, календарь, аналитику, обучение и профиль. И благодаря этому пользовательский интерфейс выглядит гораздо более элегантным, гораздо более простым и удобным для пользователя. Это именно то, что нам нужно. И теперь, когда структура прочна, нам нужно заняться чем-то сверхважным — аутентификацией пользователей, поскольку
4:34 никто не хочет потерять месяцы персональной медицинской информации только потому, что ее невозможно сохранить. Вот почему нам нужно убедиться, что пользователи могут регистрироваться, входить в систему, а затем безопасно хранить свои данные . Итак, мы скажем Lovable, что это приложение поддерживает создание учетных записей, хранение данных и безопасную аутентификацию. Начните с создания функционального пользовательского интерфейса и настройки базы данных, прежде чем добавлять отдельные функции. Подождем немного, и теперь наше приложение готово к подключению к Superbase, которая будет обрабатывать все внутренние хранилища и аутентификацию. Настройка Superbase может показаться немного технически сложной, но, честно говоря, на самом деле это очень просто. Сначала нажимаем на Superbase в правом верхнем углу и
5:19 входим в систему. Теперь, когда мы вошли, нам нужно предоставить Lovable необходимые разрешения, чтобы он мог плавно интегрироваться с нашим текущим проектом. И после этого мы создаем новый проект. Давайте дадим ей имя, введем надежный пароль базы данных и нажмем «Создать». И это все. Теперь серверная часть настроена, и нам осталось только связать ее с нашим приложением. Для этого мы попросили Lovable подключить страницу регистрации и входа в систему к Superbase, просто набрав connect the sign up login page with backend of Superbase. Предоставьте мне адрес сайта и URL-адреса перенаправления. И при этом Lovable немедленно отвечает уникальным URL-адресом, который нам нужно скопировать в Superbase, чтобы завершить соединение. Чтобы завершить этот шаг, переходим на
6:06 панель управления Sup и нажимаем на раздел аутентификации в конфигурации URL. Найдем поле, куда нам нужно вставить URL-адрес, который lovable уже предоставил нам заранее. И как только мы его вставим, нажмем «Сохранить». И вот так наше приложение и Superbase теперь связаны. Теперь пришло время проверить, действительно ли все работает. Мы создадим новую учетную запись, введем адрес электронной почты и, конечно же, пароль и попытаемся войти в систему . Сначала все кажется нормальным, пока мы не столкнемся с раздражающей проблемой. Superbase требует подтверждения по электронной почте, прежде чем разрешить нам войти в наш проект. Конечно, в некоторых случаях подтверждение адреса электронной почты является отличной функцией безопасности, но для такого приложения, как это, оно, в общем-то, излишне. Мы хотим, чтобы пользователи могли быстро войти в систему, не
6:53 проверяя каждый раз свой почтовый ящик . К счастью, исправить это довольно просто. Все, что нам нужно сделать, это вернуться на панель управления Superbase, нажать « Аутентификация» и прокрутить вниз до области настроек регистрации и входа в систему. Теперь в разделе « Поставщики O» мы найдем раздел электронной почты, а затем увидим, что опция подтверждения электронной почты включена по умолчанию. Теперь нам просто нужно отключить его и нажать «Сохранить». И снова, вот так, подтверждение по электронной почте больше не требуется. Теперь, когда мы войдём в систему в следующий раз, мы сможем мгновенно получить доступ к приложению . Хорошо, пока все хорошо, аутентификация полностью настроена. Теперь пришло время воплотить это приложение в жизнь. Сейчас это выглядит здорово, но трекер менструального цикла, который на самом деле не отслеживает его, — да, не очень-то полезен. Итак, теперь
7:41 нам нужно убедиться, что пользователи смогут с легкостью регистрировать даты начала и окончания менструального цикла . Давайте не будем усложнять им задачу. Чтобы это сделать, мы просто сообщаем Lovable в разделе, посвященном менструациям, о необходимости создания удобного интерфейса для отслеживания менструального цикла, в котором пользователи могут регистрировать даты начала и окончания менструального цикла. И как в любом автоматизированном процессе, в ходе него могут возникнуть некоторые сбои. И если мы обнаружим ошибку, не нужно паниковать. У Lovable есть встроенное решение. В правом верхнем углу есть кнопка «Попробовать исправить», на которую можно нажать. А произойдет следующее: Lovable автоматически устранит неполадку самостоятельно. И как только все будет выглядеть хорошо, мы можем перейти к более интересной части — предварительному просмотру раздела, чтобы увидеть, что на самом деле работает. Теперь, нажав кнопку предварительного просмотра, мы можем в режиме реального времени увидеть ход выполнения
8:29 нашего проекта. Теперь в разделе периодов вы видите кнопку периода журнала . Если нажать «Записать первый период», откроется меню, в котором пользователи смогут выбрать дату начала и дату окончания. Теперь, как только эти данные введены, информация мгновенно отображается на вкладке «Аналитика», предоставляя пользователям четкую историю их циклов. Но что делать, если пользователи не хотят вручную отслеживать все каждый раз, каждый месяц? Вот тут-то и пригодятся прогнозы на основе искусственного интеллекта. Если следующий менструальный цикл не отображается, мы можем попросить Lovable спрогнозировать будущие циклы и овуляцию на основе прошлых данных. И вот так . Теперь приложение включает
9:15 раздел прогнозов на будущее и показывает предстоящие менструации и периоды фертильности. Таким образом, каждый раз, когда один из наших пользователей заходит в наше приложение и регистрирует новую менструацию, вид календаря обновляется автоматически, что значительно упрощает отслеживание. Теперь у нас есть полнофункциональный трекер менструального цикла, который не только регистрирует прошлые циклы, но и может прогнозировать будущие. Никаких дополнительных ручных расчетов не требуется. Благодаря этому наше приложение становится намного мощнее, но, как всегда, мы всегда можем добавить что-то еще. Конечно, отслеживать менструальный цикл — это здорово , но понимать, как меняется ваше тело на протяжении цикла, еще лучше. Вот почему мы собираемся пойти дальше и добавить раздел или функцию отслеживания симптомов, которая позволит пользователям легко
10:02 регистрировать свое ежедневное настроение, любые физические симптомы, которые они могут ощущать, например, спазмы или головные боли, и даже режим сна. И чтобы настроить это, мы просим Lovable предоставить функцию отслеживания симптомов, которая позволит пользователям регистрировать свое ежедневное настроение, любые физические симптомы, такие как судороги, головные боли, вздутие живота и т. д., и, конечно, свой режим сна. И как только все будет готово и мы нажмем Enter, мы перейдем к разделу отслеживания симптомов. Теперь, когда пользователи вводят свои симптомы, например настроение или режим сна, а затем нажимают «Сохранить», их данные сохраняются. Однако простой текст — не самый интересный способ отслеживать тенденции с течением времени. Визуально это выглядит не очень привлекательно. Но чтобы сделать это более визуально привлекательным, мы пойдем дальше и скажем Lovable: «Отобрази отслеживание симптомов на интерактивной диаграмме или графике, чтобы
10:49 визуализировать изменения с течением времени». И с помощью этих нескольких креативных слов, подобных этому, характерные симптомы становятся легко различимы с первого взгляда, помогая нашим пользователям замечать такие тенденции, как головные боли перед менструацией или изменения сна в течение цикла. А если есть какие-то ошибки, ну, опять же, не проблема. Все, что нам нужно сделать, как и в прошлый раз, это просто снова нажать кнопку «Попробовать исправить» в правом верхнем углу, и Lovable автоматически устранит неполадку самостоятельно. А теперь, когда все работает гладко, пришло время заняться усовершенствованием нашего интерфейса. Навигационная страница по-прежнему включает в себя разделы «Домой», « Период», «Инсайты» и «Обучение», но в этом разделе они нам не особо нужны. Поэтому, чтобы сделать макеты более целенаправленными и не перегруженными, мы попросим Lovable просто удалить
11:35 страницу навигации. Теперь наш раздел отслеживания симптомов полностью функционален и гораздо более организован. Пользователи могут регистрировать свои симптомы. Они могут регистрировать свое настроение и режим сна. А затем, после выполнения всех этих записей, мы можем просмотреть их в подробной интерактивной диаграмме, что упрощает отслеживание. Теперь, в следующий раз, мы добавим режим беременности, чтобы сделать это приложение еще более многофункциональным и гораздо более мощным для наших пользователей. Сегодня планирование беременности или попытки зачать ребенка могут показаться невыполнимой задачей. Так почему бы не позволить нашему приложению отслеживать действия наших пользователей? Таким образом , в режиме беременности наши пользователи могут получить доступ ко всему: от прогнозов фертильности до данных о развитии плода, без стресса от ручных вычислений и большого объема ручного ввода данных. Итак
12:21 , для начала мы просим Lovable создать раздел о режиме беременности. Внедрить режим отслеживания фертильности, который прогнозирует овуляцию и наиболее фертильные дни. И после этого переходим к разделу о беременности. А теперь есть и трекер фертильности. пользователи могут проверить предстоящие окна фертильности и даты овуляции. Таким образом, будет легче планировать зачатие. Больше не будет никаких догадок, никаких бесконечных вычислений цикла, а вместо этого, благодаря нашему приложению, у них просто будут понятные прогнозы на основе искусственного интеллекта прямо у вас под рукой. Но вы можете спросить: а что делать, если женщина уже беременна и хочет отслеживать развитие своего ребенка? Что ж, вот тут-то и вступает в дело следующая функция. И чтобы сделать то, что
13:08 мы уже создали, еще более ценным, мы попросим Lovable создать функцию в режиме беременности, которая отслеживает развитие плода по неделям и предоставляет образовательный контент на основе прогресса триместра. Теперь, когда наши пользователи откроют режим беременности, они увидят трекер развития плода с еженедельными обновлениями прогресса, хм, основными моментами триместра, а здесь даже полезные советы внизу. Итак, независимо от того, хочет ли кто-то узнать, когда начнется сердцебиение его ребенка, когда ожидать первых шевелений или как меняется его тело в каждом триместре беременности, в этом разделе вы найдете всю необходимую информацию, включая прогнозы фертильности и информацию о развитии плода . Теперь этот раздел оказывает поддержку пользователям на каждом этапе, независимо от того,
13:53 пытаются ли они зачать ребенка или уже ожидают его. Поздравляю. И вот так завершена еще одна важная функция . Понимание своего цикла — это одно, но знание того, что он означает для вашего общего здоровья, — это уже следующий уровень. Итак, давайте приступим к решению этой проблемы. Давайте добавим раздел с полезной информацией и информацией о здоровье, который поможет пользователям разобраться в своих менструальных циклах. Теперь, чтобы начать, вернемся в Lovable и введем данные для раздела информации о здоровье, добавим систему анализа здоровья, которая анализирует данные о менструальном цикле пользователя, а затем предлагает рекомендации по здоровью. если обнаружены нерегулярные закономерности. Это означает, что теперь наше приложение может сканировать такие вещи, как необычно длинные циклы, задержка менструации или нерегулярная овуляция, а затем
14:41 предоставлять персонализированную информацию о состоянии здоровья для всех этих сценариев. А если что-то покажется не так, пользователи получат рекомендации или оповещения, которые могут помочь им решить, следует ли обратиться к врачу. Конечно, не всегда все получается идеально с первой попытки, как мы уже видели. И, как мы делали раньше , если мы сталкиваемся с ошибкой, не нужно волноваться, когда видим сообщение о неудачной сборке, мы просто нажимаем кнопку «Попробовать исправить» в правом верхнем углу , и Lovable сам попытается решить проблему. И как только все заработает гладко и мы снова встанем на путь решения проблем, мы вернемся к разделу, посвященному здравоохранению. Теперь это пространство предоставляет подробную информацию о менструальном здоровье и персонализированные рекомендации на основе данных, внесенных пользователем в систему . Но мы еще не закончили. Конечно,
15:27 нам хотелось бы сделать больше на этом канале. Информация о состоянии здоровья — это здорово, но вы можете спросить: а что, если пользователи захотят узнать больше о репродуктивном здоровье? Вместо того, чтобы заставлять их искать информацию в Интернете, Google или чатах в поисках надежных источников, давайте просто предоставим им необходимые знания прямо в нашем приложении, поскольку они уже там. Поэтому в этом разделе мы расскажем lovable о создании образовательных статей и видеороликов по репродуктивному здоровью, отображаемых на основе фазы цикла пользователя. Вместе с этим обновлением появился новый раздел дополнительных ресурсов, наполненный образовательными статьями и видео. Теперь, независимо от того, находится ли пользователь в фолликулярной фазе, овуляции или лудиальной фазе, он будет получать релевантный контент, подобранный с учетом того, на какой именно стадии цикла он находится. Теперь приложение не просто отслеживает менструации.
16:15 Очевидно, что, исходя из того, что мы сделали до сих пор, это помогает пользователям делать больше. Изучите состояние их здоровья простым, доступным и персонализированным способом. Но, знаете, давайте пойдем дальше и сделаем еще одну вещь. И последний шаг в завершение. Давайте все доработаем и увидим полную картину. Монетизация приложения — это не только зарабатывание денег. Речь идет об устойчивом развитии и его поддержании. Теперь, если мы хотим, чтобы это приложение для отслеживания менструального цикла оставалось полезным и развивалось с течением времени, нам нужно найти способ предложить премиум-функции, сохраняя при этом удобство использования для наших пользователей. Вот тут-то и вступает в дело интеграция Stripe. Итак, вот план. Мы создали модель подписки, и вы с ней знакомы: пользователи могут получить доступ к премиум-инструментам за 9,99 долларов в год. Довольно просто, не правда ли? Чтобы это реализовать, мы просто возвращаемся к
17:01 Lovable и говорим: «Настройте интеграцию и подписку Stripe, при которой пользователям нужно будет оформить премиум-план, чтобы использовать премиум-функции». Теперь Lovable приступит к работе, настроив для нас все основные параметры, но теперь пришла и наша очередь утвердить внутренние изменения. А теперь быстрое нажатие кнопки «Применить изменения» — и мы готовы к работе. А теперь начинается самое интересное: нужно заставить приложение обрабатывать платежи. поскольку Stripe необходим секретный ключ для обработки транзакций. Но прежде чем воспользоваться этим, мы перейдем в тестовый режим, чтобы случайно не снять реальные деньги во время настройки, поскольку, давайте будем реалистами, никто не хочет такого сюрприза. Перейдем на вкладку разработчика Stripe
17:47 и получим секретный ключ. Мы вставим это в lovable, а затем сделаем то же самое для ключа publishable, что заставит все работать на стороне пользователя. Но подождите, мы еще не закончили. Почти получилось. Для подписки пользователям нужен реальный продукт. Итак, вернемся к Lovable и предположим, что я добавил ключ API Stripe . Вот идентификатор продукта. Прежде чем перейти к каталогу продукции Stripe, чтобы создать подписку. В Stripe нажимаем «Создать продукт». Введите название, описание, цену и расчетный период. Затем нажмите « Добавить продукт». И как только продукт будет создан, мы его откроем. Нажмите здесь на меню с тремя точками. и затем скопируйте идентификатор цены. Вернемся в Lovable и вставим все это туда, официально привязав
18:32 план подписки к самому приложению. И последнее — веб-крючки. Они сообщают приложению, что происходит в Stripe. Например, когда пользователь подписывается, отменяет или возобновляет подписку, мы говорим lovable: «Я хочу добавить секретный ключ веб-перехвата Stripe». Должна появиться ссылка, направляющая нас прямо на панель управления веб-перехватчиками Stripe, где мы берем секрет подписи, вставляем его обратно в Lovable, а затем нажимаем «Отправить». Вот так Stripe полностью интегрируется в наше приложение. А теперь время для настоящего испытания. Давайте опубликуем приложение, создадим учетную запись и увидим, что для разблокировки премиум-функций пользователям необходимо оформить подписку. Нажав кнопку «Подписаться», мы перейдем на страницу оформления заказа Stripe. А вот и самая интересная часть. Stripe позволит нам проводить тестовые
19:18 транзакции с использованием поддельной временной карты. Итак, мы введем номер поддельной карты , любую будущую дату истечения срока действия, любой трехзначный CVC-код и любой почтовый индекс. Затем мы завершим оплату. И вот так приложение разблокирует наши премиум-функции, а это значит, что все это действительно работает. Успех. Ой, подождите, подождите. Мы не останавливаемся только на функциональности. Мы хотели бы сделать немного больше на этом канале. Отличное приложение не просто хорошо работает. Выглядит тоже хорошо. Итак, давайте пойдем дальше и скажем Lovable изменить дизайн и макет на современный дизайн пользовательского интерфейса. И всего за несколько секунд все станет более элегантным и изящным. Мы проводим быструю проверку мобильного просмотра и убеждаемся, что все отлично адаптируется к разным размерам экрана. И это все. Мы официально
20:05 создали полнофункциональное приложение на базе искусственного интеллекта для отслеживания менструального цикла, регистрации симптомов, анализа беременности и, конечно же, с опциями подписки на разделы «Здоровье», «Образование» и «Премиум» . И все это без написания единой строчки кода. Это немного безумно, да? Теперь единственный вопрос: что дальше? возможно, стоит добавить прогнозы состояния здоровья на основе искусственного интеллекта или расширить возможности отслеживания физической формы . Возможности совершенно безграничны, и теперь, по крайней мере, у нас с вами есть лучшее представление об инструментах для их создания. Спасибо за просмотр. Напишите мне в комментариях ниже, что бы вы хотели увидеть в следующий раз, и увидимся в следующем выпуске.
