Заметки LLM-энтузиаста
518 subscribers
144 photos
17 videos
1 file
175 links
Дмитрий Жечков @djdim
архитектор в Yandex Cloud,
ex. VMware NSX specialist, ex. Cisco SE

Здесь пишу свои заметки по LLM (большим языковым моделям) и AI-разработке.

Это личное мнение и не отражает официальную позицию компании, в которой я работаю.
Download Telegram
#cursor #ai #dev #v0 #heyboss #bolt #replit #lovable #tools #batle

🎨 Битва AI-помощников: Создаем генератор мемов

Привет, друзья!

Сегодня расскажу о захватывающем эксперименте, который мы провели вчера, и где сравнили 5 популярных AI-инструментов для AI-разработки, пытаясь создать веб-приложение для генерации мемов "MemeForge" 🚀

🏆 Рейтинг по результатам:

v0.dev - Чемпион по скорости! Первым выдал рабочий интерфейс с функционалом загрузки изображений и добавления текста. Правда, с AI-генерацией мемов пришлось повозиться, и помог нам в этом Cursor! 🔗 Попробовать MemeForge от v0.dev

heyboss - Серебряный призер и единственный, где AI-генерация мемов заработала "из коробки". Причем даже не потребовала добавления API-ключа! 🎉 🔗 Попробовать MemeForge от heyboss (в этом примере свой API-ключ вводить обязательно)

bolt.new - Бронзовый призер по скорости, но с ограниченным функционалом. Текст на картинках так и не заработал 😅 Уверен, что Cursor исправил бы данный недостаток, но время было ограничено (всего 2 часа на 5 вариантов решения), поэтому оставили как есть. 🔗 Попробовать MemeForge от bolt.new

replit agent - Темная лошадка! Хоть и не самый быстрый, но единственный, где удалось довести до ума все функции без дополнительных инструментов 💪 Отличная нативно-облачная альтернатива Cursor Composer Agent для небольших проектов! 🔗 Попробовать MemeForge от replit agent

lovable.dev - Интересный случай! Мой изначальный фаворит, но в этом "забеге" мне не удалось получить рабочую версию проекта. Возможно, из-за того, что вместо Openai API я вдруг решил попробовать интеграцию с runware.ai, с которой ни lovable, ни Cursor в отведенное время не справились. 🔧 🔗 Посмотреть прототип на lovable.dev (с Openai)

💡 Вывод:
Каждый инструмент показал свои сильные и слабые стороны. Для быстрого прототипа лучше всего подошел - v0.dev, быстрее всего реализовал AI функциональность - heyboss, а для полного контроля над проектом идеально подошел replit agent. Практически все инструменты кроме replit agent потребовали доработки кода в Cursor.

А какой инструмент выбрали бы вы? 🤔

#AIdev #webdev #coding #memes #технологии
2👍2🔥1
#ai #dev #lovable #tools

🚀 Крутое обновление Lovable: Визуальный редактор!

Lovable продолжает удивлять! Теперь в платформе появился визуальный редактор интерфейса, который позволяет менять элементы без использования промптов и траты кредитов 🎨

Пример использования на скрине (взял ранее написанное приложение по генерации мемов)

Что нового:

- Раньше: выбор визуального элемента + описание его изменений через промпт (что, между прочим, до сих недостижимо для многих других AI-кодеров)
- Теперь: прямое редактирование через визуальный интерфейс
- Экономия кредитов на мелких правках

Что можно редактировать:
- Цвета (включая кастомные)
- Размеры текста
- Отступы
- Скругления углов
- Прозрачность
- Стили шрифтов
- Тексты кнопок и заголовков

💡 Почему это круто:
- Мгновенные изменения без ожидания ответа AI
- Экономия кредитов
- Точное попадание в желаемый результат
- Интуитивно понятный интерфейс

Единственное, чего не хватает - это возможности перетаскивать элементы мышкой по экрану. Но уверен, что это дело времени!

P.S. а знали ли вы, что в Lovable также есть аналог .cursorrules для задания общего контекста, в котором происходит разработка приложения?

#Lovable #NoCode #WebDev #AI
🔥32👍1
#cursor #ai #dev #insights #bestpractice #tracking

С недавних пор при работе над проектами в Cursor я стал использовать методику автоматического трекинга изменений в специализированных md-файлах. Очень сильно экономит время. Ниже моя заметка по теме.

📝 Как правила трекинга делают разработку эффективнее

Двойная система документации: оперативная и стратегическая

progress.md — это ваш ежедневный дневник разработки
project-status.md — стратегическая карта проекта
• Вместе они создают полную картину развития проекта

Почему это работает:

🎯 Мгновенная фиксация прогресса после каждой задачи
🔍 Детальное документирование ошибок и их решений
📊 Структурированный подход к управлению проектом
🚀 Четкое понимание следующих шагов

Ключевые преимущества:

