Я создал приложение в Claud и заработал в первый день (реально)

Многие до сих пор воспринимают нейросети как игрушку для генерации картинок с котами. Но реальность такова: сегодня грань между «у меня есть идея» и «у меня есть работающий бизнес» сжалась до нескольких часов.

Вчера я решил провести эксперимент: сможет ли Claude (модель 4.6) написать полноценное веб-приложение для рисования, которое не стыдно показать людям, и принесет ли оно хоть какие-то деньги за 24 часа.

Шаг 1: Идея и ТЗ для нейросети

Я не хотел делать очередной сложный Photoshop. Моя цель: минималистичное веб-приложение для медитативного рисования.

Функционал:

1. Чистый холст на весь экран.
2. Набор кистей с плавными градиентами.
3. Кнопка «Экспорт в 4К» (для тех, кто хочет напечатать свой шедевр).
4. Адаптивность (чтобы работало и на планшетах).

Я зашел в Claude и скормил ей промпт/ Почему Claude? На сегодняшний день её функция Artifacts - это лучший инструмент для мгновенного предпросмотра кода.

Шаг 2: Разработка (60 минут)

Самое удивительное - я почти не писал код руками. Мы итерировали с Claude:

1. Первая версия: Просто черная линия на белом фоне. Слишком скучно.
2. Вторая версия: Добавили выбор цветов и толщину кисти. Уже лучше.
3. Киллер-фича: Я попросил добавить «эффект акварели» и симметрию (как в калейдоскопе). Это превратило обычную рисовалку в залипательный инструмент.

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

Шаг 3: Монетизация «на коленке»

Чтобы заработать в первый день, нельзя ждать одобрения в App Store. Я пошел путем Web-first:

1. Хостинг: Задеплоил всё на Vercel за 5 минут (бесплатно).
2. Модель оплаты: Я не стал вешать агрессивную рекламу. Вместо этого я добавил кнопку «Unlock Pro Brushes» (Разблокировать кисти с эффектами неона и масляной краски) за символические $2.99.
3. Прием платежей: Интегрировал простую форму Buy Me a Coffee / Stripe.

Скачивай короткие видео без водяных знаков

Шаг 4: Трафик и первые деньги

Запускаться в пустоту бессмысленно. Я использовал три канала:

1. X (Twitter) и TikTok: Выложил короткое видео (screen recording), как я рисую неоновую абстракцию за 30 секунд с подписью: «Сделал это за час с помощью Claude. Попробуйте сами».
2. Product Hunt (Launch Day): Закинул проект в раздел «Ship».
3. Telegram-чаты: Скинул ссылку в пару сообществ для дизайнеров и любителей нейросетей.

Результаты за 24 часа:

1. Посетителей: 1,240 человек.
2. Конверсия в покупку Pro: 12 человек.
3. Чистая прибыль: $35.88 (минус комиссии).

Как выжать из Claude максимум

Если в первой части мы говорили о деньгах и маркетинге, то здесь разберем, как Claude 3.5 Sonnet справляется с ролью ведущего разработчика и где ей нужно «подставлять костыли».

Архитектура через Artifacts

Главная фишка Claude - это Artifacts. В отличие от обычных чат-ботов, она создает отдельное окно с кодом, который исполняется прямо в браузере.

Для приложения-рисовалки я выбрал связку React + Canvas API.

1. Почему React: Claude отлично структурирует компоненты и управляет состоянием (state).
2. Почему Tailwind CSS: Это позволяет нейросети описывать дизайн прямо в классах элементов, не плодя бесконечные файлы стилей.

Технический хак: Чтобы приложение не «рассыпалось» при обновлении, я просил Claude использовать Lucide React для иконок. Это стандарт в её базе знаний, поэтому интерфейс сразу выглядел современно.

Как правильно «промптить» код

Самая большая ошибка - попросить «напиши всё сразу». Код быстро раздувается, и Claude начинает его обрезать из-за лимита контекста.

Мой алгоритм итераций:

1. База: «Создай React-компонент с полноэкранным Canvas и базовыми функциями рисования (черный цвет, толщина 5px)».
2. Математика: «Добавь поддержку давления (через event.pressure), если пользователь использует стилус или тачпад».
3. Экспорт: «Добавь функцию захвата изображения с холста и его конвертацию в Blob для скачивания в PNG».

4. Главные «боли» и их решение

Проблема: Галлюцинации в зависимостях

Иногда Claude пытается импортировать библиотеки, которых нет в её песочнице (например, специфические плагины для фильтров).

1. Решение: Я жестко ограничил её: «Используй только нативный Canvas API и стандартные хуки React». Это заставило её писать чистую логику вместо того, чтобы надеяться на сторонние пакеты.

Проблема: Забывчивость при больших объемах

Когда приложение выросло до 400 строк кода, Claude при внесении мелкой правки могла выдать только измененный кусок.

1. Решение: Я использовал команду: «Выдай полный обновленный код файла, сохранив всю предыдущую логику экспорта и слоев».

5. Оптимизация под Mobile

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

Мы столкнулись с тем, что скролл страницы мешал рисованию.

1. Фикс: Claude добавила CSS-свойство touch-action: none, которое блокирует стандартные жесты браузера, пока палец находится на холсте.

Вывод: Claude - это не просто «копирайтер для кода». Это напарник, который понимает контекст. Если вы понимаете основы JS, вы можете превратить её из советчика в полноценный компилятор ваших идей.Итоги и выводы

Заработать миллион за день не получилось, но $35 - это больше, чем ноль. Главный инсайт: скорость сейчас важнее идеального кода.

Мои советы тем, кто хочет повторить:

1. Не усложняйте. Делайте одну вещь, но делайте её эффектно.
2. Используйте Claude Artifacts. Это позволяет видеть результат правок в реальном времени, не переключаясь в редактор кода.

Дизайн решает. Нейросети отлично пишут логику, но «чувство стиля» им нужно прививать через четкие промпты («используй пастельные тона», «добавь стеклянный эффект в стиле Apple»)

🔥 Больше про заработок на нейросетях в тг: Polevoy