WebVTT字幕 - Lingo.dev CLI

WebVTT字幕とは？

WebVTT（Web Video Text Tracks）字幕は、HTML5ビデオで時間指定されたテキストトラックを表示するためのフォーマットです。スタイリング、位置指定、メタデータをサポートしており、SRTよりも機能が豊富です。

例えば：

WEBVTT

NOTE
字幕付き製品デモンストレーションビデオ

1
00:00:01.000 --> 00:00:03.500
ソフトウェアチュートリアルへようこそ

subtitle-2
00:00:04.000 --> 00:00:07.200
主な機能を見ていきましょう

3
00:00:08.500 --> 00:00:12.000 align:middle line:90%
最初のプロジェクトの作成方法はこちらです

Lingo.dev CLIとは？

Lingo.dev CLIは、AIでアプリやコンテンツを翻訳するための無料のオープンソースCLIです。従来の翻訳管理ソフトウェアに代わるものとして設計されており、既存のパイプラインと統合できます。

詳細については、概要をご覧ください。

このガイドについて

このガイドでは、Lingo.dev CLIを使用してWebVTT字幕ファイルを翻訳する方法を説明します。

以下の方法を学びます：

ゼロからプロジェクトを作成する
翻訳パイプラインを設定する
AIで翻訳を生成する

前提条件

Lingo.dev CLIを使用するには、Node.js v18以上がインストールされていることを確認してください：

❯ node -v
v22.17.0

ステップ1. プロジェクトのセットアップ

プロジェクトのディレクトリにi18n.jsonファイルを作成します：

{
  "$schema": "https://lingo.dev/schema/i18n.json",
  "version": "1.10",
  "locale": {
    "source": "en",
    "targets": ["es"]
  },
  "buckets": {}
}

このファイルは、翻訳パイプラインの動作を定義し、どの言語間で翻訳するか、ローカライズ可能なコンテンツがファイルシステム上のどこに存在するかを指定します。

利用可能なプロパティの詳細については、i18n.jsonをご覧ください。

ステップ2. ソースロケールの設定

_ソースロケール_は、コンテンツが最初に書かれた元の言語と地域です。ソースロケールを設定するには、i18n.jsonファイルのlocale.sourceプロパティを設定します：

{
  "$schema": "https://lingo.dev/schema/i18n.json",
  "version": "1.10",
  "locale": {
    "source": "en",
    "targets": ["es"]
  },
  "buckets": {}
}

ソースロケールはBCP 47言語タグとして提供する必要があります。

Lingo.dev CLIがサポートするロケールコードの完全なリストについては、サポートされているロケールコードをご覧ください。

ステップ 3. ターゲットロケールを設定する

_ターゲットロケール_とは、コンテンツを翻訳したい言語や地域のことです。ターゲットロケールを設定するには、i18n.jsonファイルのlocale.targetsプロパティを設定します：

{
  "$schema": "https://lingo.dev/schema/i18n.json",
  "version": "1.10",
  "locale": {
    "source": "en",
    "targets": ["es"]
  },
  "buckets": {}
}

ステップ 4. ソースコンテンツを作成する

まだ作成していない場合は、翻訳するコンテンツを含むWebVTT字幕ファイルを1つ以上作成してください。これらのファイルは、パスのどこかにソースロケールを含む場所に配置する必要があります（例：ディレクトリ名としてen/や、ファイル名の一部としてmessages.en.vttなど）。

ステップ 5. バケットを作成する

i18n.jsonファイルのbucketsオブジェクトに"vtt"オブジェクトを追加します：

{
  "$schema": "https://lingo.dev/schema/i18n.json",
  "version": "1.10",
  "locale": {
    "source": "en",
    "targets": ["es"]
  },
  "buckets": {
    "vtt": {}
  }
}