1️⃣ Предотвращение потери важной информации
2️⃣ Быстрый доступ к решениям прошлых проблем
3️⃣ Прозрачность процесса разработки
4️⃣ Упрощение коммуникации в команде

💡 Интересный факт:

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

🎁 Практический эффект:

• Экономия времени на поиск решений
• Снижение стресса при работе над сложными задачами
• Улучшение качества кода через анализ ошибок
• Повышение продуктивности команды


🔍 P.S. Некоторые внимательные читатели заметили, что в нескольких вариантах реализации "Генератора мемов" (см. заметку выше) я использовал данный подход и стали задавать вопросы

- "Зачем это нужно?"
- "Как это настроить?"

Что ж, надеюсь, этот пост прояснил вопрос "зачем".
А для тех, кто жаждет узнать "как" - файл .cursorrules уже ждет вас на моём GitHub!

🔗 Загляните в предыдущий пост для контекста: https://t.me/llm_notes/58
22👍1🔥1
#news #lovable #ai #dev #chatmode

🔄 Обновления в Lovable: что нового?

🛠 Разработчики улучшили отладку сетевых ошибок. Теперь система сама читает сетевые логи и использует их для контекста при отладке. Для тех, кто часто работает с API и внешними данными – должно стать попроще. Никаких больше всплывающих окошек с ошибками, всё отслеживается на лету 🚀

💬 Chat Mode, который недавно появился в "лабораторном" функционале, тоже обновился. Общение в нем стало похоже на разговор с техническим директором, который в курсе всех деталей проекта.
Очень эффективно использовать данный режим на этапе планирования проекта.

Тот самый подход "Plan-Act" (а точнее "Plan-Plan-Act" или "семь раз отмерь - один раз отрежь"), который рекомендуют использовать и сразу реализовали в своем продукте cоздатели Cline.

⚠️ Важное примечание: из-за высокой популярности и как следствие возросших затрат сообщения в Chat Mode теперь считаются в общем лимите. 😢
Команда работает над тем, чтобы сделать эту функцию доступнее.

💡 Кстати, если кто ещё не пробовал Chat Mode в lovable: Account → Settings → Labs
На всякий случай, я проиллюстрировал все на скриншотах.

#tech #update #dev
1👍1
#cursor #ai #dev #heyboss #bolt #replit #lovable #trae #battle

🎨🤖 Битва AI-помощников: создаем финансовый дашборд 📊

👋 Привет, друзья!

🔬 Сегодня расскажу о новом эксперименте: на прошлом занятии курса по Cursor протестировали 6 разных AI-инструментов для разработки, создавая дашборд для мониторинга личных финансов.

📝 Вводная информация:
Идея проекта: создать веб-дашборд личных финансов для визуального анализа данных из Excel-таблицы.

🎯 Начали с Cursor по методике Plan-Plan-Act:

📋 Сформировали контуры ТЗ
📑 Разработали полное ТЗ
💻 Написали код

🛠 Технические детали первой версии:
🐍 Язык: Python
🌐 Веб-интерфейс: Streamlit

🔗 Полезные ссылки:
📦 Код: https://github.com/dzhechko/pu-finance-dashboard
🚀 Приложение: https://pu-finance-dashboard-production.up.railway.app/
📊 Тестовые данные: https://disk.yandex.ru/i/LoYazgIq82XYgA

🔄 После успешного эксперимента с Cursor решили пойти дальше и протестировать другие AI-помощники.
Для более современного подхода сменили стек технологий на:
⚡️ Next.js
🎨 Tailwind CSS
🎯 shadcn/ui

📊 Тестовые данные можно брать здесь

🏆 Лидеры гонки:

1️⃣ Lovable.dev
Быстрый старт
Рабочий проект с первой попытки
⚠️ Небольшая доработка UI для графиков
➡️ Результат: y-money-mosaic (исходники тут)


2️⃣ Bolt.new
Стабильная работа "из коробки"
Отличная интеграция с Supabase
Минимум проблем
⚠️ Консервативный дизайн
➡️ Результат: Personal Finance Dashboard

3️⃣ Replit Agent
Спокойный процесс разработки
Понятный траблшутинг
⚠️ Проблемы с графиками
➡️ Результат: Replit Finance Dashboard

😐 Середнячки и аутсайдеры:

🔸 Heyboss
Проблемы с аутентификацией на этапе тестирования
Быстрая генерация функций
⚠️ Нужна доработка кода и лучше ее делать в Cursor, т.к на небольшие изменения кредиты расходуются быстро.
➡️ Результат: Heyboss Finance Dashboard

🔸 Trae
Нет рабочего кода
Неэффективный траблшутинг

💡 Основные выводы:
🥇 Lovable и Bolt - лучшие для быстрых прототипов
🏃‍♂️ Replit Agent - для спокойной разработки
📋 Для успеха очень важно иметь четкое ТЗ перед стартом
⚠️ Не все AI-инструменты одинаково полезны

