WEB DEVELOPMENT2026年〜
動画配信サービスの英語字幕で学べるChrome拡張と、単語帳のWebライブラリを約2週間で開発
- 業種
- 語学・教育の新規事業を検証する企業
- 期間
- 2026年10月〜継続中
- 体制
- Rekidから1名。設計、実装、検証、本番環境の構築、ストアへの申請まで
再生中 · 0.9倍速
I've never seen anything like it.
こんなの、見たことがない。
- 1何か、何でもIs there anything I can do?
- 2(否定で)何もI didn't say anything.
anything like it = それに似たもの(端末内のAIの解説)
保存例文ごと保存
マウスを重ねるだけで辞書調べた単語は外に送らない
01 ISSUE
課題
好きな作品を英語字幕で観ながら、一文ずつ聞き直したり、わからない単語を調べて保存し、あとで復習したりできる道具をつくる、というご相談でした。
02 APPROACH
取り組み
拡張機能が読み取るのは、字幕のデータとプレイヤーが公開している情報だけにしました。映像や音声を取り出したり、ログイン情報を読み取ったりはしません。
辞書は約4.7万語を拡張機能に同梱し、調べた単語を外部に送らない作りです。表現の解説は、ブラウザに内蔵されたAIを使い、利用者の端末の中だけで行います。保存した単語やフレーズはWebライブラリに同期し、そこで復習できます。
データの流れと、外に送らない範囲
- 1字幕データだけを読む映像・音声・ログイン情報は読まない
- 2同梱の辞書で引く約4.7万語。端末の中で引く
- 3端末内のAIで解説ブラウザに内蔵されたAIを使う
- 4Webライブラリへ同期保存した単語とフレーズだけ
外に送らない保存した単語だけ同期
主な機能
- 英語と日本語の二言語字幕、一文リピート、文の終わりでの自動停止、再生速度の変更
- マウスを重ねるだけで引ける辞書と、単語・例文・フレーズの保存
- 語彙のレベルに合わせた色分けと、端末内のAIによる表現の解説
- 字幕ファイルの取り込み、Webライブラリ(ログイン、同期、復習、CSV・JSONでの書き出し)
すべて基本中級上級
- AanythingI've never seen anything like it.基本
- RreluctantShe was reluctant to leave.中級
- Wwander offDon't wander off on your own.フレーズ
- UunprecedentedIt was an unprecedented storm.上級
Webライブラリの単語帳。保存した単語と例文を、あとで復習する
再生
字幕と辞書
保存する
拡張機能の設定。再生速度や一文リピートを選ぶ
03 RESULT
成果
約2週間着手から、拡張機能とWebライブラリの本番環境まで
約4.7万語拡張機能に同梱し、外部に送らずに引ける辞書
着手から約2週間で拡張機能とWebライブラリを本番環境に出し、2026年10月15日にChromeウェブストアの審査へ申請しました。
04 TECHNOLOGY
使った技術
- Chrome Extension(Manifest V3)
- TypeScript
- Vite
- Chrome Built-in AI(Gemini Nano)
- Cloudflare Workers
- Cloudflare D1