2023年2月10日 星期五

利用剪映線上版產出影音的字幕

2023年2月10日 星期五

剪映(CapCut)有個「智能字幕」「識別字幕」的功能滿好用的,可以由編輯軌中的音源中,利用語音辨識來產出字幕,與之前 pyTranscriber 使用 Google 辨識的結果比較,略勝一籌。哈~好用,不過因為有舊陰影,將這工具安裝在電腦中,心裡還是覺得毛毛的。

其實剪映也有線上版,因為是在瀏覽器中操作,「感覺」安心一點點(哈!這什麼心態啦!)。缺點大概就是它似乎沒有中文介面,素材上載到網站要等它一下(尤其是需要轉檔的),最重要的,想匯出字幕檔,得登入(不就又要奉送個資)。

哈!線上版的最大好處是有機會可以將資料「撈出來」,這樣一來,就不用登入了啦!試了一下,還真撈得到。底下記錄一下流程。

CapCut 的線上編輯網址:

進入後,要先選個模板,因為只是借用它來產出字幕,選擇空白的模板即可。

選擇空白模板並按 Create 鈕

選完按「Create」鈕,即可進入編輯畫面

將影音素材上載

點左側選單「Media」圖示,再點裡面的「Project」,就可以將要產出的影片或是MP3 語音檔拉進素材上載區中了。

將影音素材新增至編輯軌中

將要上載完的素材新增至編輯軌中,就可以準備製作字幕了。

語音辨識字幕的設定程序

由語音自動辨識字幕的功能在「文字」的功能中,所以先按左側有「T」字樣的圖示,再按「Auto captions」,因為我們要用語音辨識,所以接著在「Recognize voice」中的「Language」選擇語言為中文「Chinese」(是的,當然沒有繁體中文可選)。都設定好,就可以按「Create」鈕,開始進行語音辨識,製作字幕了。

語亯辨識中

接著就等語音辨識結果出爐。

點一下字幕軌

試了幾個不同的檔案,語音辨識等候的時間比在本機操作時快很多。

字幕軌出現後,按一下字幕軌,右邊就會出現「Captions」的區塊,可以查看並修改字幕內容。

基本上,在頁面上看得,當然就可以擷取下來,一句句複製嗎?這種簡單又重覆的事,當然是要交給程式來做。

2023.02.16 註:

底下的程式可以跳過,我寫了一個 Chrome 的擴充功能,用來下載字幕,已在 Google 線上應用程式上架了,網址如下:

利用底下的 JavaScript 可以解析頁面的內容,找出字幕,並將它轉為「.srt」字幕檔的格式,最後將內容複製到剪貼簿中。

var items, item, timeStart, timeEnd;
var output = '';
items = document.getElementsByClassName('attribute-subtitle-item');
for (var i = 0; i < items.length; i++) {
  item = items[i];
  timeStart = item.querySelector('.start').innerHTML;
  timeEnd = item.querySelector('.end').innerHTML;
  subtitle = item.querySelector('.textarea').value;
  //to .srt format:
  //1
  //00:00:01,166 --> 00:00:03,133
  //字幕文字
  //
  output += (i + 1) + '\n';
  output += '00:' + timeStart + ',0' + ' --> ' + '00:' + timeEnd + ',0' + '\n';
  output += subtitle + '\n';
  output += '\n';
};
console.log(output);

copyAndSelectToClipboard = function (id) {
  var target;
  if (typeof(id) == 'string') {
    target = document.getElementById(id);
  } else if (typeof(id) == 'object') {
    target = id;
  }
  target.select();
  document.execCommand("copy");
  window.getSelection().removeAllRanges(); // to deselect
};
var elm = document.createElement("textarea");
elm.value = output;
document.body.appendChild(elm);
copyAndSelectToClipboard(elm);
document.body.removeChild(elm);

只要點過「字幕軌」讓字幕編輯區出現後,將上面的程式程貼到瀏覽器「開發人員工具」的「Console」中執行,剪貼簿中應該就會有 CapCut 產出的字幕了。

瀏覽器中執行字幕擷取程序

不過字幕還是簡體字,再進行一下簡轉繁的程序就好(個人在 Windows 中是習慣用 ConverZZ)。

哈!貼程式碼令人害怕,應該要來寫個 Chrome 的擴充功能,按一下就自動下載字幕檔才對。

註:看起來,有中文界面的線上版 https://www.capcut.cn/editor (網址的網域是 .cn)和前面使用的 https://www.capcut.com/editor (網址的網域是 .com)最大的差異,其它不講,後者雖然沒中文界面,但卻有語音辨識可以自動產出字幕,而且素材的部份可以直接上載 .mkv 的影片檔案(.cn 那個則要事先將副檔名改為 .mp4 才能上載,這又是什麼跟什麼,檔案的名稱有那麼重要嗎!)。

相關文章



沒有留言:

張貼留言

 
雄::gsyan © 2009. Design by Pocket