#AIdev #webdev #coding #dashboard #finance #tech #programming
3👍3🔥2
#ai #dev #news #vibecoding #lovable

Lovable 2.0: Новые возможности платформы 🚀

Команда Lovable представила значительное обновление своей платформы, которая позволяет создавать приложения и веб-сайты в режиме Vibe Coding. Версия 2.0 добавляет множество полезных функций, делающих процесс разработки более эффективным и удобным.

Ключевые обновления в Lovable 2.0 👀

1. Обновленный дизайн и интерфейс 💅 Как пишут разработчики: платформа получила современный визуальный стиль и более интуитивный интерфейс, который помогает сосредоточиться на творческом процессе.
Я не дизайнер и мне, если честно, предыдущая версия тоже нравилась, но и новая хороша :)

2. Командная работа 👨‍💻👩‍💻 Введены рабочие пространства для совместной работы:

• Pro-подписка: возможность приглашать до 2 человек в отдельные проекты
• Teams-подписка: до 20 пользователей в одном рабочем пространстве с разными уровнями доступа
• Общий пул кредитов для всех участников рабочего пространства

3. Улучшенный ИИ-ассистент 🧠 Новый режим чата стал значительно умнее и не вносит изменения в код напрямую. Он помогает:

• Отвечать на вопросы по проекту
• Планировать разработку
• Находить и исправлять ошибки

Ассистент самостоятельно определяет, когда нужно искать информацию в файлах, проверять логи или обращаться к базе данных.
Я думаю, что в сочетании со способностью делать непрерывный рефакторинг кода (lovable всегда предлагает его сделать когда размер какого-то файла с кодом начинает превышать 250 строчек, что и раньше позволяло доводить до успеха сложные проекты, такой фичи явно не хватает другому веб-кодеру bolt.new) это значительно улучшит и ускорит сходимость Vibe Coding процессов.

4. Проверка безопасности 🛡 Функция Security Scan автоматически выявляет уязвимости в приложении. Что с моей точки зрения очень актуально! И я пока еще не видел такого в других AI-кодерах. На данный момент работает с проектами, использующими Supabase. В будущем планируется расширение возможностей.

5. Режим разработчика (Dev Mode) ⌨️ Позволяет редактировать код проекта напрямую в Lovable — функция, которая уже получила положительные отзывы от пользователей.

6. Визуальное редактирование 🎨 Возможность визуально редактировать стили без необходимости писать CSS-код вручную. Функция стала еще более надежной и удобной.

7. Интеграция доменов 🌐 Покупка и подключение доменов теперь доступны непосредственно в Lovable. С момента внедрения этой функции подключено более 10 000 пользовательских доменов.

Обновление ценовой политики 💰

Компания упростила тарифные планы:

• Pro-план: начиная от $25 в месяц — для индивидуальных разработчиков
• Teams-план: от $30 в месяц — для команд, нуждающихся в общем рабочем пространстве

Планы на будущее 🔮

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

Для тех, кто интересуется подробностями, команда Lovable проводит прямую трансляцию с ответами на вопросы. Основатель компании Антон и его команда будут рассказывать о новых возможностях и делиться планами на будущее.

#разработка_приложений #искусственный_интеллект #Lovable #новые_технологии
👍32🔥1
#lovable #battle #check

Lovable 2.0 - проверка "боем" !

На первом занятии курса по AI-программированию и агентам мы делали браузерную игру-шутер

Вот такой результат у меня получился при помощи Lovable предыдущей версии при подготовке к занятию
Причем данный результат был получен при количестве итераций > 10. И мои попытки добавить звук выстрела и фоновую музыку так и не увенчались успехом (требовалось подгрузить свои собственные mp3 файлы).

Поэтому на самом занятии мы использовали replit agent 2.0 (ранее писал о нем здесь), который позволил получить хороший результат практически сразу за пару минут, и дальнейшие 2-3 итерации были потрачены на небольшие улучшения.

А теперь сравните, пожалуйста, с результатом на Lovable 2.0, который я получил за несколько минут + 3 итерации по корректировке кнопок перемещения и коррекции заваливания горизонта.
Результат с моей точки зрения значительно лучше Lovable предыдущей версии и на уровне replit agent 2.0, а нападающие "монстры" "из коробки" получились даже более симпатичными.

Чего мне не хватило - фоновую музыку "из коробки" получить не удалось (в replit она появилась сразу, lovable 2.0 все таки запросил Для работы вам нужно добавить файл background-music.mp3 в папку public/ вашего проекта.)

Можете повторить подобный эксперимент самостоятельно. Исходный промпт здесь

Как можно сэкономить на lovable подписке и не только писал здесь
12👍2🔥1
Создание AI-тьютора испанского языка за час: разбор live-кодинга с Lovable 🤖

