У клиента был Telegram-канал с видео ремонтов. Восемнадцать роликов: разборка коробки, замена мехатроника, диагностика на стенде. Хорошие видео, снятые в процессе работы.
Проблема — видео лежали только в Telegram. На сайте портфолио не было. Потенциальные клиенты заходили на сайт, видели текст «мы ремонтируем DSG» и уходили. Без доказательств.
Задача
Перенести видео-портфолио с канала на сайт. И сделать так, чтобы новые работы добавлялись автоматически — без разработчика, без FTP, без «пришлите видео на почту».
Что было
- 18 видео в Telegram-канале @dsgclinicchannel
- Сайт на Next.js без портфолио
- Владелец сервиса загружает видео в канал с телефона
Что сделали
Шаг 1. Скачали видео из канала
Через Telethon (Python-библиотека для Telegram API) скачали все 18 видео из канала. Общий объём — 1,15 ГБ.
Каждое видео — конкретная работа: замена сцепления DSG7, ремонт мехатроника S-Tronic, диагностика DQ200. Для каждого определили тип КПП, марку автомобиля и вид работы.
Шаг 2. Загрузили на S3
Видео залили в облачное хранилище S3 — не на сервер напрямую. Это даёт:
- CDN-раздачу (видео грузится быстро из ближайшей точки)
- Сервер не забивается гигабайтами видео
- Резервное копирование на стороне хостинга
Для каждого видео сгенерировали превью-картинку через ffmpeg: кадр на первой секунде, сжатый до 320px.
Шаг 3. Создали базу данных
PostgreSQL-таблица portfolio_works хранит:
- Название работы
- Марку и модель автомобиля
- Тип КПП (DSG7, DSG6, S-Tronic)
- Описание проблемы и решения
- Ссылку на видео в S3
- Ссылку на превью
- Статус публикации (показывать на сайте или нет)
Шаг 4. Вывели на сайт
Компонент PortfolioClient.tsx: сетка карточек с превью, по клику — воспроизведение видео. Мобильная версия адаптирована — кнопка play поверх превью, потому что автоплей на iOS заблокирован.
Шаг 5. Сделали бота для новых работ
Вот тут самое интересное. Владелец сервиса не должен звонить разработчику каждый раз, когда хочет добавить работу.
Бот @dsgclinic_robot работает так:
- Отправляешь видео в бот
- Бот спрашивает: «Какая машина?»
- Предлагает выбрать тип КПП — кнопками (DSG7, DSG6, S-Tronic)
- Просит описать проблему
- Показывает превью поста и спрашивает подтверждение
- После подтверждения — одновременно:
- Загружает видео на S3
- Генерирует превью через ffmpeg
- Сохраняет в PostgreSQL
- Публикует пост в Telegram-канал
- Обновляет портфолио на сайте (через API ревалидации Next.js)
Весь процесс — 2 минуты. С телефона. Без компьютера.
Шаг 6. Telegram Mini App для управления
Для удобства сделали веб-приложение прямо внутри Telegram:
- Список всех работ с поиском и фильтрами по типу КПП
- Редактирование — название, описание, машина
- Скрытие/показ на сайте одним тапом
- Удаление (из базы, с S3 и из канала одновременно)
- Статистика: сколько работ по каждому типу КПП
- Свайп-действия на карточках — как в почте iOS
Тёмная тема, нативный вид. Открывается через кнопку «Управление» в боте.
Результат
| Метрика | Значение |
|---|---|
| Видео на сайте | 18 |
| Время добавления новой работы | 2 минуты |
| Объём на S3 | 1,15 ГБ |
| Участие разработчика | 0 |
Владелец сервиса добавляет работы сам. Снял видео на телефон, отправил в бот, ответил на 3 вопроса — готово. На сайте, в канале и в базе.
Зачем это автосервису
Портфолио — главный аргумент для клиента, который выбирает сервис. «Мы ремонтируем DSG» — это слова. Видео разборки коробки с комментариями механика — это доказательство.
Раньше видео оседали в Telegram-канале и умирали через неделю. Теперь каждое видео работает на сайте постоянно: поисковики индексируют страницу портфолио, клиенты видят реальные работы.
Технический стек
- Бот: grammy (Node.js) + Express для API
- Хранилище: S3 (Beget Cloud Storage)
- База: PostgreSQL
- Сайт: Next.js с ISR (обновление по запросу)
- Превью: ffmpeg (кадр на 1 сек, 320px JPEG)
- Mini App: HTML/CSS/JS, Telegram WebApp API
- Деплой: PM2 + nginx
Хотите так же?
Если у вас автосервис, детейлинг, стоматология, салон красоты — любой бизнес, где важно показать результат работы:
- Вы снимаете видео/фото на телефон
- Отправляете в бот
- Бот публикует на сайт и в канал
Без дизайнера, без разработчика, без FTP.
Напишите в @eldarmarketing_bot — обсудим.
