---
id: 2026-10-07-top-stage
title: トップと /feature/mobile-app のステージ背景を、cream を使わずに作り直す
purpose: www トップ §2・§3 と /feature/mobile-app のステージ（UI モックを浮かせる地）。旧 hero-warm.webp は ivory のむらが焼き込まれていたため廃止
target: www
target_path: nanco_hp_2026 public/images/stages/stable/hero-glass.webp
status: 確定
lane: 通常
selector: 姉崎
decided_at: 2026-10-07
shipped_at: 2026-10-07
routes: []
---

# トップと /feature/mobile-app のステージ背景を、cream を使わずに作り直す

## お題

- 論点: UI モック（Web 画面・スマホ）が主役に映える、暖かみのある地。cream / beige / ivory は使わない（2026-10-07 廃止で統一）
- 掲載先と実寸: nanco_hp_2026 `app/page.tsx` のステージ（1280px 幅でおよそ 1200×675）、`/feature/mobile-app` のヒーロー下ステージ
- 当座: 2026-10-07 に既存の `hero-controlled`（落ち着いたセージ）へ差し替え（hp の cream 除去 PR）。本探索の結果で置き換える
- 固定するもの: 純白〜淡 teal の明度帯、文字なし、UI を邪魔しないノイズ量
- 振るもの（発散ラウンド）: 素材感（和紙・水彩・紙の繊維・グラデーションなしの面）、色の温度（セージ / ミント / 青緑グレー / mustard をごく少量）、むらの大きさ、明暗の向き

## ラウンド

### r01（発散）— 2026-10-07

- 振った軸: 素材感（和紙・水彩・リソ・ガッシュ・スタジオ・葉の影・すりガラス・紙・等高線・方眼・メッシュ・漆喰）× 色の温度（ミント〜セージ〜青緑グレー、1案だけ mustard の点）× 模様の大きさ × 光の向き。全部振った（発散）。詳細は `spec-r01.tsv`、プロンプト全文は `prompts-r01.txt`
- 経路: OpenAI Images API（gpt-image-2・1536×864・high）。原本12枚は Drive `visual-lab/2026-10-07-top-stage/originals/` に退避済み（md5 照合）
- 検品: 文字の焼き込みなし。cream の混入（暖色の画素）は a1 の 1.9% 以外ゼロ
  - r01-a3 — 検品不合格: 版ズレの縁に淡いピンクの点（NG 色）
  - r01-a1 — 注記: 左上の光だまりが生成り寄り。使うなら補正
- ボード: `board-r01.jpg`。全案を本番のトップページのステージ2か所（エクセル連携・帳票発行）に差し込んで撮った見え方を `context/` に（自動で撮れたので r01 から作った）
- 選ぶページ: `index.html`
- **選定（姉崎・2026-10-07）**: 残す = r01-a1（和紙）・r01-a2（水彩）・r01-a4（ガッシュのかすれ）・r01-a7（すりガラス）
  - 落とした案（好み・姉崎が残さなかった）: r01-a5 スタジオ / r01-a6 葉の影（司令役は推したが残さず）/ r01-a8 紙＋mustard の点 / r01-a9 等高線・r01-a10 方眼（司令役の所見: 白すぎて境目が消える）/ r01-a11 メッシュ（teal の光が UI の裏に隠れる）/ r01-a12 漆喰（灰色が沈む）
  - 落とした案（検品不合格）: r01-a3 リソ（縁に淡いピンク）

### r02（収束）— 2026-10-07

- 振った軸: **縁の模様の強さだけ**（控えめ / 中 / しっかり）。素材・色・構図は親の案のまま固定（姉崎が軸を選択）。和紙は左上の光だまりを補正する指示を追加
- 親 → 子: r01-a1 和紙 → r02-a1〜a3 ／ r01-a2 水彩 → r02-a4〜a6 ／ r01-a4 ガッシュ → r02-a7〜a9 ／ r01-a7 すりガラス → r02-a10〜a12（詳細は `spec-r02.tsv`、プロンプトは `prompts-r02.txt`）
- 経路: OpenAI Images API（gpt-image-2・1536×864・high）。原本12枚は Drive に退避済み（md5 照合、累計24件）
- 検品: 文字の焼き込みなし・cream の混入ゼロ（和紙の補正も効いた）。注記: 和紙の系統は強くするほど水彩のにじみ寄りになり、軸が少しずれた（r02-a2・a3）
- ボード: `board-r02.jpg`（累積ボード。各行の左端が親）。実ページへの差し込みは `context/`
- **選定（姉崎・2026-10-07）**: **r02-a12（すりガラス・しっかり）を採用**。ほかの r02 は好みで落とす

## 裁定

- 採用: **r02-a12**（親 r01-a7 すりガラス → 縁の模様の強さ「しっかり」）。姉崎・2026-10-07
- 理由: すりガラスの面が縁にしっかり出て、UI の後ろでも存在感がある（姉崎「いいね」）
- 採用先のパス: nanco_hp_2026 `public/images/stages/stable/hero-glass.webp`（stable ステージ `hero-glass`）。トップ4か所・/feature/mobile-app 3か所を差し替え（nanco-hp#154）
- 実寸の最終確認: `preview/`（トップのエクセル連携・帳票発行、mobile-app の「デザインを選ぶ」を 1280px と 390px で）
- 本番に出た日: **2026-10-07**（nanco-hp#155 を release にマージ、Production デプロイ `b26b2e2` 成功。www トップ 5か所・/feature/mobile-app 7か所で hero-glass を確認）
- 勝った軸値: 素材 = 半透明の面の重なり（すりガラス）／縁の模様は「しっかり」でないと UI に隠れて効かない