Команда Lovable вчера провела интересный онлайн-эксперимент — создание полноценного AI-тьютора для изучения испанского языка в прямом эфире. Разбираем, что получилось и какие технологии использовались.

Что такое Lovable? 🛠

Про Lovable уже писал много раз (пост 1, пост 2, пост 3, пост 4), но на всякий случай напомню.
Lovable — платформа для создания full-stack приложений с помощью естественного языка. Вместо написания кода разработчики общаются с AI, описывая нужную функциональность.

Основные возможности:
• Создание React-приложений через текстовые команды
• Интеграция с Supabase для backend-функций
• Автоматическое развертывание и управление базой данных
• Поддержка аутентификации и внешних API

Техническая архитектура проекта ⚙️

Стек технологий: 1️⃣ Frontend: React (единственный поддерживаемый фреймворк) 2️⃣ Backend: Supabase (база данных + Edge Functions) 3️⃣ AI: OpenAI API для обработки текста и голоса 4️⃣ Аутентификация: встроенная система Supabase

Структура приложения:
• Глобальная боковая панель навигации
• Страница дашборда (по умолчанию)
• Чат-интерфейс для общения с AI
• Панель настроек справа

Реализованная функциональность 📱

Основные возможности:
• Текстовый чат с AI-тьютором на испанском
• Голосовой ввод с преобразованием речи в текст
• Воспроизведение ответов AI в аудиоформате
• Перевод сообщений AI на английский
• Настройка скорости воспроизведения аудио

Система кредитов:
• Ограничение бесплатного использования
• Списание кредитов за AI-операции
• Отображение баланса в интерфейсе
• Модальное окно при исчерпании лимита

Практические советы по работе с Lovable 💡

Эффективные промпты:
• Разбивайте сложные задачи на мелкие шаги
• Будьте максимально конкретны в описаниях
• Указывайте технические детали (например, "используй OpenAI")
• Добавляйте требования к UI/UX сразу

Работа с ошибками:
• Не нажимайте "Try to fix" больше 2-3 раз
• Используйте функцию отката к предыдущим версиям
• Переформулируйте запрос, если AI "застрял"
• Применяйте Chat Mode для планирования сложных изменений

Интеграция с внешними сервисами 🔗

Supabase:
• Автоматическое создание таблиц для профилей пользователей
• Безопасное хранение API-ключей в секретах
• Edge Functions для серверной логики
• Миграции базы данных "на лету"

OpenAI API:
• Отдельные Edge Functions для каждой AI-задачи
• Обработка текста, речи и переводов
• Настраиваемые системные промпты
• Автоматическое развертывание при изменениях

Ограничения и особенности ⚠️

Текущие ограничения:
• Только React в качестве frontend-фреймворка
• Производительность снижается в пиковые часы
• Необходимость детального планирования промптов
• Ограниченная поддержка кастомных доменов

Рекомендации:
• Используйте Custom Knowledge для хранения требований проекта
• Применяйте гибридный подход: Lovable + ручное редактирование кода
• Интегрируйтесь с GitHub для версионирования
• Тестируйте функциональность после каждого изменения

Планы развития проекта 🚀

Следующие этапы: 1️⃣ Улучшение дизайна и UX 2️⃣ Добавление геймификации (рейтинг достижений) 3️⃣ Админ-панель для управления пользователями 4️⃣ Интеграция Stripe для монетизации 5️⃣ Запуск на Product Hunt

Эксперимент показал, что современные AI-инструменты позволяют создавать функциональные приложения без глубоких знаний программирования. Однако успех зависит от умения правильно формулировать задачи и понимания архитектуры веб-приложений.

Очень рекомендую посмотреть этот эксперимент в записи (1 час), или прочитать транскрипт. Я подготовил 2 версии транскрипта: • детальнуюкраткую

P.S. На этой неделе курса по AI-программированию и ИИ-агентам у нас была очень близкая тема - мы делали синхронный переводчик для зума, и также в одном из вариантов использовали lovable, в следующей заметке напишу чуть подробнее что и как мы делали и дам ссылки на веб-приложения, которые у нас получились.

#ai_development #nocode #lovable #supabase #react
❤‍🔥33👍3
На прошлой неделе на 6-ом занятии по AI-программированию мы делали синхронный переводчик для Zoom-звонков. Решение получилось универсальным — работает с любой системой ВКС через виртуальные аудио-устройства.

Протестировали сразу 3 варианта решения задачи:
Cursor для разработки и railway для деплоя
Replit
Lovable

Во всех трех случаях для подготовки PRD я использовал Codeguide.dev - отличный инструмент, позволяет в режиме диалога с AI подготовить целый набор необходимой документации для написания софта методом Vibe Coding. Документация готовится под выбранный набор AI-кодеров. Также codeguide содержит внутри готовые шаблоны micro SaaS приложений под различные сценарии использования: например, с бэкендом для аутентификации пользователей или для оплаты.

