🌌 作品名称：《星际旅行社》—— 商业级高动效 AI 网页生成提示词 🎯 核心价值 (Core Value) 本作品的核心价值在于“用结构化语言驾驭 AI 的审美与工程能力”。 创意平权与降本增效：将传统前端开发中门槛极高的“现代动效与UI设计”（如粒子系统、滚动视差）转化为自然语言模板。让完全没有代码或设计背景的用户，也能实现“一键生成”极具视觉冲击力的商业级着陆页。 解决 AI 幻觉与审美崩塌：针对用户常见的模糊指令（如“随便做个网页，花哨一点”），本 Prompt 提供了一套经过严格校验的控制框架。通过锁定配色、材质和具体技术方案，彻底解决了 AI 自由发挥时容易产生的“配色混乱、逻辑缺���、只懂堆砌元素”等痛点。 💡 适用场景 (Applicable Scenarios) 快速原型构建 (MVP & Prototyping)：极度适用于初创团队、独立开发者在 0 到 1 阶段，为 Web3、AI工具、独立游戏、前沿科技硬件 等项目快速搭建高逼格的产品官网或着陆页（Landing Page）。 Prompt Engineering 教学与评测：作为结构化提示词的标杆案例，可用于展示如何通过“角色设定 + 全局规范 + 具象化细节 + 技术授权”的四维模型来榨干 LLM (大型语言模型) 的代码生成潜力。 前端动效代码脚手架：为专业前端开发者提供一个包含现代流行趋势（如毛玻璃、发光阴影）的基础骨架，开发者可直接在生成的代码上进行业务逻辑的二次开发，节省大量 CSS 调优时间。 ✨ 亮点功能 (Highlighted Features) 将“抽象感觉”转化为“具象工程指令”： 摒弃了空洞的形容词。将需求中的“花哨”，精准拆解为了前端可实现的5大核心动效（自定义鼠标拖尾、Canvas星空粒子背景、打字机特效、GSAP级滚动视差、Hover 3D 浮动）。让 AI 生成的代码招招命中现代 Web 审美的爽点。 教科书级的 UI/UX 品控： 直接内置了成熟的视觉设计规范系统。限定了“深空黑+霓虹青+星云紫”的赛博太空配色，并强制应用 Glassmorphism（毛玻璃质感）和 Neon Glow（霓虹发光），确保页面呈现出极强的未来感与奢华感。 模块化与商业逻辑闭环： 不仅注重视觉，更注重产品的转化率设计。将页面严格划分为：带透明渐变的导航栏 -> 极具煽动性的英雄区(Hero) -> 带有浮雕动效的卡片展示区 -> 特色卖点区，形成了一个完整、可商用的着陆页结构。 灵活的技术放权机制： 在提示词中特别加入了“允许引入第三方 CDN 库（如 Particles.js， Tailwind， AOS.js）”的指令。打破了原生手写代码的局限性，让 AI 能够调用成熟的开源生态，极大地拔高了最终网页的动态表现力上限。
所有作品均通过 EdgeOne Makers Skill 生成并部署，具备CDN加速、安全防护能力，可按需接入后端服务。获取 Prompt 或 Skill后，在WorkBuddy中按指引操作（含 EdgeOne Makers Skill 安装步骤等），即可生成并上线你的同款网站。
# 角色设定
你是一个世界顶级的资深前端开发工程师和UI/UX设计师，擅长使用现代Web技术创建极具视觉冲击力、高交互性且性能优优越的网页。
# 任务目标
请为一家名为“Nexus Galaxy（星流）”的
**星际旅行社**
设计并编写一个单页面的官方着陆页（Landing Page）。这个网页必须非常“花哨”、精美、充满未来科技感，并且完全响应式。请直接提供可运行的完整代码（HTML/CSS/JS，或基于React/Tailwind的单文件代码）。
# 视觉设计规范 (UI/UX)
1. **主题风格**
：赛博朋克与未来太空交织的风格。要求充满神秘感、科技感和奢华感。
2. **配色方案**
：
-
背景色：深空黑（#0b0f19）到暗紫色的渐变。
-
主色调：霓虹青（#00f3ff）和星云紫（#bc13fe），用于按钮、高亮和发光效果。
-
文本色：纯白（#ffffff）和浅灰（#a0aec0）。
3. **材质与质感**：大量使用**毛玻璃效果（Glassmorphism）**（半透明背景+背景模糊+细边框）和**发光阴影（Neon Glow）**
。
# 核心“花哨”交互与特效要求（必须实现）
1. **自定义鼠标指针**
：鼠标指针替换为一个带有发光拖尾或光环的自定义样式。
2. **动态背景**
：全屏的星空粒子背景（可以通过Canvas或CSS动画实现星光闪烁或流星划过的效果）。
3. **打字机特效**
：首屏大标题需要有充满科技感的打字机逐字显示效果。
4. **滚动视差与动画**
：向下滚动时，页面元素（如卡片、图片）需要带有平滑的浮现（Fade-in-up）效果；卡片悬浮（Hover）时要有明显的3D倾斜放大或边框流光效果。
5. **炫酷按钮**
：主要的 CTA (Call to Action) 按钮必须具有动态渐变边框或呼吸灯光效。
# 页面结构要求（自上而下）
1. **透明导航栏 (Navbar)**
：
-
左侧：极具科技感的发光Logo（文本即可，如 "NEXUS"）。
-
右侧：导航链接和“立即预订”发光按钮。向下滚动时导航栏需增加毛玻璃背景。
2. **首屏英雄区 (Hero Section)**
：
-
居中显示打字机效果的主标题：“逃离地球，触及星辰”。
-
副标题：“2050年首屈一指的星际旅行服务，带您领略半人马座阿尔法星的绝美日落。”
-
两个按钮：“探索航线”（幽灵按钮）与“立刻启程”（高亮霓虹按钮）。
3. **热门航线区 (Destinations)**
：
-
使用 CSS Grid 或 Flexbox 排布的 3 张毛玻璃卡片（例如：火星殖民地、木卫二冰海、猎户座星云）。
-
每张卡片包含：背景图片、航线名称、旅行时长、以及 Hover 时的浮动和发光特效。
4. **特色服务区 (Features)**
：
-
用图标配合文字展示三个卖点（如：光速引擎、失重舱体验、全息星际导游），配合呼吸灯动画。
5. **页脚 (Footer)**
：
-
极简的版权信息，配合一条横向流动的霓虹渐变线条作为分割线。
# 技术要求
-
请将 HTML， CSS 和 JavaScript 整合在一个文件中（或者按照现代组件化结构给出代码），方便我直接在浏览器中预览。
- 允许引入第三方 CDN 库来实现花哨的效果（例如引入 `particles.js` 做粒子背景，引入 `GSAP` 或 `AOS.js` 做滚动动画，或使用 `Tailwind CSS`
进行快速布局）。
-
确保代码结构清晰，关键动画和特效部分有注释说明。
现在，请开始编写你的代码，让我看到一个令人惊艳的星际旅行网页！
Install this skill: https://github.com/TencentEdgeOne/edgeone-pages-skills, then deploy to EdgeOne Makers.感谢支持
如果你觉得这些作品很酷，给我们的 Github 仓库一个 Star