Transit Designer

⚠️ 開発初期版

路線図デザインと音声アナウンスが作れるWebツールです。

音声ファイルのアップロードやプリセット音声の利用に加え、ElevenLabsでの音声生成にも対応しています。

試してみる: https://landonikko.github.io/Transit-Designer

注目ポイント

• インタラクティブなキャンバスマップエディタで路線を作成
• 音声の割り当てと自動再生シーケンス用のキュー機能
• 音声と効果音を生成。音響処理を追加
• すぐに使えるプリセット
• 多言語対応（日本語・英語）
• ライトモード・ダークモード
• 履歴管理（Undo/Redo）
• 豊富なカスタマイズ機能

主な技術スタック

• React + Vite
• Tailwind CSS
• D3.js (路線図描画)
• Web Audio API (音響処理)
• ElevenLabs API (音声生成)

---

Transit Designer

⚠️ Early Prototype

Web tool for designing train route maps with audio announcements.

You can upload your own audio files or use preset sounds, as well as generate your own with ElevenLabs.

Try it here: https://landonikko.github.io/Transit-Designer

Highlights

• Interactive canvas map editor for creating train lines
• Audio assignments and queue for automatic playback sequencing
• Generate voices and sound effects. Add audio processing
• Presets to get started
• Multilingual support (Japanese & English)
• Light and Dark mode
• History management (Undo/Redo)
• Lots of customization

Tech Stack

• React + Vite
• Tailwind CSS
• D3.js (route visualization)
• Web Audio API (audio processing)
• ElevenLabs API (voice generation)