🔥

abceedでの英語学習効率を爆上げするchrome拡張を作った話

2022/12/26に公開・約2,100字・7件のコメント

はじめに

昨今では円安も進み日本人が海外に出稼ぎに行くというニュースも聞くようになってきました。また、開発の現場でも海外のエンジニアと仕事をする機会も増えてきたように思います
その時に壁になるのがやはり英語です。私は英語からずっと逃げてきた感じのエンジニアでして、海外の人も参加するテックカンファレンスを見ては「英語勉強しなきゃな〜」と思っても特に行動もせずにgoogle翻訳やDeepLに頼って長いことやり過ごしてきました
しかし最近の流れを踏まえると、そろそろやらないと時代に取り残されてしまうと感じているので本格的に勉強を始めています
最初はとりあえず会話出来るようになりたいなと思いオンライン英会話を始めてみました。しかし、英語を聞き取れないし英文も作れないしで散々でした。そもそも基礎が出来てないという事がわかりました
諸々と英語学習の情報を集めた結果、まずはTOEICの学習をしてある程度のスコアを取ることが大事であると考えました。TOEICの勉強を通して英単語や文法のベースを作ろうと思ってます
TOEICのスコアはエンジニアも今後見られることが増えてきそうだなと感じてもいて、この記事のように具体的な目標スコアを掲げている企業もあるようです

abceedとは

AI英語教材アプリです。webとios, androidで使えます
https://www.abceed.com/

色々なTOEICの参考書の問題をこのアプリ1つで解けるのが魅力的なところだなと思ってます
かつて、スタサプEnglishも使っていたのですが、そちらも使いやすくて良いですね。ただ価格がやや割高なのと問題を多く解きたいと思っていて今はabceedを使ってみてます

使っていて感じた不満

画像はabceed webの問題解説画面です
下で問題音声を再生したり3秒進む・戻るが出来たり再生速度の変更を行うことが出来ます
リスニング問題を解いた後に問題の音声を聞きながらオーバーラッピングやシャドーイングするようにしているのですが、途中で音声を止めて戻したかったり速度を遅くして音を確認したいとかをしたくなった時にマウス操作がすごくめんどくさいと感じていました
普段仕事でキーボードを触ることがメインなので、出来ることならキーボード使って学習をしたいところです

解決策

abceed webでショートカットキーを使えるようにするchrome extensionを作りました

使い方

https://github.com/tkm-kj/shortcut-for-abceed/tags から最新のソースコードをダウンロードして解凍します

chrome://extensions/ にアクセスして Developer Mode(デベロッパーモード)のトグルをon -> Load unpacked（パッケージ化されてない拡張機能を読み込む）で解凍されたディレクトリを指定で完了です

あとは https://app.abceed.com/ にアクセスして問題の解説画面に移動すれば拡張機能が使えるようになります
具体的に使えるショートカットは以下です

スペースキー: 音声の再生・停止
左矢印キー: 3秒戻る
右矢印キー: 3秒進む
上矢印キー: 再生速度を遅くする
下矢印キー: 再生速度を速くする
Altキー（を押しながら）矢印左キー: 前の問題に切り替え
Altキー（を押しながら）矢印右キー: 次の問題に切り替え
Shiftキー（を押しながら）矢印左キー: （Part3, 4の解説の）前の設問の解説に切り替え
Shiftキー（を押しながら）右矢印キー: （Part3, 4の解説の）次の設問の解説に切り替え

※コマンドは適宜追加予定でいます

さいごに

個人的に不満だった問題がこの拡張機能で解消されたので、abceedを使った学習がより捗ってます！
同じ悩みを抱えている方がいらっしゃいましたら、ぜひ使ってみてください〜！

Discussion

始めまして、このような機能を探しており大いに活用させて頂いております。

Macで「Shiftキー + 」が機能しないようで御座いまして、
こちらお手隙の際にご確認いただけると、助かります！！！

活用してもらえて大変嬉しいです！

こちら、私の説明不足だったので表記の変更を行いました

Shiftキー（を押しながら）矢印左キー: 前の問題の解説に切り替え
Shiftキー（を押しながら）右矢印キー: 次の問題の解説に切り替え

になります

わー早速ありがとう御座います！

Shiftキーを押しながら矢印を押しているのですが、反応せずで御座いました！
（Mac2台で試してみたので、キーボードの問題ではないと思われます・・！）

連絡ありがとうございます🙏

私の方でもいくつか試してみたのですが、再現せずでして
例えば、他のchrome拡張やmacのデスクトップアプリ（特にkarabinerのようなキーをカスタマイズ出来るもの）を切って動かしても反応しないでしょうか？

ご丁寧にご確認いただきまして、ありがとう御座います！

拡張機能やアプリを終了して見ましたが、やはりだめでした！
ただ、他の機能は十分活用できております！ありがとう御座います！

私もshift+←→で次の問題に移動する機能が機能していなかったのですが、
content_script.ts，content_script.jsを

  if (keysPressed['Shift']) {
    switch (event.code) {
      case 'ArrowLeft':
        clickSoundControllerButton(0)
        break
      case 'ArrowRight':
        clickSoundControllerButton(4)
        break
    }

に変更すると動作しました！

修正したところ、shift+←→が機能いたしました！
お二方の大先生に支えられて、TOEIC800点待ったなしです。勉強ガチってきます。

ログインするとコメントできます