"vtt"オブジェクト内で、1つ以上のincludeパターンの配列を定義します：
```
{
  "$schema": "https://lingo.dev/schema/i18n.json",
  "version": "1.10",
  "locale": {
    "source": "en",
    "targets": ["es"]
  },
  "buckets": {
    "vtt": {
      "include": ["./[locale]/example.vtt"]
    }
  }
}
```
これらのパターンは、翻訳するファイルを定義します。

パターン自体は：
- 設定されたロケールのプレースホルダーとして[locale]を含む必要があります
- ファイルパスを指定できます（例："[locale]/video.vtt"）
- ワイルドカードプレースホルダーとしてアスタリスクを使用できます（例："[locale]/*.vtt"）
再帰的なグロブパターン（例：**/*.vtt）はサポートされていません。

ステップ 6. LLMを設定する

Lingo.dev CLIは、AIでコンテンツを翻訳するために大規模言語モデル（LLM）を使用します。これらのモデルを使用するには、サポートされているプロバイダーからAPIキーが必要です。

可能な限り早く始めるには、毎月10,000トークンの無料使用量を提供する独自のホスティングプラットフォームであるLingo.dev Engineの使用をお勧めします：

Lingo.devアカウントにサインアップする。
次のコマンドを実行します：
```
npx lingo.dev@latest login
```
これにより、デフォルトのブラウザが開き、認証を求められます。
画面の指示に従ってください。

ステップ 7. 翻訳を生成する

i18n.jsonファイルが含まれているディレクトリで、次のコマンドを実行します：

npx lingo.dev@latest run

このコマンドは以下を実行します：

i18n.jsonファイルを読み込みます。
翻訳が必要なファイルを見つけます。
ファイルから翻訳可能なコンテンツを抽出します。
設定されたLLMを使用して抽出されたコンテンツを翻訳します。
翻訳されたコンテンツをファイルシステムに書き戻します。

翻訳が初めて生成される際に、i18n.lockファイルが作成されます。このファイルは、どのコンテンツが翻訳されたかを追跡し、後続の実行時に不要な再翻訳を防ぎます。

例

en/example.vtt

WEBVTT

NOTE
Product demonstration video with captions

1
00:00:01.000 --> 00:00:03.500
Welcome to our software tutorial

subtitle-2
00:00:04.000 --> 00:00:07.200
Let's explore the main features

3
00:00:08.500 --> 00:00:12.000 align:middle line:90%
Here's how to create your first project

00:00:13.000 --> 00:00:16.500
Click the New Project button
to get started

final-cue
00:00:17.000 --> 00:00:20.000 position:25% align:start
That completes our basic tutorial

es/example.vtt

WEBVTT

NOTE
Video de demostración de producto con subtítulos

1
00:00:01.000 --> 00:00:03.500
Bienvenido a nuestro tutorial de software

subtitle-2
00:00:04.000 --> 00:00:07.200
Exploremos las características principales

3
00:00:08.500 --> 00:00:12.000 align:middle line:90%
Aquí está cómo crear tu primer proyecto

00:00:13.000 --> 00:00:16.500
Haz clic en el botón Nuevo Proyecto
para comenzar

final-cue
00:00:17.000 --> 00:00:20.000 position:25% align:start
Eso completa nuestro tutorial básico

i18n.json

{
  "version": "1.10",
  "locale": {
    "source": "en",
    "targets": ["es"]
  },
  "buckets": {
    "vtt": {
      "include": ["./[locale]/example.vtt"]
    }
  },
  "$schema": "https://lingo.dev/schema/i18n.json"
}

i18n.lock

version: 1
checksums:
  ab6437a18c50af6612bb75499361d64a:
    0#1-3.5#1: 5df3c06b74cfc8558e85ff75a30a9162
    1#4-7.2#subtitle-2: 0de65f1d2616b6959aa79ac5beb6e84c
    2#8.5-12#3: 3351244c032529a099f1191477d9e488
    3#13-16.5#: b9341abc965d5178a96d9bc4e8e2c59a
    4#17-20#final-cue: 0b67e089cd3f39b8520d7a2be9f34362