4Dアプリケーションのローカライゼーションは、主にデスクトップアプリケーション用に設計されたXLIFFアーキテクチャー（ ）により、数十年にわたってサポートされてきました。
しかし、ブラウザの動作は異なります。
そのため、4D Qodly Proは、ウェブインターフェイス用に調整された、新しいビルトイン国際化(i18n)アプローチを導入しています。
では、実際にどのように機能するのか見てみましょう。
では…ローカライズとは一体何でしょうか？
ローカライゼーションとは、アプリを異なる言語、地域、文化的なニュアンスに対応させるプロセスのことで、単にテキストを翻訳するだけでなく、現地の期待に応えるためにデザインや機能をカスタマイズすることです。
4D Qodly Proでは、ローカライゼーションは国際的なユーザーの獲得と維持に不可欠です。彼らの言語や文化を尊重することで信頼を築き、より強い関係や高い満足度を育みます。ローカライゼーションはまた、製品を自然で直感的なものにし、世界中のユーザーの摩擦を減らすことで、普及を促進します。
開発の早い段階でローカライゼーションを組み込むことで、アプリを新しい市場にスムーズに展開できるようになり、効率的なスケーリングと世界的な競争力の維持が可能になります。ローカルで開始する場合でも、ローカリゼーションを今計画することで、後で時間とコストを節約し、グローバルな成長への道を加速します。
使用例最小限のローカリゼーションUIの構築
今回のユースケースでは、テキストコンポーネントとユーザーが言語を選択できるセレクトボックスを表示するシンプルなページを作成します。
- テキストコンポーネントには、次のようなテキストを使用します。設定メニューからいつでも言語を切り替えることができます。”
- このアプリは、英語、フランス語、アラビア語、スペイン語をサポートします。
ステップ1：UserLanguage Qodlysourceによる言語選択
言語選択を実装する場合、アプリケーションでサポートされているすべてのロケールをリストアップしたセレクトボックスが必要になることがよくあります。このためにカスタムQodlyソースを作成する代わりに、4D Qodly ProではUserLanguageと呼ばれるビルトインQodlyソースを提供し、この作業を効率化します。
UserLanguageQodlyソースは自動的に以下のことを行います：
-
を使用して、利用可能な言語をセレクトボックスに入力します。UserLanguage.supported
-
を介して選択された言語を追跡します。UserLanguage.selected
セレクトボックスにUserLanguage.supported をバインドするだけです。結果は？エンドユーザーは実行時に言語を切り替えることができます。
ステップ 2: ロケールの作成
言語選択のためにこのQodlyソースをフル活用する前に、まずアプリケーションがサポートするロケールを定義する必要があります。
ロケールとは？
ロケールとは、アプリがユーザーにコンテンツを表示する方法を決定する、特定の言語と地域の設定を表します。
ロケールの作成方法
アプリのロケールを管理するために、Qodly Studioのエクスプローラーに新しいローカライゼーションセクションが追加されました。
最初のロケールを追加するには、ローカリゼーションセクションの新規ロケール追加ボタンをクリックするだけです。
クリックするとドロップダウンメニューが表示されますので、追加したいロケールを選択してください。
ステップ 3: QODLYページを編集しながらローカライズする
4D Qodly Proでは、ヘッダーパネルにロケール切り替えコントロールがあります。これにより、編集モードでQodlyページをプレビューしたり、直接翻訳することができます。
一度ロケールを選択すれば
-
テキスト、画像、レイアウトの編集が可能です。
-
視覚的な変更（フォントサイズ、配置、コンテナサイズなど）は、アクティブなロケールにのみ適用されます。
-
画像やアセットは、ターゲット地域に応じて入れ替えることができます。
つまり、Qodlyでのローカライゼーションは文字列だけではありません。
アラビア語やヘブライ語など、右から左へのレイアウトを必要とする言語に役立ちます。
✅翻訳が長かったり、異なるフォーマットが必要な言語に最適です。
💡 ローカライゼーションは状態ともシームレスに連動します – つまり、ローカライズされた変更は、ページで定義された状態のバリエーションと一緒に適用されます。
ステップ4：よく使う翻訳をキーで再利用する
翻訳された文章が複数のページやコンポーネントにまたがって表示される場合、それを翻訳キーとして保存することができます。
翻訳キーとは?
翻訳キーは、アプリケーション内の多言語コンテンツを管理するために使用される一意の識別子です。すべてのコンポーネントに翻訳されたテキストを手入力する代わりに、キーをコンポーネントにバインドします。各キーは、サポートされているすべての言語のテキストのバージョンを保存し、アプリケーションをクリーンで一貫性のある、メンテナンスしやすい状態に保ちます。キーのテキストを更新すると、そのキーが使用されている場所であればどこでも自動的に反映されます。
今回の使用例では、textコンポーネントにバインドされた翻訳キー“key1“を使用します。
サポートされている4つの言語での表示は以下の通りです：
英語：このアプリケーションは複数の言語に対応しています。設定メニューからいつでも言語を切り替えることができます。
フランス語：このアプリケーションは複数の言語でご利用いただけます。設定メニューからお好きな言語にいつでも変更できます。
アラビア語: هذا التطبيق متاح بعدة لغات.يمكنك تغيير لغتك المفضلة في أي وقت من خلال قائمة الإعدادات.
スペイン語：このアプリケーションは様々な言語に対応しています。設定メニューからお好きな言語にいつでも変更できます。
アプリケーション内で“key1“が使用されている場合、Qodlyは自動的に選択されたロケールに基づいた正しいバージョンを表示します。効率的で信頼性が高く、多言語でアプリを拡張するのに理想的です。
翻訳キーの作成とバインド方法
ロケールが選択されていなければ、テキストコンポーネントのラベルをダブルクリックすることで、最初の翻訳キーを作成し、バインドすることができます。他のコンポーネントの場合は、プロパティパネルで同じことができます。
また、Localizationセクションでキーを管理することもできます。このセクションでは、すべてのキーとその翻訳が一箇所に表示され、簡単に表示・編集することができます。
どちらの方法でも、アプリの成長に合わせてローカライズを整理しておくことができます。
アイデアローカライゼーションはテキストを翻訳するだけではありません。アラビア語やクルド語などの言語では、アプリが自然でユーザーフレンドリーに感じられるように、テキストの方向を左から右へ、右から左へと切り替えるなど、レイアウトを調整する必要もあります。
ステップ5：翻訳のインポートとエクスポート
すべての翻訳キーと値をJSONまたはCSV形式でダウンロードできます。
これにより、以下のことが可能になります：
-
コンテンツを外部に翻訳する（AIや翻訳サービスを使用してもよい）
-
翻訳チームと共有
-
ワンクリックでQodlyに再アップロード
これは、数十のロケールがある大規模なプロジェクトで特に役立ちます。
ボーナスヒント：ユーザーの言語設定を保存する
サーバーサイドのパーソナライズ（エラーメッセージやデータベースからのローカライズされたコンテンツなど）のために、ユーザーの希望する言語をSessionオブジェクトに保存することができます。
これは、Qodlyページ自体に存在しないデータであっても、クライアントとサーバーの両方で一貫したエクスペリエンスを維持するのに役立ちます。
UIに表示されるもの
アプリをプレビューすると、セレクトボックスを使用して言語を切り替えると、テキストが即座に更新される様子がわかります。ユーザーが選択したロケールがリアルタイムで反映され、スムーズな体験ができます。
しかし、ユーザーが手動で言語を選択しなかった場合はどうなるでしょうか？
そこで、4D Qodly Proが舞台裏でスマートな処理を行います。あなたのアプリが常に最も適切な言語でコンテンツを表示するように、レイヤー戦略に従っています：
- セッション保存言語：セッション保存言語：ユーザーが以前に言語を選択した場合、Qodlyはそれを記憶します。ユーザーが選択した言語はセッションに保存され、次回アプリを開いた時に自動的に適用されます。
- ブラウザ言語検出：ユーザーの初回訪問時、保存された設定がない場合、Qodlyはブラウザのデフォルト言語をチェックします。その言語がサポートされているロケールのいずれかと一致する場合、その言語が自動的に選択されます。
- プライマリー・ロケール・フォールバックセッションやブラウザに一致するものがない場合、Qodlyはローカライゼーションセクションで定義されたプライマリーロケールにデフォルト設定されます。
そのため、ユーザーが積極的に言語を選択してもしなくても、あなたのアプリは常に自然で親しみやすく、すぐに使える方法で表示されます。
最後に
グローバルユーザーは後回しではなく、次のチャンスです。ローカライゼーションを早期に統合することで、アプリを翻訳するだけでなく、どこに行ってもネイティブだと感じられる製品をデザインすることができます。
第一印象が重要な世界では、ユーザーの言語を話すことは贅沢なことではありません。そして、4D Qodly Proがあれば、明瞭で、効率的で、自信を持って、その標準を満たすことができます。
ローカライズのベストタイミング？ユーザーから要求される前です。