kyeongmin
beb5fd0c61
- 10단계 변환 프로세스 (PROCESS.md) - 수학 공식 레퍼런스 (MATH.md, gradient_math.py) - CSS 보정 규칙 R1~R16 (RULES.md) - 작업 규율 7개 규칙 (PROCESS-CONTROL.md) - 8개 Figma 프레임 1:1 HTML 변환물 (block-tests/) - 8개 Jinja2 템플릿 staging (templates_staging/) - 변환 완료 도서관 + 디자인 인사이트 (blocks_index.md) - 사용법 가이드 (README.md) Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
105 lines
5.8 KiB
Markdown
105 lines
5.8 KiB
Markdown
# Frame 1171281191 — BIM 3역할(발주자/시공자/설계자) 목표 카드
|
||
|
||
> 원본: 2600.998 × 1927.004 px
|
||
> Scale: × 0.49213 → 1280 × 948.5 px
|
||
> Node ID: 45:16 (Figma)
|
||
> 패턴 ID (잠정): `cards-3col-persona`
|
||
> 슬라이드 컨테이너: **1280 × 949** (16:9 초과. design_agent 본체 이전 시 재배치 필요)
|
||
|
||
## 계층 경로
|
||
|
||
```
|
||
Frame 45:16 "Frame 1171281191" (2600.998 × 1927.004)
|
||
└─ 17:1450 "오른쪽" (0,0) full size
|
||
├─ 17:1451 Frame 1171276940 (0, 1204.82) 2600.998 × 677.02 — bottom area placeholder
|
||
├─ 17:1452 Group 1171276418 (43, 82.30) 2508 × 1844.70
|
||
│ └─ 17:1453 Group 1171276417
|
||
│ ├─ 17:1454 image 2977 (43, 82.30) 833 × 1844.70 ← 좌 컬럼 BG
|
||
│ ├─ 17:1455 image 2978 (880, 82.30) 834 × 1844.70 ← 중 컬럼 BG (동일 src 2977)
|
||
│ └─ 17:1456 image 2979 (1718, 82.30) 833 × 1844.70 ← 우 컬럼 BG (동일 src 2977)
|
||
│ ├─ 17:1457 image 2986 (114.01, 180.66) 691 × 1510.49 opacity 0.80 ← 좌 오버레이
|
||
│ ├─ 17:1458 image 2987 (948.01, 180.66) 692 × 1053.83 opacity 0.80 ← 중 오버레이
|
||
│ ├─ 17:1459 image 2988 (1783.01, 180.66) 691 × 1128.10 opacity 0.80 ← 우 오버레이
|
||
│ └─ 17:1460 image 3574 (108, 1150.18) 697 × 700.55 r=49 opacity 0.70 ← 좌하 사진
|
||
├─ 17:1461 Group 1171276695 "시공자 뱃지" (1092.88, 0) 396.02 × 397.47
|
||
│ ├─ 17:1462 image 2984 outer (1092.88, 0) 396.02 × 397.47
|
||
│ ├─ 17:1463 image 2981 inner (1139.46, 51.84) 301.83 × 301.91
|
||
│ └─ 17:1464 TEXT "시공자 목표" center (1291.9, 256.94) 179.27 × 130.47
|
||
│ #445a2f Bold, "시공자" 65px / "목표" 50px
|
||
├─ 17:1465 Group 1171276696 "설계자 뱃지" (1945.7, 0) 396.02 × 397.47
|
||
│ ├─ 17:1466 image 2985 outer
|
||
│ ├─ 17:1467 image 2982 inner
|
||
│ └─ 17:1468 TEXT "설계자 목표" #743002, 65/50px
|
||
├─ 17:1469 Group 1171276694 "발주자 뱃지" (265.38, 0) 396.02 × 397.47
|
||
│ ├─ 17:1470 image 2983 outer
|
||
│ ├─ 17:1471 image 2980 inner
|
||
│ └─ 17:1472 TEXT "발주자 목표" #285b4a, 65/50px
|
||
├─ 17:1473 TEXT "발주자 본문" (171.18, 421.58) 643.4 × 750.34
|
||
│ font 40 Medium black, leading 85, 7줄
|
||
├─ 17:1474 TEXT "시공자 본문" (1004.79, 417.52) 624.3 × 650.61
|
||
│ font 40 Medium, mixed leading 50/85, 12+줄 (긴 본문)
|
||
├─ 17:1475 TEXT "설계자 본문" (1842.01, 417.52) 664.7 × 750.34
|
||
│ font 40 Medium, mixed, 8+줄
|
||
├─ 17:1476 image 3571 (948, 1150.18) 697 × 700.55 r=50 opacity 0.70 ← 중하 사진
|
||
├─ 17:1477 Group "체크박스 우 6개" (1794.78, 446.04~919.74)
|
||
│ 6개 아이콘 32.41×32.53 image 3005 (체크박스)
|
||
│ y: 446, 526, 661, 746, 833, 919
|
||
├─ 17:1484 Group "체크박스 중 7개" (961.20, 447.04~1056.84)
|
||
│ 7개 아이콘. y: 447, 530, 609, 744, 832, 969, 1056
|
||
├─ 17:1492 Group "체크박스 좌 7개" (127.63, 449.63~963.46)
|
||
│ 7개 아이콘. y: 449, 535, 620, 704, 791, 877, 963
|
||
└─ 17:1500 image 3572 (1781, 1150.18) 697 × 700.55 r=50 opacity 0.70 ← 우하 사진
|
||
```
|
||
|
||
## 이상 탐지 결과
|
||
|
||
| 검사 | 결과 |
|
||
|------|------|
|
||
| 회전 단일문자 | 없음 |
|
||
| 좁은 박스 세로 텍스트 | 없음 |
|
||
| 중복 노드 | image 2977이 image 2978/2979로 3번 사용됨 — 의도된 재사용 (각 컬럼의 BG가 동일 텍스처). image 3005는 20개 인스턴스 모두 동일 src — 체크박스 아이콘 |
|
||
| Vector metadata 회전 불일치 | 없음 (vector 노드 없음) |
|
||
| 텍스트 leading 혼합 | 17:1474 시공자 본문에서 leading 50/85/40 혼재 — Figma 원본의 line break 표현 의도 그대로 보존 |
|
||
| 색상 시스템 | 발주자 #285b4a (녹), 시공자 #445a2f (올리브), 설계자 #743002 (브라운). 각 컬럼 컬러 코드 |
|
||
|
||
## 패턴 분류
|
||
|
||
이 패턴은 기존 `cycle-3way-intersect`와 **다름**:
|
||
- cycle: 3원 교차 다이어그램 (관계/통합)
|
||
- cards-3col-persona: 3 stakeholder 세로 카드 + 본문 리스트 (병렬/대조)
|
||
|
||
기존 legacy `prerequisites-3col`와도 **다름**:
|
||
- legacy: 색상바 + 한자 라벨 + 키워드 카드
|
||
- cards-3col-persona: 사진 배경 + 원형 뱃지 + 긴 본문 리스트
|
||
|
||
→ **새 패턴 등록.** 패턴 카탈로그에 `cards-3col-persona` 추가, 등장 횟수 1.
|
||
|
||
## 변형 가능 축
|
||
|
||
- **columns[N]**: 현재 3, 가능 2~4
|
||
- 각 column: bg_image, overlay_image, badge_outer, badge_inner, badge_label, role_color, body_text, checkbox_count, bottom_photo
|
||
- **role_colors[3]**: 현재 #285b4a / #445a2f / #743002 (역할별)
|
||
- **body_text_lines[]**: 각 컬럼당 6~10줄
|
||
- **checkbox_count[col]**: 현재 7/7/6, 가능 5~10
|
||
- **bottom_photos[N]**: 현재 3 (둥근 모서리 사진), 가능 0~N
|
||
- **badge_label_2lines**: "역할이름"/"목표" 형식 (변형 가능)
|
||
|
||
## 자산 매핑
|
||
|
||
| hash | 의미 라벨 | 사용처 |
|
||
|------|---------|------|
|
||
| 4a17cd1d... | column_bg_texture | 3컬럼 BG (재사용 ×3) |
|
||
| e837f870... | overlay_left | 좌 컬럼 컬러 오버레이 |
|
||
| 755384bd... | overlay_mid | 중 컬럼 컬러 오버레이 |
|
||
| 5577732e... | overlay_right | 우 컬럼 컬러 오버레이 |
|
||
| 77f31997... | badge_outer_owner | 발주자 outer circle |
|
||
| e64c967d... | badge_inner_owner | 발주자 inner circle |
|
||
| 1550ec75... | badge_outer_builder | 시공자 outer circle |
|
||
| 85beaf9d... | badge_inner_builder | 시공자 inner circle |
|
||
| 9ac089fa... | badge_outer_designer | 설계자 outer circle |
|
||
| 4b534ccf... | badge_inner_designer | 설계자 inner circle |
|
||
| 6896d5c2... | checkbox_icon | 체크박스 (재사용 ×20) |
|
||
| d2c070f2... | bottom_photo_left | 하단 좌 사진 |
|
||
| 2a6a58e7... | bottom_photo_mid | 하단 중 사진 |
|
||
| 39113493... | bottom_photo_right | 하단 우 사진 |
|