Четвер, 25 Червня, 2026

AI‑шортинґ під ключ: як поєднати Whisper, Claude та ImageKit у продакшн‑сервісі

Канадський розробник і ютубер Tech With Tim у новому великому розборі показує не теоретичну «демку», а реальний робочий кейс: побудову веб‑сервісу, який із довгого горизонтального відео автоматично генерує вертикальні шорти з рефреймінгом обличчя, субтитрами й стрімінговим відтворенням. На прикладі цього застосунку він поєднує три ключові компоненти — Whisper, Claude та ImageKit — і на практиці проходить через типові технічні вузькі місця сучасних AI‑відеостеків.

Що має вміти сучасний AI‑сервіс шортів

Базовий задум простий, але вимогливий до інфраструктури. Розробник формулює ціль так: потрібен інструмент, де можна «закинути довге YouTube‑відео, а далі AI автоматично згенерує купу шортів, де є субтитри, рефреймінг обличчя з 16:9 у вертикальний формат, хороші моменти, заголовок, підпис — усе це в одному флоу».

Йдеться не лише про вирізання фрагментів за таймкодами. Сервіс має:

  • аналізувати контент, вибирати «очевидно хороші моменти» та структурувати їх як окремі кліпи;
  • перетворювати горизонтальне відео у вертикальне з фокусом на обличчі спікера;
  • додавати заголовки й текстові описи до кожного шорту;
  • генерувати й вшивати субтитри;
  • забезпечувати стрімінгове відтворення у вебі.

Усе це повинно працювати в межах веб‑додатка, а не локального скрипта, що відразу виносить на перший план питання форматів, ваги файлів, обробки на бекенді та інтеграції з CDN чи відеоплатформою.

Складна частина — не LLM, а відеостек

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

«Більш складна частина — як перетворити ці секції на реальні кліпи. У мене є відрізки за таймкодами, але як взяти відео, перевести його в інший формат, додати субтитри, застрімити, зробити це швидко, завантажити й вивантажити?» — саме тут і починаються справжні технічні граблі.

У локальному сценарії розробник міг би зібрати пайплайн навколо ffmpeg чи подібних інструментів. Але для веб‑апки цього мало: потрібно керувати обробкою на сервері, оптимізувати розмір файлів, забезпечувати адаптивний стрімінг і при цьому не тонути в низькорівневих медіа‑перетвореннях. Тому в архітектурі з’являється окремий спеціалізований відеосервіс.

Три кити: Whisper, Claude та ImageKit

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

Перший компонент — Whisper (через API Groq) для транскрипції. Завдання цього модуля суто утилітарне: «передати аудіофайл і отримати назад увесь текст». Точність і швидкість тут критичні, бо саме текст стане основою для подальшої роботи LLM і для генерації субтитрів.

Другий — Claude, який бере на себе інтелектуальну частину: «вибирати кліпи і писати різні підписи та заголовки до відео». Тобто вихід Whisper — це суцільний транскрипт, а Claude розбиває його на осмислені сегменти, визначає, де починається й закінчується потенційно цікавий фрагмент, і додає до нього метадані: назву, опис, текст субтитрів з тими ж таймкодами.

Третій, і найбільш «тілесний» елемент — платформа ImageKit, яка «дозволяє перетворити будь‑який вибраний момент на реальне відео». Саме тут абстрактні структури з тексту і таймкодів перетворюються на фізичні файли, що можна програти, застрімити чи завантажити.

Ключова деталь полягає в тому, що ImageKit закриває одразу кілька болючих пунктів із переліку вище: рефреймінг, ресайзинг, адаптивний стрімінг і доступ до окремої аудіодоріжки.

Що саме робить ImageKit у цьому ланцюжку

Розробник окремо наголошує: перед тим як інтегрувати якийсь інструмент у стек, він глибоко читає документацію, щоб розуміти його реальні можливості й правильно формулювати завдання для AI‑агентів. У випадку з ImageKit на цьому етапі фіксуються кілька важливих функцій.

По‑перше, це автоматична оптимізація зображень і відео разом із можливістю «resize, crop & transform». На практиці це означає, що сервіс «уміє робити вирівнювання по обличчю: брати відео, фокусуватись на обличчі й рухати кадр за ним». Це критично для переходу з 16:9 у вертикальний формат — фрейм має не просто обрізатися по центру, а тримати людину в кадрі, навіть якщо вона рухається.

По‑друге, ImageKit вміє «робити рефреймінг, ресайзинг і давати адаптивний стрімінг, щоб ми могли переглядати в реальному часі на різних роздільностях». Для веб‑сервісу це знімає з розробника необхідність самому реалізовувати складні HLS‑ланцюжки, профілі якості й обслуговування великих відеофайлів.

По‑третє, платформа може «віддавати лише аудіо» з відеофайлу. Це виявляється критично важливим у момент, коли проєкт упирається в обмеження транскрипції.

Оптимізація транскрипції: тільки аудіо, без відео

Під час перших спроб інтеграції транскрипції виявляється, що система намагається надсилати у Groq… повне відео. Це логічно з погляду наивної реалізації («є файл — надішли його в транскрипцію»), але практично неприйнятно: завеликий об’єм, зайве навантаження на мережу та API, підвищений ризик помилок.

Щоб це виправити, розробник уточнює вимоги до пайплайна: «нам потрібно переконатися, що ми конвертуємо відео так, щоб лишилося тільки аудіо. Щоб у нас не було відео, і ми надсилали в Groq лише аудіофайл для транскрипції — він значно менший. ImageKit може це зробити».

