diff --git a/app/page.tsx b/app/page.tsx
index f316159..a64a492 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -4,7 +4,8 @@ import { useState } from 'react';
import Link from 'next/link';
import ContactModal from './components/ContactModal';
import { GlassButton } from './components/LiquidGlass';
-import { trackCTAClick } from '../lib/gtag';
+import { trackCTAClick } from '@/lib/gtag';
+import { PORTFOLIO } from '@/lib/freelance-portfolio';
const BEFORE = [
'작곡 공부에만 최소 6개월 소요',
@@ -13,6 +14,13 @@ const BEFORE = [
'곡 하나 완성에 드는 수백만 원의 외주비',
];
+const AFTER = [
+ '단 1시간 만에 프로급 음원 & 영상 완성',
+ '드래그 앤 드롭 수준의 직관적인 워크플로우',
+ '가이드대로 따라하면 완벽한 저작권 해결',
+ '커피 한 잔 가격으로 무한대 콘텐츠 생산',
+];
+
const TWEETS_ROW_A = [
{ name: '김민재', handle: 'minjae_shorts', time: '2h', body: '작곡 하나 못 하던 내가 3일 만에 쇼츠 채널 열었다. 프롬프트북 반칙 수준 ㄹㅇ' },
{ name: '이소영', handle: 'cafe_sohyang', time: '5h', body: '매장 BGM 직접 만들어요. 저작권 고민 없이 매달 플레이리스트 갈아끼우는 게 신기함.' },
@@ -35,17 +43,22 @@ const TWEETS_ROW_B = [
{ name: '임준혁', handle: 'junhyuk_tune', time: '6d', body: '업데이트 진짜로 오네요. 2주 만에 V4.5 프롬프트 가이드 추가됨.' },
];
-const AFTER = [
- '단 1시간 만에 프로급 음원 & 영상 완성',
- '드래그 앤 드롭 수준의 직관적인 워크플로우',
- '가이드대로 따라하면 완벽한 저작권 해결',
- '커피 한 잔 가격으로 무한대 콘텐츠 생산',
+const CB_CARDS = [
+ { href: '/work/freelance', label: '외주 개발', desc: '맞춤 솔루션 · RPA·API 자동화 포함', key: 'freelance' },
+ { href: '/work/website', label: '웹사이트', desc: '기업·브랜드 사이트', key: 'website' },
+ { href: '/work/saju', label: 'AI 사주', desc: '12개 항목 무료 해석', key: 'saju' },
+ { href: '/work/blog', label: '블로그 자동화', desc: '수익 엔진 팩', key: 'blog' },
];
export default function Home() {
const [modalOpen, setModalOpen] = useState(false);
const [modalService, setModalService] = useState('일반 문의');
+ const openContact = (service: string) => {
+ setModalService(service);
+ setModalOpen(true);
+ };
+
return (
- {/* 1. Hero */}
-
+ {/* 1. Brand Hero — kx-surface 검정, 60vh, 텍스트 중심 */}
+
-
-
+
+
- 나의 이야기가
-
- 노래가 됩니다.
+ 현직 엔지니어가 만드는
+
두 가지.
-
- 프롬프트부터 뮤직비디오까지.
-
- {' '}AI 음악 제작의 모든 순서를 한 팩에 담았습니다.
+
+ AI 제품, 그리고 맞춤 개발.
-
- trackCTAClick('home_v6_hero_primary')}
- tint="rgba(255,255,255,0.18)"
- className="text-base"
- >
- Try now
-
-
- 샘플 결과 보기
-
-
-
- {/* 2. Features */}
+ {/* 2. Two-up Cards */}
+
+
+ {/* Music 카드 */}
+
trackCTAClick('home_v7_card_music')}
+ className="group relative rounded-2xl border border-white/15 overflow-hidden min-h-[280px] flex flex-col justify-end p-8 hover:border-white/40 transition"
+ style={{ textDecoration: 'none' }}
+ >
+
+
+
+
+ Music
+
+
+ AI 음악 제품
+
+
+ Suno 프롬프트 + 뮤비 워크플로우 + 유튜브 SEO 한 팩에.
+
+
₩39,000~
+
+ Try now →
+
+
+
+
+ {/* Custom Build 카드 */}
+
trackCTAClick('home_v7_card_work')}
+ className="group relative rounded-2xl border border-white/15 overflow-hidden min-h-[280px] flex flex-col justify-end p-8 hover:border-white/40 transition"
+ style={{
+ textDecoration: 'none',
+ background: 'linear-gradient(135deg, var(--kx-surface) 0%, rgba(204,151,255,0.15) 100%)',
+ backgroundImage: 'repeating-linear-gradient(135deg, rgba(255,255,255,0.02) 0px, rgba(255,255,255,0.02) 1px, transparent 1px, transparent 40px)',
+ }}
+ >
+
+
+ Custom Build
+
+
+ 맞춤 개발 사업부
+
+
+ 외주 · 웹사이트 · AI 사주 · 블로그 자동화
+
+
납품 5건 · 견적 24h 내 답변
+
+ 견적 문의 →
+
+
+
+
+
+
+ {/* 3. Music 섹션 — 기존 Features + Before/After + Tweet 마퀴 보존 */}
+
+ {/* 3-1. Features */}
@@ -185,7 +256,7 @@ export default function Home() {
- {/* 3. Before / After */}
+ {/* 3-2. Before / After */}
@@ -232,7 +303,7 @@ export default function Home() {
- {/* 4. Use Cases — Tweet Marquee */}
+ {/* 3-3. Use Cases — Tweet Marquee */}
@@ -281,7 +352,7 @@ export default function Home() {
- {/* 4.5. Custom Build — 외주 사업부 미니 섹션 (P0) */}
+ {/* 4. Custom Build 섹션 — 4 카드 + 5건 사례 + 견적 CTA */}
@@ -295,22 +366,16 @@ export default function Home() {
맞춤 개발이 필요하신가요?
- 7년차 백엔드 개발자가 직접 설계·개발·납품. 외주, 웹사이트, 자동화부터 사주·블로그 솔루션까지.
+ 7년차 백엔드 개발자가 직접 설계·개발·납품. 외주, 웹사이트, AI 사주, 블로그 자동화까지.
-
- {[
- { href: '/freelance', label: '외주 개발', desc: '맞춤 솔루션 외주', key: 'freelance' },
- { href: '/services/website', label: '웹사이트 제작', desc: '기업·브랜드 사이트', key: 'website' },
- { href: '/freelance', label: '자동화', desc: 'RPA · API 연동', key: 'automation' },
- { href: '/saju', label: 'AI 사주', desc: 'AI 사주 솔루션', key: 'saju' },
- { href: '/services/blog', label: '블로그 자동화', desc: '수익 엔진 팩', key: 'blog' },
- ].map((card) => (
+
+ {CB_CARDS.map((card) => (
trackCTAClick(`home_v6_custom_build_card_${card.key}`)}
+ onClick={() => trackCTAClick(`home_v7_cb_card_${card.key}`)}
className="group rounded-2xl border border-white/15 bg-white/[0.02] p-5 hover:border-white/40 hover:bg-white/[0.05] transition flex flex-col"
>
{card.label}
@@ -320,12 +385,27 @@ export default function Home() {
))}
+ {/* 납품 5건 사례 미리보기 */}
+
+ {PORTFOLIO.map((p) => (
+
+
+ {p.category}
+
+
{p.title}
+
{p.result}
+
+ ))}
+
+
- {/* 5. Final CTA — Full-width video */}
-
+ {/* 5. Final CTA — 어느 쪽이든 시작하세요 */}
+
-
-
-
-
- Start Today
-
+
+
- 오늘 밤, 당신 채널에
-
- 첫 AI 뮤비가 올라갑니다.
+ 어느 쪽이든 시작하세요.
-
- 입문 팩 ₩39,000으로 시작. 1시간 워크플로우 + 템플릿 + 저작권 가이드 포함.
-
-
+
trackCTAClick('home_v6_final_music')}
+ href="/music"
+ onClick={() => trackCTAClick('home_v7_final_music')}
tint="rgba(255,255,255,0.18)"
className="text-base"
>
- Try now
+ Music 팩 보기
+