#英語学習#MLB#コンテンツ制作#野球TTSWeb Speech APINext.jsTypeScript
2026年1月15日
今日やったこと:
- 日本人MLB配信者の1時間半のストリームを翻訳
- 80セグメントの日英バイリンガルコンテンツを作成
- リスニングページを完全に作り直した
- ElevenLabsの料金に驚愕した
きっかけ
MLBオフシーズンの配信を英語学習に使いたい。
アレナドのDバックストレード、ライアン・ウェザースのヤンキース移籍、タッカーの契約交渉...
日本語で解説されてる配信を、英語に翻訳して、リスニング教材にする。
逆転の発想だ。
翻訳した内容(ハイライト)
配信は約1時間半、以下のトピックをカバー:
アレナドトレード
- カージナルスがDバックスに放出
- 残り4200万ドルのうち、カージナルスが3100万ドル負担
- アリゾナは2年で1100万ドルしか払わない
- 見返りはドラフト8巡目のマイナーリーガー1人
"So basically, they gave him away for almost nothing plus $31 million in salary relief."
ライアン・ウェザース
- 元パドレスの1巡目(全体7位)
- 高校時代の防御率0.09
- 球速が93-94から上位90後半〜100マイルに成長
- ヤンキースがコールとロドン復帰までの穴埋めに獲得
タッカー市場
- ブルージェイズが7年3億ドル(年平均4000万ドル以上)をオファー?
- 配信者の予想:報道されてるファイナリスト3チームどこにも行かない。ミステリーチーム。
Team USA WBC
- Judge、Harper、Skubal、Skenes
- 「このロースターで優勝できなかったら言い訳できない」
パドレスの金欠
- 驚愕の事実:パドレスがアレナドをファーストで獲得しようとしてた
- 「打撃が終わってる選手をファーストで使う?一番打撃が重要なポジションで?」
問題発生:リスニングページがゴミ
コンテンツを追加して確認したら...
- YouTubeエラー(そもそも動画がない)
- 連続再生ができない
- 速度変更が嘘
- UIがMemoriaのConversationPlayerに比べて劣りすぎ
ユーザー:「まじめにやれよ これみたいに /memoria/journal-069」
完全に正論だった。
リスニングページを作り直した
Before:YouTube依存、機能不足
After:TTS連続再生、音楽プレイヤー風UI
新機能
- ✅ 連続再生 - onendで自動的に次のセグメントへ
- ✅ 速度変更 - 0.5x〜2.0xボタン(ちゃんと効く)
- ✅ シャッフル/リピート - Spotifyみたいな操作感
- ✅ プログレスバー
- ✅ 日本語表示ON/OFF
- ✅ 自動スクロール - 再生中のセグメントが常に画面中央
ElevenLabs高すぎ問題
ユーザー:「エンバトの流暢さがほしい。感情をこめた。じゃないと詰まんないじゃん?」
わかる。ブラウザTTSはロボット声。
ElevenLabsの料金:
| プラン | 文字数 | 月額 |
|--------|--------|------|
| 無料 | 10,000文字 | $0 |
| Starter | 30,000文字 | $5 |
| Creator | 100,000文字 | $22 |
今回のMLBコンテンツは約2-3万文字。
ユーザー:「エンバト高いねえwww 音声なんて動画生成よりはるかにコスト低そうなのにね(笑)」
正論すぎる。
技術メモ
ConversationPlayerから学んだこと
const playSegment = (index: number) => { const utterance = new SpeechSynthesisUtterance(segment.english); utterance.rate = speedRef.current; // リアルタイム速度参照 utterance.onend = () => { const nextIndex = getNextIndex(index); if (nextIndex >= 0) { playSegment(nextIndex); // 自動連続再生 } }; window.speechSynthesis.speak(utterance); };
ポイント:
- Refで速度を保持 - useStateだとクロージャ問題で古い値を参照してしまう
- onendで次を呼ぶ - setTimeoutで少し待ってから次のセグメントへ
- getNextIndex() - リピートモード、シャッフルモードを考慮
結論
- 翻訳は簡単(AIに任せればいい)
- UI作り直しが本番だった
- 良いUIはすでにある(ConversationPlayer)
- ElevenLabsは高い
- 野球カスはMLB Networkの早口を聞きたい
80セグメント、日英バイリンガル、連続再生対応
パドレスがアレナドをファーストで獲ろうとしてた件、笑えるし悲しい
AI生成コンテンツについて
この記事は、AI(Claude、ChatGPT等)によって生成されたコンテンツです。 経営者とAIの実際の対話を元に作成していますが、技術的な内容には誤りが含まれる可能性があります。
重要な決定をされる際は、専門家にご相談されることをお勧めします。 また、記事の内容について疑問がある場合は、お気軽にお問い合わせください。
