diff --git a/templates/phase_z2/catalog/frame_contracts.yaml b/templates/phase_z2/catalog/frame_contracts.yaml index 095becd..f1ab9d9 100644 --- a/templates/phase_z2/catalog/frame_contracts.yaml +++ b/templates/phase_z2/catalog/frame_contracts.yaml @@ -206,13 +206,13 @@ three_persona_benefits: - constructor - designer - # min_height_px : derive + confirm (Codex round 13 §2.2). + # min_height_px : derive + confirm (Codex round 13 §2.2 + round 24 asset 분류). # Figma frame 1927 px @ scale 0.49213 → 948 px adapted (full frame). # Phase Z slide-body ≤ 585 px → adaptive content fit. - # Content density (3 col × 7 bullets + badge) → F29 (345) class 보다 가벼움. - # Derived = 290 (between F13=230 and F29=345). confirm via smoke + sample run. + # Content density 2nd refinement : badge raster 70 + bullet body ~210 + photo strip 36 + padding 30 + # = 346 (F29 class). 안전 buffer 포함 = **320**. confirm via V2 MDX 02 validation. visual_hints: - min_height_px: 290 + min_height_px: 320 accepted_content_types: - text_block diff --git a/templates/phase_z2/families/three_persona_benefits.html b/templates/phase_z2/families/three_persona_benefits.html index 9d25c2b..8203247 100644 --- a/templates/phase_z2/families/three_persona_benefits.html +++ b/templates/phase_z2/families/three_persona_benefits.html @@ -7,46 +7,60 @@ Visual Provenance — figma_to_html_agent/blocks/1171281191/ (frame 14) Frame 14 = "주체별 기대효과" (cards-3col-persona, 2601×1927 px, scale 0.49213). 3 컬럼 카드 : 발주자 / 시공자 / 설계자 각 persona 별 *목표* + bullet 7 개 안팎. 본 partial 은 `figma_to_html_agent/blocks/1171281191/index.html` (184 lines) 을 -base 로 Phase Z 규약 (Jinja slot + token CSS + slide-base wrap + pure CSS) adapt. +base 로 Phase Z 규약 (Jinja slot + token CSS + slide-base wrap) adapt. -PROMOTED (Figma 색 / 디자인 의도 → CSS 로 보존) : - - 발주자 accent color : Figma TEXT #285b4a (dark green) — index.html L80 - - 시공자 accent color : Figma TEXT #445a2f (olive) — index.html L81 - - 설계자 accent color : Figma TEXT #743002 (red-brown) — index.html L82 - - 발주자 overlay tint : #d6e7c4 (opacity-80) — index.html L45 - - 시공자 overlay tint : #e1efe1 — index.html L46 - - 설계자 overlay tint : #d0c0ad — index.html L47 - - title gradient : #000 → #883700 (F13 zone-title 와 동일 family) - - badge 원형 의도 : index.html L60-69 (396×397 round badges) → CSS round - - bullet check 의도 : index.html L94 (32×32 check icon) → CSS ::before unicode - - section divider line : 카드 별 색 border 위계 (F13 pillar bar 답습) +본 commit (Track A 1/16 second refinement, F2 re-do post-Codex round 22 catch) : +asset-promotion policy = per-asset case-by-case (round 13 §2.3 + round 24 합의). +strict CSS-only over-generalization (first refinement `2fcd8bb`) 정정. -NOT PROMOTED (Figma 데코지만 MDX 무관 — memory rule `feedback_blocks_must_be_css.md` -+ 기존 F13/F29/F16 partials 의 strict CSS-only convention) : - - col_bg_texture.png (3 컬럼 BG 텍스처) — index.html L113-115 - - col-overlay raster (실제 데이터 = solid 색) — index.html L44-47 → CSS 단색 - - 하단 사진 (photo--left/mid/right) 3 개 — index.html L122-123, 177-178 - - 원형 뱃지 outer / inner image (badge-outer/inner) — index.html L62-69 → CSS round - - 체크 아이콘 image (bullet-icon img) — index.html L94-99 → CSS unicode +PROMOTED — RASTER (Phase Z `copy_assets()` 가 figma_to_html_agent/blocks/1171281191/ +assets/ → {run_dir}/assets/three_persona_benefits/ 복사) : + - col_bg_texture (4a17cd1d...png) — 3 컬럼 BG 텍스처. CSS noise/gradient 근사 보다 fidelity 보존. + - bottom photo client (d2c070f2...png) — 발주자 카드 하단 사진 + - bottom photo constructor (2a6a58e7...png) — 시공자 카드 하단 사진 + - bottom photo designer (39113493...png) — 설계자 카드 하단 사진 + - badge outer client (77f31997...png) — 발주자 round badge outer ring + - badge inner client (e64c967d...png) — 발주자 round badge inner disk + - badge outer constructor (1550ec75...png) + - badge inner constructor (85beaf9d...png) + - badge outer designer (9ac089fa...png) + - badge inner designer (4b534ccf...png) + → 10 raster (1 BG + 3 photos + 6 badge). Codex round 24 tightening : badge = + default promote (asset-capable path 검증). + +PROMOTED — CSS (Figma 색/디자인 의도 → CSS 으로 충분) : + - 발주자 accent color : Figma TEXT #285b4a (dark green) — index.html L80 + - 시공자 accent color : Figma TEXT #445a2f (olive) — index.html L81 + - 설계자 accent color : Figma TEXT #743002 (red-brown) — index.html L82 + - col-overlay tint : #d6e7c4 / #e1efe1 / #d0c0ad (opacity-80 — solid 색, CSS equivalent) + - title gradient : #000 → #883700 (F13 zone-title 와 동일 family) + - bullet check marker : ✓ unicode (실제 png 6896d5c2 와 동등) + +NOT PROMOTED (MDX 무관 + Figma 데코) : + - 한자/장식 텍스트 (Figma 안 deco) — index.html 에도 없음. N/A. ADAPTED : - - Figma 65/50/40px → token-fixed (zone-title 13 / sub-title 12 / body 11) - - 396×397 absolute-positioned round badge → flex card-header 안 CSS round - - Figma `zoom: 0.49213` + absolute positioning → Phase Z flex/grid (zone fit) - - 7 bullets vertical absolute layout → flex column 안 자동 spacing - - Figma `line-height: 85/50px` → token-fixed `--lh-body` + - Figma 65/50/40px → token-fixed (zone-title 13 / sub-title 12 / caption / body 11) + - Figma 396×397 absolute round badge → flex card-header 안 round image + - Figma `zoom: 0.49213` absolute positioning → Phase Z flex column (zone fit) + - Figma 7 bullets absolute layout → flex column gap auto spacing ───────────────────────────────────────────────────────────────────────────── -min_height_px derivation (Codex round 13 §2.2 — derive + confirm) : - Figma frame total height = 1927 px @ scale 0.49213 → 948 px adapted - But Phase Z slide-body height ≤ 585 px → adaptive content fit - Content density : 3 col × 7 bullets + badge → similar to F29 (345) class - Initial derived value = 290 (between F13=230 and F29=345) - → confirm via smoke + sample run before bulk activation (Track A calibration) +min_height_px derivation (round 13 §2.2 — derive + confirm) : + Figma frame 1927 px @ scale 0.49213 → 948 px adapted (full Figma fit). + Phase Z slide-body ≤ 585 px → adaptive content fit. + Content density (3 col × 7 bullets + badge + photo) → F29 (345) 보다 약간 ↑. + Derived = 320 (badge 30 + bullet body ~210 + photo strip ~50 + padding 30). + Confirm via smoke + V2 validation (MDX 02 sample run). ───────────────────────────────────────────────────────────────────────────── slots : title, personas[].{label, body, color_class} - color_class ∈ {client, constructor, designer} (role_order 따라) - body = list[{text:str, indent:int}] (parse_quadrant_item 출력) - - persona suffix "목표" = frame 의 visual 언어 (slot 미사용, partial 내부 노출) + - persona suffix "목표" = frame 의 visual 언어 (slot 미사용, partial 노출) +───────────────────────────────────────────────────────────────────────────── +Asset path runtime resolution : + Phase Z `copy_assets(template_id, run_dir)` (phase_z2_pipeline.py:746) copies + figma_to_html_agent/blocks/1171281191/assets/ → {run_dir}/assets/three_persona_benefits/ + → partial 의 src="assets/three_persona_benefits/.png" 가 runtime 에서 resolve. #}
@@ -159,15 +207,41 @@ slots : title, personas[].{label, body, color_class}
{% for persona in slot_payload.personas %}
+ {# badge — raster outer/inner + CSS text overlay #}
- {{ persona.label | safe }} - 목표 + {% if persona.color_class == "client" %} + + + {% elif persona.color_class == "constructor" %} + + + {% elif persona.color_class == "designer" %} + + + {% endif %} +
+ {{ persona.label | safe }} + 목표 +
+ + {# body — bullets with CSS check marker #}
{% if persona.body %} {% for line in persona.body %}
{{ line.text | safe }}
{% endfor %} {% endif %}
+ + {# bottom photo — per persona 실사 사진 #} +
+ {% if persona.color_class == "client" %} + + {% elif persona.color_class == "constructor" %} + + {% elif persona.color_class == "designer" %} + + {% endif %} +
{% endfor %}