Исходные заявки в codeguide.dev на подготовку PRD, а также финальные PRD можно посмотреть здесь.

Результаты тестирования

• Вариант с Cursor закончить за время занятия (2 часа) не удалось, но это скорее связано с тем, что задача ставилась сложнее - я хотел сделать систему с личным кабинетом пользователя, с аутентификацией на базе Clerk, и по закону подлости в определенный момент перестали работать обращения к Cursor-агенту через VPN, я уже не стал переключаться, тем более что по двум другим кодерам прогресс шел быстро.

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

Вариант с Lovable стал показывать первые результаты практически одновременно с Replit, но потребовал значительно бОльшего количества итераций траблшутинга. Заканчивал приложение уже после занятия (github).

Ну а теперь про само приложение!

Как это работает 🔧

🎤 Система распознает речь через Web Speech API (фронтенд в браузере)
📤 Отправляет текст на перевод через OpenAI API (бэкенд - в облаке или на вашем PC/mac)
🗣 Синтезирует переведенную речь (фронтенд в браузере)
🎧 Передает аудио через виртуальный или обычный микрофон в видеоконференцию (зависит от сценария использования - см. ниже)

Настройка для разных сценариев ⚙️


Чтобы вас слышали на иностранном языке:
1️⃣ Запустить веб-приложение
2️⃣ Подключить виртуальный микрофон (BlackHole/VB-Cable) - в моем случае был VB-cable на Mac в браузере Safari
3️⃣ В ВКС выбрать виртуальное устройство как speaker. Микрофон оставить обычным (External Mic).
Вы говорите на родном языке. Приложение в браузере Safari/Chrome «слышит» это через External Mic. И передает это (Speaker) через VB-cable. Вы сами не слышите то, что слышит ваш собеседник, но видите, что ему говорят (т.к. в приложении работает текстовый перевод)

Чтобы слышать перевод на русском:
1️⃣ В ВКС подключить виртуальный микрофон как input
2️⃣ В системных настройках ОС: input = виртуальный микрофон, чтобы приложение "слышало", что говорит ваш собеседник, а output = внешний микрофон (External Mic), чтобы вы слышали перевод
3️⃣ Веб-приложение будет переводить и озвучивать через стандартный выход

Технические характеристики 📊

• Задержка перевода: до 1-2 секунд (зависит от того используете деплой в облаке или на своем ПК)
• Точность перевода: более 95% для разговорного контента
• Поддержка популярных ВКС: Zoom, Google Meet, Microsoft Teams и т.д.
• Кэширование переводов для ускорения повторных фраз (не во всех версиях реализовано)

Требования 💻

• Браузер с поддержкой Web Speech API (лучше всего Chrome или Safari)
• Действующий API-ключ OpenAI
• Наличие установленного виртуального аудиоустройства (BlackHole или VB-Cable)
• Стабильное интернет-соединение от 10 Мбит/с

Ограничения
• Поскольку все основные функции по транскрибации и синтезу речи реализованы в браузере через Web Speech API, то на мобильных устройствах будет доступен только текстовый перевод, синтез речи работать не будет.
• В зависимости от используемого браузера будет варьироваться количество доступных языков и голосов для транскрибации и синтеза

#realtime_translation #speech #video_conferencing #openai #web_audio #battle #lovable #replit #cursor #zoom
👍65🔥31
🚀 RAG на практике: создаем ИИ-помощников с нуля

На прошлой неделе я проводил занятие по RAG (Retrieval Augmented Generation) на курсе "Менеджер ИИ-продуктов" в Product University.
Специально к занятию собрал небольшой интерактивный курс по RAG, которым хотел бы поделиться с вами 👉 ссылка

К нему также "прикручен" ИИ-ассистент, который может проконсультировать по вопросам построения предметно-ориентированных вопросно-ответных систем (так по-умному называются ИИ-помощники :)

Что делали на практике:
• ИИ-помощники через OpenAI Assistant API
• ИИ-помощник на базе Yandex AI Assistant
• Flowse AI Assistant с векторной БД Pinecone
• Agent Flow Canvas

ИИ-помощник "прикручивался" к клону странички курса по AI-программированию (оригинал здесь) и тестировался вопросами по содержанию курса.

🔥 Приятное открытие: уже созданный OpenAI Assistant API можно просто загрузить во Flowise через OpenAI креды, затем выложить на Chatflow Canvas и опубликовать с крутыми опциями:

▫️ Rate Limit для безопасного инференса
▫️ Контроль адресатов подключения
▫️ Сбор и мониторинг обратной связи
▫️ Генерация лидов

💡 Преимущество Flowise: сразу получаешь рабочий код для виджета, который можно разместить на своем сайте. Именно им я и воспользовался, когда "прикручивал" ИИ-помощника к посадочной странице курса по RAG.

