- Brand Hero: 60vh, "현직 엔지니어가 만드는 두 가지" + 영상 blur 35%
- Two-up: Music 카드(영상+₩39,000~) / Custom Build 카드(정적 그라데이션+견적)
- Music 섹션: 기존 Features+Before/After+마퀴 그대로 보존
- Custom Build 섹션: 4 카드 (자동화는 외주 흡수) + 납품 5건 사례 + 견적 CTA
- Final CTA: "어느 쪽이든 시작하세요" + 두 분기 CTA
- 메인 진입점: Music → /music, Custom Build → /work
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- saju 페이지 + 입력 폼 + 결과 + AI 해석 + 사주 컴포넌트 모두 이동
- depth 변경 → 모든 import @/ 절대 경로
- 내부 Link href + router.push 새 URL로
- 카탈로그 spec(49만 코어 + 11 모듈)은 보류 — 무료 사주 분석만 마이그
- API route /api/saju/* 변경 없음
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- 메인 페이지 + layout
- 8 sample 페이지: bakery, corporate, dashboard, game, interior, portfolio, reading, shopping
- import @/ 절대 경로 변환
- 내부 Link href 새 URL로
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- portfolio 데이터 lib/freelance-portfolio 에서 import (양쪽 페이지 공유)
- depth 변경으로 모든 import @/ 절대 경로 변환
- 자동화 사례 그룹에 id="automation" — /work/freelance#automation 진입 가능
- 내부 Link href 새 URL로 변환
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
@/ 절대 경로 import + 내부 Link 새 URL로 변환.
원본 app/services/music/* 는 Phase D에서 삭제 (현재는 양쪽 존재 → redirect 우선).
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
/work 허브 + /work/freelance 양쪽 import. 단일 source of truth.
원본은 app/freelance/page.tsx — Phase B6에서 lib import로 교체.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
4월 27일 brainstorm 의 A-1 결정 + 5월 16일 spec 구현:
- Phase A (2): next.config redirects 10개 + lib/freelance-portfolio 추출
- Phase B (9): /music 허브 + /music/{packs,samples,studio} + /work 허브
+ /work/{freelance,website,saju,blog} + website samples 8개 + saju 7개
- Phase C (4): app/page.tsx 안 2 + TopNav 2개 LINKS + PublicShell footer
+ layout JSON-LD URL 갱신
- Phase D (2): 원본 25 파일 삭제 + build/lint/시각 회귀
핵심 안전 장치:
- Phase A/B/C/D 분할로 빌드 무중단 (원본 + 신규 양쪽 존재 기간 보호)
- push 시점은 Phase D 완료 후 (사용자 시각 회귀 후)
- 모든 task 마지막 step: git log -3 직접 검증 (Phase 2 subagent commit 누락 이슈 대비)
- redirect 영구 (301) — 외부 링크/검색 인덱스 보존
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
4월 27일 brainstorm의 A-1 결정을 구현 spec으로 확정.
CEO 결정 8개 라인:
- 메인 안 2 (Brand Hero + 2-up Card)
- 헤더 안 b (Music | Custom Build | Try now)
- /work, /music URL prefix, 10 redirects
- 사주 단순 URL 마이그 (카탈로그 spec 보류)
- 자동화는 /work/freelance 흡수 (Custom Build 4라인)
- /about 미신설 (Brand Hero가 약식 회사 표지)
- 가격 미정 → 견적 문의 CTA만
- 외주 진행 5건 비공개, 납품 5건만 사례
Phase A/B/C 분할 마이그레이션 (인프라+신규 → 원본 삭제+안 2 → 검증).
push는 Phase B 완료 후 무중단 배포.
신규 21+, 수정 5, 삭제 21 파일.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- packFiles state + /api/packs/list-mine fetch (RLS 우회 위해 admin client 라우트)
- handleDownload: /api/packs/sign-link 호출 → window.location 이동
- 카드: 자료 리스트 DB SSOT (PACK_ASSETS.files 폐기)
- order.status === 'completed' 만 다운로드 활성, 그 외는 Phase 1 placeholder 유지
- 4시간 만료 안내 추가
빌드 복구: B3에서 깨진 mypage 빌드를 이번 commit이 복구.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- 업로드: tier 선택 + label + 파일 → /api/admin/packs/upload-url 토큰 발급
→ XHR로 web-backend에 직접 multipart POST (진행률 추적)
- 리스트: tier별 그룹 + label inline 편집 (blur 시 PATCH)
- 삭제: confirm 후 DELETE → soft delete
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- GET: pack_files 목록 (deleted_at IS NULL)
- PATCH: { id, label?, sort_order?, min_tier? } 인라인 편집
- DELETE: web-backend 통한 soft delete
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
15분 만료 + jti 단발성. 브라우저는 이 토큰을 web-backend /api/packs/upload에
직접 multipart POST 시 Authorization Bearer 헤더로 전달 → Vercel function body
limit 우회 (5GB 업로드).
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Phase 2 시작 — pack_files 테이블이 자료 리스트 source of truth.
PACK_TIER_NAMES export 신규 추가 (mypage가 카드 제목용으로 참조).
TIER_LABEL, extractPackTier 변경 없음.
Note: 이 commit 단독으로는 mypage 빌드 깨짐. Task C3 (mypage page.tsx 수정)
에서 PACK_ASSETS 참조 제거 + 새 데이터 흐름 적용 후 빌드 복구.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
DashboardShell에서 사이드바 분기를 제거하면서 Sidebar 컴포넌트는 더 이상
어디에서도 import되지 않음. 파일 삭제로 dead code 정리.
(AdminSidebar는 별도 컴포넌트로 admin shell에서 계속 사용 중 — 영향 없음)
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
mypage가 PublicShell + TopNav를 사용하도록 라우팅 단순화:
- SIDEBAR_PATHS 상수 + Sidebar import + useSidebar 분기 + 모바일 top bar
+ 사이드바 안의 카카오 버튼 + 사업자 정보 footer + style 블록 모두 삭제
- Standalone 분기(/login·/signup·/admin)는 그대로 유지
- 카카오 버튼은 PublicShell로 이미 이동(Task 3)
- 사업자 정보 footer는 PublicShell footer가 동일 정보 보유
Sidebar.tsx 자체는 다음 커밋(Task 7)에서 삭제 — 사용처 0이 됨.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Liquid Glass 메인 surface와 톤 정렬:
- 본문 배경 #f0f5ff → slate-50
- 액센트 #1a56db → violet-600 (탭 active, 버튼, 링크)
- 카드 보더 #dbe8ff → slate-200
- 다크 카드(프로젝트 헤더) #04102b → #060e20 (kx-surface 일관)
- 강조 박스 blue-50/200 → violet-50/200
- 다크 위 텍스트 blue-300/60 → white/50 등
- 탭 button min-w-[100px] 추가 (모바일 wrap 시 텍스트 잘림 방지)
의미 색(emerald/orange/amber/red/rose/pink/cyan/sky)는 시그널이므로 보존.
프로젝트 헤더 in_progress 상태 핀은 sky 계열로 이전(브랜드 블루 잔존 제거).
Task 4에서 추가된 새 코드(AI 스튜디오 카드 등)도 함께 마이그레이션.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
코드 리뷰 후속 (I-1):
인접 div에 사용자 이메일이 텍스트로 노출되므로 아바타 글자는 decoration.
스크린 리더가 외톨이 글자("B" 등)를 읽지 않도록 aria-hidden 처리.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- Hero: bg-[#04102b] → kx-surface, py-10→py-8, 아바타 보라 액센트, 가입일 톤 다운,
로그아웃 버튼 제거 (TopNav가 담당)
- Tab type에 'packs' 추가, 결제 내역 다음 위치에 "구매한 팩" 탭
- packOrders 계산: orders.service 에서 extractPackTier로 Music 팩만 필터
- 신규 탭 JSX: status별 분기(완료/처리중/대기) + 자료 리스트 + 비활성 다운로드 버튼
+ 카톡 안내. Phase 2에서 다운로드 활성화 예정
- 빠른 메뉴: AI 스튜디오 카드 1개 추가 (사주·외주 옆), grid-cols-2→sm:grid-cols-3
- 탭 컨테이너 flex-wrap 적용 (모바일 7개 wrap)
- handleLogout 함수 제거 (사용처 없어짐)
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
DashboardShell 사이드바 분기에서 mypage 전용으로만 노출되던 카카오 버튼을
모든 공개 페이지(메인/서비스/외주/사주/결제/legal/mypage 등)에서 노출되도록 이동.
DashboardShell 쪽 원본은 Task 6에서 사이드바 분기 제거와 함께 자연 삭제 예정.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
코드 리뷰 후속:
- (I-1) useMemo로 supabase client 안정화 → 매 렌더 re-subscribe 제거
- (I-2) getUser() → getSession() → first paint flash 거의 제거 (localStorage 동기 읽기)
- (M-1) 로그아웃 router.push → router.replace → 보호 페이지 백스택 잔존 방지
- (M-2) 모바일 로그아웃 button transition-colors 추가 (데스크톱과 일관)
Defer (별도 검토):
- M-3 로그인 시 Try now 사라짐 — marketing 결정 필요
- M-5 잔여 flash — Phase 2 server prop hydration 시 완전 제거
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- 로그아웃 시: "로그인" link + "Try now" 버튼 (기존)
- 로그인 시: "마이페이지" link + "로그아웃" 버튼 (신규)
- 데스크톱 + 모바일 오버레이 둘 다 동일 패턴
- Sidebar.tsx:93-103 의 auth 구독 패턴 차용
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
코드 리뷰 후속 (I1+M2):
- TIER_LABEL: PackTier → 한국어 표시명 single source of truth
- PACK_ASSETS[*].name 백틱 템플릿으로 TIER_LABEL 참조
- extractPackTier if-ladder → LABEL_TO_TIER lookup (자동 derive)
- 마케팅 카피(입문/프로/마스터) 변경 시 한 곳만 수정으로 mypage·music 동기화
추가 코멘트 (M1, I3):
- U+00B7 middle-dot 명시
- Phase 2 PackFile 형태 마이그레이션 가이드 (files: string[] → { label, url? }[])
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- PACK_ASSETS: starter/pro/master 각 자료 리스트 (Phase 1 placeholder, 실제 파일 URL은 Phase 2)
- extractPackTier(): orders.service "구매 신청: AI 음악 마스터 팩 · {tier}" → tier key
· "·" 뒤의 마지막 단어로 매칭하여 "마스터 팩" + "프로" 같은 충돌 회피
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Spec docs/superpowers/specs/2026-04-27-mypage-liquidglass-redesign.md 의 7개 섹션
모두 task로 매핑. 검증 인프라 부재 → lint + build + 시각 회귀 3단계 검증.
Task 순서 안전 분석(부록 A): 각 commit 후 mypage 로그아웃 경로 + 카카오 진입 항상 유지.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Final code reviewer 후속 3건:
- 명명 통일: Home 카드 "웹사이트" → "웹사이트 제작", "사주 카탈로그" → "AI 사주" /
JSON-LD "맞춤 개발 외주" → "외주 개발". Footer와 4개 라인 라벨 일치.
- priceSpecification 스텁 제거 (Schema.org price-on-request 관용 표기 아님).
P1에서 자체 정가 확정 시 Offer.price + priceCurrency 동시 추가 예정.
- 카드별 trackCTAClick("home_v6_custom_build_card_<key>") 5개 추가 — P1 IA
결정용 라인별 클릭 데이터.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Custom Build 사업부의 두 라인을 JSON-LD에 노출:
- 맞춤 개발 외주 (/freelance)
- 웹사이트 제작 (/services/website)
자체 정가가 미정이라 Offer.price 생략 (P1에서 가격 확정 후 추가).
provider는 기존 Person(@id="...#person") 재사용.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- 카드 grid: grid-cols-2 md:grid-cols-5 → grid-cols-1 sm:grid-cols-2 lg:grid-cols-5
(모바일 orphan 방지)
- ContactModal service를 state로 lift (modalService) — Custom Build CTA에서
"외주 개발 문의" 자동 선택. 모달 close 시 "일반 문의"로 리셋.
- 카드 화살표 span에 aria-hidden 추가 (a11y)
- 카드 Link 의 redundant inline style 제거
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- spec: Music + Custom Build 동등 두 사업부 (A/A-1) IA 재구조
· /work 사용, /work/saju 통합, 자체 정가, 외주 5건 비공개
· 메인 안 2 (Brand Hero + 2-up) + 헤더 안 b 추천
· TODO P0~P3 우선순위
- plan: P0 4 task (TopNav 외주 링크 / 푸터 Custom Build / 메인 미니 섹션 / JSON-LD)
· 결제는 이미 계좌이체 단일화 상태(Music/Blog) 발견 → P0 결제 task 제외
· 사주 1,000원 PG는 미해결로 부록 분리
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
