ブラウザ上で開いているものをなんでもOCRできるようにしてみた
英語の勉強も兼ねてhuluとかで海外ドラマを字幕付きで見ることがあって、かっこいいセリフとか出てきたときに字幕をクリップボードにコピーできたら便利だよなーと思ってそんなchrome extensionを作ってみた。
使い方はこんな感じ。
OCR処理にはOcrad.jsというライブラリを使っている。
このchrome extensionの主な処理はOCRしやすいように画像を加工すること。
具体的には、画像の中に出ている文字と似ている色は黒にして、それ以外は白にする。
つまり、背景は白で文字が黒になるように画像を加工する。
これをHTML5のcanvas APIを使って、1ピクセル単位でごりごりやっている。
ずばっとOCRできたときは気持ちいい感じだけど、失敗したときには結局手直ししなきゃいけないのが面倒。
OCR対象の文字の色を教えるために、画像内の文字をクリックする必要があるのだけど、対象文字が小さいとクリックしづらい。
とか問題が多くあって、OCR精度上げるのは難易度が高いけど、このあたりのUX改善させる余地はまだまだありそう。