Тестирование AI-кодеров:
1️⃣ Lovable - справился с клонированием сайта по URL, но виджет от Flowise самостоятельно и без ошибок добавить не смог 😅 Пришлось вручную править код.
2️⃣ Bolt.new - выполнил задачу с первого раза! 💪 В bolt, кстати, появился режим "Discussion", который можно использовать для планирования изменений и создания "Implementation Plan", также добавилась встроенная библиотека промптов, в общем, инструмент меня неожиданно порадовал 😄

Именно на bolt.new я собрал финальную версию интерактивного курса по RAG.
К слову, lovable и здесь лажанулся: как я его ни уговаривал, он так и не смог сделать кликабельными ссылки на модули курса, пришлось даже пригрозить, что если он не решит задачу с очередной (пятой по счету) попытки, то я больше не буду им пользоваться - но все равно не помогло 😄

🏆 Yandex AI Assistant показал себя отлично - единственный понял, что в задаваемых вопросах слово "поток" означает "поток курса", остальные ассистенты упрямо писали, что вопрос не относится к курсам 😄

Полезный лайфхак: Flowise теперь можно развернуть из Yandex Cloud Marketplace и использовать YandexGPT через официальный OpenAI-совместимый API ! Так можно получить полностью локализованную в РФ версию ИИ-помощника, данные которого хранятся в инфраструктуре, которая выполняет требования ФЗ-152.

⚠️ Когда будете разворачивать flowise в Яндекс Облаке, то имейте ввиду, что дефолтная группа безопасности не открывает доступ по порту TCP 3000, поэтому применяйте кастомную группу с настройками permit any any, иначе не сможете подключиться по веб-интерфейсу к flowise.

@llm_notes

#rag #aiassistants #flowise #yandexgpt #lovable #bolt #openai
🔥54
AI Fluency: Полное руководство по эффективной работе с ИИ 🤖

Примерно месяц назад Anthropic опубликовали с моей точки зрения интересный курс "AI Fluency: Framework & Foundations" по развитию навыков взаимодействия с искусственным интеллектом. Практические знания без воды. И главное - эти знания не устареют через неделю, месяц или год при появлении очередной LLM-модели, агентного фреймворка или нового ИИ-продукта.
Курс также оформлен в виде плейлиста на официальном youtube-канале Anthropic.

Ниже привожу мои краткие заметки по курсу.

Я также подготовил детальные транскрипты на русском языке для каждого урока (см. github) и представил все в виде интерактивного веб-сайта, пользуясь тем, что gpt5 сейчас в lovable.dev находится в limited preview до полуночи воскресенья 10 августа 😉 (к слову, мне очень понравилось "собирать" сайт при помощи gpt5 на lovable, отталкиваясь от транскриптов, выложенных на github - только 1 небольшая ошибка возникла в процессе)

Что такое AI Fluency? 🎯

AI Fluency — способность работать с ИИ эффективно, результативно, этично и безопасно. Это не знание промптов, а фундаментальные навыки для долгосрочного сотрудничества с ИИ.

Три способа взаимодействия с ИИ:

• Автоматизация — ИИ выполняет конкретные задачи по инструкциям
• Дополнение — совместная работа как с партнером
• Агентность — ИИ действует самостоятельно по заданным принципам

Фреймворк 4D 📊 (ДОКО - русскоязычная аббревиатура, которая у меня получилась)

🔹 Delegation - Делегирование
Решение о распределении задач между человеком и ИИ. Включает понимание проблемы, знание возможностей ИИ и стратегическое планирование работы.

🔹 Description - Описание
Четкое общение с ИИ через:
• Описание продукта — что создать
• Описание процесса — как подходить к задаче
• Описание производительности — стиль взаимодействия

🔹 Discernment - Контроль (мой вольный перевод по смыслу)
Критическая оценка результатов ИИ:
• Качество контента
• Логика процесса
• Эффективность взаимодействия

🔹 Diligence - Ответственность (мой вольный перевод по смыслу)
Ответственное использование:
• Выбор подходящих систем
• Прозрачность о роли ИИ
• Подотчетность за результаты

Генеративный ИИ: основы ⚙️

Большие языковые модели создают новый контент на основе статистических паттернов из обучающих данных. Три прорыва сделали это возможным:

1️⃣ Трансформерная архитектура (2017) 2️⃣ Массивы цифровых данных
3️⃣ Мощные вычислительные ресурсы

Возможности и ограничения ⚖️

Сильные стороны:
• Универсальность в языковых задачах
• Поддержание контекста разговора
• Подключение к внешним инструментам

Ограничения:
• Дата среза знаний
• Возможные "галлюцинации"
• Ограниченное контекстное окно
• Непредсказуемость результатов

Эффективные техники промптинга 💡

6 основных принципов:

1️⃣ Контекст — объясните что, зачем и кто вы 2️⃣ Примеры — покажите желаемый результат 3️⃣ Ограничения — укажите формат и требования 4️⃣ Декомпозиция — разбейте сложные задачи 5️⃣ Время на размышления — дайте ИИ обдумать 6️⃣ Роль — определите, кем должен быть ИИ

