- BrainTools - https://www.braintools.ru -

Трекер отказа от стиков и вейпа: вайбкодинг, веб‑приложение и ноль персональных данных

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

Какая разница, кого менеджерить, людей или ИИ

Больше десяти лет я работаю в диджитал‑агентствах: сначала аккаунт‑менеджером, потом руководителем проектов. Сайты, CRM‑маркетинг, дизайн, социальные кампании для FMCG, фармы, ритейла и госсектора. Моя работа — понять ТЗ, посчитать бюджет, собрать команду, принять результат и объяснить клиенту, почему так как ему хочется можно или не нужно делать. Код я видела в основном в скриншотах в тикетах, ну или при необходимости вытащить какую‑нибудь картинку с какого‑нибудь сайта.

Поэтому проект был для меня экспериментом и практикой, чтобы ручками разобраться кто такой ваш этот вайбкодинг. Хватит ли проектного опыта [1], чтобы довести продукт до работающего состояния, если исполнитель — нейросеть, а не подрядчик или коллега из отдела, который сидит в соседнем кабинете? Опыта хватило, но не с первой итерации, что впрочем применимо и для работы с вышеупомянутыми исполнителями.

Чего мне не хватило в готовых трекерах

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

Разница не минимальная. В стиках табак нагревается, а не горит. В вейпе табака нет вообще. Значит, часть пунктов из сигаретного таймлайна к ним относится иначе. А вот то, что связано с самим никотином, — тяга, сон [2], работа рецепторов [3] — у всех трёх групп примерно одинаковое.

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

Главное продуктовое решение: уровни доказательности

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

  • A — есть крупные исследования и метаанализы.

  • B — отдельные исследования или прямое действие никотина, которое одинаково для сигарет, стиков и вейпов.

  • C — данные перенесены с сигарет там, где устройство может менять картину. Прямых исследований нет.

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

На какие источники я и искуственный интеллект [4], разумеется, опирались:

  • рекомендации CDC и NHS и отчёты Surgeon General по отказу от курения;

  • обзор Национальных академий США по электронным сигаретам (2018);

  • исследования мозга [5] с томографией: Cosgrove, 2009; Rademacher, 2016;

  • метаанализ о психическом здоровье после отказа: Taylor, BMJ, 2014;

  • работа о срывах: Hughes, 2008;

  • исследование дёсен: Nair, 2003.

Приложение не ставит диагнозов и не заменяет врача. Это написано в нём прямо, и для этого есть отдельный медицинский дисклеймер.

Вайбкодинг глазами менеджера проектов

Вайбкодинг — это когда ты описываешь нейросети, что нужно, а она пишет код. Я работала с Claude. По сути моя роль почти не отличается от привычной: поставить задачу, проверить результат, вернуть на доработку. Только исполнитель отвечает за секунды и не тормозит в принятии задачи в работу. Но естественно есть нюансы.

Что сработало:

  • Нормальное ТЗ. Чем точнее я описывала экран, сценарий и крайние случаи, тем меньше было итераций. «Сделай красиво» не работает ни с дизайнерами, ни с нейросетями. Если я говорила что нужно заменить какую‑то формулировку в коде, то да, он её менял, но я же не сказала про юридическую документацию, так что сорри, какое Те Зе, такой и результат.

  • Одна задача за раз. Когда я просила сразу много, выпадало то, что уже работало. Поправишь кнопку — уедет вёрстка на соседнем экране. Исправлялось тем же, чем в агентстве: маленькие шаги и проверка после каждого.

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

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

Чего нейросеть за тебя не сделает — это решения. Что входит в продукт, что выкидываем, как не нарушить закон. Именно на этих решениях проект дважды разворачивался. У неё нет опыта и бэкграунда матёрого специалиста, который на граблях и шишках знает как лучше делать, а чего лучше избежать. Кроме того, ну не всё она запоминает, хотя для менеджера это по сути не проблема — его ответственность что у него там в ТЗ по проекту должно быть.

Первый разворот: почему не App Store

Первая версия была нативным iOS‑приложением на SwiftUI. Я прошла две полные итерации кода и упёрлась не в код, а в публикацию. Для релиза нужен платный аккаунт в Apple Developer Program, а оплата и подтверждение личности из России превратились в отдельный проект со своими сроками и рисками. Плюс модерация стора и тот факт, что iOS — это только часть аудитории.

Для бесплатного пет‑проекта это было непропорционально дорого. Я перенесла всё в веб. Теперь это обычный сайт на статическом хостинге, без серверной части. Его можно добавить на рабочий стол телефона или компьютера, и он будет открываться с иконки, во весь экран, без адресной строки:

  • iPhone: Safari → “Поделиться” → «На экран Домой»;

  • Android: Chrome → меню → «Добавить на главный экран»;

  • компьютер: Chrome или Edge → значок установки в адресной строке.

Чтобы на iPhone сайт вел себя как приложение, хватает нескольких метатегов: они задают полноэкранный режим, название под иконкой и цвет статус‑бара. А viewport-fit=cover растягивает интерфейс под чёлку.

