Lab 3.1: Variable Symmetry & Syntax Inspection
Act as a localization engineer performing automated and visual QA on dynamic string assets.
Objective
In this hands-on lab, you will act as a localization engineer performing automated and visual QA on dynamic string assets. You will identify and fix broken string concatenation traps, resolve variable naming mismatches across languages, and reorder positional placeholders to conform to target language grammar without breaking runtime variable mapping.
Required Setup & Prerequisites
Editor: Visual Studio Code installed.
Working Directory: Open your
loc_labworking directory in VS Code.
Step-by-Step Instructions
Step 1: Create the Broken Multilingual Assets
Let's create two files: a source English file (en_source.json) and a broken Japanese target file (ja_target.json) that contains string concatenation errors and variable symmetry defects.
Open VS Code and navigate to
assets/loc/software/.Create
en_source.jsonand paste:JSON
json{ "welcome_msg": "Welcome back, {username}!", "item_count": "Page {0} of {1}", "transfer_status": "Transferred {amount} to {recipient} successfully." }In the same folder, create
ja_target.jsonand paste the corrupted translation asset:JSON
json{ "welcome_msg": "お帰りなさい、{userName}様!", "item_count": "{0} ページ / 全 {1} ページ", "transfer_status": "{recipient} へ {amt} の送信が完了しました。" }Save both files (
Cmd + Son macOS /Ctrl + Son Windows).
Step 2: Open Split View & Inspect Variable Mismatches
In localization pipelines, variable names act as code identifiers. If a translator changes {username} to {userName} or {amount} to {amt}, the software runtime will fail to replace the placeholder, displaying raw code tags to end users.
Open
en_source.jsonin VS Code.Split your editor view to inspect source and target side-by-side:
macOS: Press
Cmd + \Windows: Press
Ctrl + \
In the new right-hand pane, open
ja_target.json.Inspect line 2 (
welcome_msg):Source:
{username}(all lowercase)Target:
{userName}(camelCase)Defect: Variable name mismatch! The runtime parser will fail to populate
{userName}.
Inspect line 4 (
transfer_status):Source:
{amount}Target:
{amt}Defect: Abbreviated variable name breaks runtime data binding.
Step 3: Reorder Positional Placeholders for Target Grammar
Examine line 3 (item_count):
English Source:
"Page {0} of {1}"(where{0}= current page,{1}= total pages)Japanese Target:
"{0} ページ / 全 {1} ページ"
In Japanese grammar, specifying the total page count before the current page number sounds significantly more natural in UI headers: "Out of {1} pages, page {0}" (全 {1} ページ中 {0} ページ).
If you swap unindexed placeholders like
%s/%s, variable values map to the wrong parameters.Because indexed placeholders (
{0},{1}) are used, you can safely swap their order in the string:JSON
json"item_count": "全 {1} ページ中 {0} ページ"Runtime result: If
{0}=1and{1}=10, the UI correctly renders"全 10 ページ中 1 ページ"without modifying backend application code.
Step 4: Remediate and Clean ja_target.json
Fix all variable symmetry and placeholder errors in ja_target.json:
Update line 2: Change
{userName}to match source{username}verbatim.Update line 3: Ensure positional placeholders
{0}and{1}are correctly formatted in natural Japanese word order.Update line 4: Change
{amt}to match source{amount}verbatim.
Your finalized ja_target.json should match this clean state:
JSON
json{ "welcome_msg": "お帰りなさい、{username}様!", "item_count": "全 {1} ページ中 {0} ページ", "transfer_status": "{recipient} へ {amount} の送信が完了しました。" }
Save the file as
ja_clean.json.
Self-Verification Checklist
Check your remediated asset against these technical parameters before proceeding:
[ ] Every placeholder name in
ja_clean.json({username},{amount},{recipient}) matchesen_source.jsonverbatim (case-sensitive).[ ] Positional placeholders (
{0},{1}) maintain valid brace syntax and index numbering.[ ] Side-by-side editor view (
Cmd + \/Ctrl + \) verifies 1:1 variable symmetry across keys.[ ] Asset is saved as valid JSON with
UTF-8encoding.
Ready to move on?
Mark this lesson complete when you’re ready.