[
  {
    "slug":"designing-for-depth","status":"published","section":{"en":"Design systems","ja":"デザインシステム"},
    "datePublished":"2026-07-18","dateModified":"2026-07-20","author":{"en":"Sample Author","ja":"サンプル著者"},
    "title":{"en":"Designing for depth without adding visual noise","ja":"視覚的ノイズを増やさずに奥行きを設計する"},
    "excerpt":{"en":"A practical framework for making digital surfaces feel more substantial through hierarchy, material and restrained motion.","ja":"階層、素材感、抑制された動きによってデジタル表面に重みを与える実践的な枠組みです。"},
    "image":"assets/img/posts/post-depth.png","imageAlt":{"en":"Abstract layered monochrome interface panels","ja":"抽象的に重なったモノクロのインターフェースパネル"},
    "focalPoint":{"x":0.63,"y":0.48},"featured":true,
    "body":{"en":[
      {"type":"lead","text":"Premium visual quality is rarely the result of more decoration. It is usually the result of clearer relationships between surfaces, states and user intent."},
      {"type":"heading","text":"Start with hierarchy"},
      {"type":"paragraph","text":"A strong interface makes background, working surface and active foreground immediately distinguishable. Use luminance, border emphasis, inner highlights and shadow softness as a coordinated system rather than isolated effects."},
      {"type":"paragraph","text":"The active element should receive the strongest elevation. Static information remains quieter, allowing attention to move naturally without animated distraction."},
      {"type":"heading","text":"Connect motion to meaning"},
      {"type":"paragraph","text":"Small transitions can preserve spatial continuity when content changes. Motion should confirm a relationship, not delay access to information. Reduced-motion users must receive the same state change immediately."},
      {"type":"quote","text":"Depth becomes expensive-looking when it explains structure rather than advertising an effect."}
    ],"ja":[
      {"type":"lead","text":"高品質な視覚表現は、装飾の多さではなく、表面・状態・利用者の意図の関係が明確であることから生まれます。"},
      {"type":"heading","text":"階層から始める"},
      {"type":"paragraph","text":"優れたインターフェースは、背景、作業面、アクティブな前景を即座に区別できます。輝度、境界線、内側のハイライト、影の柔らかさを、個別の効果ではなく統合されたシステムとして使用します。"},
      {"type":"paragraph","text":"最も強い奥行きはアクティブ要素に与えます。静的情報を落ち着かせることで、不要なアニメーションなしに注意が自然に移動します。"},
      {"type":"heading","text":"動きを意味に結びつける"},
      {"type":"paragraph","text":"小さな遷移は、コンテンツ変更時の空間的な連続性を保ちます。動きは関係を確認するためのもので、情報へのアクセスを遅らせてはいけません。"},
      {"type":"quote","text":"奥行きは、効果を誇示するのではなく構造を説明するときに高級感を持ちます。"}
    ]}
  },
  {
    "slug":"building-a-useful-case-study","status":"published","section":{"en":"Case studies","ja":"ケーススタディ"},
    "datePublished":"2026-07-08","dateModified":"2026-07-08","author":{"en":"Sample Author","ja":"サンプル著者"},
    "title":{"en":"Building a useful case study from evidence, not decoration","ja":"装飾ではなく証拠から有用なケーススタディを作る"},
    "excerpt":{"en":"How to structure project context, decisions and outcomes so a reader can evaluate the work quickly and credibly.","ja":"読者が仕事を迅速かつ信頼性高く評価できるよう、背景、判断、成果を構造化する方法です。"},
    "image":"assets/img/posts/post-evidence.png","imageAlt":{"en":"Abstract editorial document and evidence markers","ja":"抽象的な編集文書と証拠マーカー"},
    "focalPoint":{"x":0.42,"y":0.50},"featured":false,
    "body":{"en":[
      {"type":"lead","text":"A case study should help a prospective client understand the problem, the quality of the decisions and the relevance of the result."},
      {"type":"heading","text":"State the context precisely"},
      {"type":"paragraph","text":"Avoid generic claims. Explain the organisation, audience, constraint and reason for change. A small amount of verified context is more persuasive than a long list of services."},
      {"type":"heading","text":"Show decisions, not just deliverables"},
      {"type":"paragraph","text":"Screens and photographs become meaningful when the reader understands why a particular structure, interaction or message was chosen."},
      {"type":"heading","text":"Separate proof from promotion"},
      {"type":"paragraph","text":"Use verified metrics, attributed testimony and clearly labelled sample data. Credibility is damaged when placeholder claims appear to be real results."}
    ],"ja":[
      {"type":"lead","text":"ケーススタディは、見込み顧客が課題、判断の質、成果の関連性を理解するためのものです。"},
      {"type":"heading","text":"背景を正確に示す"},
      {"type":"paragraph","text":"一般的な主張を避け、組織、対象者、制約、変更理由を説明します。検証された少量の背景情報は、長いサービス一覧より説得力があります。"},
      {"type":"heading","text":"成果物だけでなく判断を示す"},
      {"type":"paragraph","text":"特定の構造、操作、メッセージを選んだ理由が分かると、画面や写真に意味が生まれます。"},
      {"type":"heading","text":"実証と宣伝を分ける"},
      {"type":"paragraph","text":"検証済み指標、出典付き証言、明確に表示されたサンプルデータを使用します。プレースホルダーが実績に見えると信頼性が損なわれます。"}
    ]}
  },
  {
    "slug":"offline-localisation-that-scales","status":"published","section":{"en":"Localisation","ja":"ローカライゼーション"},
    "datePublished":"2026-06-27","dateModified":"2026-07-02","author":{"en":"Sample Author","ja":"サンプル著者"},
    "title":{"en":"Offline localisation that scales beyond translated labels","ja":"ラベル翻訳を超えて拡張できるオフライン多言語化"},
    "excerpt":{"en":"A robust language system includes dates, validation, metadata, typography, routes and persistent interface state.","ja":"堅牢な言語システムには、日付、検証、メタデータ、書体、ルート、永続的なUI状態が含まれます。"},
    "image":"assets/img/posts/post-localisation.png","imageAlt":{"en":"Abstract bilingual interface with English and Japanese type","ja":"英語と日本語の文字を含む抽象的な二言語インターフェース"},
    "focalPoint":{"x":0.54,"y":0.44},"featured":false,
    "body":{"en":[
      {"type":"lead","text":"A language toggle is credible only when the entire interface behaves correctly in the selected locale."},
      {"type":"heading","text":"Translate states, not only labels"},
      {"type":"paragraph","text":"Errors, empty states, share feedback, print labels, dialog titles and assistive text all belong to the interface. Missing these strings creates a visibly incomplete product."},
      {"type":"heading","text":"Use locale-aware data"},
      {"type":"paragraph","text":"Dates and number formats should be produced through the platform internationalisation APIs. Do not hard-code English date order into translated content."},
      {"type":"heading","text":"Test geometry"},
      {"type":"paragraph","text":"Japanese and English have different line-breaking behaviour. The design should retain the same component hierarchy without clipping, tiny text or unpredictable height changes."}
    ],"ja":[
      {"type":"lead","text":"言語切替は、選択したロケールでインターフェース全体が正しく動作して初めて信頼できます。"},
      {"type":"heading","text":"ラベルだけでなく状態を翻訳する"},
      {"type":"paragraph","text":"エラー、空状態、共有結果、印刷ラベル、ダイアログ見出し、支援技術用テキストもUIの一部です。これらが欠けると製品は未完成に見えます。"},
      {"type":"heading","text":"ロケール対応データを使う"},
      {"type":"paragraph","text":"日付と数値はプラットフォームの国際化APIで生成します。英語の日付順序を翻訳コンテンツに固定してはいけません。"},
      {"type":"heading","text":"形状をテストする"},
      {"type":"paragraph","text":"日本語と英語では改行挙動が異なります。クリッピングや極端に小さい文字、不安定な高さ変化なしに同じ階層を維持する必要があります。"}
    ]}
  }
]