Секрет: Просите ИИ помочь улучшить ваши промпты! 🔥

Практические выводы 📝

• Ваша экспертиза — основа эффективного использования ИИ
• Четкая постановка задачи критична для получения качественных результатов
• Всегда проверяйте и оценивайте выводы ИИ
• Берите ответственность за итоговые результаты
• Будьте прозрачны и сообщайте об использовании ИИ

И как обычно - эти навыки развиваются только через практику.
Начните применять фреймворк 4D уже сегодня — результаты не заставят себя ждать.

Полезные ссылки 📝
• Интерактивный сайт по курсу на русском языке здесь
• Оригинальный курс "AI Fluency: Framework & Foundations" здесь
• Плейлист оригинального курса на youtube здесь

@llm_notes

#aifluency #anthropic #prompt #gpt5 #lovable #context #course
3👍8🔥3❤‍🔥1
🔧 Open Lovable: быстрое клонирование сайтов и создание React-приложений через чат с ИИ

Команда Mendable AI выпустила открытый инструмент для быстрого создания React-приложений.
Open Lovable (не путать с lovable.dev, который является коммерческим развитием GPT Engineer) позволяет клонировать любой сайт и воссоздать его как современное React-приложение за несколько минут.

Основные возможности:
• Создание приложений через чат с ИИ
• Клонирование существующих веб-сайтов
• Автоматическая генерация React-кода
• Поддержка современного стека технологий

Технические требования: 1️⃣ E2B API ключ для песочниц 2️⃣ Firecrawl API для веб-скрапинга 3️⃣ Один из ИИ провайдеров: Anthropic, OpenAI или Groq

Установка:
git clone https://github.com/mendableai/open-lovable.git
cd open-lovable
npm install
npm run dev


Проект распространяется под лицензией MIT и уже набрал 3.1k звёзд на GitHub 📈

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

На скриншоте - моя попытка склонировать сайт lovable.dev
Результат, который получился, можно найти по ссылке

DeepWiki по проекту здесь (в этот раз почему-то без схем архитектуры)

@llm_notes

#react #ai #vibecoding #opensource #javascript #lovable
👍4
🔍 Как сделать виртуальную примерку очков: полный разбор проекта

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

Расскажу коротко (насколько позволяет формат заметки) о всех этапах - от исследования до деплоя.

Исследование решений 🔬

Сначала проводим анализ возможных подходов к решению задачи и существующих open-source проектов для AR-примерки, которые можно взять за основу. Как правило, после проведенного ресерча всегда возникает "развилка", которая в данном случае выглядит так:

• Самостоятельная разработка:
Создать решение с нуля, используя комбинацию передовых библиотек: MediaPipe для высокоточного отслеживания лица и Three.js для рендеринга 3D-моделей. Этот подход обеспечивает максимальный контроль, наилучшее качество и гибкость для будущего развития.

• Адаптация готового проекта: Взять за основу существующий open-source проект, например, bensonruan/Virtual-Glasses-Try-on (который демонстрирует связку MediaPipe + Three.js). Это может ускорить начальный этап, но в долгосрочной перспективе может оказаться менее гибким вариантом.

Мы решили пойти путем адаптации готового проекта. И выбирали из следующих вариантов:
jeeliz/jeelizGlassesVTOWidget - 300 ⭐️ Самое популярное решение с готовой базой 3D-моделей
bensonruan/Virtual-Glasses-Try-on - 46 ⭐️
alperenuzun/basic-virtual-tryon-glasses - 30 ⭐️ Базовая реализация без продвинутых функций

Попробовав все три варианта, я выбрал Jeeliz как наиболее зрелое решение (ну и "звездочек" у него больше).

Архитектура финального решения 🏗

• Фронтенд: Lovable.dev - быстрое создание React-интерфейса
• Бэкенд: Яндекс.Облако - Docker-контейнер с nginx и виджетом
• Интеграция: Stripe для платежей + система аутентификации (заодно проверили как lovable.dev справился с "прикруткой" данных функций - все прошло гладко)

Потестировать финальное приложение можно по ссылке (примеры на скриншотах)
На посадочной странице есть подробная информация про архитектуру и внутреннее устройство приложения.

Техническая база проекта ⚡️

Использовали готовую библиотеку Jeeliz VTO Widget:
• WebGL-рендеринг с физически корректным освещением
• Нейросеть для отслеживания лица в реальном времени
• База 3D-моделей очков (Ray-Ban, Oakley, Carrera)
• Поддержка мобильных устройств

Что пришлось решать 🔧

1️⃣ HTTPS-требование - камера работает только через защищенное соединение 2️⃣ Контейнеризация - настроил Docker + Nginx с SSL-сертификатами 3️⃣ Проксирование API - внешние ресурсы Jeeliz через локальный прокси 4️⃣ GPU-совместимость - проверка WebGL на клиенте

