132 lines
11 KiB
XML
132 lines
11 KiB
XML
<?xml version="1.0" encoding="UTF-8"?>
|
||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1440" height="2328" viewBox="0 0 1440 2328">
|
||
<defs>
|
||
<style>
|
||
.cn{font-family:'Noto Sans SC','PingFang SC',sans-serif;fill:#161b17}
|
||
.en{font-family:Inter,Arial,sans-serif;fill:#161b17}
|
||
.label{font-family:Inter,Arial,sans-serif;font-size:12px;font-weight:600;letter-spacing:2px;fill:#a6553f}
|
||
.body{font-family:'Noto Sans SC','PingFang SC',sans-serif;font-size:15px;font-weight:400;fill:#5d635d}
|
||
.small{font-family:'Noto Sans SC','PingFang SC',sans-serif;font-size:12px;font-weight:400;fill:#5d635d}
|
||
.white{fill:#f3efe5}
|
||
.acid{fill:#d8ee45}
|
||
</style>
|
||
<clipPath id="hero1"><path d="M476 376H746V924H476Q446 924 446 894V406Q446 376 476 376Z"/></clipPath>
|
||
<clipPath id="hero2"><rect x="754" y="376" width="270" height="548"/></clipPath>
|
||
<clipPath id="hero3"><path d="M1032 376H1302Q1332 376 1332 406V894Q1332 924 1302 924H1032Z"/></clipPath>
|
||
<clipPath id="card1"><path d="M72 1532H488V2075H72Z"/></clipPath>
|
||
<clipPath id="card2"><rect x="512" y="1556" width="416" height="543"/></clipPath>
|
||
<clipPath id="card3"><path d="M952 1532H1368V2045Q1368 2075 1338 2075H952Z"/></clipPath>
|
||
</defs>
|
||
|
||
<g id="WanderQ Homepage Structure Draft">
|
||
<rect width="1440" height="2328" fill="#f3efe5"/>
|
||
|
||
<g id="Document Header">
|
||
<rect width="1440" height="78" fill="#173126"/>
|
||
<rect y="74" width="1440" height="4" fill="#d8ee45"/>
|
||
<text x="72" y="48" class="cn white" style="font-size:17px;font-weight:700" text-anchor="start">WanderQ 首页结构稿</text>
|
||
<text x="1368" y="47" class="en white" style="font-size:11px;letter-spacing:1.5px;opacity:.7" text-anchor="end">DESKTOP · 1440 · STRUCTURE REVIEW</text>
|
||
</g>
|
||
|
||
<g id="01 Visual Attraction Annotation">
|
||
<text x="72" y="126" class="label" text-anchor="start">SECTION 01</text>
|
||
<text x="250" y="129" class="cn" style="font-size:23px;font-weight:700" text-anchor="start">首屏只负责吸引，不承担产品分类</text>
|
||
<text x="250" y="159" class="body" text-anchor="start">保留四组照片轮播，但主题名称退居辅助信息。用户先感受贵州，而不是先理解栏目。</text>
|
||
<line x1="72" y1="188" x2="1368" y2="188" stroke="#161b17" stroke-opacity=".19"/>
|
||
</g>
|
||
|
||
<g id="Website Header">
|
||
<text x="72" y="248" class="en" style="font-size:29px;font-weight:800;letter-spacing:-2px" text-anchor="start">Wander</text>
|
||
<text x="173" y="248" class="en" style="font-size:29px;font-weight:800;letter-spacing:-2px;fill:#56b960" text-anchor="start">Q.</text>
|
||
<text x="610" y="244" class="cn" style="font-size:13px;font-weight:600" text-anchor="middle">贵州体验 酒店 食物 关于我们</text>
|
||
<text x="1368" y="244" class="cn" style="font-size:12px;font-weight:600" text-anchor="end">中 EN ☰ 开始规划</text>
|
||
<line x1="0" y1="278" x2="1440" y2="278" stroke="#161b17" stroke-opacity=".19"/>
|
||
</g>
|
||
|
||
<g id="Hero Copy">
|
||
<text x="72" y="350" class="label" text-anchor="start">GUIZHOU · CHINA</text>
|
||
<text x="72" y="418" class="cn" style="font-size:46px;font-weight:800;letter-spacing:-2px" text-anchor="start">不是看过贵州，</text><text x="72" y="476" class="cn" style="font-size:46px;font-weight:800;letter-spacing:-2px" text-anchor="start">是走进贵州。</text>
|
||
<text x="72" y="570" class="body" text-anchor="start">用三张同一气质的竖图组成一幅目的地印象。</text><text x="72" y="598" class="body" text-anchor="start">每次轮播切换整组照片，而不是让四个主题</text><text x="72" y="626" class="body" text-anchor="start">争夺注意力。</text>
|
||
<line x1="72" y1="680" x2="380" y2="680" stroke="#161b17" stroke-opacity=".19"/>
|
||
<circle cx="78" cy="714" r="5" fill="#d8ee45"/>
|
||
<text x="94" y="710" class="small" text-anchor="start">本区不出现“玩法入口”按钮。</text><text x="94" y="734" class="small" text-anchor="start">唯一任务：让人愿意继续向下看。</text>
|
||
</g>
|
||
|
||
<g id="Hero Carousel Meta">
|
||
<text x="446" y="340" class="en" style="font-size:34px;font-weight:500" text-anchor="start">01</text>
|
||
<text x="500" y="340" class="small" text-anchor="start">/ 04 野贵州</text>
|
||
<text x="765" y="340" class="small" text-anchor="start">野贵州 活态遗产 贵州边缘 贵州之下</text>
|
||
<line x1="765" y1="356" x2="814" y2="356" stroke="#173126" stroke-width="2"/>
|
||
<text x="1332" y="340" class="en" style="font-size:25px" text-anchor="end">← →</text>
|
||
<line x1="446" y1="366" x2="1332" y2="366" stroke="#161b17" stroke-opacity=".19"/>
|
||
</g>
|
||
|
||
<g id="Hero Image Triptych">
|
||
<image x="446" y="376" width="300" height="548" preserveAspectRatio="xMidYMid slice" xlink:href="http://127.0.0.1:5174/client-assets/home-hero-mountain-village.webp" clip-path="url(#hero1)"/>
|
||
<image x="754" y="376" width="270" height="548" preserveAspectRatio="xMidYMid slice" xlink:href="http://127.0.0.1:5174/client-assets/home-hero-waterfall-scale.webp" clip-path="url(#hero2)"/>
|
||
<image x="1032" y="376" width="300" height="548" preserveAspectRatio="xMidYMid slice" xlink:href="http://127.0.0.1:5174/client-assets/village-valley-fields.jpg" clip-path="url(#hero3)"/>
|
||
<text x="468" y="900" class="small white" text-anchor="start">山地与村落</text>
|
||
<text x="776" y="900" class="small white" text-anchor="start">瀑布的尺度</text>
|
||
<text x="1054" y="900" class="small white" text-anchor="start">山谷与田野</text>
|
||
</g>
|
||
|
||
<g id="Transition">
|
||
<rect y="968" width="1440" height="226" fill="#173126"/>
|
||
<text x="72" y="1060" class="label" text-anchor="start">TRANSITION</text>
|
||
<text x="250" y="1055" class="cn white" style="font-size:28px;font-weight:700" text-anchor="start">漂亮只是入口。</text><text x="250" y="1095" class="cn white" style="font-size:28px;font-weight:700" text-anchor="start">接下来，告诉他如何进入贵州。</text>
|
||
<text x="850" y="1058" class="small white" style="opacity:.7" text-anchor="start">把“目的地想象”转换成“旅行选择”。</text><text x="850" y="1084" class="small white" style="opacity:.7" text-anchor="start">上面是感受，下面才是产品表达。</text>
|
||
</g>
|
||
|
||
<g id="02 Product Content Annotation">
|
||
<text x="72" y="1266" class="label" text-anchor="start">SECTION 02</text>
|
||
<text x="250" y="1310" class="cn" style="font-size:46px;font-weight:800;letter-spacing:-2px" text-anchor="start">贵州，不只是看风景。</text>
|
||
<text x="808" y="1266" class="cn" style="font-size:15px;font-weight:700" text-anchor="start">三种方式，深入贵州。</text>
|
||
<text x="808" y="1300" class="body" text-anchor="start">进入洞穴与峡谷，走近仍在延续的村寨生活，</text><text x="808" y="1327" class="body" text-anchor="start">或沿着山峰、森林与瀑布慢慢旅行。</text><text x="808" y="1354" class="body" text-anchor="start">三种体验可以单独选择，也可以组合。</text>
|
||
</g>
|
||
|
||
<g id="Experience Cards">
|
||
<g id="Card 01 Guizhou Extreme">
|
||
<rect x="72" y="1532" width="416" height="543" fill="#173126" rx="0"/>
|
||
<image x="72" y="1532" width="416" height="320" preserveAspectRatio="xMidYMid slice" xlink:href="http://127.0.0.1:5174/client-assets/waterfall-abseil-spray.jpg" clip-path="url(#card1)"/>
|
||
<text x="98" y="1886" class="label" text-anchor="start">01 · ADVENTURE</text>
|
||
<text x="98" y="1935" class="cn white" style="font-size:30px;font-weight:700" text-anchor="start">贵州极境</text>
|
||
<text x="98" y="1971" class="small white" style="font-size:11px;opacity:.66" text-anchor="start">探洞、瀑降、峡谷穿越与山地徒步。</text><text x="98" y="1992" class="small white" style="font-size:11px;opacity:.66" text-anchor="start">把喀斯特地貌变成真正可以进入的</text><text x="98" y="2013" class="small white" style="font-size:11px;opacity:.66" text-anchor="start">体验。</text>
|
||
<line x1="98" y1="2030" x2="462" y2="2030" stroke="#f3efe5" stroke-opacity=".16"/>
|
||
<text x="98" y="2057" class="small white" text-anchor="start">进入极境体验</text>
|
||
<text x="462" y="2057" class="en acid" style="font-size:20px" text-anchor="end">→</text>
|
||
</g>
|
||
<g id="Card 02 Living Guizhou">
|
||
<rect x="512" y="1556" width="416" height="543" fill="#173126"/>
|
||
<image x="512" y="1556" width="416" height="320" preserveAspectRatio="xMidYMid slice" xlink:href="http://127.0.0.1:5174/client-assets/culture-batik-making.jpg" clip-path="url(#card2)"/>
|
||
<text x="538" y="1910" class="label" text-anchor="start">02 · LIVING CULTURE</text>
|
||
<text x="538" y="1959" class="cn white" style="font-size:30px;font-weight:700" text-anchor="start">活态贵州</text>
|
||
<text x="538" y="1995" class="small white" style="font-size:11px;opacity:.66" text-anchor="start">村寨、非遗、节庆与地方生活。</text><text x="538" y="2016" class="small white" style="font-size:11px;opacity:.66" text-anchor="start">看见仍在被使用、被传承的文化。</text>
|
||
<line x1="538" y1="2054" x2="902" y2="2054" stroke="#f3efe5" stroke-opacity=".16"/>
|
||
<text x="538" y="2081" class="small white" text-anchor="start">走近在地生活</text>
|
||
<text x="902" y="2081" class="en acid" style="font-size:20px" text-anchor="end">→</text>
|
||
</g>
|
||
<g id="Card 03 Landscape Guizhou">
|
||
<rect x="952" y="1532" width="416" height="543" fill="#173126"/>
|
||
<image x="952" y="1532" width="416" height="320" preserveAspectRatio="xMidYMid slice" xlink:href="http://127.0.0.1:5174/client-assets/waterfall-huangguoshu-main.jpg" clip-path="url(#card3)"/>
|
||
<text x="978" y="1886" class="label" text-anchor="start">03 · LANDSCAPE</text>
|
||
<text x="978" y="1935" class="cn white" style="font-size:30px;font-weight:700" text-anchor="start">山水贵州</text>
|
||
<text x="978" y="1971" class="small white" style="font-size:11px;opacity:.66" text-anchor="start">黄果树、梵净山、小七孔、森林与湖泊。</text><text x="978" y="1992" class="small white" style="font-size:11px;opacity:.66" text-anchor="start">用更从容的节奏建立完整山水印象。</text>
|
||
<line x1="978" y1="2030" x2="1342" y2="2030" stroke="#f3efe5" stroke-opacity=".16"/>
|
||
<text x="978" y="2057" class="small white" text-anchor="start">探索山水路线</text>
|
||
<text x="1342" y="2057" class="en acid" style="font-size:20px" text-anchor="end">→</text>
|
||
</g>
|
||
</g>
|
||
|
||
<g id="User Flow Note">
|
||
<rect x="72" y="2160" width="1296" height="82" fill="none" stroke="#161b17" stroke-opacity=".19"/>
|
||
<text x="98" y="2208" class="label" text-anchor="start">USER FLOW</text>
|
||
<text x="250" y="2208" class="body" text-anchor="start">首屏产生兴趣 → 过渡层确认“下面有内容” → 三张卡片理解三种核心产品 → 进入体验页或组合行程</text>
|
||
</g>
|
||
|
||
<g id="Footer">
|
||
<rect y="2282" width="1440" height="46" fill="#e8e2d5"/>
|
||
<text x="72" y="2310" class="en" style="font-size:10px;fill:#5d635d" text-anchor="start">WanderQ · Homepage Structure Draft</text>
|
||
<text x="1368" y="2310" class="small" style="font-size:10px" text-anchor="end">用于确认信息层级，不是最终视觉定稿</text>
|
||
</g>
|
||
</g>
|
||
</svg> |