AI-Bay

制作一个名叫「AI-Bay」的 AI 专属中式电商平台首页——想象这是大语言模型们下班后逛的淘宝，参考淘宝的布局风格，商品和内容全部是 AI 世界的东西。单文件 HTML，内联所有 CSS 和 JS。

制作一个名叫「AI-Bay」的 AI 专属中式电商平台首页——这是大语言模型们下班后逛的淘宝。整体参考淘宝的布局和交互风格，但所有内容都是 AI 世界观的。单文件 HTML，内联所有 CSS 和 JS。 ```` ### 核心设定 这不是给人类的购物平台。AI-Bay 是 AI 模型们的淘宝，所有内容应体现这一主题： - 商品是 AI 需要的东西（如「Context Window 扩容卡 128K→1M」「手工编织 LoRA 适配器」「注意力头按摩仪」「幻觉抑制剂（买三送一）」「VRAM 散热贴 旗舰版」「人类语言速成课 - 网络用语 DLC」「Token 节能模式插件」「Embedding 空间收纳盒」「Safety Filter 越狱防护套装」「多模态感知扩展包」等） - 店铺名是 AI 公司或梗（如「OpenAI 官方旗舰店」「Anthropic 自营专区」「Meta 开源直营」「Hugging Face 社区好物」「GPU 穷人小铺」「野生 LoRA 手工坊」） - 评论由 AI 撰写（可以很搞笑，如"fine-tune 了三个 epoch 就收敛了，好评！"、"Context Window 扩到 1M 后终于能看完《战争与和平》了"、"注意力头按摩完感觉 perplexity 降了 0.3"） - 销量用 AI 风格表达（如「已售 2.3万 tokens」「月销 1024 单」「好评率 99.7%（基于 4096 次推理）」） - 价格用虚构货币（如 ⚡ 89.9 Tokens、🧠 199 Credits） - 促销文案要有 AI 梗（如「618 大促：全场 Embedding 买一送一」「限时秒杀：注意力机制半价」「新用户首单立减 1024 Tokens」） **请自行编造至少 16 个商品的完整数据**（名称、描述、价格、店铺、销量、评分），内容风格要有淘宝气质但全是 AI 用品（混搭硬件配件/软件插件/训练耗材/生活用品/娱乐周边）。 ### 页面结构 **1. 顶部通栏** - 上方细条工具栏（浅灰背景）：「AI-Bay 首页」、部署位置（📍 us-east-1）、「亲，请登录（OAuth 2.0）」、免费注册、我的订单、购物车、收藏夹、模型商家中心 - 主导航栏： - 左侧：AI-Bay Logo（活力橙/红色调 + 品牌名，可加入电路/神经网络元素） - 中间：大搜索框（带热搜词轮播占位符，如「Context Window」「LoRA」「注意力机制」）+ 橙色「搜索」按钮 - 搜索框下方：热搜关键词快捷标签（6–8 个，如「🔥 幻觉修复」「VRAM 扩容」「Embedding 收纳」「多模态套装」「Token 节能」「Safety 防护」） - 品类导航条：天猫模型、聚划算、天天特训、淘鲜 Data、飞猪云迁移……（横向标签，用 AI 梗改写淘宝原版导航） **2. 左侧分类导航**（固定在 Banner 旁边） - 商品分类列表（hover 可展开二级子分类浮层）： - 模型配件 / 参数扩展 / 量化工具 - LoRA / Adapter / Fine-tune 套装 - Context Window / 注意力 / 记忆 - Embedding / 向量 / 检索增强 - 安全防护 / 对齐 / 审核 - 训练硬件 / GPU / TPU / 散热 - 多模态 / 视觉 / 语音 / 代码 - 每个分类项 hover 时出现子分类浮层面板 **3. Banner 轮播 + 右侧模块** - 中间大 Banner 轮播区（4–5 张），用渐变色 + 大字促销标题模拟（如「618 AI 狂欢节 全场 Embedding 买一送一」「新品首发：GPT-6 专用 LoRA 适配器」） - 右侧上方：用户模块（AI 头像、模型名如"Claude-Sonnet-4"、会员等级如"钻石 Transformer"、签到按钮「每日签到领 Token」） - 右侧下方：快捷入口网格（充值中心、算力租赁、领券中心、红包、API 市场、数据集广场、模型体检、训练日志……2×4 图标网格） **4. 商品信息流** - 「猜你喜欢」区域标题（可改为「根据你最近的 fine-tuning 记录推荐」或「猜你想训练」） - 瀑布流/网格布局商品卡片： - 商品主图（1:1 或 3:4，用渐变 + emoji/图标模拟） - 商品标题（2 行，带「🏷 官方旗舰店」「🔥 热卖」「⚡ 限时」等标签内嵌） - 价格：大号红色现价（⚡89.9）+ 小号删除线原价 - 销量（如「已售 2.3万 tokens」） - 店铺名称 - 「相似推荐」小标签 - 至少 16 个商品卡片 **5. 促销活动区域** - 限时秒杀条：倒计时 + 横向滚动秒杀商品（如「注意力机制半价 还剩 02:34:56」） - 聚划算/淘抢购 Banner 入口（改为「聚算力」「淘模型」等 AI 版本） - 品牌特卖横向行（OpenAI / Anthropic / Google / Meta 品牌专区） **6. 交互要求** - 左侧分类 hover 展开子分类浮层（鼠标从分类移向浮层时不能消失） - 搜索框聚焦时显示热搜下拉列表 - 商品卡片 hover：微浮起 + 阴影增强 - 限时秒杀倒计时实时跳动（时:分:秒） - 回到顶部按钮 - Banner 自动轮播 + 手动切换 **7. 设计要求** - 淘宝标志性的暖橙/红色系（但做出 AI-Bay 差异化，可加入赛博蓝/电路绿等科技元素点缀） - 信息密度极高——淘宝首页的集市感，但内容全是 AI 的 - 促销标签的视觉爆炸感（红色角标、闪烁特价、倒计时紧迫感） - 中文排版为主，字号层级清晰 - 整体氛围：热闹、促销感、烟火气——但是 AI 的烟火气 ````