From 572b0bce455b5757bdb684a93f4efb5b1decdc28 Mon Sep 17 00:00:00 2001 From: gahusb Date: Thu, 2 Apr 2026 01:48:00 +0900 Subject: [PATCH] =?UTF-8?q?design:=20AI=20=ED=85=9C=ED=94=8C=EB=A6=BF=20?= =?UTF-8?q?=ED=8C=A8=ED=84=B4=20=EC=A0=84=EB=A9=B4=20=EC=A0=9C=EA=B1=B0=20?= =?UTF-8?q?Round=202=20+=20=EC=BB=A8=ED=85=90=EC=B8=A0=20=EC=A0=95?= =?UTF-8?q?=ED=95=A9=EC=84=B1=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 홈: hero gradient text → solid #5ba4ff, 토스페이먼츠 tech 제거, 사주 가격 '무료'로 수정 - 사주: CTA 버튼 gradient 제거, radial dots+이모지 CTA 섹션 → diagonal pattern 유료 카드 gradient+orb 제거, FAQ 유료 언급 수정, 가격 섹션 제목 수정 - freelance: useCounter/StatCard 제거 → 4개 보증 카드로 대체, 모든 gradient 제거 - login: blur orbs 제거, gradient logo/버튼 → solid - mypage: gradient 헤더/아바타 → solid + diagonal pattern - DashboardShell: gradient '쟁' 로고 → solid - automation: gradient step/pricing/CTA → solid - ai-kit: gradient 배경들 → solid, gradient text → solid red-400 Co-Authored-By: Claude Sonnet 4.6 --- app/components/DashboardShell.tsx | 2 +- app/freelance/page.tsx | 288 ++++++++++++++++-------------- app/login/page.tsx | 14 +- app/mypage/page.tsx | 4 +- app/page.tsx | 13 +- app/saju/page.tsx | 54 +++--- app/services/ai-kit/page.tsx | 10 +- app/services/automation/page.tsx | 8 +- 8 files changed, 210 insertions(+), 183 deletions(-) diff --git a/app/components/DashboardShell.tsx b/app/components/DashboardShell.tsx index 8a4ab30..0dd54bf 100644 --- a/app/components/DashboardShell.tsx +++ b/app/components/DashboardShell.tsx @@ -33,7 +33,7 @@ export default function DashboardShell({ children }: { children: React.ReactNode
-
+
쟁
쟁승메이드 diff --git a/app/freelance/page.tsx b/app/freelance/page.tsx index f286a70..e6d8184 100644 --- a/app/freelance/page.tsx +++ b/app/freelance/page.tsx @@ -1,41 +1,8 @@ 'use client'; -import { useState, useEffect, useRef } from 'react'; +import { useState } from 'react'; import ContactForm from '../components/ContactForm'; -/* ─── Counter Hook ─── */ -function useCounter(target: number, duration = 1400) { - const [count, setCount] = useState(0); - const started = useRef(false); - const ref = useRef(null); - - useEffect(() => { - const observer = new IntersectionObserver( - ([entry]) => { - if (entry.isIntersecting && !started.current) { - started.current = true; - const step = target / (duration / 16); - let current = 0; - const timer = setInterval(() => { - current += step; - if (current >= target) { - setCount(target); - clearInterval(timer); - } else { - setCount(Math.floor(current)); - } - }, 16); - } - }, - { threshold: 0.3 } - ); - if (ref.current) observer.observe(ref.current); - return () => observer.disconnect(); - }, [target, duration]); - - return { count, ref }; -} - /* ─── Data ─── */ const portfolio = [ { @@ -46,9 +13,8 @@ const portfolio = [ tags: ['Python', 'Gmail API', 'Google Apps Script'], status: '납품 완료', statusType: 'done', - accentFrom: '#200a0a', - accentTo: '#4a1010', accentColor: 'text-red-400', + accentBg: 'bg-[#200a0a]', borderAccent: 'border-red-400/20', }, { @@ -59,9 +25,8 @@ const portfolio = [ tags: ['Python', 'Selenium', 'Telegram Bot'], status: '납품 완료', statusType: 'done', - accentFrom: '#0d0a2e', - accentTo: '#1a0f5c', accentColor: 'text-violet-400', + accentBg: 'bg-[#0d0a2e]', borderAccent: 'border-violet-400/20', }, { @@ -72,9 +37,8 @@ const portfolio = [ tags: ['Python', 'OpenPyXL', 'ReportLab'], status: '납품 완료', statusType: 'done', - accentFrom: '#012030', - accentTo: '#013d50', accentColor: 'text-cyan-400', + accentBg: 'bg-[#012030]', borderAccent: 'border-cyan-400/20', }, { @@ -85,9 +49,8 @@ const portfolio = [ tags: ['Python', '공공데이터 API', 'PostgreSQL', 'Telegram'], status: '납품 완료', statusType: 'done', - accentFrom: '#04102b', - accentTo: '#0a2060', accentColor: 'text-blue-400', + accentBg: 'bg-[#04102b]', borderAccent: 'border-blue-400/20', }, ]; @@ -195,90 +158,106 @@ const process = [ }, ]; -/* ─── Sub-components ─── */ -function StatCard({ - target, - suffix = '', - label, - sublabel, - pulse = false, - accentClass, -}: { - target: number; - suffix?: string; - label: string; - sublabel: string; - pulse?: boolean; - accentClass: string; -}) { - const { count, ref } = useCounter(target); - return ( -
-
- {count}{suffix} -
-
- {pulse && } - {label} -
-
{sublabel}
-
- ); -} +const guarantees = [ + { + label: '계약서 필수', + detail: '구두 약속 없음 — 착수 전 계약서 발송', + icon: ( + + + + ), + accentText: 'text-sky-400', + accentBorder: 'border-sky-400/20', + }, + { + label: '납기 지연 패널티', + detail: '하루 지연 = 10만원 감면 — 그래서 안 늦습니다', + icon: ( + + + + ), + accentText: 'text-amber-400', + accentBorder: 'border-amber-400/20', + }, + { + label: '소스코드 100% 인도', + detail: '납품 후 전체 소스코드 + 배포 가이드 제공', + icon: ( + + + + ), + accentText: 'text-emerald-400', + accentBorder: 'border-emerald-400/20', + }, + { + label: '1개월 무상 AS', + detail: '납품 후 한 달 — 버그·수정 무상 대응', + icon: ( + + + + ), + accentText: 'text-violet-400', + accentBorder: 'border-violet-400/20', + }, +]; /* ─── Main Page ─── */ export default function FreelancePage() { + const [_contactPreset] = useState(''); + return (
{/* ─── Hero ─── */} -
-
-
- +
-
+
현재 프로젝트 접수 가능

연락 두절? 그런 거 없습니다.
- - 납기 지키고, 끝까지 책임집니다 - + 납기 지키고, 끝까지 책임집니다

-

+

개발자에게 맡겼다가 연락 두절된 경험 있으신가요?
계약서 작성, 중간 보고, 소스코드 인도까지 — 단계마다 증거를 남깁니다.

- {/* ─ Live Counters ─ */} -
- - - - + {/* Developer tag */} +
+
+ 박 +
+
+
쟁토리 (박재오)
+
대기업 백엔드 7년 · Python / Java / Next.js
+
+
+ {['Python', 'Java', 'Next.js', 'Docker'].map(t => ( + {t} + ))} +
- {/* developer tag */} -
-
-
- 박 + {/* 보증 카드 4개 */} +
+ {guarantees.map((g) => ( +
+
{g.icon}
+
{g.label}
+
{g.detail}
-
-
쟁토리
-
시니어 백엔드 개발자 · Python / Java / Next.js
-
-
- {['Python', 'Java', 'Next.js', 'Docker'].map(t => ( - {t} - ))} -
-
+ ))}
@@ -299,14 +278,8 @@ export default function FreelancePage() { className="bg-white rounded-2xl border border-[#dbe8ff] overflow-hidden hover:shadow-xl hover:shadow-blue-100 hover:-translate-y-1 transition-all duration-200 group" > {/* card header */} -
- {/* grid texture */} -
-
+
+
{item.category}

{item.title}

@@ -427,26 +400,32 @@ export default function FreelancePage() { {/* Vertical timeline */}
{/* connecting line */} -
+
{process.map((p) => ( -
+
{/* step circle */}
{p.icon}
{/* content */} -
+
@@ -474,14 +453,14 @@ export default function FreelancePage() {
- {/* ─── 기술 스택 & 강점 ─── */} + {/* ─── 기술 스택 & 신뢰 ─── */}
{/* Tech Stack */}
-
+

개발 가능 기술 스택

@@ -506,21 +485,67 @@ export default function FreelancePage() {
{/* 신뢰 포인트 */} -
+
-
+

신뢰할 수 있는 이유

    {[ - { icon: '🌐', title: '지금 URL로 직접 확인', desc: 'jaengseung-made.com — 로또 분석, 주식 자동매매 지금도 운영 중' }, - { icon: '📋', title: '계약서 먼저, 개발 나중', desc: '구두 약속 없음 — 견적서·계약서 발송 후 착수' }, - { icon: '🔒', title: '납품 전 전액 환불 보장', desc: '마음에 안 드시면 이유 불문 전액 환불' }, - { icon: '📦', title: '소스코드 100% 인도', desc: '완성 후 전체 소스코드 + 배포 가이드 제공' }, - { icon: '⚡', title: '납기 지연 시 패널티', desc: '하루 늦을 때마다 10만원 감면 — 그래서 안 늦습니다' }, + { + title: '지금 URL로 직접 확인', + desc: 'jaengseung-made.com — 로또 분석, 주식 자동매매 지금도 운영 중', + icon: ( + + + + ), + }, + { + title: '계약서 먼저, 개발 나중', + desc: '구두 약속 없음 — 견적서·계약서 발송 후 착수', + icon: ( + + + + ), + }, + { + title: '납품 전 전액 환불 보장', + desc: '마음에 안 드시면 이유 불문 전액 환불', + icon: ( + + + + ), + }, + { + title: '소스코드 100% 인도', + desc: '완성 후 전체 소스코드 + 배포 가이드 제공', + icon: ( + + + + ), + }, + { + title: '납기 지연 시 패널티', + desc: '하루 늦을 때마다 10만원 감면 — 그래서 안 늦습니다', + icon: ( + + + + ), + }, ].map((item) => (
  • - {item.icon} + {item.icon}
    {item.title}
    {item.desc}
    @@ -583,7 +608,10 @@ export default function FreelancePage() {
-
+
24h
이내 답변 보장
영업일 기준 · 주말 포함
diff --git a/app/login/page.tsx b/app/login/page.tsx index c210a2f..02ec320 100644 --- a/app/login/page.tsx +++ b/app/login/page.tsx @@ -76,18 +76,16 @@ function LoginForm() { return (
{/* 배경 장식 */} -
-
-
-
-
+
{/* 로고 */}
-
+
쟁
@@ -153,7 +151,7 @@ function LoginForm() { diff --git a/app/mypage/page.tsx b/app/mypage/page.tsx index 451b6c3..8465288 100644 --- a/app/mypage/page.tsx +++ b/app/mypage/page.tsx @@ -268,10 +268,10 @@ export default function MyPage() { )} {/* 헤더 */} -
+
-
+
{user.email?.[0].toUpperCase()}
diff --git a/app/page.tsx b/app/page.tsx index 5f38696..209aaf6 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -88,8 +88,8 @@ const LIVE_SERVICES = [ name: '쟁승메이드', label: '이 사이트', url: '/freelance', - desc: '기획·디자인·개발·배포·결제·관리자까지 혼자 만들고 직접 운영 중. 이 사이트 자체가 포트폴리오.', - tech: ['Next.js 16', 'Supabase', 'Tailwind', 'Vercel', '토스페이먼츠'], + desc: '기획·디자인·개발·배포·관리자까지 혼자 만들고 직접 운영 중. 이 사이트 자체가 포트폴리오.', + tech: ['Next.js 16', 'Supabase', 'Tailwind', 'Vercel'], status: 'live', color: '#1a56db', }, @@ -155,7 +155,7 @@ const SERVICE_LIST = [ category: 'AI', title: 'AI 사주 분석', desc: '생년월일 입력 → AI가 성격·직업·관계·운세를 즉시 분석', - from: '4,900원/건', + from: '무료', duration: '즉시', hot: false, }, @@ -218,12 +218,7 @@ export default function Home() {
만드는 것부터
- - 운영까지 맡기세요. - + 운영까지 맡기세요. {/* 서브텍스트 */} diff --git a/app/saju/page.tsx b/app/saju/page.tsx index 78fd330..7ddcdb2 100644 --- a/app/saju/page.tsx +++ b/app/saju/page.tsx @@ -12,7 +12,7 @@ const faqItems = [ }, { q: 'AI 해석은 어떻게 동작하나요?', - a: '전통 명리학 계산 로직(오행, 신강/신약, 용신/희신 등)으로 산출된 데이터를 GPT-4o에 전달하여 12개 항목의 상세 해석을 생성합니다. 기본 원국 분석은 무료이며, AI 상세 해석은 유료(₩4,900)로 제공됩니다.', + a: '전통 명리학 계산 로직(오행, 신강/신약, 용신/희신 등)으로 산출된 데이터를 Gemini AI에 전달하여 12개 항목의 상세 해석을 생성합니다. 현재 기본 원국 분석과 AI 상세 해석 모두 무료로 제공됩니다.', }, { q: '태어난 시간을 모르면 어떻게 하나요?', @@ -98,7 +98,7 @@ export default function SajuPage() {
@@ -169,7 +169,7 @@ export default function SajuPage() { )} 다시 보기 → @@ -180,28 +180,29 @@ export default function SajuPage() { )} {/* ─── 바로 시작하기 CTA ─── */} -
-
-
-
✨
-

지금 무료로 시작하세요

-

회원가입 없이, 생년월일만 입력하면 바로 확인 가능합니다

- - 사주 입력하러 가기 → - -
+
+

지금 무료로 시작하세요

+

회원가입 없이, 생년월일만 입력하면 바로 확인 가능합니다

+ + 사주 입력하러 가기 → +
{/* ─── 무료 vs 유료 비교표 ─── */}

PRICING

-

무료 vs 유료 비교

-

기본 원국은 무료로, AI 상세 해석은 단 ₩4,900에

+

무엇을 분석해드리나요

+

기본 원국부터 AI 상세 해석까지 — 현재 전부 무료

@@ -247,12 +248,17 @@ export default function SajuPage() {
- {/* 유료 */} -
-
- ₩4,900 + {/* AI 해석 (현재 무료) */} +
+
+ 현재 무료
-
diff --git a/app/services/ai-kit/page.tsx b/app/services/ai-kit/page.tsx index 506f509..649dd7e 100644 --- a/app/services/ai-kit/page.tsx +++ b/app/services/ai-kit/page.tsx @@ -253,7 +253,7 @@ export default function AiKitPage() {
{/* 총합 카드 */} -
+

6가지 반복 업무를 혼자 할 때

@@ -342,7 +342,7 @@ export default function AiKitPage() { ))}
-
+

실수 1번이 계약 1건을 날립니다.

@@ -391,7 +391,7 @@ export default function AiKitPage() {
{/* 업데이트 알림 */} -
+
@@ -496,13 +496,13 @@ export default function AiKitPage() {
{/* ─── 최하단 CTA ─── */} -
+
{/* 마지막 카피: 기회비용 프레이밍 */}

구독 안 하면 내일도 동일합니다

월 19,900원 vs
- + 월 409,000원어치 시간 낭비

diff --git a/app/services/automation/page.tsx b/app/services/automation/page.tsx index 32f0573..ab91e04 100644 --- a/app/services/automation/page.tsx +++ b/app/services/automation/page.tsx @@ -244,11 +244,11 @@ export default function AutomationPage() {

진행 프로세스

-
+
{process.map((p) => (
-
+
STEP {p.step}
@@ -272,7 +272,7 @@ export default function AutomationPage() { {plans.map((plan) => (
{plan.highlight && ( @@ -411,7 +411,7 @@ export default function AutomationPage() { {/* ─── CTA ─── */}
-
+

FREE CONSULTATION

어떤 업무든 상담해보세요

자동화 가능한 업무라면 무엇이든 도와드립니다