【ツール＆コード無料】noteを「聴く」生活へ。「note Reader」爆誕！

皆さん、こんにちは。「やっぱり猫が大好き」です。

最近はnoteの記事をたくさん読んでいます。人間味のある記事は、読んで本当に面白いですよね。音声入力で執筆されている方もいるそうで、日々学びがあります。
今回爆誕したツールは「note Reader」です！パソコンの標準機能のみを使用していますので、導入が済めばサブスクなどの月額料金は不要です。

■ なぜこの機能が必要になったのか

「自動でページめくりして、読み上げてくれたらnoteライフが捗るよね～」と思ったのがきっかけです。 探せば既存のツールもあるのかもしれませんが、一つのネタとして自分で作ってみることにしました。 このツールで、noteを使う方々の生活が少しでも向上しますように😀

■ この拡張機能を使ったら何ができるか

※重要：現在はパソコン版のGoogle Chromeに対応（Microsoft Edgeでも動作すると思います）しており、スマートフォンでは利用できません。

• 連続読み上げ: フォローしている記事や、特定のクリエイターさんの記事を連続で読み上げることができます。自分の投稿記事もチェックできますね！

• 多様な再生順: フォローリスト、クリエイター毎、検索結果として表示されている記事リストを「上から順」、「下から順」でも自動連続再生可能です。小説などの連載記事を、古いものからラジオ感覚で聴くのに最適です。

• ハイライト＆自動スクロール: 音声が流れるだけでなく、今読み上げている範囲をハイライトし、自動でページをスクロールしてくれます。

• ショートカットキーで効率操作:

  • Alt + R ：この記事を読み上げる

  • Alt + Q ：前の記事へ戻る

  • Alt + S ：次の記事へ進む

  • Alt + X ：読み上げ停止

洗い物をしながらでも、寝ながらでも記事を読む（聴く）ことができるようになります。やったね😍

■ どんな感じに動作するの？

実際の動作はこちらの動画をご確認ください。

キャプションはついていませんが、マウスのカーソルの動きで内容を察してください😅 3:00→6:20ぐらいまで興味がなければスキップしてください
※一番下まで読んだら自動で次の記事に進む動作を待っているだけです
(🔴音が鳴ります注意🔴)(🔴音が鳴ります注意🔴)(🔴音が鳴ります注意🔴)

うまく動作するようになりましたら、おすすめのクリエイター様の記事をぜひ逆連続再生で聴いてみてください。とても聞きやすくて、すばらしいストーリーです😍

■ そもそも「拡張機能」とは？

プログラミングに詳しくない方のために簡単に解説しますと、拡張機能とは「ブラウザ（Chrome）に後から追加できる、専用の便利ボタン」のようなものです。 ブラウザそのものに「新しい特技」を覚えさせることができるパーツだと思ってください。世の中には素晴らしい拡張機能がたくさんあります。

■ 拡張機能追加の危険性について（一般論）

この記事のように、Chromeウェブストアで公式に公開されていない拡張機能を導入することには、一般的に以下のようなリスクがあります。

• セキュリティリスク: ソースコードの中身に悪意がある場合、閲覧履歴や個人情報を盗み見られる可能性があります。

• 動作の不安定さ: 公式の審査を経ていないため、ブラウザが重くなったり、特定のサイトが正しく表示されなくなったりすることがあります。

この拡張機能は外部通信せずローカルで完結し、権限等もnote内だけしか動作しないように最小限度に留めています。
念の為にこの拡張機能のソースコードをGeminiくんにセキュリティ診断してもらいました。Geminiくんの判定は、この拡張機能の危険性は極めて低いと判断できますと評価されました。

このソースコードは2026年2月7日現在動作していますが、将来的にnoteや拡張機能の仕様が変わることで動作しなくなる可能性があります。その場合は最善を尽くしますが、できなかったらごめんなさい。
また、お使いの環境によって動作を保証することもできません。 基本的には「プログラミング学習ネタ」としての提供となります。

■ ソースコードと実装方法

🟠ソースコードのダウンロード

ZIPファイルは展開して、任意の場所に保存してください。ブラウザへの読み込み後はフォルダを移動させないでください。

🟠お使いのPCへの実装方法(ブラウザへの読み込み手順)

• Chromeブラウザで chrome://extensions/ アドレスバーに入力して開きます。

• 右上の1.「デベロッパー モード」をオンにします。

• 2.「パッケージ化されていない拡張機能を読み込む」をクリックし、ダウンロードしたファイルを展開してできたフォルダ3.「note_yomiage」を4.選択します。5.有効になっていると思いますがなっていなければON

拡張機能をピン留めする方法

ブラウザの右上にある1.パズルピースのようなアイコン（拡張機能アイコン）をクリックし、2.「note Reader」の横にあるピンマークをクリックして固定してください。3.緑色のアンテナマークで再生のメニューが表示されます。

ここまでで準備完了です！😌
新しくnoteを開いて、緑のアンテナマークを押すとメニューが表示されますので操作を試してみてください。
必要に応じてスピード、投稿者の読み上げを調整してください。

もし、ショートカットキーが動作しない場合は手動にて登録してください。

対処法: chrome://extensions/shortcuts を開き、拡張機能のキーボードショートカットを確認してください。もし空欄になっていたら、そこで直接 Alt+R などを入力して設定してください。お好きなキーでも大丈夫です。

※拡張機能は無料で利用できます。いいなと思ったらシェアお願いします😊

応援購入したくださった方へのおまけとして、㊙️開発秘話（Geminiくんとの奮闘記）をお見せします。

2026年3月6日現在、応援いただきましたら、スマートフォン対応への修正に関するGeminiくんとのやりとりと、スマートフォン対応したテストファイルをお試しいただけます。

①Android版 Microsoft Edge CANARY、kiwi Browserで動作している、②iosのOrion Browser by Kagiでなんとか動作している β版のcrxファイルを提供しています。

スマートフォンへの拡張機能導入を実験的にお試しいただけますが、導入難易度もPCより少し難しく開発中の内容ですので過度に期待しないでください。うまく動作すればnoteを聞きながらの通勤や、ウォーキングは捗りますよ。

㊙️開発秘話（Geminiくんとの奮闘記）

興味がある方はぜひお読みください。ここからは、私と親友のGeminiくんがいかにしてこのツールを作り上げたかの記録です。

私は以前に、Amazon Prime Video、Hulu、YouTubeの再生速度変更、本編へのスキップ、次の動画を自動で行う拡張機能や、Gmailのpop取得時間制御、RSSニュース取得などを作成したことがあります。その時にファイル構造などは学びましたが、私はゼロからコードを書けるようなスーパーエンジニアではありません。

--【ここから先は有料部分です】--
応援いただきありがとうございます😉