- 관리자 견적서 CRUD (WBS/항목/향후관리/특이사항 5탭 편집기) - 고객용 공개 견적서 페이지 (optional 항목 선택 + 실시간 총액 + 수락) - 마케팅 SVG 에셋 6종 (썸네일 5개 + 배너 1개) + 관리자 에셋 페이지 - 전체 카피 강화: 크레덴셜 제거 → URL증거/환불보장/계약서/납기패널티 중심 Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
126 lines
7.9 KiB
XML
126 lines
7.9 KiB
XML
<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="400" viewBox="0 0 1200 400">
|
|
<defs>
|
|
<linearGradient id="bgGrad" x1="0%" y1="0%" x2="100%" y2="100%">
|
|
<stop offset="0%" style="stop-color:#0f172a;stop-opacity:1"/>
|
|
<stop offset="60%" style="stop-color:#1e1b4b;stop-opacity:1"/>
|
|
<stop offset="100%" style="stop-color:#1e3a8a;stop-opacity:1"/>
|
|
</linearGradient>
|
|
<linearGradient id="textGrad" x1="0%" y1="0%" x2="100%" y2="0%">
|
|
<stop offset="0%" style="stop-color:#60a5fa;stop-opacity:1"/>
|
|
<stop offset="100%" style="stop-color:#a78bfa;stop-opacity:1"/>
|
|
</linearGradient>
|
|
<radialGradient id="glowBlue" cx="75%" cy="35%" r="40%">
|
|
<stop offset="0%" style="stop-color:#2563eb;stop-opacity:0.25"/>
|
|
<stop offset="100%" style="stop-color:#2563eb;stop-opacity:0"/>
|
|
</radialGradient>
|
|
<radialGradient id="glowViolet" cx="85%" cy="70%" r="30%">
|
|
<stop offset="0%" style="stop-color:#7c3aed;stop-opacity:0.2"/>
|
|
<stop offset="100%" style="stop-color:#7c3aed;stop-opacity:0"/>
|
|
</radialGradient>
|
|
<clipPath id="browserClip">
|
|
<rect x="650" y="40" width="510" height="320" rx="12"/>
|
|
</clipPath>
|
|
<filter id="shadow" x="-10%" y="-10%" width="130%" height="130%">
|
|
<feDropShadow dx="0" dy="8" stdDeviation="16" flood-color="#000000" flood-opacity="0.5"/>
|
|
</filter>
|
|
<filter id="badgeShadow">
|
|
<feDropShadow dx="0" dy="2" stdDeviation="4" flood-color="#2563eb" flood-opacity="0.4"/>
|
|
</filter>
|
|
<filter id="priceShadow">
|
|
<feDropShadow dx="0" dy="2" stdDeviation="6" flood-color="#7c3aed" flood-opacity="0.5"/>
|
|
</filter>
|
|
<pattern id="dots" x="0" y="0" width="40" height="40" patternUnits="userSpaceOnUse">
|
|
<circle cx="20" cy="20" r="1" fill="#334155" opacity="0.5"/>
|
|
</pattern>
|
|
</defs>
|
|
|
|
<!-- 배경 -->
|
|
<rect width="1200" height="400" fill="url(#bgGrad)"/>
|
|
<rect width="1200" height="400" fill="url(#glowBlue)"/>
|
|
<rect width="1200" height="400" fill="url(#glowViolet)"/>
|
|
<rect width="1200" height="400" fill="url(#dots)"/>
|
|
|
|
<!-- 신뢰 뱃지 -->
|
|
<rect x="60" y="48" width="260" height="34" rx="17" fill="#1d4ed8" filter="url(#badgeShadow)"/>
|
|
<text x="190" y="70" text-anchor="middle" font-family="'Malgun Gothic','Apple SD Gothic Neo',Arial,sans-serif" font-size="13" font-weight="700" fill="#ffffff">★ 100% 만족보장 · 로켓 납품</text>
|
|
|
|
<!-- 메인 헤드라인 -->
|
|
<text x="60" y="130" font-family="'Malgun Gothic','Apple SD Gothic Neo',Arial,sans-serif" font-size="40" font-weight="800" fill="#ffffff">7년차 대기업 개발자가</text>
|
|
<text x="60" y="182" font-family="'Malgun Gothic','Apple SD Gothic Neo',Arial,sans-serif" font-size="40" font-weight="800" fill="url(#textGrad)">직접 만드는 홈페이지</text>
|
|
|
|
<!-- 서브텍스트 -->
|
|
<text x="60" y="228" font-family="'Malgun Gothic','Apple SD Gothic Neo',Arial,sans-serif" font-size="17" fill="#94a3b8">코드 품질 · 성능 최적화 · SEO 설정까지 원스톱</text>
|
|
|
|
<!-- 가격 뱃지 -->
|
|
<rect x="60" y="255" width="200" height="48" rx="12" fill="#7c3aed" filter="url(#priceShadow)"/>
|
|
<text x="160" y="274" text-anchor="middle" font-family="'Malgun Gothic',Arial,sans-serif" font-size="12" font-weight="600" fill="#ddd6fe">시작 가격</text>
|
|
<text x="160" y="294" text-anchor="middle" font-family="'Malgun Gothic',Arial,sans-serif" font-size="22" font-weight="800" fill="#ffffff">스타터 50만원~</text>
|
|
|
|
<!-- 체크리스트 -->
|
|
<circle cx="74" cy="334" r="9" fill="#22c55e" opacity="0.2"/>
|
|
<text x="74" y="339" text-anchor="middle" font-family="Arial" font-size="11" font-weight="700" fill="#22c55e">✓</text>
|
|
<text x="92" y="339" font-family="'Malgun Gothic',Arial,sans-serif" font-size="14" fill="#94a3b8">반응형 디자인</text>
|
|
|
|
<circle cx="224" cy="334" r="9" fill="#22c55e" opacity="0.2"/>
|
|
<text x="224" y="339" text-anchor="middle" font-family="Arial" font-size="11" font-weight="700" fill="#22c55e">✓</text>
|
|
<text x="242" y="339" font-family="'Malgun Gothic',Arial,sans-serif" font-size="14" fill="#94a3b8">SEO 최적화</text>
|
|
|
|
<circle cx="364" cy="334" r="9" fill="#22c55e" opacity="0.2"/>
|
|
<text x="364" y="339" text-anchor="middle" font-family="Arial" font-size="11" font-weight="700" fill="#22c55e">✓</text>
|
|
<text x="382" y="339" font-family="'Malgun Gothic',Arial,sans-serif" font-size="14" fill="#94a3b8">무료 A/S</text>
|
|
|
|
<!-- URL -->
|
|
<text x="60" y="380" font-family="Arial,sans-serif" font-size="13" fill="#475569">jaengseung-made.com</text>
|
|
|
|
<!-- 브라우저 목업 -->
|
|
<g filter="url(#shadow)">
|
|
<rect x="650" y="40" width="510" height="320" rx="12" fill="#1e293b" stroke="#334155" stroke-width="1"/>
|
|
<!-- 탭바 -->
|
|
<rect x="650" y="40" width="510" height="36" rx="12" fill="#0f172a"/>
|
|
<rect x="650" y="64" width="510" height="12" fill="#0f172a"/>
|
|
<circle cx="676" cy="58" r="6" fill="#ef4444"/>
|
|
<circle cx="698" cy="58" r="6" fill="#f59e0b"/>
|
|
<circle cx="720" cy="58" r="6" fill="#22c55e"/>
|
|
<rect x="740" y="48" width="360" height="20" rx="10" fill="#1e293b" stroke="#334155" stroke-width="1"/>
|
|
<text x="920" y="62" text-anchor="middle" font-family="Arial,sans-serif" font-size="10" fill="#64748b">jaengseung-made.com</text>
|
|
<!-- 내부 콘텐츠 -->
|
|
<g clip-path="url(#browserClip)">
|
|
<rect x="650" y="76" width="510" height="284" fill="#f8fafc"/>
|
|
<!-- 네비 -->
|
|
<rect x="650" y="76" width="510" height="40" fill="#1d4ed8"/>
|
|
<rect x="668" y="88" width="60" height="16" rx="8" fill="#ffffff" opacity="0.3"/>
|
|
<rect x="870" y="88" width="40" height="16" rx="8" fill="#ffffff" opacity="0.2"/>
|
|
<rect x="918" y="88" width="40" height="16" rx="8" fill="#ffffff" opacity="0.2"/>
|
|
<rect x="966" y="88" width="40" height="16" rx="8" fill="#ffffff" opacity="0.2"/>
|
|
<rect x="1080" y="84" width="64" height="24" rx="12" fill="#7c3aed"/>
|
|
<!-- 히어로 -->
|
|
<rect x="650" y="116" width="510" height="110" fill="#eff6ff"/>
|
|
<rect x="695" y="134" width="200" height="18" rx="9" fill="#bfdbfe"/>
|
|
<rect x="695" y="160" width="160" height="18" rx="9" fill="#93c5fd"/>
|
|
<rect x="695" y="186" width="100" height="28" rx="14" fill="#2563eb"/>
|
|
<rect x="980" y="122" width="160" height="96" rx="8" fill="#dbeafe"/>
|
|
<rect x="996" y="138" width="80" height="10" rx="5" fill="#93c5fd"/>
|
|
<rect x="996" y="154" width="120" height="10" rx="5" fill="#bfdbfe"/>
|
|
<rect x="996" y="170" width="100" height="10" rx="5" fill="#bfdbfe"/>
|
|
<!-- 카드들 -->
|
|
<rect x="668" y="242" width="148" height="90" rx="8" fill="#ffffff" stroke="#e2e8f0" stroke-width="1"/>
|
|
<rect x="668" y="242" width="148" height="6" rx="3" fill="#2563eb"/>
|
|
<rect x="680" y="258" width="60" height="10" rx="5" fill="#e2e8f0"/>
|
|
<rect x="680" y="276" width="100" height="8" rx="4" fill="#f1f5f9"/>
|
|
<rect x="680" y="292" width="80" height="8" rx="4" fill="#f1f5f9"/>
|
|
<rect x="826" y="242" width="148" height="90" rx="8" fill="#ffffff" stroke="#e2e8f0" stroke-width="1"/>
|
|
<rect x="826" y="242" width="148" height="6" rx="3" fill="#7c3aed"/>
|
|
<rect x="838" y="258" width="60" height="10" rx="5" fill="#ddd6fe"/>
|
|
<rect x="838" y="276" width="100" height="8" rx="4" fill="#ede9fe"/>
|
|
<rect x="984" y="242" width="148" height="90" rx="8" fill="#ffffff" stroke="#e2e8f0" stroke-width="1"/>
|
|
<rect x="984" y="242" width="148" height="6" rx="3" fill="#059669"/>
|
|
<rect x="996" y="258" width="60" height="10" rx="5" fill="#d1fae5"/>
|
|
<rect x="996" y="276" width="100" height="8" rx="4" fill="#ecfdf5"/>
|
|
</g>
|
|
</g>
|
|
|
|
<!-- 하단 바 -->
|
|
<rect x="0" y="368" width="1200" height="32" fill="#1d4ed8"/>
|
|
<text x="600" y="389" text-anchor="middle" font-family="'Malgun Gothic','Apple SD Gothic Neo',Arial,sans-serif" font-size="13" font-weight="600" fill="#ffffff">7년차 대기업 백엔드 개발자 박재오 | 기획부터 런칭까지 원스톱 | jaengseung-made.com</text>
|
|
</svg>
|