奶油刀 使用說明

奶油刀 logo

get-the-addon-172x60.png

不曉得各位會不會像我一樣會在看動畫的過程中,把一些好笑或是喜歡的畫面截圖下來收藏,或是後續再分享幾個畫面推坑其他人呢?想必或多或少應該都會有類似的經驗;如果是像我一樣非常喜歡抓剛好的精準畫面的同好,也應該有過以下經驗:

  1. 按下 PrtSc 的時機總是抓不準,總是差一點
  2. 一直在「倒退→截圖→暫停→查看截圖→不滿意所以再來一次」的循環
  3. 不想看到全螢幕的瀏覽器提示和播放控制列,只能多按一次 來讓這些東西有時間消失
  4. 好不容易截好圖,已經是幾分鐘過去了;甚至是按下截圖後暫停的瞬間,發現一閃而過超難抓的時機就在眼前,但控制列橫亙在眼前只好再來一次倒退的循環,無數 loop 後只好放棄

不管你有沒有以上困擾,我自己是有啦。太勤奮是當不了開發者的!為了想要自己截圖方便於是決定動手寫一個 Firefox 的附加元件來用!

特色

  • 不用再多倒退影片只為了不要出現控制列,因為附加元件截圖只有影片。現在可以慢慢地調整到想要的畫面暫停後,再按下按鈕截圖!
  • 提供鍵盤快捷鍵和介面按鈕不只一種方式進行截圖
  • 存檔名稱方便回朔截圖是在哪部動畫、第幾話的什麼時間擷取的
  • 依照目前串流的影片大小截圖,不因預設大小或全螢幕而改變截圖的長寬
  • 開源!本附加元件採用 GNU Affero General Public License v3.0 開源許可證

使用

使用請遵守《著作權法》及《巴哈姆特動畫瘋服務條款》等相關規範。作者撰寫附加元件僅供學術研究及程式碼練習,請注意合理使用的範疇!

下載及安裝

get-the-addon-172x60.png

截圖

目前提供兩種方式:

  1. 按下 F8 進行截圖
  2. 播放器控制列右下方會多出一個按鈕,點一下也會進行截圖

控制列上會注入一個「切奶油」的可愛圖示

下載截圖

之後畫面往下滾,奶油刀會把切下的畫面暫時存放在相簿區(作品簡介上方)。滑鼠放在圖片上方,會出現存檔名稱,預設為:動畫標題 + 集/話數資訊 + 時間(分 + 秒共四位;若達小時等級則為時 + 分 + 秒共六位)。

例如下圖,存檔名稱為「四月是你的謊言011515.png」:
四月是你的謊言011515在相簿區

請直接在想要存的截圖上點一下滑鼠左鍵,就可以像一般下載檔案一樣,開始下載檔案。

如果不想使用預設的格式,且使用的是 0.3.2 版以上的奶油刀的話,則可以自訂存檔檔名前綴:

自訂檔名前綴輸入區

以上圖的《劇場版 擅長捉弄人的高木同學》為例,原先預設截圖後前綴為「劇場版 擅長捉弄人的高木同學電影」,把電影兩字去除後按下勾勾鍵儲存:

修改後存檔檔名少了「電影」

注意事項

  1. 擷取的畫面都會掛到目前的 DOM 底下,擷取的圖片越多、串流解析度越大,DOM 占用記憶體空間就越大。請衡量電腦硬體能力,適當的截圖。
  2. 由於擷取的畫面都存放在目前的頁面中,所以重新整理或關閉分頁就會消失無法撿回來。在關閉或重新整理畫面前,請務必將想要的截圖下載儲存。

常見問題

  • Q:請問有 Chrome 版本嗎?
    A:作者本人九成以上都是使用火狐,且 Chorme 上架需要收費,故目前尚無此打算。
  • Q:可以截圖彈幕嗎?
    A:以 JS 的角度看,由於彈幕和影片不是在同一層上,如果截圖要有彈幕還要另外繪製到 canvas 上,除了麻煩外,我也沒這個需求,故不會實作。
  • Q:可以提供自訂存檔格式和檔名的功能嗎?
    A:未來有時間及心力的話,會持續調整奶油刀,敬請期待!
  • Q:想提出建議、想法或回報問題?
    A:如果有 GitHub 帳號的話,請優先使用 issue 功能;其他人可以直接在本文下方留言。

命名由來

或許你會問,為什麼這個工具要叫做「奶油刀」呢?當初興起念頭,開好 repo 並做出 icon 的時候,其實也有人問過我這個問題。

大家應該都知道,動畫的原理就是把很多動作相近的圖,以快速換頁的方式讓你有「動」的感覺。而截圖這個動作,就好像是從一個連貫的時間軸/影格/幀或是類似的概念中,「切」出一個畫面。看到這邊就明白為什麼是刀子了吧。

原先我是想命名為手術刀的,但一來怕切割的不夠精準(目前的存檔名稱只到秒,而非毫秒)二來也沒有在連續的東西中切出一片的感覺。後來想到了奶油刀。

把動畫想像成一塊完整的奶油,用奶油刀切奶油,就好像截圖的感覺一樣,希望大家可以體會這個意象。無法想像就算了,名字是不會改的。

結語

再次強調,雖然做這個附加元件可以更方便的截圖,但請遵守相關的使用規範,以免吃上官司。

本附加元件為開源專案,依照 AGPL 3.0 開源,歡迎大家互相交流。

最後感謝動畫瘋,讓我有機會完成這個小小的想法,也感謝網路上的各路文章不吝分享經驗及資源(可以參考 GitHub repo 上的參考資料列表)。我們有機會下次見~