はじめに
「同じ情報を、同じ速度で共有できる」
これは、聴覚障がいをお持ちの方にとって、会議やセミナーに参加する際の切実な願いです。
聴覚に障がいがあると、会議の内容をリアルタイムで把握することが難しくなります。手話通訳者がいない場面、要約筆記が追いつかない場面、そもそもサポートがない場面...。情報の遅れは、議論への参加機会を奪い、意思決定から取り残される原因になります。
そんな課題を解決すべく、CollaRecoX（コラレコエックス）というツールを開発しました。昨年のアドベントカレンダーで初公開してから1年、大幅な改善を経て2年目を迎えました。
本記事はNTTテクノクロス Advent Calendar 2025のシリーズ1、12月23日の記事です。
CollaRecoXでできること ✨
あらためまして、CollaRecoXは、リアルタイム音声文字起こしと共同編集を組み合わせたWebアプリケーションです。
🎤 リアルタイム文字起こし
話者がマイクに向かって喋ると(もしくはVB-Cableなどの仮想マイク経由で入力すると)、その内容が0.5〜数秒程度の遅延で画面に文字として表示されます。聴覚障がいをお持ちの方は、この画面を見ることでリアルタイムに会話の内容を把握できます。とはいえこれは専用アプリやTeamsなどの電子会議システム、場合によってはOSレベルなどでも提供している機能です。
👥 複数人での同時編集・校正
これが最大の特徴になりますが、文字起こしされた内容は、分散編集可能なドキュメントとして、それを見ているリモートの複数人で同時に編集・確認ができます。Google Docsのような感覚です。たとえば以下のような修正を行うことができます。
- 音声認識の誤りをすぐに修正
- 専門用語や固有名詞の補正
- 補足コメントの追加
サポートする人が複数いれば、分担して校正できます。以下、校正画面の例です。
弊社にはもともと、Teamsなどの自動文字起こしの誤認識に対応するためのボランティアの取り組みがあり、大きなセミナーのリアルタイム配信などでは、有志の方々が聴覚障害を持った方の聴取をサポートするために、自動文字起こし結果の誤認識を補正するチャットをつかった支援の営みがあります。CollaRecoXはその校正をシステム的に効率化しようという位置付けになります。
🤖 AI再編
これは副次的な機能ですが、ある程度の文章が積み上がったとき、任意の範囲でAIに整理してもらえます。あらかじめ決まったAI再編のテンプレートとしては以下があり、カスタム化も可能です。
- 誤字脱字の修正
- 句読点の整理
- フィラー（「えーと」「あのー」）の除去
- パラグラフごとの小見出しの追加
- 箇条書きへの変換
数種類のテンプレートを用意しており、組み合わせて使用可能です。
📍 実際の利用シーン
🎓 セミナー・講演会
話者の発言がリアルタイムでスクリーンに表示されます。聴覚障がいをお持ちの参加者も、他の参加者とほぼ同じタイミングで情報を得られます。固有名詞や部署名など、一般の文字起こしツールでは認識精度が低くなりがちな用語を、人手によって補正して認識を合わせることができます。
💼 会議・打ち合わせ
議論の内容をその場で確認。文字起こしをみて、他のメンバーもしくは発言者本人が内容を確認し修正することもできます。また文字起こし結果は整理して議事メモにすることもできます。
💬 面談・相談
1対1のコミュニケーションでも活用。筆談の手間を省きつつ、記録も残せます。
1年目から2年目への進化 📈
1年目の課題 😓
昨年公開した初期バージョンには、いくつかの課題がありました。
精度が低かった
前バージョンは、文字起こしにChrome内蔵のWeb Speech Recognition APIを使用していましたが、認識精度に課題がありました。精度が低いとフラストレーションが高まり校正の手間も増すため、リアルタイムの理解は阻害されがちでした。
リアルタイム性をもとめるとコストが高かった
その後にOpenAIが発表したgpt-4o-realtimeは低遅延(準リアルタイム)の応答が可能な高性能モデルでしたが、発話が不要で文字起こしだけに使うにはオーバースペックで、コストが高くなっていました。
UIの完成度が低かった
PoCとして機能検証が優先だったこともあり、UIの使いやすさまで十分に作り込めていませんでした。特に校正画面は、ITに詳しくない校正ボランティアの方々でも直感的に操作できる必要がありますが、そのレベルには達していませんでした。
2年目の改善 🚀
精度向上
最大の改善点は文字起こし精度の大幅改善です。これは以下のような工夫で達成しています。
- OpenAIが新たに提供を開始した文字起し専用モデルgpt-4o-transcribeの採用。これはリアルタイムかつ文字起こし特化したモデルで、従来のWeb Speech Recognition APIと比較して認識精度が大幅に向上しました。gpt-4o-realtimeモデルと比べるとコストも削減できます。
- VAD（Voice Activity Detection）により発話の区切りで文字起こし実施ができるようにしました。
- VADによる自動区切りだけでなく、手動で「ここで区切り」と指定できる機能を実装しました。話者が間を取らない場合や、VADがうまく区切れない場面でも、校正者が任意のタイミングで文字起こしを確定できます。
- その他様々な認識パラメータを調整を可能にすることで、音声認識精度を最適なものに高めていくことができます。
UIの劇的な改善
リッチテキストエディタライブラリTiptap Editorを採用し、Google Docsライクな操作感で誰でも迷わず使える校正画面を実現しました。
💡 Yjs・Tiptap・ProseMirrorとは？
ProseMirrorは、リッチテキストエディタを構築するための低レベルツールキットです。New York TimesやThe Guardianなど大手メディアのCMSでも採用されており、高度なカスタマイズ性と堅牢性を兼ね備えています。また、後述のYjsと連携することでエディタの状態をリアルタイムに同期する分散共同編集エディタとして利用できます。
Tiptap Editorは、ProseMirrorをReact等のフレームワーク向けにラップしたライブラリです。ProseMirrorの強力な機能を保ちながら、Notionのような高機能エディタを比較的少ないコードで構築できます。
Yjsは、リアルタイム共同編集を実現するためのCRDT（Conflict-free Replicated Data Type）ライブラリです。Google DocsやFigmaのように、複数人が同時に同じドキュメントを編集しても競合が起きない仕組みを提供します。オフライン編集後の同期も自動で解決してくれます。Tiptapとの連携プラグイン（y-prosemirror)が用意されており、共同編集機能を簡単に追加できます。
CollaRecoXでは、上記を使って「音声認識結果のリアルタイム表示」と「複数人での同時校正」を両立しています。
細かな不具合の修正
- ハングルなど他国語が混入する問題を修正
- 句点「。」が余分に追加される問題を修正
- 発話終端の自動検出（VAD）タイミングの調整
- 音声バッファリング長の最適化
これらの改善により、より実用的なツールに進化しました。
技術的な改善ポイント 🔧
ここからは、技術者向けに実装の詳細を説明します。
テクノロジースタック 🛠️
まずはCollaRecoXで採用している主要な技術を紹介します。
フロントエンド
| 技術 | 用途 |
|---|---|
| Next.js 15 (App Router) | Webアプリケーション基盤 |
| Tiptap + ProseMirror | リッチテキストエディタ |
| Jotai | クライアント状態管理 |
| Tailwind CSS v4 | UIスタイリング |
リアルタイム同期
| 技術 | 用途 |
|---|---|
| Yjs | CRDT（Conflict-free Replicated Data Type）による共同編集 |
| Hocuspocus | Yjsサーバー実装、サーバーサイドからのドキュメント更新に対応 |
| WebSocket | 双方向リアルタイム通信 |
AI・音声認識
| 技術 | 用途 |
|---|---|
| OpenAI Realtime API + GPT-4o-transcribe | リアルタイム文字起こし |
| OpenAI GPT-4.1 mini 他任意のモデル | AI再編（テキスト整形・校正支援） |
GPT-4o-transcribeの効果
最大の改善点は、Realtime API経由でgpt-4o-transcribeを呼び出す構成への変更です。
const sessionConfig = {
type: 'session.update',
session: {
modalities: ['text'], // テキスト出力のみ
input_audio_transcription: {
model: 'gpt-4o-transcribe', // 文字起こし専用モデル
language: 'ja'
},
turn_detection: {
type: 'server_vad',
threshold: 0.2,
silence_duration_ms: 3000
}
}
};
ポイント:
-
modalities: ['text']で音声応答を無効化（文字起こしのみに特化） -
gpt-4o-transcribeモデルで高精度な日本語認識 - Server VADで発話区間を自動検出
VADパラメータの調整
音声区間検出（Voice Activity Detection）のパラメータ調整は、使い勝手に大きく影響します。
turn_detection: {
type: 'server_vad',
threshold: 0.2, // 感度（低いほど敏感）
silence_duration_ms: 3000 // 無音判定までの時間
}
-
threshold: 0.2- 小さな声も拾う設定 -
silence_duration_ms: 3000- 3秒の無音で発話終了と判定
話者が考えながら話す場面を想定し、少し長めの無音時間を設定しています。これらのタイミングはUIで変更することができます。
他国語混入問題の修正
日本語を認識しているはずが、なぜかハングルや中国語が混入することがありました。言語パラメータの明示的な指定で解決しました。今のところハードコーディングですが、国際化のタイミングで言語を選択できるようにしたいと考えています。
input_audio_transcription: {
model: 'gpt-4o-transcribe',
language: 'ja' // 日本語を明示
}
サーバーからのドキュメント更新
アーキテクチャ上、特筆すべき点が一つあります。
サーバーが音声認識結果をYjsドキュメントに直接書き込む設計を採用しています。
ブラウザ(マイク) → サーバー ←→ OpenAI Realtime API
↓
Hocuspocus/Yjs
↓
全クライアントに同期
通常、Yjsはクライアントが編集を行いサーバー経由で同期しますが、CollaRecoXではサーバーが「特別なクライアント」として振る舞います。AI再編の実行や結果の差し替えも、きっかけはクライアントからですが、AI再編処理はサーバーサイドで実行し、サーバーがYjsクライアントとして同時編集ドキュメントに書き込みます。
function sendTextToHocuspocusDocument(sessionId, text) {
const document = hocuspocus.documents.get(roomName);
if (document) {
const fragment = document.getXmlFragment(`content-${sessionId}`);
// サーバーがパラグラフを追加
const newParagraph = new Y.XmlElement('paragraph');
const textNode = new Y.XmlText();
textNode.insert(0, text);
newParagraph.insert(0, [textNode]);
fragment.insert(fragment.length, [newParagraph]);
}
}
これにより、音声認識結果やAI再編の結果は即座に全クライアントに配信されます。
Claude Codeによる開発 🤝
今回の開発では、AnthropicのClaude Codeを全面的に活用しました。既存コードの解析、バグの原因特定、修正案の提示など、対話しながら効率的に開発を進められました。特に、リッチなUIの実現や複雑なWebSocket周りのデバッグで威力を発揮しました。
正直に言えば、Claude CodeなしではこのCollaRecoXの開発は不可能でした。コンセプトや技術的なアイデアはあったものの、絶対的なコーディング時間や能力の不足があり、この形にまとめあげる過程でClaude Codeの能力に助けられたことは言い尽くすことができません
生成AIがもたらす開発の民主化
これは私個人の経験に留まらない、大きな変化の兆しだと感じています。かつてソフトウェア開発は、専門的なスキルを持つ一部の人だけが担える領域でした。アイデアがあっても、それを形にするには長い学習期間と実装経験が必要でした。「こういうものがあれば便利なのに」という当事者の声が、技術的なハードルによって実現されないまま埋もれていく——そんな状況が当たり前でした。生成AIは、この構図を変えつつあります。
ドメイン知識を持つ人が、AIの支援を受けながら自らツールを作れる時代が来ています。CollaRecoXのケースで言えば、「聴覚障がい者支援に何が必要か」を理解している当事者と、仲立ちとなる開発者が生成AIを活用して開発することで、当事者のニーズに近いプロダクトが生まれました。特にアクセシビリティの分野では、この変化は大きな意味を持ちます。障がい当事者やその支援者が、自分たちの課題を最もよく理解しています。その知見が、生成AIという橋渡しによって、直接により近いかたちでプロダクトに反映される可能性が開けたのです。
「アイデアを持つ人」と「実装できる人」の垣根が低くなることで、これまで見過ごされてきたニッチな課題にも光が当たるようになる——CollaRecoXの開発を通じ、そんな未来の片鱗を感じています。
今後実装したい機能 🔮
置換リスト
よくある誤認識パターン（例: 「CollaRecoX」→「コラレコックス」）を手動で登録、 もしくは修正履歴から自動登録し、自動修正する置換リスト機能を検討中です。
AI再編プロンプトの共有
現在、AI再編のプロンプトテンプレートは固定ですが、ユーザー定義のカスタムテンプレートとして、追加・共有できる仕組みを検討しています。
話者識別について
文字起こしでは「誰が喋ったか」を表示するために話者識別（diarization）があると望ましく、バッチでの文字起こしではそのため「gpt-4o-transcribe-diarize」というモデルがあるのですが、2025年12月現在、リアルタイムAPIからはまだ利用可能になっておりません。技術的に可能なモデルが出てきたらぜひ実現したい機能です。
まとめ 🎯
CollaRecoXは、聴覚障がいをお持ちの方が「同じ情報を、同じ速度で共有できる」環境を目指して開発しています。
2年目の改善で、GPT-4o-transcribeの採用により精度とコストの両面で大きく前進しました。まだ課題はありますが、実用的なツールとして使っていただけるレベルになったと思います。
AI技術は、「誰かの困りごとに寄り添う」ツールとして大きな可能性を持っています。アクセシビリティの分野でAIがどう活用できるか、これからも探求していきたいと思います。
最後になりましたが、CollaRecoXの開発、評価、アイデアなど多面にわたり、一緒に取り組んできて頂いている社内有志ボランティアのみなさん、聴覚障がい者のかた含む当事者のみなさま、本当にありがとうございました。引き続きよろしくお願い致します。
こちら、当社のメンバーが書いてくださった関連記事になります。
CollaRecoXはこちらにて公開されています。
質問やフィードバックがあれば、ぜひコメントください。
明日は @korodroid さんです。
引き続きNTTテクノクロス Advent Calendar 2025をお楽しみに!
おまけ
いままでに書いてきたAdvent Calendarの記事を記録として列挙しておきます。
- 2024 CollaReco〜セミナーや会議で耳が聴こえにくい方の理解と積極参加を助ける〜人機(AI)協調型文字起こしシステム
- 2023 Refine(Refine.dev)を半年開発で使ってみてわかったこと
- 2022 流行り始めたtRPCでAPI通信を型にはめて開発しよう
- 2021 React Queryを状態管理ライブラリとして使い倒そう！/useQStateのススメ
- 2020 ReactでAirtableのAPPS(アプリ)を作ろう!!
- 2019 React-SpringのHooks APIでブラウザアニメーションを基本から極めよう!
- 2018 Reactベース静的サイトジェネレータGatsbyの真の力をお見せします
- Claude CodeはAnthropic, PBCの商標です。
- 本記事中に記載されている会社名、製品名、サービス名等は、各社の登録商標または商標です。
- 本記事は著者の所属社および各社の公式な見解・提携・支援を示すものではありません。