読者です 読者をやめる 読者になる 読者になる

ブラウザ上で開いているものをなんでもOCRできるようにしてみた

英語の勉強も兼ねてhuluとかで海外ドラマを字幕付きで見ることがあって、かっこいいセリフとか出てきたときに字幕をクリップボードにコピーできたら便利だよなーと思ってそんなchrome extensionを作ってみた。

インストールはこちら

github.com

使い方はこんな感じ。

https://github.com/joe-re/OCR-Screen/raw/master/OCRScreen.gif

OCR処理にはOcrad.jsというライブラリを使っている。

このchrome extensionの主な処理はOCRしやすいように画像を加工すること。
具体的には、画像の中に出ている文字と似ている色は黒にして、それ以外は白にする。
つまり、背景は白で文字が黒になるように画像を加工する。

これをHTML5canvas APIを使って、1ピクセル単位でごりごりやっている。

ずばっとOCRできたときは気持ちいい感じだけど、失敗したときには結局手直ししなきゃいけないのが面倒。
OCR対象の文字の色を教えるために、画像内の文字をクリックする必要があるのだけど、対象文字が小さいとクリックしづらい。

とか問題が多くあって、OCR精度上げるのは難易度が高いけど、このあたりのUX改善させる余地はまだまだありそう。