- lib/gtag.ts: GA4 이벤트 유틸리티 (trackCTAClick, trackToolDemo, trackDownload, trackOutboundClick)
- ContactModal/ContactForm: 공용 trackEvent로 리팩토링 + generate_lead 이벤트
- 홈/tools/automation/prompt/website: CTA 클릭 이벤트 추적 추가
- 홈/freelance/ai-kit: IntersectionObserver 스크롤 리빌 애니메이션 신규 추가
- automation/prompt: GA4 trackCTAClick 적용
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
[DB]
- supabase/migrations/002_project_milestones.sql 추가
quotes.user_id 컬럼 + project_milestones 테이블 생성 SQL
[API]
- GET /api/projects — 로그인 사용자의 프로젝트+마일스톤 조회
- POST /api/projects/link — 견적서 토큰으로 계정에 프로젝트 연결
- GET/POST /api/admin/milestones — 관리자 마일스톤 목록/기본 7단계 초기화
- PATCH/DELETE /api/admin/milestones/[id] — 관리자 단계별 상태·메모 업데이트
[UI — 마이페이지]
- '프로젝트 현황' 탭 신규 추가 (Tab type 확장)
- 진행률 바, 단계별 타임라인, 개발자 메모 표시
- 견적서 코드 입력 → 계정 연결 폼
[UI — 관리자 견적서 편집]
- '진행 단계' 탭 추가: 기본 7단계 초기화, 단계별 status/메모 편집
[마케팅 카피]
- page.tsx PROMISES 4번째 추가: "진행 현황 마이페이지 실시간 확인"
- freelance 보증 카드 5번째 추가: 실시간 진행 현황 (그리드 2×5)
- services/website trust badge 5번째 추가
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- page.tsx: 홈 서비스 목록 website 가격 50만원→20만원, 기간 7일→3일 (실제 페이지와 일치)
이벤트 배너 AI 자동화→스타터 20% 할인 (주력 서비스와 방향 통일)
- services/website: FAQ 3→5개 (앱/모바일 개발 가능 여부, 계약금·취소 방식 추가)
- freelance: 웹사이트 제작 포트폴리오 1건 추가 (기업 브랜드 홈페이지·Next.js)
자동화 4건만 있던 포트폴리오에 웹 개발 사례 보강
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- services/website: 하단 CTA 그라디언트→솔리드+대각 패턴, 방사형 오브 제거
CTA 카피 "지금 바로 시작하세요"→"내일도 고민만 하실 건가요?" 전환 강화
CTA 버튼·스크롤탑 버튼 linear-gradient→#6366f1 솔리드
모바일 반응형 CSS 블록 추가 (portfolio/process/pricing/hero 1컬럼)
Hero 타이틀·배지 웹앱·앱 개발 포함 문구로 확장
- page.tsx: 서비스카드 가격/기간 hidden sm:flex→항상 표시 (모바일 대응)
- freelance: 개발자 기술 배지 hidden sm:flex→flex flex-wrap (모바일 표시)
후기 그리드 md:grid-cols-3→sm:grid-cols-2 md:grid-cols-3
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Sidebar: 'v2' 배지 제거, '박재오의 개발 공방' 태그라인으로 정체성 명확화,
로그인 버튼 → 'AI 사주·키트 이용 시 필요' 안내 텍스트로 교체
- automation: automationTypes 6개 설명을 기능 나열 → 고객 고통 시나리오 중심으로 재작성
- website: samples 8개 desc을 '추상적 형용사' → '"고객 문제 → 해결"' 구조로 전환
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
[SEO 인프라]
- app/sitemap.ts: Next.js App Router 사이트맵 자동 생성 (/sitemap.xml)
- app/robots.ts: 크롤러 허용/차단 규칙 + 사이트맵 경로 등록
- app/layout.tsx: JSON-LD 구조화 데이터 추가 (Person + LocalBusiness + OfferCatalog 스키마)
- GA4 config 업데이트 (send_page_view, custom_map)
[서비스 페이지 SEO 메타태그 강화]
- automation: 'AI 업무 자동화 외주' 키워드 12종 최적화
- prompt: 'ChatGPT 프롬프트 잘 쓰는 법', '이미지 생성 프롬프트' 등 구매형 키워드 추가
- website: '소상공인 홈페이지 제작 외주', '홈페이지 제작 비용' 등 롱테일 키워드 추가
[GA 이벤트 트래킹]
- ContactModal: contact_attempt / generate_lead / contact_error 이벤트 추가
(전환 추적 핵심 — 어떤 서비스에서 문의가 오는지 GA에서 확인 가능)
[홈페이지 콘텐츠 위젯]
- 'AI 자동화 실전 팁' 블로그 포스트 3종 카드 섹션 추가 (블로그 연동 준비)
[콘텐츠 자산 (CONTENT/ 폴더)]
- brand-story.md: 풀/숏/초단문/유튜브 채널 소개용 4종 브랜드 스토리 원고
- youtube-scripts.md: 유튜브 숏츠 스크립트 10편 (훅→문제→시연→CTA 구조)
- sns-calendar.md: 30일 SNS 포스팅 캘린더 (블로그·스레드·카카오·블라인드 채널별)
- blog-drafts.md: 네이버 블로그 SEO 초안 10편 (키워드·소제목·본문 완성)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- SampleMiniPreview 컴포넌트 추가: 700×350px 레이아웃을 scale(0.5)로 축소
- 8개 샘플별 실제 페이지 디자인 언어를 그대로 재현
- corporate: 화이트 배경, 네이비 Nav, 그리드 패턴, 통계 수치
- bakery: 크림 배경, 세리프 로고, 앰버 버튼, 베이커리 메뉴 카드
- portfolio: 블랙 배경, 네온 그린 타이포, 아바타 카드
- dashboard: 다크 슬레이트, 사이드바, 통계 카드, 막대 차트
- game: 블랙+사이버 보라/청록, 챔피언 카드 그리드
- interior: 다크 브라운 Nav, 스플릿 레이아웃, 인테리어 이미지 그리드
- reading: 다크 웜, 골드 세리프, 책등 스택 시각화
- shopping: 페이퍼 배경, 에디토리얼 히어로, 미니 상품 그리드
- 기존 아이콘 + 단색 그라디언트 → 실제 페이지처럼 보이는 CSS 프리뷰로 교체
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
products.ts — 7개 상품 신규 등록:
- prompt_team (249,000원): 팀/기업 프롬프트 패키지
- automation_basic (50,000원): 단순 업무 자동화
- automation_advanced (150,000원): 자동화 심화
- website_starter (200,000원): 홈페이지 스타터
- website_business (1,000,000원): 홈페이지 비즈니스
- website_premium (2,000,000원): 홈페이지 프리미엄
PaymentButton — style prop 추가 (inline-style 페이지 대응)
프롬프트 서비스: 팀/기업 패키지 PaymentButton 연결
업무 자동화: 단순·심화 플랜 PaymentButton 연결 (대형은 협의가격→ContactModal 유지)
웹사이트 제작: 전 플랜 Link 버튼 → PaymentButton 전환
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- interior/shopping 샘플 페이지의 * {} CSS 리셋이 사이드바 포함
전체 DOM을 오염시키던 문제 수정
- .au-page / .ml-page 클래스로 스코프 한정:
*, *::before, *::after → .au-page *, .ml-page * 로 변경
- 쇼핑몰 이미지: Unsplash CDN → picsum.photos 교체 (항상 안정 로드)
seed 기반으로 일관된 이미지 유지
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- 모든 샘플 페이지 우측 하단 맨 위로 스크롤 버튼 추가 (인테리어, 독서)
- 독서 기록 노트 상단 '홈페이지 제작 서비스로 돌아가기' 배너 추가
- 개인 쇼핑몰 샘플 (MELLOW STUDIO) 신규 생성
- 베이지/크림 라이트 톤, Cormorant Garamond + Pretendard
- 히어로 스플릿 레이아웃, 상품 그리드(카테고리 필터), 브랜드 스토리, 리뷰, CTA, 푸터
- 장바구니 뱃지, 상품 찜하기, 퀵 장바구니 인터랙션
- 홈페이지 서비스 소개 페이지 재디자인
- CookieRun → Pretendard 교체로 한글 폰트 렌더링 개선
- word-break: keep-all 적용으로 이상한 개행 제거
- IntersectionObserver 스크롤 reveal 애니메이션 추가
- Trust badge 섹션, Marquee 추가
- 쇼핑몰 샘플 카드 추가
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
[Root cause 3가지]
1. 스크롤 이벤트 타깃 오류
- window.scroll → .main-content (overflow-y:auto) 로 수정
- DashboardShell의 내부 스크롤 컨테이너를 querySelector로 탐색
2. 히어로 높이 오류
- height:100dvh → calc(100dvh - 40px - 72px)
- 배너(40px) + 네비(72px) 이후 남은 뷰포트를 정확히 채움
3. 스크롤 텍스트 transform 충돌
- top:50%; transform:translateY(-50%) 위치지정 제거
- au-scrub-text를 inset:0 flex 레이아웃으로 변경
- JS는 opacity+filter만 갱신 (transform 불변)
[추가 개선]
- nav: 히어로 위에서 투명, 스크롤 후 cream 배경+blur 전환
- 스크롤 섹션 초기 onScrub() 즉시 호출로 첫 텍스트 표시
- IntersectionObserver root를 .main-content로 지정
- 마일스톤 2 data-end="1.01" (경계값 처리)
- 전체 페이지 코드 정리 및 중복 제거
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- 히어로: MP4 풀스크린 비디오 배경 (autoplay/muted/loop), 초기 8초 drift 애니메이션
- 스크롤 섹션(380vh): 48장 WebP 프레임 스크러빙 (Apple 스타일)
- 스크롤 위치에 따라 캔버스에 프레임 렌더링 (requestAnimationFrame)
- 3단계 텍스트 오버레이 (공간 철학 / 실적 / CTA) DOM 직접 조작
- 하단 진행 바 실시간 업데이트
- 6fps WebP 48프레임 추출 (libwebp, quality 82) → 총 1.3MB
- 모든 이미지 cover-fit 캔버스 렌더링
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
picsum 플레이스홀더 → 실제 인테리어 이미지 7장으로 교체:
- 히어로, 포트폴리오 벤토 4컷, 서비스 지그재그 3컷
- Pinterest 이미지 + Lunalight Studios 조명 이미지 적용
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- bakery: 이모지 → SVG 빵/셰프 일러스트, 고객 리뷰 섹션, 시즌 스페셜 섹션, 재료 태그 추가
- portfolio: 수상내역 마퀴 배너, 서비스 섹션, 프로젝트 카테고리 필터+호버 오버레이, 클라이언트 후기 추가
- dashboard: SVG 라인 차트, KPI 스파크라인, 알림 패널, 도넛 차트, 사용자 아바타 테이블 개선
- game: 챔피언 선택 섹션, 시즌 패스 진행 바, 최근 매치 히스토리, 파티클 배경, 티어 SVG 배지
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- 홈페이지 제작: 50→20만, 150→100만, 300→200만원
- 업무 자동화: 10→5만, 중간→자동화심화 15만원 (이름 변경 포함)
- 주식 자동매매: 스타터 99→49k/29→9.9k, 프로 199→99k/49→29k
- 홈 서비스 카드 가격 동기화 (stock, automation)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- 관리자 견적서 CRUD (WBS/항목/향후관리/특이사항 5탭 편집기)
- 고객용 공개 견적서 페이지 (optional 항목 선택 + 실시간 총액 + 수락)
- 마케팅 SVG 에셋 6종 (썸네일 5개 + 배너 1개) + 관리자 에셋 페이지
- 전체 카피 강화: 크레덴셜 제거 → URL증거/환불보장/계약서/납기패널티 중심
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- app/services/website/page.tsx: Google Fonts (Syne, Noto Sans KR) 제거
→ 사이트 공통 폰트 CookieRun으로 교체, @import 제거
- app/services/automation/page.tsx: 자동화 도구 무료 다운로드 섹션 추가
- 엑셀 자동화 도구(배포), 웹 스크래핑·이메일 자동화(준비중) 카드
- 각 카드 → 상세 서브페이지 링크 연결
- app/services/automation/tools/excel/page.tsx: 신규 생성
- 엑셀 매크로 툴킷 상세 페이지 (기능 6가지, 사용법, 미리보기 목업, FAQ)
- 무료 다운로드 버튼 (/downloads/Excel_Macro_Toolkit_v1.2.xlsm)
- 맞춤 개발 문의 CTA
- public/downloads/: 다운로드 파일 배치 디렉토리 생성
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
