- 프롬프트 엔지니어링 페이지에 비즈니스 이메일/마케팅 카피/업무 보고서 패키지 3종 추가 - 각 상품 할인가(10,900~12,900원), 7가지 기능 설명, 프롬프트 미리보기 포함 - 마케팅 SVG 에셋 8개 전면 재작성: - 이모지 제거 → SVG path 기반 아이콘으로 교체 - 배경에 유기적 bezier 곡선 블롭 형태 추가 - 자동화 플로우 직선 연결 → 곡선 bezier path로 교체 - 로또 공 3D 하이라이트/그림자 강화 - 주식 차트 polyline → smooth bezier 곡선 개선 - 말풍선 꼬리 path 추가로 자연스러운 대화 표현 Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
176 lines
12 KiB
XML
176 lines
12 KiB
XML
<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="675" viewBox="0 0 1200 675">
|
|
<defs>
|
|
<radialGradient id="hpA-bgGlow1" cx="20%" cy="50%" r="50%">
|
|
<stop offset="0%" stop-color="#1d4ed8" stop-opacity="0.35"/>
|
|
<stop offset="100%" stop-color="#04102b" stop-opacity="0"/>
|
|
</radialGradient>
|
|
<radialGradient id="hpA-bgGlow2" cx="85%" cy="40%" r="45%">
|
|
<stop offset="0%" stop-color="#7c3aed" stop-opacity="0.28"/>
|
|
<stop offset="100%" stop-color="#04102b" stop-opacity="0"/>
|
|
</radialGradient>
|
|
<linearGradient id="hpA-headlineGrad" x1="0%" y1="0%" x2="100%" y2="0%">
|
|
<stop offset="0%" stop-color="#60a5fa"/>
|
|
<stop offset="100%" stop-color="#a78bfa"/>
|
|
</linearGradient>
|
|
<linearGradient id="hpA-bottomBar" x1="0%" y1="0%" x2="100%" y2="0%">
|
|
<stop offset="0%" stop-color="#2563eb"/>
|
|
<stop offset="100%" stop-color="#7c3aed"/>
|
|
</linearGradient>
|
|
<linearGradient id="hpA-browserHero" x1="0%" y1="0%" x2="100%" y2="100%">
|
|
<stop offset="0%" stop-color="#1e3a8a"/>
|
|
<stop offset="100%" stop-color="#312e81"/>
|
|
</linearGradient>
|
|
<linearGradient id="hpA-card1top" x1="0%" y1="0%" x2="100%" y2="0%">
|
|
<stop offset="0%" stop-color="#2563eb"/>
|
|
<stop offset="100%" stop-color="#3b82f6"/>
|
|
</linearGradient>
|
|
<linearGradient id="hpA-card2top" x1="0%" y1="0%" x2="100%" y2="0%">
|
|
<stop offset="0%" stop-color="#7c3aed"/>
|
|
<stop offset="100%" stop-color="#8b5cf6"/>
|
|
</linearGradient>
|
|
<linearGradient id="hpA-card3top" x1="0%" y1="0%" x2="100%" y2="0%">
|
|
<stop offset="0%" stop-color="#059669"/>
|
|
<stop offset="100%" stop-color="#10b981"/>
|
|
</linearGradient>
|
|
<filter id="hpA-shadow">
|
|
<feDropShadow dx="0" dy="8" stdDeviation="20" flood-color="#000" flood-opacity="0.5"/>
|
|
</filter>
|
|
</defs>
|
|
|
|
<!-- 배경 -->
|
|
<rect width="1200" height="675" fill="#04102b"/>
|
|
<rect width="1200" height="675" fill="url(#hpA-bgGlow1)"/>
|
|
<rect width="1200" height="675" fill="url(#hpA-bgGlow2)"/>
|
|
|
|
<!-- 유기적 배경 블롭 -->
|
|
<path d="M 580 0 C 700 -30 900 80 1000 150 C 1100 220 1200 350 1200 500 L 1200 0 Z" fill="rgba(37,99,235,0.05)"/>
|
|
<path d="M 800 675 C 900 620 1100 650 1200 600 L 1200 675 Z" fill="rgba(124,58,237,0.06)"/>
|
|
<path d="M 0 400 C 80 360 180 420 260 390 C 340 360 400 310 480 330 L 480 675 L 0 675 Z" fill="rgba(37,99,235,0.03)"/>
|
|
|
|
<!-- ===== 왼쪽 콘텐츠 ===== -->
|
|
|
|
<!-- 뱃지 -->
|
|
<rect x="48" y="72" width="296" height="34" rx="17" fill="rgba(37,99,235,0.2)" stroke="#2563eb" stroke-width="1"/>
|
|
<text x="196" y="94" text-anchor="middle" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="13" fill="#93c5fd">납기 100% · 무료 AS · 연락두절 없음</text>
|
|
|
|
<!-- 헤드라인 -->
|
|
<text x="48" y="175" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="58" font-weight="700" fill="white">연락 끊기는</text>
|
|
<text x="48" y="245" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="58" font-weight="700" fill="white">외주, 이제</text>
|
|
<text x="48" y="315" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="58" font-weight="700" fill="url(#hpA-headlineGrad)">그만하세요.</text>
|
|
|
|
<!-- 서브텍스트 -->
|
|
<text x="48" y="358" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="17" fill="#94a3b8">7년차 대기업 개발자가 직접 만드는 맞춤 솔루션</text>
|
|
|
|
<!-- 특징 목록 -->
|
|
<circle cx="62" cy="400" r="10" fill="rgba(34,197,94,0.15)" stroke="#22c55e" stroke-width="1.5"/>
|
|
<path d="M 57 400 L 61 404 L 68 396" stroke="#22c55e" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none"/>
|
|
<text x="82" y="405" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="15" fill="#e2e8f0">납기일 100% 준수 보장</text>
|
|
|
|
<circle cx="62" cy="435" r="10" fill="rgba(34,197,94,0.15)" stroke="#22c55e" stroke-width="1.5"/>
|
|
<path d="M 57 435 L 61 439 L 68 431" stroke="#22c55e" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none"/>
|
|
<text x="82" y="440" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="15" fill="#e2e8f0">납품 후 1개월 무료 AS</text>
|
|
|
|
<circle cx="62" cy="470" r="10" fill="rgba(34,197,94,0.15)" stroke="#22c55e" stroke-width="1.5"/>
|
|
<path d="M 57 470 L 61 474 L 68 466" stroke="#22c55e" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none"/>
|
|
<text x="82" y="475" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="15" fill="#e2e8f0">24시간 내 응답 보장</text>
|
|
|
|
<!-- 가격 뱃지 -->
|
|
<rect x="48" y="510" width="118" height="44" rx="22" fill="rgba(96,165,250,0.12)" stroke="#60a5fa" stroke-width="1.5"/>
|
|
<text x="107" y="537" text-anchor="middle" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="20" font-weight="700" fill="#60a5fa">50만원~</text>
|
|
|
|
<!-- ===== 오른쪽 브라우저 목업 ===== -->
|
|
<g filter="url(#hpA-shadow)">
|
|
<!-- 브라우저 외곽 -->
|
|
<rect x="562" y="50" width="608" height="540" rx="18" fill="#1e293b" stroke="#334155" stroke-width="1.5"/>
|
|
|
|
<!-- 탭바 -->
|
|
<rect x="562" y="50" width="608" height="44" rx="18" fill="#0f172a"/>
|
|
<rect x="562" y="76" width="608" height="18" fill="#0f172a"/>
|
|
|
|
<!-- 신호등 버튼 -->
|
|
<circle cx="591" cy="72" r="6" fill="#ef4444"/>
|
|
<circle cx="611" cy="72" r="6" fill="#f59e0b"/>
|
|
<circle cx="631" cy="72" r="6" fill="#22c55e"/>
|
|
|
|
<!-- URL 바 -->
|
|
<rect x="652" y="60" width="462" height="24" rx="12" fill="#1e293b" stroke="#334155" stroke-width="1"/>
|
|
<text x="883" y="77" text-anchor="middle" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="11" fill="#64748b">jaengseung-made.com</text>
|
|
|
|
<!-- 브라우저 내부 배경 -->
|
|
<rect x="562" y="94" width="608" height="496" fill="#f1f5f9"/>
|
|
|
|
<!-- 사이드바 -->
|
|
<rect x="562" y="94" width="120" height="496" fill="#0f172a"/>
|
|
<!-- 사이드바 로고 -->
|
|
<rect x="568" y="106" width="108" height="30" rx="6" fill="#1e3a8a"/>
|
|
<rect x="578" y="117" width="50" height="8" rx="4" fill="rgba(255,255,255,0.7)"/>
|
|
<!-- 사이드바 메뉴 -->
|
|
<rect x="568" y="148" width="84" height="10" rx="5" fill="#334155"/>
|
|
<rect x="568" y="168" width="96" height="10" rx="5" fill="#1e3a8a"/>
|
|
<rect x="568" y="188" width="76" height="10" rx="5" fill="#334155"/>
|
|
<rect x="568" y="208" width="88" height="10" rx="5" fill="#334155"/>
|
|
<rect x="568" y="228" width="78" height="10" rx="5" fill="#334155"/>
|
|
<rect x="568" y="248" width="64" height="10" rx="5" fill="#334155"/>
|
|
|
|
<!-- 메인 콘텐츠 영역 -->
|
|
<!-- 히어로 섹션 -->
|
|
<rect x="682" y="94" width="488" height="172" fill="url(#hpA-browserHero)"/>
|
|
<rect x="704" y="118" width="210" height="14" rx="7" fill="rgba(255,255,255,0.65)"/>
|
|
<rect x="704" y="140" width="165" height="9" rx="4" fill="rgba(255,255,255,0.35)"/>
|
|
<rect x="704" y="156" width="180" height="9" rx="4" fill="rgba(255,255,255,0.25)"/>
|
|
<!-- CTA 버튼들 -->
|
|
<rect x="704" y="178" width="94" height="28" rx="14" fill="#2563eb"/>
|
|
<text x="751" y="197" text-anchor="middle" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="10" fill="white">지금 문의하기</text>
|
|
<rect x="804" y="178" width="76" height="28" rx="14" fill="rgba(255,255,255,0.1)" stroke="rgba(255,255,255,0.3)" stroke-width="1"/>
|
|
<text x="842" y="197" text-anchor="middle" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="10" fill="rgba(255,255,255,0.8)">서비스 보기</text>
|
|
|
|
<!-- 서비스 카드 3개 -->
|
|
<!-- 카드 1 -->
|
|
<rect x="682" y="278" width="154" height="114" rx="10" fill="white" stroke="#e2e8f0" stroke-width="1"/>
|
|
<rect x="682" y="278" width="154" height="5" rx="2" fill="url(#hpA-card1top)"/>
|
|
<rect x="694" y="296" width="82" height="9" rx="4" fill="#1e293b"/>
|
|
<rect x="694" y="313" width="104" height="7" rx="3" fill="#94a3b8"/>
|
|
<rect x="694" y="328" width="92" height="7" rx="3" fill="#94a3b8"/>
|
|
<rect x="694" y="356" width="64" height="18" rx="9" fill="#eff6ff" stroke="#bfdbfe" stroke-width="1"/>
|
|
|
|
<!-- 카드 2 -->
|
|
<rect x="845" y="278" width="154" height="114" rx="10" fill="white" stroke="#e2e8f0" stroke-width="1"/>
|
|
<rect x="845" y="278" width="154" height="5" rx="2" fill="url(#hpA-card2top)"/>
|
|
<rect x="857" y="296" width="82" height="9" rx="4" fill="#1e293b"/>
|
|
<rect x="857" y="313" width="104" height="7" rx="3" fill="#94a3b8"/>
|
|
<rect x="857" y="328" width="92" height="7" rx="3" fill="#94a3b8"/>
|
|
<rect x="857" y="356" width="64" height="18" rx="9" fill="#f5f3ff" stroke="#ddd6fe" stroke-width="1"/>
|
|
|
|
<!-- 카드 3 -->
|
|
<rect x="1008" y="278" width="154" height="114" rx="10" fill="white" stroke="#e2e8f0" stroke-width="1"/>
|
|
<rect x="1008" y="278" width="154" height="5" rx="2" fill="url(#hpA-card3top)"/>
|
|
<rect x="1020" y="296" width="82" height="9" rx="4" fill="#1e293b"/>
|
|
<rect x="1020" y="313" width="104" height="7" rx="3" fill="#94a3b8"/>
|
|
<rect x="1020" y="328" width="92" height="7" rx="3" fill="#94a3b8"/>
|
|
<rect x="1020" y="356" width="64" height="18" rx="9" fill="#ecfdf5" stroke="#a7f3d0" stroke-width="1"/>
|
|
|
|
<!-- 통계 바 -->
|
|
<rect x="682" y="404" width="478" height="66" rx="10" fill="white" stroke="#e2e8f0" stroke-width="1"/>
|
|
<text x="748" y="427" text-anchor="middle" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="18" font-weight="700" fill="#1d4ed8">7년</text>
|
|
<text x="748" y="444" text-anchor="middle" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="10" fill="#64748b">개발 경력</text>
|
|
<line x1="810" y1="414" x2="810" y2="460" stroke="#e2e8f0" stroke-width="1"/>
|
|
<text x="884" y="427" text-anchor="middle" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="18" font-weight="700" fill="#1d4ed8">100%</text>
|
|
<text x="884" y="444" text-anchor="middle" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="10" fill="#64748b">납기 준수</text>
|
|
<line x1="964" y1="414" x2="964" y2="460" stroke="#e2e8f0" stroke-width="1"/>
|
|
<text x="1034" y="427" text-anchor="middle" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="18" font-weight="700" fill="#1d4ed8">무료</text>
|
|
<text x="1034" y="444" text-anchor="middle" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="10" fill="#64748b">납품 후 AS</text>
|
|
<line x1="1098" y1="414" x2="1098" y2="460" stroke="#e2e8f0" stroke-width="1"/>
|
|
<text x="1144" y="427" text-anchor="middle" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="18" font-weight="700" fill="#1d4ed8">50+</text>
|
|
<text x="1144" y="444" text-anchor="middle" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="10" fill="#64748b">납품 실적</text>
|
|
|
|
<!-- 실적 패널 -->
|
|
<rect x="682" y="482" width="478" height="54" rx="10" fill="#1e293b"/>
|
|
<text x="921" y="502" text-anchor="middle" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="11" fill="#94a3b8">누적 납품 실적</text>
|
|
<text x="921" y="522" text-anchor="middle" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="16" font-weight="700" fill="white">최단 납품 7일 · 재의뢰율 94%</text>
|
|
</g>
|
|
|
|
<!-- 하단 바 -->
|
|
<rect x="0" y="638" width="1200" height="37" fill="url(#hpA-bottomBar)"/>
|
|
<text x="600" y="662" text-anchor="middle" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="14" font-weight="600" fill="white">jaengseung-made.vercel.app — 지금 바로 문의하세요</text>
|
|
</svg>
|