Разделение фронт/бэк 📐

Lovable.dev (фронтенд):
• Посадочная страница с описанием
• Система регистрации/авторизации
• Интеграция Stripe для оплаты
• Адаптивный дизайн

Яндекс.Облако (бэкенд):
• Docker-контейнер с Nginx
• Jeeliz VTO Widget
• SSL через Let's Encrypt
• Прокси для внешних API

Практические находки 💡

• GPU нужен только на клиенте, сервер работает без видеокарты
• Обязательно тестировать WebGL-совместимость (например, chrome://gpu)
• Для слабых устройств есть режим пониженной производительности
• Размер приложения всего 2.1MB благодаря оптимизации

Результат работы 📊

Получили полнофункциональное приложение:
• Работающая AR-примерка в браузере (safari/firefox/chrome)
• Каталог с 200+ моделями очков
• Система оплаты и личный кабинет (подписку оформлять не нужно, она сделана для проверки функциональности)
• Готовое к продакшн-деплою решение

Весь процесс занял несколько часов благодаря использованию готовой библиотеки и правильной архитектуре.

О курсе 🎓
• Данный проект был реализован в рамках курса "Cursor. AI-прототипирование и ИИ-агенты"
• Следующий поток стартует 27 августа - отличная возможность освоить современные инструменты разработки с ИИ.
• Примеры реализованных проектов можно найти здесь.

@llm_notes

#webgl #ar #lovable #cursor #yandexcloud #glasses #productuniversity
83
GenSpark AI Developer: новый инструмент для создания веб-приложений методом vibecoding 🚀

Компания GenSpark AI представила GenSpark AI Developer — специализированного ИИ-агента, который дополняет функциональность супер-агента Genspark и позволяет создавать веб-сайты и приложения без навыков программирования (про genspark.ai и варианты его использования я писал чуть ранее, вот пример одного из постов)

Основные возможности:

• Работа с несколькими AI-моделями, включая Claude Sonnet 4
• Создание сайтов прямо в браузере или мобильном приложении
• Автоматическая генерация админ-панелей для управления контентом
• Интеграция с GitHub для разработчиков

Примеры использования:

1️⃣ Бизнес-сайты — система бронирования для салона красоты с возможностью выбора времени и подтверждения записей 2️⃣ E-commerce — интернет-магазин с корзиной покупок и каталогом товаров 3️⃣ Личные проекты — трекер домашних дел для детей с системой баллов и наград 4️⃣ Игры — простые игровые приложения по текстовому описанию

Для разработчиков 👨‍💻

Поддерживает работу с существующими GitHub-репозиториями (см. скриншот). Можно модифицировать код, создавать pull request'ы и деплоить изменения через браузер или мобильное приложение.

Технические детали:

• Поддерживаемые модели: Claude Sonnet 4.0, Opus 4.1, GPT-5, Kimi K2
• Модель нельзя изменить в процессе работы над проектом ⚠️
• Интеграция с GenSpark SuperAgent для создания программных продуктов или простых веб-сайтов на основе проведенных исследований (сам пользуюсь с начала этой недели, вот один из примеров)

Варианты публикации приложения: 📤

• Через сам GenSpark (не очень удобно, т.к. требует от пользователя приложения регистрации на самом genspark.ai)
Cloudflare Pages (хороший вариант, т.к. позволяет разместить веб-приложение на хостинге с развитыми инструментами мониторинга и сопровождения, но в РФ опубликованный таким образом сайт будет доступен только через VPN)
• Экспорт кодовой базы для размещения на любом хостинге
GitHub Pages для простых сайтов (бесплатно)

Конкуренты: Genspark AI Developer с моей точки зрения уже сейчас составляет хорошую конкуренцию таким решениям как lovable.dev, bolt.new и v0.app. Основное его преимущество в том, что после проведения подготовительной работы, которой обычно является глубокий ресерч по какой-то тематике, не требуется переключаться на другую платформу.

Чего не хватает: 🔍 Встроенного Security Audit — пока можно использовать внешние инструменты для проверки безопасности кода, такие как https://vibe-eval.com/ например.

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

Как я чаще всего использую 📚
Провожу ресерч по интересующей меня теме
Создаю для себя обучающий сайт с проверочными тестами (к слову, и раньше без специализированного ai dev-агента это тоже можно было делать, но с AI developer качество стало значительно выше, думаю, что другим популярным универсальным браузерным ИИ-агентам, таким как manus, flowith, abaqus deep agent и т.д. имеет смысл перенять опыт genspark.ai )
Очень удобно быстро собрать интерактивный материал для изучения новых областей. И все на одной универсальной платформе.

В следующем посте приведу пример подготовки комплексной обучающей программы, которым поделился один из моих коллег на своем тг-канале.

@llm_notes

#genspark #agent #vibecoding #lovable #bolt #replit
👍21