feat: 프리미엄 툴 2종 + 프롬프트 상품 2종 추가

- automation/page.tsx: 부동산 크롤러·회계 자동화 프리미엄 섹션 UI 추가
- accounting_automation_v1.0.py: 사업장 회계 장부 자동화 프로그램 생성
  (5개 업종·19개 지출 항목·손익계산서·분기요약·부가세 자료 등 5시트 Excel 보고서)
- prompt/page.tsx: 이미지 생성 프롬프트 패키지(45,000원) + 자소서·이력서 첨삭 프롬프트(35,000원) 상품 추가
  (다크 그라디언트 카드, 실제 프롬프트 미리보기, ContactModal 연결)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-23 22:48:08 +09:00
parent 05d80a7926
commit 0cf7913169
3 changed files with 1540 additions and 1 deletions

View File

@@ -12,6 +12,113 @@ const CHECKLIST = [
'납품 후 사용 가이드 및 1:1 교육 포함 여부 확인',
];
// ─── 프리미엄 상품 ───
const premiumProducts = [
{
id: 'image_gen',
badge: 'IMAGE GENERATION',
badgeColor: '#e879f9',
bgFrom: '#1a0533',
bgTo: '#2d1054',
accentColor: '#d946ef',
accentBg: 'rgba(217,70,239,0.12)',
accentBorder: 'rgba(217,70,239,0.3)',
title: 'AI 이미지 생성 마스터 프롬프트 패키지',
subtitle: 'Midjourney · DALL-E 3 · Stable Diffusion 전용',
price: '45,000원',
priceNote: '/ 패키지 (즉시 다운로드)',
desc: '수천 장의 이미지 생성 실험을 통해 검증된, 업종별·스타일별 고품질 프롬프트 50종 세트. 단순 키워드 나열이 아닌 구도·조명·분위기·카메라·후처리까지 세밀하게 설계된 전문가급 프롬프트입니다.',
features: [
{ label: '50종 프롬프트 라이브러리', desc: '상업용 · 마케팅 · SNS 콘텐츠 · 제품 사진 · 인물 포트레이트 · 배경 · 로고 컨셉 · 인테리어 등 카테고리별 구성' },
{ label: '구도·조명·후처리 공식', desc: '주제(Subject) → 환경(Environment) → 스타일(Style) → 조명(Lighting) → 카메라(Camera) → 후처리(Post) 6단계 구조 적용' },
{ label: '네거티브 프롬프트 포함', desc: '흐림·왜곡·불필요한 텍스트·비현실적 요소를 제거하는 부정 키워드까지 최적화하여 실패 확률 최소화' },
{ label: 'Midjourney 파라미터 완전 가이드', desc: '--ar / --v / --style / --chaos / --no 등 핵심 파라미터 활용법과 상황별 추천값 포함' },
{ label: '한국어 → 영어 변환 치트시트', desc: '자주 쓰는 한국어 표현을 AI가 잘 이해하는 영어 표현으로 매핑한 빠른 참고 시트' },
{ label: '업종별 특화 세트 5개', desc: '카페/음식 · 패션 · 부동산 인테리어 · 교육/강의 · 뷰티/헬스 분야 특화 프롬프트 세트별 제공' },
{ label: '활용 예시 이미지 50장', desc: '각 프롬프트로 실제 생성한 결과물 예시 이미지 포함 (PDF 가이드북 형태 제공)' },
{ label: '무제한 재사용 가능', desc: '구매 후 본인 사업·작업에 무제한 활용 가능. 상업적 이용 허용' },
],
promptPreview: {
title: '프롬프트 예시 — 프리미엄 카페 음료 사진',
content: `A professional product photograph of a single iced caramel latte in a tall clear glass,
placed on a rustic wooden cafe table. The drink features layers of espresso, milk,
and golden caramel syrup with ice cubes.
Lighting: soft natural window light from the left, warm golden hour tone,
subtle rim lighting highlighting condensation droplets on the glass.
Camera: Canon EOS R5, 85mm f/1.8 lens, shallow depth of field,
foreground blur with coffee beans and a sprig of dried lavender.
Style: editorial food photography, Pinterest aesthetic, warm muted tones,
slightly desaturated with lifted shadows.
Post-processing: film grain texture, subtle vignette,
color grade with warm highlights and cool shadows.
--ar 4:5 --v 6.1 --style raw --q 2
Negative: text, watermark, multiple cups, cartoon, illustration,
overexposed, blurry, plastic look, artificial lighting`,
},
cta: '패키지 구매 문의 →',
productId: 'prompt_image_gen',
},
{
id: 'resume',
badge: 'CAREER COACHING',
badgeColor: '#34d399',
bgFrom: '#052e16',
bgTo: '#064e3b',
accentColor: '#10b981',
accentBg: 'rgba(16,185,129,0.12)',
accentBorder: 'rgba(16,185,129,0.3)',
title: 'AI 자소서·이력서 첨삭 마스터 프롬프트',
subtitle: 'ChatGPT · Claude 전용 · 대기업 HR 기준 적용',
price: '35,000원',
priceNote: '/ 패키지 (즉시 다운로드)',
desc: '7년차 대기업 재직 경험과 수십 명의 신입/경력 지원자 첨삭 경험을 바탕으로 설계한 자소서·이력서 최적화 프롬프트 세트. 합격률을 높이는 구체적인 표현과 구조로 AI가 전문 컨설턴트처럼 첨삭하도록 만들어드립니다.',
features: [
{ label: '자기소개서 7가지 유형별 프롬프트', desc: '지원동기 · 성장과정 · 강점/약점 · 직무역량 · 팀워크 경험 · 위기극복 · 입사 후 포부 — 각 항목에 최적화된 별도 프롬프트 제공' },
{ label: 'STAR 기법 자동 적용', desc: '상황(Situation) → 과제(Task) → 행동(Action) → 결과(Result) 구조로 경험을 임팩트 있게 재구성하는 프롬프트 포함' },
{ label: '이력서 불릿포인트 최적화', desc: '단순 업무 나열이 아닌 "무엇을 했고, 어떤 방법으로, 어떤 결과를 냈는지" 3단 구조 + 수치화로 강점을 극대화하는 첨삭 프롬프트' },
{ label: 'ATS 키워드 최적화', desc: '채용 공고의 키워드를 분석하여 자소서에 자연스럽게 녹여내는 ATS(지원자 추적 시스템) 통과 최적화 프롬프트' },
{ label: '업종/직무별 맞춤 톤 설정', desc: 'IT · 금융 · 제조 · 마케팅 · 공공기관 등 업종별, 신입/경력별 적합한 문체와 표현 스타일로 자동 조정' },
{ label: '약점을 강점으로 전환하는 프롬프트', desc: '공백기 · 전공 불일치 · 낮은 학점 · 짧은 재직기간 등 불리한 스펙을 긍정적으로 표현하는 전략적 첨삭 프롬프트' },
{ label: '면접 질문 예측 & 답변 준비', desc: '작성된 자소서를 기반으로 예상 면접 질문을 생성하고, 모범 답변 구조를 잡아주는 면접 대비 프롬프트 포함' },
{ label: '실제 첨삭 Before/After 5사례', desc: '실제로 사용하여 개선된 자소서 전후 비교 예시 5가지를 PDF로 제공 (직무별 다양한 케이스)' },
],
promptPreview: {
title: '프롬프트 예시 — 지원동기 항목 첨삭',
content: `당신은 15년 경력의 대기업 HR 수석 컨설턴트입니다.
수백 명의 합격 자소서를 분석한 전문가 관점에서 다음 자소서를 첨삭해주세요.
[첨삭 기준]
1. STAR 기법(상황-과제-행동-결과) 구조가 명확한가?
2. 지원 동기가 회사의 사업 방향/가치와 구체적으로 연결되는가?
3. "열정", "성장" 등 추상적 단어 대신 구체적 경험과 수치가 있는가?
4. 첫 문장이 면접관의 시선을 끄는 Hook으로 시작하는가?
5. 지원 직무에서 필요한 역량이 자연스럽게 드러나는가?
[첨삭 방식]
① 현재 자소서의 강점 2가지 (구체적 근거 포함)
② 치명적 약점 3가지와 개선 방향
③ 표현이 약한 문장 3개를 지목하여 강화 버전으로 재작성
④ 전체 구조 리뉴얼 버전 (300자 이내로 압축한 임팩트 버전)
⑤ 이 자소서로 예상되는 면접 질문 2가지
[지원 정보]
- 회사/직무: [입력]
- 채용 공고 키워드: [입력]
[첨삭할 자소서]
[여기에 자소서 붙여넣기]`,
},
cta: '패키지 구매 문의 →',
productId: 'prompt_resume',
},
];
const useCases = [
{ label: '이메일 작성', desc: '고객사별, 상황별 최적화된 비즈니스 이메일 프롬프트' },
{ label: '보고서·기획서', desc: '회사 내부 보고서, 제안서, 기획서 자동 작성용 프롬프트' },
@@ -133,6 +240,90 @@ export default function PromptPage() {
</div>
</div>
{/* ─── 프리미엄 상품 ─── */}
<div className="px-6 py-12 lg:px-12">
<div className="max-w-5xl mx-auto">
<div className="text-center mb-8">
<div className="inline-flex items-center gap-2 bg-fuchsia-500/10 border border-fuchsia-500/30 text-fuchsia-400 text-xs font-extrabold px-4 py-1.5 rounded-full uppercase tracking-widest mb-4">
<svg className="w-3.5 h-3.5" viewBox="0 0 24 24" fill="currentColor"><path d="M11.049 2.927c.3-.921 1.603-.921 1.902 0l1.519 4.674a1 1 0 00.95.69h4.915c.969 0 1.371 1.24.588 1.81l-3.976 2.888a1 1 0 00-.363 1.118l1.518 4.674c.3.922-.755 1.688-1.538 1.118l-3.976-2.888a1 1 0 00-1.176 0l-3.976 2.888c-.783.57-1.838-.197-1.538-1.118l1.518-4.674a1 1 0 00-.363-1.118l-3.976-2.888c-.784-.57-.38-1.81.588-1.81h4.914a1 1 0 00.951-.69l1.519-4.674z" /></svg>
PREMIUM PRODUCTS
</div>
<h2 className="text-2xl md:text-3xl font-extrabold text-[#04102b]"> </h2>
<p className="text-slate-500 text-sm mt-2"> </p>
</div>
<div className="grid lg:grid-cols-2 gap-6">
{premiumProducts.map((product) => (
<div
key={product.id}
className="rounded-2xl overflow-hidden border"
style={{ borderColor: product.accentBorder, background: `linear-gradient(135deg, ${product.bgFrom}, ${product.bgTo})` }}
>
{/* 헤더 */}
<div className="p-6 border-b" style={{ borderColor: product.accentBorder }}>
<div className="flex items-start justify-between gap-3 mb-3">
<span
className="text-xs font-extrabold px-3 py-1 rounded-full uppercase tracking-widest"
style={{ color: product.accentColor, background: product.accentBg, border: `1px solid ${product.accentBorder}` }}
>
{product.badge}
</span>
<div className="text-right">
<div className="text-2xl font-extrabold text-white">{product.price}</div>
<div className="text-xs" style={{ color: product.accentColor + '99' }}>{product.priceNote}</div>
</div>
</div>
<h3 className="text-lg font-extrabold text-white mb-1 leading-snug">{product.title}</h3>
<p className="text-xs mb-3" style={{ color: product.accentColor + 'aa' }}>{product.subtitle}</p>
<p className="text-sm leading-relaxed" style={{ color: 'rgba(255,255,255,0.55)' }}>{product.desc}</p>
</div>
{/* 기능 목록 */}
<div className="p-6 border-b" style={{ borderColor: product.accentBorder }}>
<p className="text-xs font-bold uppercase tracking-widest mb-3" style={{ color: product.accentColor + 'cc' }}> </p>
<ul className="space-y-2.5">
{product.features.map((f, i) => (
<li key={i} className="flex items-start gap-2.5">
<div className="w-4 h-4 rounded-full flex items-center justify-center flex-shrink-0 mt-0.5" style={{ background: product.accentBg, border: `1px solid ${product.accentBorder}` }}>
<div className="w-1.5 h-1.5 rounded-full" style={{ background: product.accentColor }} />
</div>
<div>
<span className="text-xs font-bold text-white">{f.label}</span>
<span className="text-xs ml-1.5" style={{ color: 'rgba(255,255,255,0.45)' }}> {f.desc}</span>
</div>
</li>
))}
</ul>
</div>
{/* 프롬프트 미리보기 */}
<div className="p-6 border-b" style={{ borderColor: product.accentBorder }}>
<p className="text-xs font-bold uppercase tracking-widest mb-3" style={{ color: product.accentColor + 'cc' }}>
{product.promptPreview.title}
</p>
<div
className="rounded-xl p-4 font-mono text-xs leading-relaxed overflow-auto"
style={{ background: 'rgba(0,0,0,0.35)', color: 'rgba(255,255,255,0.6)', border: `1px solid ${product.accentBorder}`, whiteSpace: 'pre-line', maxHeight: '180px' }}
>
{product.promptPreview.content}
</div>
</div>
{/* CTA */}
<div className="p-6">
<button
onClick={() => openModal(`프롬프트 엔지니어링 - ${product.title}`)}
className="w-full py-3.5 rounded-xl text-sm font-extrabold transition-all hover:opacity-90 hover:scale-[1.01]"
style={{ background: product.accentColor, color: product.bgFrom }}
>
{product.cta}
</button>
<p className="text-center text-xs mt-2" style={{ color: 'rgba(255,255,255,0.3)' }}>
</p>
</div>
</div>
))}
</div>
</div>
</div>
{/* ─── Before/After ─── */}
<div className="px-6 py-12 lg:px-12">
<div className="max-w-5xl mx-auto">