<h2 id="%E3%81%AF%E3%81%98%E3%82%81%E3%81%AB" data-line="0" class="code-line">
<a class="header-anchor-link" href="#%E3%81%AF%E3%81%98%E3%82%81%E3%81%AB" aria-hidden="true"></a> はじめに</h2>
<p data-line="2" class="code-line">ChatGPTやClaudeなどのLLMサービスを使って翻訳をする機会が増えましたが、いくつかの制限に直面することがあります。</p>
<ul data-line="4" class="code-line">
<li data-line="4" class="code-line">大量の文章を一度に翻訳できない(一度に処理できるトークン数に制限がある)</li>
<li data-line="5" class="code-line">epubファイルに対応していない</li>
<li data-line="6" class="code-line">APIを使うとコストがかかる</li>
</ul>
<p data-line="8" class="code-line">これらの問題を解決するために、LM Studioを使ってローカルで動作する多言語翻訳HTMLツールを作成しました。サーバは必要なく、ブラウザで完結するため、手軽に利用できます。</p>
<p data-line="10" class="code-line"><img src="https://res.cloudinary.com/zenn/image/fetch/s--H7mimFVY--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_1200/https://storage.googleapis.com/zenn-user-upload/deployed-images/8bdf98479293ac45d8f13df2.png%3Fsha%3D98aa54e60ee9b71603d1f84e171cc549b0a57400" alt="翻訳ツールの画面例" class="md-img" loading="lazy"></p>
<p data-line="12" class="code-line">plamoの翻訳に特化した<code>plamo-2-translate</code>が発表されてから、ずっとやりたいと思っていたのですが、なかなか手が回らず、今回ようやく形にすることができました(plamo-2-translateは５GB程度と軽量なので、比較的メモリが少ないマシンでも走る･･･はず)。</p>
<p data-line="14" class="code-line">まだまだ改善の余地ありで、表示が崩れることが多々ありますが、宜しければお試しください。</p>
<p data-line="16" class="code-line">私は先日Macbook Pro M4 Max メモリ128GBを購入して、ハッスルしながらgpt-oss-120Bを動かしていて、やっとマシンの性能を活かせるようになってきたので、これからはローカルで色々試していきたいと思っています。</p>
<h2 id="%E4%BD%9C%E6%88%90%E3%81%97%E3%81%9F%E3%83%84%E3%83%BC%E3%83%AB" data-line="18" class="code-line">
<a class="header-anchor-link" href="#%E4%BD%9C%E6%88%90%E3%81%97%E3%81%9F%E3%83%84%E3%83%BC%E3%83%AB" aria-hidden="true"></a> 作成したツール</h2>
<h3 id="%E3%83%80%E3%82%A6%E3%83%B3%E3%83%AD%E3%83%BC%E3%83%89" data-line="20" class="code-line">
<a class="header-anchor-link" href="#%E3%83%80%E3%82%A6%E3%83%B3%E3%83%AD%E3%83%BC%E3%83%89" aria-hidden="true"></a> ダウンロード</h3>
<p data-line="22" class="code-line"><a href="https://github.com/sumik5/llm-translate/releases" target="_blank" rel="nofollow noopener noreferrer">📦 LLM Translator - Release</a> より最新版をダウンロードしてください。</p>
<p data-line="24" class="code-line">このツールは、LM Studioのローカルサーバーと連携して、テキストやepubファイルを翻訳するHTMLアプリケーションです。対応言語は使用するLLMモデルに依存します。</p>
<h2 id="%E4%B8%BB%E3%81%AA%E7%89%B9%E5%BE%B4" data-line="26" class="code-line">
<a class="header-anchor-link" href="#%E4%B8%BB%E3%81%AA%E7%89%B9%E5%BE%B4" aria-hidden="true"></a> 主な特徴</h2>
<ul data-line="28" class="code-line">
<li data-line="28" class="code-line">
<strong>ローカル環境で完結</strong>: LM Studioを使用することで、インターネット接続なしで翻訳が可能</li>
<li data-line="29" class="code-line">
<strong>柔軟な言語対応</strong>: 使用するLLMモデルが対応している言語間での翻訳が可能</li>
<li data-line="30" class="code-line">
<strong>epub対応</strong>: epubファイルをアップロードして章ごとに翻訳</li>
<li data-line="31" class="code-line">
<strong>大量テキスト対応</strong>: チャンクごとに分割して処理するため、長文の翻訳も可能</li>
<li data-line="32" class="code-line">
<strong>コスト削減</strong>: ローカルLLMを使用するため、APIコストが発生しない</li>
</ul>
<h2 id="%E4%BD%BF%E3%81%84%E6%96%B9" data-line="34" class="code-line">
<a class="header-anchor-link" href="#%E4%BD%BF%E3%81%84%E6%96%B9" aria-hidden="true"></a> 使い方</h2>
<h3 id="1.-lm-studio%E3%81%AE%E3%82%BB%E3%83%83%E3%83%88%E3%82%A2%E3%83%83%E3%83%97" data-line="36" class="code-line">
<a class="header-anchor-link" href="#1.-lm-studio%E3%81%AE%E3%82%BB%E3%83%83%E3%83%88%E3%82%A2%E3%83%83%E3%83%97" aria-hidden="true"></a> 1. LM Studioのセットアップ</h3>
<ol data-line="38" class="code-line">
<li data-line="38" class="code-line">
<a href="https://lmstudio.ai/" target="_blank" rel="nofollow noopener noreferrer">LM Studio</a>をダウンロード・インストール</li>
<li data-line="39" class="code-line">翻訳したい言語に対応したLLMモデルをダウンロード
<ul data-line="40" class="code-line">
<li data-line="40" class="code-line">日本語対応モデル例：Qwen2.5、Llama 3-ELYZA-JP-8Bなど</li>
<li data-line="41" class="code-line">モデルによって対応言語が異なるため、用途に合わせて選択</li>
</ul>
</li>
<li data-line="42" class="code-line">LM Studioでローカルサーバーを起動（デフォルト: <a href="http://localhost:1234" target="_blank" rel="nofollow noopener noreferrer">http://localhost:1234</a>）</li>
</ol>
<h3 id="2.-%E7%BF%BB%E8%A8%B3%E3%83%84%E3%83%BC%E3%83%AB%E3%81%AE%E4%BD%BF%E7%94%A8" data-line="44" class="code-line">
<a class="header-anchor-link" href="#2.-%E7%BF%BB%E8%A8%B3%E3%83%84%E3%83%BC%E3%83%AB%E3%81%AE%E4%BD%BF%E7%94%A8" aria-hidden="true"></a> 2. 翻訳ツールの使用</h3>
<ol data-line="46" class="code-line">
<li data-line="46" class="code-line">
<a href="https://github.com/sumik5/llm-translate/releases" target="_blank" rel="nofollow noopener noreferrer">📦 LLM Translator - Release</a> から最新版のZIPファイルをダウンロード</li>
<li data-line="47" class="code-line">ZIPファイルを解凍</li>
<li data-line="48" class="code-line">ブラウザで<code>translator.html</code>を開く</li>
<li data-line="49" class="code-line">テキストを入力するか、epubファイルをアップロード</li>
<li data-line="50" class="code-line">翻訳先言語を選択</li>
<li data-line="51" class="code-line">「翻訳する」ボタンをクリックして翻訳開始</li>
</ol>
<p data-line="53" class="code-line">詳細な設定方法や使用方法については、<a href="https://github.com/sumik5/llm-translate/blob/main/README.md" target="_blank" rel="nofollow noopener noreferrer">README.md</a>をご参照ください。</p>
<p data-line="55" class="code-line">チャンクサイズをデフォルト1000にしていますが、ここを増減させると翻訳の粒度が変わります。<br>
一括で大きく翻訳したい場合は大きく、細かく翻訳したい場合は小さくしてください<br>
（ただし訳の精度や、表示の崩などに影響する可能性があります）。<br>
どの程度が良いかは、使用するモデルや翻訳元の文章によって異なるため、試行錯誤が必要です。</p>
<h2 id="%E6%B3%A8%E6%84%8F%E4%BA%8B%E9%A0%85" data-line="60" class="code-line">
<a class="header-anchor-link" href="#%E6%B3%A8%E6%84%8F%E4%BA%8B%E9%A0%85" aria-hidden="true"></a> 注意事項</h2>
<p data-line="62" class="code-line">このツールは複数のepubファイルで動作確認を行っていますが、完全ではありません。epubの構造によっては、HTMLの表示が崩れる場合があります。特に以下のような場合に問題が発生する可能性があります：</p>
<ul data-line="64" class="code-line">
<li data-line="64" class="code-line">複雑なレイアウトを持つepubファイル</li>
<li data-line="65" class="code-line">特殊なCSSスタイルが適用されているepub</li>
<li data-line="66" class="code-line">画像が多く含まれるepub</li>
</ul>
<h2 id="%E6%8A%80%E8%A1%93%E7%9A%84%E3%81%AA%E8%A9%B3%E7%B4%B0" data-line="68" class="code-line">
<a class="header-anchor-link" href="#%E6%8A%80%E8%A1%93%E7%9A%84%E3%81%AA%E8%A9%B3%E7%B4%B0" aria-hidden="true"></a> 技術的な詳細</h2>
<ul data-line="70" class="code-line">
<li data-line="70" class="code-line">
<strong>フロントエンド</strong>: 純粋なHTML/JavaScript（フレームワーク不使用）</li>
<li data-line="71" class="code-line">
<strong>epub処理</strong>: JSZipとXMLパーサーを使用してepubを解析</li>
<li data-line="72" class="code-line">
<strong>API連携</strong>: LM StudioのOpenAI互換APIエンドポイントを使用</li>
<li data-line="73" class="code-line">
<strong>翻訳処理</strong>: チャンク分割により大量テキストにも対応</li>
</ul>
<h2 id="%E3%81%8A%E3%82%8F%E3%82%8A%E3%81%AB" data-line="75" class="code-line">
<a class="header-anchor-link" href="#%E3%81%8A%E3%82%8F%E3%82%8A%E3%81%AB" aria-hidden="true"></a> おわりに</h2>
<p data-line="77" class="code-line">このツールは個人的なニーズから生まれたものですが、同じような課題を抱えている方の役に立てば幸いです。</p>
<p data-line="79" class="code-line">改善点や機能追加のアイデアがありましたら、ぜひ<a href="https://github.com/sumik5/llm-translate/issues" target="_blank" rel="nofollow noopener noreferrer">GitHubのIssue</a>やコメントでお知らせください。特に以下の点についてフィードバックをいただけると嬉しいです：</p>
<ul data-line="81" class="code-line">
<li data-line="81" class="code-line">epubの表示崩れを改善する方法</li>
<li data-line="82" class="code-line">翻訳品質を向上させるプロンプトの工夫</li>
<li data-line="83" class="code-line">UIの改善案</li>
<li data-line="84" class="code-line">その他の便利な機能のアイデア</li>
</ul>
<h3 id="%E6%9C%AC%E5%BD%93%E3%81%AF%E3%82%84%E3%82%8A%E3%81%9F%E3%81%8B%E3%81%A3%E3%81%9F%E3%81%93%E3%81%A8" data-line="86" class="code-line">
<a class="header-anchor-link" href="#%E6%9C%AC%E5%BD%93%E3%81%AF%E3%82%84%E3%82%8A%E3%81%9F%E3%81%8B%E3%81%A3%E3%81%9F%E3%81%93%E3%81%A8" aria-hidden="true"></a> 本当はやりたかったこと</h3>
<ul data-line="88" class="code-line">
<li data-line="88" class="code-line">画像を適切に挿入</li>
<li data-line="89" class="code-line">目次と該当部分へのリンク</li>
</ul>
<p data-line="91" class="code-line">皆様のご意見をお待ちしております！</p>


LM Studioを使ってローカルで多言語翻訳するHTMLツールをつくった

Discussion