<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover, maximum-scale=1">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="apple-mobile-web-app-title" content="Лучше без">
<meta name="theme-color" content="#23272F">

Из плюсов: обновления доходят до всех сразу, без ревью и очередей. Из минусов: приложение не найти поиском в сторе, и людям нужно объяснять, что такое «добавить на экран Домой». Поэтому инструкция лежит прямо в приложении.

Второй разворот: почему приложение ничего о вас не знает

На старте я планировала Telegram‑бота с напоминаниями. Отказалась: бот бы хранил данные пользователей. А это уведомление Роскомнадзора, политика обработки и всё остальное, что влечёт 152-ФЗ. Для одного человека с пет‑проектом это лишнее. Да и данные о том, кто и сколько курит, собирать не хотелось принципиально.

В итоге всё хранится в браузере пользователя, в localStorage. Дата отказа, что именно бросили, сколько штук в день, цена пачки, сколько миллиграммов никотина в штуке — ничего из этого не уходит на сервер. Нет регистрации и аккаунтов. Мне нечего собирать и нечего терять при утечке.

У этого решения две цены, и я приняла их сознательно.

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

Вторая — если очистить данные браузера или сменить телефон, прогресс пропадёт. Поэтому в настройках есть три кнопки: «Перенести прогресс», «Выгрузить» и «Удалить». Данные выгружаются файлом и загружаются на другом устройстве, без участия сервера. Упрощённо логика [7] такая:

// всё состояние — один объект в localStorage
const load = () => JSON.parse(localStorage.getItem('state') || '{}');
const save = (state) => localStorage.setItem('state', JSON.stringify(state));

// выгрузка: файл собирается прямо в браузере
function exportProgress() {
  const blob = new Blob([JSON.stringify(load())], { type: 'application/json' });
  const a = document.createElement('a');
  a.href = URL.createObjectURL(blob);
  a.download = 'luchshebez-progress.json';
  a.click();
}

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

Что помогло мне больше всего: видеть прогресс

Трекер отказа от стиков и вейпа: вайбкодинг, веб‑приложение и ноль персональных данных - 1

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

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

Но срывы всё равно бывают, и большинство бросает не с первой попытки. Поэтому есть кнопка «Я сорвался». Счётчик начинается заново, но прошлый результат не исчезает. В «Дневнике» хранятся лучший результат, число попыток и общее количество дней без никотина. Мне было важно, чтобы срыв не обнулял всё сделанное, иначе легко махнуть рукой.

За вехи открываются ачивки. Из любой можно сделать картинку для сторис — людям нравится похвастаться, и это тоже держит.

Вторая штука, которая мне помогла, совсем простая. Курение — это ещё и механика: взять устройство, глубоко вдохнуть, медленно выдохнуть. Тяга держится несколько минут и уходит сама. Значит, эти минуты нужно чем‑то занять.

Трекер отказа от стиков и вейпа: вайбкодинг, веб‑приложение и ноль персональных данных - 2

Дыхательные упражнения делают ровно это. Они механически повторяют [8] ритуал затяжки, только без никотина, и занимают голову. Кнопка «Подышать» стоит прямо на главном экране, рядом с «Я сорвался», — там, куда рука тянется в момент тяги.

Практик несколько, в том числе «Длинный выдох» и «Ровное дыхание». Анимация и звук подсказывают, когда вдыхать и когда выдыхать. Часть практик — с задержками дыхания [9], и тут я добавила предупреждение. Если закружилась голова, нужно остановиться и дышать как обычно. А людям с болезнями сердца или лёгких лучше выбирать практики без задержек.

Про деньги

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

Итоги

За этот проект я прошла путь от «а если попробовать» до рабочего продукта и выкинула по дороге нативную версию и бота. Главный вывод для таких же не‑разработчиков: нейросеть пишет код, но ответственность за продукт остаётся на тебе. И тут опыт руководителя проектов пригодился больше, чем я думала.

Мне было интересно попробовать. А если приложение поможет хотя бы кому‑то продержаться лишний день, значит, всё было не зря.

Попробовать можно на luchshebez.com [10]. Буду рада замечаниям в комментариях — особенно от тех, кто пишет код без нейросети и точно знает, что тут можно сделать лучше.

Автор: alinarle

Источник [11]


Сайт-источник BrainTools: https://www.braintools.ru

Путь до страницы источника: https://www.braintools.ru/article/36342

URLs in this post:

[1] опыта: http://www.braintools.ru/article/6952

[2] сон: http://www.braintools.ru/article/9809

[3] рецепторов: http://www.braintools.ru/article/9580

[4] интеллект: http://www.braintools.ru/article/7605

[5] мозга: http://www.braintools.ru/parts-of-the-brain

[6] ошибки: http://www.braintools.ru/article/4192

[7] логика: http://www.braintools.ru/article/7640

[8] повторяют: http://www.braintools.ru/article/4012

[9] дыхания: http://www.braintools.ru/article/4500

[10] luchshebez.com: https://luchshebez.com

[11] Источник: https://habr.com/ru/articles/1089020/?utm_source=habrahabr&utm_medium=rss&utm_campaign=1089020

www.BrainTools.ru

Rambler's Top100