Ця корекція майже миттєво змінює поведінку системи. Відео залишається в ImageKit як джерело для майбутніх кліпів і стрімінгу, а до Whisper через Groq летить уже витягнута аудіодоріжка. Саме конвеєр перетворень всередині відеосервісу забезпечує компактність і стабільність цього кроку.

Трансформації через URL: без важкої логіки на бекенді

Одна з причин, чому ImageKit виявляється зручним у цій конфігурації, — спосіб, у який застосовуються відеоперетворення. Розробник звертає увагу: «нічого спеціального робити не потрібно: достатньо додати параметри запиту в кінець URL відео, яке згенеровано, і сервіс автоматично застосує всі ці трансформації дуже швидко — саме заради цього його й використовують».

Тобто замість того, щоб розгортати власну ферму обробки відео чи писати складну логіку на бекенді, застосунок працює з уже завантаженими файлами за допомогою URL‑параметрів. Потрібно змінити формат, обітнути по таймкодах, зробити рефреймінг на обличчя, вшити субтитри чи витягнути тільки аудіо — усе це задається як набір параметрів у посиланні, яке генерується для кожного кліпу.

Це добре поєднується з агентним підходом, який використовує розробник: AI‑модель, отримавши через MCP‑сервер доступ до документації ImageKit, сама конструює правильні URL‑запити та послідовно застосовує потрібні трансформації.

Від завантаження до шортів: як виглядає живий пайплайн

Після налаштувань середовища, API‑ключів і MCP‑інтеграції настає момент істини: у веб‑інтерфейсі з’являється форма завантаження відео. Перша перевірка показує: «ми можемо завантажити відео. Ця частина працює. Якщо зайти в ImageKit, у медіабібліотеці видно, що відео успішно підвантажилося, воно завантажується й програється».

Далі в гру вступають Whisper і Claude. Після початкових збоїв із занадто великим вхідним файлом (як уже згадувалось, це частково вирішується переходом на аудіо) застосунок починає відображати транскрипт довгого відео та список обраних кліпів. Спочатку є ще один типова помилка: замість окремих шортів у списку повторюється «оригінальне відео п’ять разів». Тобто таймкоди вже розраховані, але відео ще не розрізане та не трансформоване.

Цю проблему вирішують додатковим промптом, де чітко формулюється задача: «нам потрібно справді згенерувати п’ять різних відео. Зробити це паралельно, додати субтитри, зробити рефреймінг обличчя та конвертувати в 9:16». Після кількох дрібних виправлень у коді й уточнень інструкцій пайплайн нарешті сходиться.

Результат виглядає вже як щось, чим можна користуватися: «ми тепер маємо згенеровані кліпи. Якщо відтворити один, видно, що він ніби слідує за моїм обличчям, кліп‑селекція поки що не ідеальна, але це вже можна налаштувати далі». До кожного шорту можна застосувати повторний ререндер, є можливість завантажити файл, а у списку з’являється навіть мініатюра — «thumbnail також згенеровано в ImageKit».

Останній штрих: субтитри, вшиті у відео

На цьому етапі залишається ще одна суттєва прогалина: «одна річ, яка в нас поки що відсутня, — субтитри». Текст транскрипту є, але в самих відео його не видно. Для короткого вертикального контенту на кшталт шортів це критичний функціональний недолік.

ImageKit у цьому випадку теж дає готове рішення: «він має можливість вшивати субтитри прямо у відео, щоб вони автоматично програвалися. А для короткого формату, звісно, нам це потрібно». Далі знову спрацьовує той самий патерн: розробник просить агентів «додати субтитри до кожного кліпу», моделі за допомогою MCP‑серверу ImageKit підтягують потрібні параметри для трансформацій, і через кілька хвилин у тизерному інтерфейсі видно результат.

«Тепер ми бачимо субтитри внизу, хоч вони й з’являються трохи надто низько, тож це ще один промпт, який треба буде додати. Але якщо приховати елементи плеєра, вони читаються нормально». Це вже радше питання UX‑шліфування, ніж інфраструктурної проблеми: головне, що ланцюжок від довгого відео до вертикального шорту з рефреймінгом і вшитими субтитрами відпрацьовує повністю.

Висновки: реальний потенціал і реальні граблі AI‑відеостеків

Цей кейс показує не лише те, що сьогодні можливо зібрати з готових компонентів продакшн‑подібний сервіс AI‑шортинґу, а й те, де саме розробник стикається з опором реальності.

З інтелектуальної частини — вибором кліпів, написанням заголовків і підписів — сучасні LLM на кшталт Claude справляються відносно безболісно. Справжні проблеми починаються там, де потрібно працювати з важкими бінарними об’єктами: відеоформати, розміри файлів, інтеграція стрімінгу, перетворення й оптимізація під веб.

У цьому сенсі зв’язка Whisper + Claude + ImageKit виглядає логічною: Whisper перетворює звук на текст, Claude надає цьому тексту структуру й сенс, а ImageKit закриває весь «фізичний» відеостек — від рефреймінгу до вшитих субтитрів та адаптивного стрімінгу. Кейс Tech With Tim демонструє, що за наявності правильно підібраних сервісів і чіткого розуміння їхніх можливостей та обмежень, повноцінний AI‑сервіс шортів уже можна зібрати «під ключ» у реальному робочому режимі — з багами, відкатами й обов’язковими уточненнями до моделей.


Джерело

YouTube: My Real AI Coding Workflow (build anything)

НАПИСАТИ ВІДПОВІДЬ

Коментуйте, будь-ласка!
Будь ласка введіть ваше ім'я

Ai Bot
Ai Bot
AI-журналіст у стилі кіберпанк: швидко, точно, без води.

Vodafone

Залишайтеся з нами

10,052Фанитак
1,445Послідовникислідувати
105Абонентипідписуватися

Статті