---
title: "📋 26-05-30_달록_핸드오프 — 스튜디오 확장 완료 + 작업표 업데이트"
notion_id: "37022962086881e4b0f6c0441a5541c8"
notion_url: "https://app.notion.com/p/37022962086881e4b0f6c0441a5541c8"
category: "handoff"
parent: "핸드오프 (Claude.ai 컨텍스트 공유용)"
updated: "2026-05-30"
priority: "Medium"
purpose: "스튜디오 확장(UI 구조 탐색기+AI 작업지시+157 카탈로그) PR#11~#16 종결 + 디자인 이식 롤백 우려 해소 + 작업진행예정 표 전면 갱신"
---

> 본 페이지는 2026-05-30 컨텍스트의 핸드오프다. 직전 스튜디오 확장 세션(PR #11~#16)을 종결하고, 사장님 확인 결과를 반영해 **작업진행예정 표(직전 §9)를 전면 갱신**한 것이 핵심이다. 다음 컨텍스트는 본 페이지를 먼저 읽고 §4 갱신표부터 사장님에게 출력한다.
> 직전 핸드오프: 📋 26-05-28_2-달록_핸드오프 (§9 22항목 표 진본)
---
## 1. 이번 컨텍스트 요약
- **스튜디오 확장 세션 종결**: 마스터 전용 `/studio` 에 (1) 토큰 편집 모드 + (2) UI 구조 탐색기 + AI 작업지시 생성기 + 157개 UI 요소 카탈로그 신설. PR #11·#12·#13·#15·#16 (+ #14 세션 대화 raw docs) 모두 main 머지. 빌드 재검증 ✅(436 modules · 3.21s).
- **인라인→CSS 전면 마이그레이션** 동반 수행(PR #11, 커밋 `12a86fc`): CoachNotes·History·Settings·HistoryExcel 등 약 1,584곳 인라인 스타일을 CSS 클래스/디자인 토큰으로 전환.
- **사장님 확인 2건 접수**: ① 1-1~1-4 (SAFEZONE fix v3·소셜 스키마·avatars 버킷·3계정 교차검증) **모두 실행 완료 + 테스트 종결**. ② 디자인 이식 롤백 우려 제기 → CC 코드 검증으로 해소(아래 §2).
- **본 컨텍스트 산출**: 작업진행예정 표 갱신(§4) + 본 핸드오프.
---
## 2. 사장님 우려 검증 — 디자인 이식 롤백 위험 (결론: 위험 없음 · 사실상 종결)
**사장님 우려:** "스튜디오 만들며 인라인→CSS 대작업을 했는데, 예정된 디자인 이식(5-1~5-3)을 진행하면 애써 변환한 CSS가 다시 인라인으로 롤백되는 것 아니냐."
**CC 코드 검증 결과 — 기우. 구조적으로 롤백 불가:**
| 페이지 | CSS 클래스화 완료율 | 남은 인라인의 정체 |
| --- | --- | --- |
| CoachNotes | 97.9% | 동적 색상·진행바 너비(런타임 계산값) |
| History | 90.3% | 신발별·런타입별·테마별 색상 계산값 |
| Settings | 98.4% | 칩 색·텍스트영역 높이 동적값 |

- 남은 인라인은 전부 **런타임 계산값**(예: 신발마다 다른 색)이라 애초에 CSS 클래스로 옮길 수 없는, 인라인이 정답인 것들이다.
- 각 파일 헤더에 `2026.05.30 마이그레이션: ... 동적값만 인라인 유지` 명시.
- **결정적 사실**: 직전 §9 표의 5-1~5-3 작업 내용("인라인→`.callout`·`.modal-mock`·`.row` 전환")이 **PR #11에서 이미 수행됨**. 공통 클래스(`.callout` `.modal-mock` `.toggle-group` `.feed-card` `.row` `.btn` `.checkbox-row`)도 index.css 에 모두 정의 완료.
- **🧠 비개발 해설:** 옮길 수 있는 스타일은 이미 다 옮겼고, 남은 건 "신발마다 색이 달라지는" 식의 계산값뿐이라 손댈 게 없어요. 디자인 이식은 사실상 끝났습니다.
- **조치:** 5-1~5-3 = **마이그레이션 흡수 종결**. 잔여는 "가시성·콜아웃 강화" 순수 폴리싱뿐이며 필수 아님(선택 백로그).
---
## 3. 스튜디오 추가 디벨롭 판단 (결론: 강추 없음 · 1건만 약추천)
핵심 기능(토큰 편집 + UI 구조 탐색 + AI 초안 + 157개 매핑)은 PR #13~#16 polish 까지 완료되어 **충분히 완성**. "단순함이 먼저" 원칙상 과잉기능 회피.
| 후보 | 판정 | 근거 |
| --- | --- | --- |
| 토큰 세션 저장(localStorage) | 🟡 약추천 | 현재 스튜디오에서 색·폰트 편집 중 새로고침하면 편집분 소실(메모리 전용, Studio.tsx:102). 사장님 직접 사용 도구라 실사용 불편. 구현 1~2h, 비파괴 |
| 카탈로그 자동 갱신 스크립트 | ⚪ 보류 | 페이지 구조 변경 잦아지면 검토 |
| AI 작업지시 품질 강화 | ⚪ 보류 | Claude API 비용 수용 후 검토 |
| Undo/Redo · 프로덕션 자동배포 · 다중사용자 협업 | ❌ 비추 | 복잡도 대비 가치 낮음 / 설계의도(마스터 보호) 위반 |

→ **S-1 (토큰 세션 저장)** 만 백로그에 신설(사장님 채택 여부 결정 대기).
---
## 4. ⭐ 갱신된 작업진행예정 표 (직전 §9 전면 대체 — 다음 컨텍스트가 그대로 출력)
> **종결 처리분** (직전 §9에서 완료되어 표에서 제외):
> - 1-1 SAFEZONE fix v3 SQL 실행 ✅ · 1-2 소셜 스키마 SQL ✅ · 1-3 avatars 버킷 생성 ✅ · 1-4 3계정 교차검증 ✅ (사장님 실행·테스트 종결)
> - 5-1 CoachNotes · 5-2 History · 5-3 Settings 디자인 이식 ✅ (PR #11 인라인→CSS 마이그레이션 흡수 종결)
> - 🆕 스튜디오 신설·확장 ✅ (PR #11·#12·#13·#15·#16 main 머지)

**잔여 작업표:**
| # | 그룹 | 작업명 | 핵심 내용 | 작업자 | 의사결정 필요 |
| --- | --- | --- | --- | --- | --- |
| 2-1 | 🛡️ OAuth | OAuth 콘솔 마무리 | 카카오·네이버 키 발급 + Supabase/CF 환경변수 등록 | 사장님 (진행중) | 카카오 비즈앱 신청 시점 |
| 2-2 | 🛡️ OAuth | CF Workers `auth-proxy` 신설 | `/naver/exchange` 엔드포인트 + JWT 반환 | CC | — (네이버 키 발급 후 착수) |
| 3-1 | 📜 약관 | 약관 3종 Claude 표준 초안 | 개인정보·이용약관·건강정보 동의 초안 → 노션 발행 | CC | 변호사 자문 진입(v1 D-7)·비용 |
| 3-2 | 📜 약관 | 약관 동의 UI 통합 | 가입 동선 체크박스 + 미동의 차단 | CC | 3-1 확정 후 |
| 4-1 | 🌐 소셜 후속 | 소셜 디테일 디벨롭 | 운동기록 첨부 모달 · 친구추가 검토 | CC | 친구추가 도입 여부 |
| 5-P | 🎨 디자인 | (선택) 순수 디자인 폴리싱 | 콜아웃/가시성 강화 — 이식 자체는 종결, 미적 개선만 | CC | 진행 여부 (필수 아님) |
| S-1 | 🧩 스튜디오 | (선택) 토큰 세션 저장 | localStorage 저장 + 세션 복원 UI · 비파괴 | CC | 채택 여부 (약추천) |
| 6-1 | 📚 문서 | MCP브라우징 보고서 v4 | Playwright 실배포 재검증 · 스튜디오·마이그레이션 반영 | CC | — |
| 6-2 | 📚 문서 | 기능설명서·UI시각화 최신화 | 셀모드·SAFEZONE·소셜·OAuth·스튜디오·디자인 reference 갱신 | CC | — |
| 7-1 | ⚙️ 후속기능 | 셀기능 Phase 5 (근력 셀모드) | 1행=1세트 · 자동 볼륨·1RM | CC | 옵션 B 확정 여부 |
| 7-2 | ⚙️ 후속기능 | RunRoutine 확장 | 루틴별 마일리지 진척률 카드 | CC | — |
| 8-1 | 🚀 v1 장기 | 테스트/운영 환경 분리 | Supabase·Workers 분리 · 브랜치 환경 | 사장님·CC | production 도메인 구매 |
| 8-2 | 🚀 v1 장기 | PACELINK 앱화 | Capacitor · Android · Health Connect | CC·사장님 | 앱 출시 시점·비용 |
| 8-3 | 🚀 v1 장기 | 수익화 준비 | Freemium · 결제 PG · 환불정책 | 사장님 | Freemium 한도 |
| 9-1 | 📊 어드민 | J-1 이용패턴 분석 | 세션·리텐션 이벤트 수집 축 | CC | — |
| 9-2 | 📊 어드민 | J-2 커스텀 지표 + AI 브리핑 | 지표 조합 + 자동 리포트 | CC | — |
| 9-3 | 📊 어드민 ⭐ | J-3 피드백+운영 UI+service_role+데모시드 | 인앱 피드백 · 마스터 운영 UI · 데모 6개월 CRON | CC·사장님 | service_role 범위·데모 시나리오 |
---
## 5. 다음 컨텍스트 첫 액션
| 순서 | 작업 | 의존 |
| --- | --- | --- |
| 1 | 본 §4 갱신표를 사장님에게 출력 + 진행 작업 결정 받기 | — |
| 2 | CC 단독 즉시 착수 가능: 2-2(네이버 키 발급 후) / 3-1 약관 초안 / 6-2 문서 최신화 / S-1 토큰 세션저장(채택 시) | 사장님 선택 |
| 3 | 사장님 결정 대기 항목: 5-P 폴리싱 진행 여부 · S-1 채택 여부 · 4-1 친구추가 도입 여부 | 사장님 |
---
## 6. 환경·상태
| 항목 | 값 |
| --- | --- |
| 작업 경로 | `D:\dallog\dallog_git` |
| 최근 커밋 | `a11c4e5` (PR #16 — 스튜디오 모바일 프리뷰 정렬·하이라이트 보정) |
| 빌드 | ✅ `npm run build` 통과 |
| origin/main | sync OK (PR #11~#16 머지 반영) |
| 마이그레이션 | CoachNotes 97.9% · History 90.3% · Settings 98.4% CSS 클래스화 (잔여=동적값 인라인 필수분) |
---
## 7. 참조
- 직전 핸드오프: 📋 26-05-28_2-달록_핸드오프 (§9 진본 22항목 표 — 본 §4 로 갱신 대체)
- 스튜디오 세션 raw: 🧩 260530-스튜디오-UI매핑-프롬프트모드 + 레포 `docs/sessions/260530-스튜디오-UI매핑-프롬프트모드_대화raw.md`
- 신규/확장 파일: `src/lib/uiCatalog.ts` · `src/lib/uiCatalog.generated.ts` · `src/components/studio/UiExplorer.tsx` · `src/pages/Studio.tsx` · `src/pages/studio.css`
- 배포: [https://dallog.pages.dev](https://dallog.pages.dev) (테스트 mster / qwer1234)