![]()
嗨大家好!我是阿真!
不久前刚和朋友讨论 Qwen3.8-Flash-Next 的测评报告,转头就看到 Qwen3.8-Max-0902 在 Code Arena 猛猛登顶了。Qwen 老师真是强者啊。
大家猛一听到 Qwen3.8-Max-0902 可能会觉得:哎,好熟悉,这个模型好像早就发布了?
这个模型发布一个多月后,又做了 0902 版本更新,重点补强编程和专业办公。官方希望它能接住真实业务、科研辅助和长周期这类复杂任务。
规格上,2.4 万亿总参数、950 亿激活参数,再加上 100 万 token 上下文,长文档和长任务都有了更充足的容量。
Code Arena 是全球知名的编程第三方评测。这次 Qwen3.8-Max-0902 拿到 1691 分,总榜第一,这不得让它跑几个项目试试。
![]()
操作过程都差不多。我直接在 Qwen Code 里调用 API,让它从终端完成项目。
下面直接看成品。
五个案例从 3D 互动、游戏规则一路测到数据仪表盘,看看它能否理解复杂约束、调用工具,并把长任务收成可用成品。
先做个好玩的 3D 海洋馆互动网页。
这个案例要做一座可游览的海洋乐园,底层用 Three.js 组织 3D 场景,还涉及动物曲线路径、镜头预设、实例化渲染和移动端适配。成品把蓝色穹顶、弧形道路、滨海绿地和馆内动物都搭了出来。模型把园区布局、动物运动与镜头交互连在一起,颜色统一、层次清楚,切进馆内依然有细节。
海洋馆主要测 3D 空间组织和多对象调度。建筑、动物、路线与镜头能同时成立,还兼顾性能和移动端,说明它能抓住复杂前端任务的整体关系。
Qwen 在终端完成冒烟测试、保存截图,并把项目经验写入长期记忆。
![]()
滑动查看完整提示词
none
使用 Three.js 创建一个梦幻的海洋馆互动微缩世界:打造一座明亮、精致、充满玩具质感的海洋主题乐园。鲸鲨、魔鬼鱼、海豚、企鹅、水母和热带鱼在不同展馆中游动,游客小车与观光设施穿梭于园区。整体需要像一套高级收藏级海洋乐园模型,同时具备鲜明的珠海横琴滨海气质。如果使用 Three.js,请在模块脚本之前添加 import map,将 "three" 和 "three/addons/" 映射到同一个固定版本,并且只能通过这两个名称导入。禁止在同一个作用域内重复使用标识符,请使用含义清楚的描述性变量名。#### 整体场景- 将整个海洋馆建在一块清晰可见的海岛式展示底座上,底座带有圆角、海浪纹理和玩具模型边缘。- 使用略微俯视的三分之四视角,让游客可以同时看清园区布局、建筑入口和水下展馆。- 园区整体呈现珠海横琴的滨海度假氛围,加入蓝天、海湾、棕榈树、步行道和小型观景平台。- 场景布局紧凑清晰,各个展馆通过弧形道路、玻璃通道和水景区域连接。- 加入少量绿地、礁石、沙滩和浅水区域,保持空间的呼吸感。#### 核心建筑与区域- 设置一座大型鲸鲨主题主馆,建筑拥有巨大的蓝色穹顶和鲸鲨尾鳍造型入口。- 设置海豚湾,包括弧形表演池、环形看台和跳跃的海豚。- 设置企鹅馆,加入冰川、雪地、小型水池和成群活动的企鹅。- 设置梦幻水母馆,使用半透明发光水箱和缓慢漂浮的彩色水母。- 设置热带珊瑚馆,加入色彩鲜艳的珊瑚、海草、热带鱼群和海底洞穴。- 设置海龟与魔鬼鱼区域,让海龟和魔鬼鱼从观景隧道上方游过。- 设置一座标志性的海洋灯塔或鲸尾雕塑,作为整个园区的视觉中心。- 加入横琴滨海天际线、远处跨海大桥和海湾轮廓,增强地域辨识度。#### 水族展示- 创建多个透明水箱,使用蓝绿色半透明材质表现海水。- 鲸鲨需要体型巨大、动作缓慢,持续环绕主水箱游动。- 魔鬼鱼以舒展的姿态滑翔,并与鱼群形成明显的大小对比。- 海豚可以周期性跃出水面,落水时产生简洁的卡通水花。- 企鹅可以在陆地行走、排队跳入水中,并在水下快速游动。- 水母保持缓慢的上下漂浮和轻柔的发光变化。- 小型鱼群需要形成有规律的群游效果,避免随机抖动和互相穿透。- 设置几段剖面式水族箱,让观众可以直接观察水面上方与水下空间。#### 游客与观光系统- 运行多辆色彩明亮的观光小车,在园区道路上循环行驶。- 加入一条小型高架观光轨道,让海洋主题列车经过鲸鲨馆、企鹅馆和海豚湾。- 设置分岔路线或观光车道切换点,使车辆能够切换不同游览路线。- 添加迷你游客、工作人员、售票亭、纪念品商店、遮阳棚和方向指示牌。- 游客动作保持简洁,可以包括排队、挥手、拍照和观看动物。- 让观光车辆持续经过具有代表性的展馆,形成清楚的游览节奏。#### 视觉风格- 整体采用明亮、精致、干净的玩具模型风格。- 建筑和动物可以采用圆润的低多边形造型,并保留各物种的典型轮廓。- 主色使用海洋蓝、青绿色、珊瑚橙、阳光黄和清新的植物绿。- 水体保持通透,避免颜色过深或透明层叠造成画面混乱。- 禁止使用昏暗灯光、浑浊海水、厚重雾气、脏污墙面和恐怖深海氛围。- 使用柔和日光、环境光和适度阴影,营造晴朗的珠海滨海度假感。- 所有文字标签使用简洁清晰的中文,并控制数量,避免遮挡主要场景。#### 互动控制- 海洋动物显示数量滑块。- 动物游动速度滑块。- 观光车与海洋列车数量控制。- 观光路线切换按钮。- 水族箱剖面显示开关。- 建筑屋顶隐藏开关,方便观察展馆内部。- 水面透明度调节。- 白天与傍晚灯光切换。- 跟随鲸鲨镜头。- 跟随海豚镜头。- 跟随观光小车镜头。- 一键重置为完整园区视角。#### 镜头预设- 完整海洋馆全景。- 鲸鲨主水箱内部。- 海底观景隧道。- 海豚跃水瞬间。- 企鹅馆近景。- 梦幻水母展厅。- 珊瑚鱼群视角。- 横琴滨海夜景。- 观光列车沿线视角。镜头切换需要使用平滑过渡,避免突然跳转。跟随镜头需要保持稳定的高度、距离和观察角度。#### 动画要求- 所有海洋动物沿平滑曲线路径运动。- 大型动物动作缓慢稳定,小型鱼群动作轻快整齐。- 海豚跳跃、企鹅入水和水母漂浮使用循环动画。- 动物转弯时需要平滑调整朝向,避免瞬间旋转。- 水面加入轻微波纹和缓慢反光变化。- 场景中的旗帜、树叶、气泡和水花可以加入轻柔动画。- 所有循环动画需要自然衔接,避免明显停顿。#### 技术要求- 使用实例化渲染处理鱼群、游客、树木、座椅、灯具、窗户、气泡和其他重复元素。- 合理复用几何体、材质和纹理,减少重复资源。- 使用曲线路径控制鲸鲨、魔鬼鱼、海豚、鱼群和观光车辆。- 透明水箱按照合理顺序渲染,减少闪烁和透明材质冲突。- 控制实时阴影数量,大型建筑和主要动物可以投射阴影,小型重复元素无需全部开启阴影。- 保持动物运动和镜头跟随平滑、稳定、容易预测。- 支持鼠标拖动旋转、滚轮缩放和触摸屏操作。- 控制界面需要适配桌面端和移动端。- 目标运行帧率不低于 55 FPS。- 将 devicePixelRatio 限制为不超过 2。- 页面加载完成后直接展示完整可运行的互动场景,不依赖外部模型文件也能正常显示。
接着来个 3D 微型赛车游戏。
小赛车要绕开巨型咖啡杯和便利贴等桌面障碍,同时与多个 AI 对手比赛。
底层涉及 Three.js 场景、AI 路径、检查点判定、出界恢复、道具效果和排名状态管理。虽然我先靠我超强的驾驶技术拿了第一,它仍会等所有选手到达终点后再结算。
车辆会跑、名次会变、违规会触发处理,最后还有完整结算。
这个案例重点测一把规则推理与状态管理。多个机制互相配合并形成完整闭环,比单纯让赛车跑起来更能说明系统能力。
滑动查看完整提示词
none
请制作一个浏览器 3D 微型赛车游戏“桌面极速赛”,使用 Three.js。要求:1. 交付可通过静态服务器运行的网页文件、脚本文件、样式文件和项目说明文件。2. 赛道位于办公桌微缩场景,包含键盘弯道、咖啡杯环岛、尺子跳台和便签障碍。3. 玩家与 3 名 AI 对手完成 3 圈比赛,AI 能沿赛道行驶、超车和从卡死状态恢复。4. 桌面支持 WASD 与方向键,手机支持方向触控和油门、刹车按钮。5. 必须有倒计时、圈数、当前名次、单圈时间、最佳圈速和终局排名。6. 车辆离开赛道超过 3 秒后回到最近检查点,并给予短暂无敌保护。7. 加入两个可拾取道具:短时加速和防撞护盾,效果与剩余时间要可见。8. 提供暂停、重新开始、音效开关和低画质模式。9. 第一圈结束前至少经过 6 个有效检查点,禁止通过倒车穿线刷圈。10. 在项目说明文件中写明操作、规则和已执行的自检。请亲自模拟完整一局的状态流程,检查开始、三圈计数、AI 完赛、掉出赛道恢复、终局与重开。
短视频里常有人讨论“地球 Online”。假设我们只是普通 NPC,也可以把生活小事包装成随机支线,通过抽卡抽到、揭开并立即执行,日常一下就有趣了。
这个网页使用 HTML、CSS、JavaScript,以及 3D 跟随、翻牌效果和响应式布局,还调用我提供的图片生成 API 制作噪点插画,风格很有系列感。
深蓝紫背景里放着任务卡牌,动效比较克制,用户一眼就知道下一步怎么做,同时保留了抽卡的仪式感。
抽卡网页主要测视觉意图理解和跨工具协同。模型完成交互、调用图片 API 补齐插画,还能统一卡面、动效与流程,设计和实现都妥妥接住。
滑动查看完整提示词
none
请直接创建一个可运行的中文单页互动网页,项目名称为《地球 Online:今日支线》,核心文案为“抽到什么,就去做什么”。它把打扫房间、整理衣物、清洁洗手池、照顾植物、散步和回复消息等生活小事包装成《地球 Online》里的随机支线任务。视觉参考:【这里有一个参考链接】只学习参考网站的卡牌舞台、颗粒插画、留白方式和轻盈动效节奏。重新设计属于《地球 Online》的原创卡背、任务插画、图形符号、配色、文字与交互。禁止复制原站插画、卡牌图案、字体、Logo、文案、源码和像素级版式。请直接完成可运行成品,不要只输出建议、线框图、伪代码或设计说明。项目以视觉呈现为主,功能保持轻量。一、项目范围整个体验包含五个状态:1. 首页等待抽取。2. 三张卡牌等待选择。3. 单张任务卡揭晓。4. 任务执行中。5. 任务完成结算。禁止加入登录、积分、排行榜、连续打卡、商城、社交、AI 接口、复杂推荐、任务后台、历史数据和数据库。页面无需滚动即可完成主要流程。二、首屏构图页面占满浏览器窗口。顶部左侧显示“EARTH ONLINE”,顶部右侧显示绿色状态点和“SERVER ONLINE”。中央标题为“今天的生活支线正在等待领取”,辅助文案为“把手放在卡片上,领取一件值得完成的小事”,主按钮为“抽取今日支线”。底部显示“玩家:你”“当前地图:家”“身份:普通 NPC”。标题、说明和按钮区域保持紧凑,减少顶部无效留白。三张卡牌位于画面中央,中间卡片靠前,左右卡片轻微旋转,形成稳定的扇形牌组。卡牌尺寸偏大,桌面端宽度上限约 436 像素,宽度不超过视口的 92%,高宽比约 1.5。手机端维持相同视觉中心,不允许卡牌、按钮和底部信息互相遮挡。三、背景视觉背景采用深蓝紫暮色,不使用纯黑色大底。基础渐变从 过渡到 ,再回到 。卡牌正后方加入低饱和淡紫柔光,左上加入克制的钴蓝光晕,右下加入珊瑚红光晕,左下加入薄荷绿光晕,并点缀极少量太阳黄。所有光斑边缘必须柔软,卡牌始终是最高对比度元素。在背景中建立“家庭星图”空间:1. 使用全屏内联 SVG 绘制断续路线、家庭区域轮廓、任务节点、方向刻度和 HOME-03 编号。2. 线宽控制在 0.6 至 1.15 像素,透明度保持克制。3. 三条流动路线分别使用钴蓝 、珊瑚红 、薄荷绿 。4. 路线必须由断线、缺口、节点和局部弧线组成,禁止使用两个完整椭圆反复旋转。5. 当前任务对应的节点可以亮起,其余节点保持低亮度。6. 背景保留少量星点、柔焦光斑、暗角和细颗粒,禁止加入写实星球、银河照片、霓虹网格和密集数据面板。背景状态需要跟随任务阶段变化。等待选择时路线稍微活跃,卡片揭晓后只突出当前节点,执行状态降低背景亮度,完成状态播放一次短促的线路闪光。页面隐藏时暂停持续动画。四、卡背与插画素材优先调用可用的图片生成工具创建真实位图素材,禁止用廉价占位图代替。生成一张竖版 3:5 原创卡背插画。设计要求:1. 温暖奶油色纸张底。2. 中央图腾由抽象小地球、拱形门和四角星组成。3. 周围环绕叶片、水滴、小房子、运动鞋、聊天气泡和折叠衣物等生活任务符号。4. 使用钴蓝、珊瑚红、太阳黄、薄荷绿、淡紫和暖白。5. 采用现代扁平编辑插画、丝网印刷和 risograph 颗粒质感。6. 构图饱满,边缘保留安全裁切区。7. 图片内部不要生成文字、数字、Logo、水印、黑色背景和粗金边。再生成一张严格的 4 列 2 行任务插画合集,八个格子等宽等高,按以下顺序排列:1. 手擦拭凌乱桌面,露出一块干净区域。2. 双手整理并叠好彩色衣物。3. 打开的抽屉被分成整齐的小区域。4. 手擦亮浴室洗手池。5. 水壶给室内植物浇水并摘除黄叶。6. 穿运动鞋在社区小路散步。7. 手机相册删除模糊和重复照片。8. 手在手机上回复一条消息。八张插画采用完全统一的扁平噪点风格、构图比例和配色。背景为暖白色,色彩明确,禁止黑漆漆的单色线稿。将插画合集程序化裁切为八张独立的任务插画,裁切后逐张检查,不能切到相邻画面。若当前环境没有图片生成能力,使用原创内联 SVG 完成同一套插画系统,但仍需满足彩色、扁平、颗粒统一和场景可辨识。五、卡牌视觉卡牌采用亮色奶油白卡面和 18 像素统一圆角。外边缘只保留 1 像素半透明高光描边,并加入很轻的内侧光泽和背景色阴影。禁止粗金边、厚重金属壳和大面积金色包边。卡背直接铺满生成的彩色卡背图片。卡片正面顶部保留一条 4 像素四色细条,依次使用钴蓝、珊瑚红、太阳黄和薄荷绿。正面内容按以下顺序排列:1. SIDE QUEST 编号与任务分类。2. 彩色任务插画。3. 任务名称。4. 预计时间。5. 一句具体行动说明。6. SYSTEM 系统旁白。7. “我去执行”按钮。插画区域自动吸收多余高度。任务说明和 SYSTEM 区域连续排列,禁止在两者之间留下大块空白。按钮始终位于卡片内部并可见。六、字体与排版优先使用本机 MiSans 字体。标题使用 MiSans Light,字重约 300,字形细长并带适量字距。任务标题使用 MiSans Medium,字重约 500。正文和按钮使用 MiSans Normal。英文状态与数字可使用 Avenir Next,并提供 OPPO Sans 4.0、Source Han Sans SC、PingFang SC 和系统无衬线字体回退。禁止使用宋体、粗重圆体、廉价科幻字体和过宽的等宽英文字体。页面标题保持轻盈,卡片任务名称保持清晰,微型状态文字不能小到无法阅读。七、鼠标与卡牌 3D 互动桌面端卡背需要根据鼠标在卡面中的位置实时改变 3D 朝向。使用 CSS 自定义变量控制 rotateX、rotateY、光泽位置和反向阴影。1. perspective 约 640 像素。2. 上下最大旋转约 20 度,左右最大旋转约 24 度。3. 跟随过渡约 0.17 秒,缓动平滑。4. 白色柔光高光跟随鼠标在卡面移动。5. 阴影向鼠标反方向移动,增强卡牌厚度。6. 鼠标离开后平稳回到零角度。卡牌的位置必须保持固定。禁止悬停抬升、缩放、左右位移、相邻卡牌让位、整副牌跟随移动和高频随机抖动。触屏设备关闭悬停 3D,只保留点击与翻牌。八、抽卡与翻牌点击“抽取今日支线”后,标题和按钮在约 180 毫秒内平稳淡出,三张卡牌进入可选择状态。禁止快速交错洗牌、剧烈抖动、蓄力弹跳和长时间旋转。用户选择一张卡后:1. 当前卡牌先在约 110 毫秒内从鼠标倾斜角度平稳归正。2. 另外两张卡在约 220 毫秒内轻柔淡出并略微退开。3. 被选中的卡片在约 340 毫秒内平稳移动到中央。4. 卡片沿 Y 轴完成一次约 500 毫秒的标准 3D 翻面。5. 翻面过程中只允许一道窄而轻的光泽扫过。6. 翻面结束后任务内容逐项淡入。禁止翻牌前剧烈晃动,禁止翻开后的二次放大、弹跳和连续回弹。动画播放期间锁定重复点击。九、八张固定任务任务数据直接保存在 JavaScript 数组中:1. 环境修复:夺回桌面的一小块领地,10 分钟。把桌面最乱的一块擦干净,直到重新出现一片空白。系统旁白:该区域已脱离混沌阵营。2. 装备归位:十件衣物的返乡行动,15 分钟。把散落的十件衣服逐一叠好,送回各自的位置。系统旁白:衣架联盟对你的行动表示感谢。3. 混沌封印:打开那盒封印的杂物,15 分钟。选一个抽屉,只放回仍然需要的东西。系统旁白:抽屉已提交无序物品清单。4. 水源净化:让洗手池重获清白,8 分钟。把洗手池擦一遍,直到水珠能利落滑走。系统旁白:水源祭坛恢复了应有的光亮。5. 光合支援:支援你的光合队友,5 分钟。给植物浇水并摘掉发黄叶片。系统旁白:绿色阵营记你一次大功。6. 领地巡逻:用双脚巡视领地,10 分钟。下楼走十分钟,路线随意。系统旁白:地图迷雾已向前推进十米。7. 记忆瘦身:二十张废片流放令,8 分钟。删除二十张模糊或重复照片。系统旁白:存储水晶重获自由。8. 信号修复:超度那条未读消息,3 分钟。回复一条拖延很久的消息。系统旁白:信号塔已恢复在线。每次随机选择三张候选卡。当前会话避免连续出现完全相同的结果。揭晓后提供弱化的“换一张”按钮,换卡不能与底部状态文字重叠。十、执行、完成与主页入口点击“我去执行”后,卡片保持在中央,背景进入安静状态。页面顶部显示任务名称、行动说明、预计时间和“任务完成”按钮,无需倒计时。点击“任务完成”后:1. “COMPLETED / 已完成”印章平稳落在卡面。2. 卡片只产生一次很轻的触感反馈。3. 少量蓝、红、黄、绿、紫彩纸与星屑向外散开。4. 当前任务节点闪亮一次。5. 显示“世界因此整洁了 0.01%”。结算区提供“再抽一项”和“回到主页”。同时在顶部左侧加入常驻“← 回到主页”入口。该入口在选牌、揭晓、执行和完成状态持续可见,可以在任何阶段安全清理当前状态并恢复首页。手机端进入任务流程后可以隐藏 EARTH ONLINE 字样,为主页入口留出空间。十一、背景点击烟花用户点击卡片和按钮以外的空白背景时,生成 16 至 22 个彩色粒子。粒子包含四角星、小纸屑和发光点,使用钴蓝、珊瑚红、太阳黄、薄荷绿、淡紫和暖白,向外扩散后自然减速消失。烟花范围要明显,持续约 0.8 至 1.3 秒。禁止生成圆形冲击波、扩散圆环、完整光圈和大面积爆闪。点击卡片或按钮时不能误触发背景烟花。十二、技术实现使用原生 HTML、CSS 和 JavaScript 实现。交付可直接运行的单页网页文件和配套图片素材。不使用 React、Three.js、后端、数据库和大型依赖。使用 CSS 3D transform、Web Animations API、轻量 Canvas 粒子与内联 SVG 完成交互。按钮和文字使用语义化 HTML。任务卡不能全部绘制在 Canvas 中。需要处理以下工程细节:1. 动画期间锁定重复点击,动画结束后恢复操作。2. 键盘可选择卡牌并触发按钮,焦点样式清楚。3. Canvas 设备像素比最高为 2。4. 页面不可见时暂停背景持续动画。5. 支持 prefers-reduced-motion,关闭卡牌鼠标倾斜、路线运动和装饰循环,核心抽卡流程改为淡入与直接翻面。6. 所有图片均能正常加载,禁止资源 404。7. 手机宽度 390 像素、桌面 1440 × 960 和 1920 × 1080 均能完成完整流程。8. 卡片、换卡按钮与底部信息不能重叠,页面不能出现横向滚动。十三、验收标准1. 首页能在五秒内表达“抽取一个现实生活支线任务”。2. 三张彩色卡背与深蓝紫家庭星图背景属于同一套视觉系统。3. 卡背和八张任务插画均为彩色扁平噪点风格,场景清楚且统一。4. 卡片只有 1 像素细高光边缘,没有粗金边。5. 鼠标移动时卡面产生明显且平稳的 3D 转向,卡牌位置不移动、不缩放、不抖动。6. 点击抽取后没有快速洗牌,选择卡片后归正、居中并完成一次平稳翻面。7. 卡片内部没有大块无意义留白,任务文字和 SYSTEM 信息连续排列。8. 点击空白背景会生成较大的彩色粒子烟花,没有任何圆环。9. 左上角主页入口在所有非首页状态可见,并能返回初始状态。10. 抽卡、换卡、执行、完成、再抽一项与返回主页全部可用。11. 桌面和手机端都没有遮挡、溢出和误触。12. prefers-reduced-motion 状态仍可完成全部核心操作。13. 浏览器控制台没有持续报错,脚本语法正确,所有图片均能加载。完成后请自行运行桌面端与手机端完整流程,检查首页、选牌、揭晓、执行、完成和返回主页六个状态。发现问题后直接修复,再提供最终文件、素材清单和简短验收结果。
简单版式想在网页上出彩,常会用底纹或动效增加层次。
我给它一个参考网页,Franky 的个人网页。看起来很极简,底层却要让 1600 个方块通过 InstancedMesh 渲染,并叠加波纹位移、鼠标轨迹采样、镜头视差和移动端适配。
波纹有清楚的起点和传播路径,鼠标随手画线也能形成连贯、舒服的动态反馈。1600 个方块持续响应轨迹,波纹叠加仍然稳定,它既理解视觉目标,也用好了工程路线。
滑动查看完整提示词
none
请制作一个受到以下网页启发的全屏 Three.js 互动作品:参考网页:【这里有一个参考链接】先实际打开参考网页,观察桌面端和移动端的构图、方块比例、波纹传播、鼠标反馈、镜头变化、阴影、颜色与排版关系。只参考视觉机制和交互逻辑,使用原创代码、原创品牌名称和原创页面文案,不复制对方源码或个人信息。## 核心目标创建一张铺满屏幕的白色立体方块矩阵。用户移动鼠标或手指时,指针经过的位置形成连续轨迹,并沿矩阵向外传播蓝色立体波纹。方块的高度、顶部位置和颜色随波峰变化,最终形成像柔软数字地毯、建筑立面或机械水面一样的效果。页面加载后即有生命力。用户没有操作时,系统自动在不同位置生成缓慢扩散的波纹。## 交付形态使用 Vite、原生 JavaScript 和 Three.js 创建完整项目。固定使用同一 npm 依赖路线:1. three@0.184.02. gsap@3.15.03. lil-gui@0.21.0,仅用于调试模式不要混用 CDN、import map 和 npm 版本。交付内容包括:1. 完整源代码2. package.json3. 本地启动说明4. 桌面端验收截图5. 移动端验收截图6. 简短说明波纹计算、实例化渲染和性能处理方式完成代码后必须启动本地服务,在浏览器中实际检查页面,不能只停留在代码生成或构建成功。## 三维场景创建 40 × 40 的方块矩阵,共 1600 个细长立方柱。建议初始参数:1. 单个方块宽度和深度约为 0.82. 方块基础高度约为 33. 方块间距约为 0.014. 阵列以世界坐标原点为中心5. 阵列需要延伸到屏幕四周之外,让画面看不到明显边缘6. 方块底部保持稳定,主要由顶部顶点产生升降变化使用 InstancedMesh 渲染全部方块,共享几何体和材质。禁止为每个方块分别创建 Mesh。基础颜色为干净的暖白色,波峰颜色为明亮钴蓝色。方块上升时从白色平滑过渡到蓝色,回落时恢复白色。背景使用浅灰白色,方块之间保留非常细的阴影缝隙。## 波纹系统通过 Raycaster 将鼠标或触摸坐标投射到隐藏的水平平面,记录世界坐标中的移动轨迹。最多保存 128 个轨迹点。每个轨迹点至少包含:1. 世界坐标 X2. 世界坐标 Z3. 创建后的年龄4. 本次轨迹点与上一个轨迹点的距离强度轨迹点之间设置最小采样距离,避免鼠标轻微移动时产生过量数据。每个轨迹点产生向外扩散的环形波纹。波纹应包含:1. 随时间扩大的波前半径2. 高斯包络控制波纹宽度3. 余弦函数形成波峰与波谷4. 指数衰减控制生命周期5. 距离衰减控制远处振幅6. 最大高度限制,防止方块突然拉伸7. 基于方块位置的轻微稳定扰动,使波纹边缘更自然多条波纹相遇时使用加权平均或受控混合,避免振幅无限叠加和画面剧烈闪烁。建议初始参数:1. 波纹速度 62. 波纹频率 1.23. 波纹宽度 34. 波纹振幅 0.45. 最大升降高度 0.46. 轨迹淡出时间 2 秒7. 位置扰动 0.2波纹计算放在 GPU 顶点着色器中。可以通过自定义 ShaderMaterial,或使用 onBeforeCompile 扩展标准光照材质。用于阴影的深度材质必须应用相同的顶点位移,使动态方块与投射阴影保持一致。## 自动动态页面启动后自动生成少量波纹。用户停止移动指针 3 秒后,进入自动演示状态。自动演示状态下,每隔约 1.5 秒在阵列中心区域生成一个强度略有变化的波纹。用户重新移动鼠标或触摸页面后,立即退出自动演示,继续响应用户轨迹。所有动画根据真实时间差计算,不能依赖固定帧数。## 镜头使用透视相机:1. 视野角约为 402. 默认距离约为 123. 镜头接近俯视,但保留足够透视感以看清方块侧面4. 镜头始终看向阵列中心5. 方块矩阵填满整个屏幕,只展示阵列中间的一部分鼠标位置同时产生轻微镜头视差:1. 横向移动造成很小幅度的左右环绕2. 纵向移动造成很小幅度的俯仰变化3. 镜头使用平滑插值追随鼠标4. 插值系数约为 0.045. 镜头变化必须克制,不能产生眩晕或抢过波纹主体移动端关闭持续镜头追随,或将视差幅度降低至桌面端的三分之一。## 灯光与材质使用浅色摄影棚式灯光:1. 白色环境光提供基础亮度2. 左前上方设置较强的主方向光3. 右后方设置较弱的补光4. 主方向光投射柔和阴影5. 阴影贴图控制在 1024 × 10246. 使用 PCF 柔化阴影7. 使用 ACES Filmic 色调映射8. 控制曝光,保留白色方块之间的层级整体保持明亮、干净、轻盈。避免黑色背景、霓虹赛博风、强烈辉光、金属反射、浓重雾效和复杂纹理。## 后期效果增加非常轻微的屏幕边缘暗角与 RGB 色差:1. 色差主要出现在画面边缘2. 中心区域保持清晰3. 色差强度约为 0.0054. 暗角过渡柔和5. 效果不能影响文字阅读或让白色方块变脏如果后期处理明显影响性能,优先降低效果强度或关闭移动端后期处理。## 页面排版在 Three.js 画布上方增加透明 HTML 信息层。桌面端布局:1. 顶部为固定导航栏,带轻微背景模糊2. 左侧放置原创品牌名称,例如 WAVE GRID3. 右侧分成项目、介绍、联系和当前时间等信息列4. 中下区域放置一段较大的原创英文介绍文案5. 底部放置地点、项目入口和联系入口6. 文字使用黑色与中灰色7. 字体使用 Inter 或兼容的无衬线字体8. 保留充足留白,让三维方块仍是视觉主体信息层默认不拦截画布指针事件,链接区域恢复点击能力。页面加载时,导航、主文案和底栏依次从下方约 20 像素淡入。链接悬停时使用双层文字纵向滚动效果,动画时间约为 0.8 秒。不要使用参考网页中的姓名、介绍文字、社交账号和联系方式。## 调试模式默认页面不显示控制面板。当 URL 包含 `?debug=1` 时显示 lil-gui,至少可以调整:1. 波纹振幅2. 波纹速度3. 波纹频率4. 波纹宽度5. 最大高度6. 淡出时间7. 轨迹采样间距8. 基础颜色9. 波峰颜色10. 镜头距离11. 主光与补光强度12. RGB 色差强度所有控件必须即时改变可见效果。## 响应式与可访问性桌面端、平板和手机都应铺满整个视口。移动端需要:1. 重排顶部导航2. 缩小品牌名称和介绍文字3. 支持手指滑动产生连续波纹4. 避免页面滚动与画布手势冲突5. 保证底部链接可以点击支持 prefers-reduced-motion。减少动态模式下关闭镜头跟随和自动随机波纹,降低波纹速度,用户点击或触摸时仍可产生一次受控波纹。## 性能要求1. 将 devicePixelRatio 限制在 2 以内2. 1600 个方块必须使用 InstancedMesh3. 波纹位移主要在 GPU 中完成4. 控制动态阴影数量5. 控制后期处理 Pass 数量6. 窗口隐藏后避免产生异常大的时间差7. resize 时同步更新渲染器、后期合成器和相机投影矩阵8. 事件监听器与动画循环只能初始化一次9. 被销毁的几何体、材质、纹理和渲染目标需要正确 dispose10. 使用描述性变量名,同一作用域不能重复声明标识符性能验收目标为现代笔记本电脑、1440 × 900 视口、1600 个方块同时显示时达到约 55 FPS 以上。移动端允许关闭阴影或后期处理进入低功耗模式。## 验收标准1. 页面加载后,立体方块矩阵铺满整个视口。2. 即使用户没有操作,页面也会周期性出现自然扩散的蓝色波纹。3. 鼠标快速画圆或画线时,波纹会沿完整轨迹连续产生。4. 波纹表现为向外扩散的环形波峰,不能只是鼠标附近方块简单升高。5. 方块高度、颜色与阴影同步变化。6. 多条波纹相遇时画面稳定,没有异常尖峰或剧烈闪烁。7. 鼠标移动会产生克制且平滑的镜头视差。8. 文字层清晰可读,链接能够点击,画布交互不受遮挡。9. 手机端可以通过触摸产生波纹。10. 改变窗口尺寸后,画面比例、相机和文字布局保持正常。11. 默认页面不出现调试面板。12. `?debug=1` 下所有参数控件都真实有效。13. 控制台没有未处理错误、重复声明、着色器编译错误或资源加载失败。14. 实际浏览器截图应能清楚看到白色立体矩阵、蓝色传播波纹、浅灰背景和黑灰排版层。15. 如果某项验收失败,继续修改并重新运行检查,直到核心效果通过。
除了前端编程,Qwen3.8-Max-0902 在多步推理、工具调用和数据仪表盘方面也表现不错。
大家提到苹果,总绕不开乔布斯和库克两个阶段。这次我让 Qwen3.8-Max-0902 从公开资料开始收集,做一个对比仪表盘。
它先收集公开资料,再清洗数据表格、追溯核查来源,最后制作响应式仪表盘。
乔布斯时代、交接年份和库克时代划分得很清楚,下方还对照了营收、收入结构、地区、研发和资本回报等维度。
悬停可以查看具体数值,滚轮可以缩放时间轴,让密集数据更容易读懂。
这个仪表盘主要测一下多步推理、工具调用和长任务执行能力。资料收集、数据清洗、来源核查、结构划分与可视化连续推进,整个交互都很清楚,我们页能看出它的 Coding 结合专业办公的能力。
滑动查看完整提示词
none
请直接完成一个名为《苹果双时代:从乔布斯到库克》的数据叙事项目。项目包含两个相互配套的成品:一个可交互的数据分析网页仪表盘,以及一份 16:9 的可编辑 PPTX。网页用于自由探索数据,PPT 用于完整讲述苹果从乔布斯时代到库克时代的经营变化、产品结构变化与增长逻辑。请完成真实数据研究、数据清洗、分析、设计、开发、生成文件和质量检查,不要只输出方案、目录、设计稿或零散代码。一、研究边界与时代划分1. 时间范围:从 1997 财年乔布斯回归苹果开始,到执行本任务时最新的完整财年结束。若执行日期为 2026 年 9 月 2 日,完整财年终点使用 FY2025。FY2026 尚未结束的季度数据可以放入“最新动态”补充区,禁止与完整财年序列混合计算。2. 时代划分采用统一口径:FY1997 至 FY2010 为乔布斯完整财年,FY2011 单列为管理层交接年,FY2012 至最新完整财年为库克完整财年。时间轴中注明蒂姆·库克于 2011 年 8 月 24 日接任 CEO。3. 所有金额默认使用名义美元,单位统一为十亿美元。若能取得可靠 CPI 数据,可以提供“名义值 / 2025 年不变价”切换;无法可靠取得时直接省略该功能。4. 每个关键结论都必须能追溯到来源。优先使用 Apple Investor Relations、Apple Newsroom 财务报表、Apple Form 10-K 和 SEC EDGAR。市值、拆股调整股价或宏观数据需要使用第二来源时,必须记录来源名称、链接、提取日期、口径与计算方法。5. 禁止编造、插值或用视觉效果掩盖缺失数据。苹果在 FY2019 起停止披露主要产品销量时,在图表中明确标注“停止披露”,不要继续估算销量。不同年度产品分类发生变化时,保留原始口径,并在方法说明中解释可比性限制。6. 以 Apple FY2025 Form 10-K 作为终点交叉校验。FY2025 的总营收应为 416.161 十亿美元,净利润为 112.010 十亿美元,研发支出为 34.550 十亿美元,服务收入为 109.158 十亿美元。若抓取结果不一致,先排查单位、财年和字段映射。优先数据入口:Apple Investor Relations SEC Filings:【这里有一个参考链接】Apple FY2025 Form 10-K:【这里有一个参考链接】Apple FY2025 Q4 Consolidated Financial Statements:【这里有一个参考链接】二、需要整理的数据建立清晰的数据字典和年度 CSV,至少覆盖以下指标:1. 财务规模:总营收、净利润、营业利润、毛利润、经营现金流、自由现金流。2. 效率与盈利:毛利率、净利率、研发支出、研发占营收比例。3. 收入结构:Mac、iPod、iPhone、iPad、Services、Wearables / Home / Accessories 等历年可得分类。分类变更需要维护映射表,原始字段与统一展示字段同时保留。4. 区域结构:美洲、欧洲、大中华区、日本、亚太其他地区等可得年份的数据。5. 资本与股东回报:现金及有价证券、债务、年度分红、股票回购。6. 市场与规模补充:财年末市值或拆股调整股价、员工数量、活跃设备安装量等。此类指标只有在来源可靠且年度口径一致时纳入主图,否则放入补充数据或明确省略。7. 关键事件:乔布斯回归、iMac、iPod、iTunes Store、iPhone、App Store、iPad、库克接任、Apple Watch、AirPods、Apple Silicon、Services 增长、Vision Pro、Apple Intelligence 等。事件日期必须核实,不把产品发布事件写成财务因果事实。至少生成以下文件:年度指标 CSV收入结构 CSV地区收入 CSV关键事件 CSV数据来源清单 CSV方法说明文档数据来源清单至少包含 metric、fiscal_year、value、unit、source_title、source_url、page_or_section、retrieved_at、notes、confidence。缺失值保留为空,并在 notes 中说明原因。所有衍生指标写出公式。CAGR 使用完整财年边界计算,交接年不归入两位 CEO 的完整任期 CAGR。三、核心分析问题请先计算,再用数据回答以下问题:1. 两个时代的营收、净利润和现金创造能力分别增长了多少,CAGR 有何差异?2. 苹果的增长引擎如何从 Mac 和 iPod 转向 iPhone,再转向 Services 与生态收入?3. 产品收入与服务收入的组合变化如何影响整体毛利率?若缺乏可比数据,只陈述可直接验证的范围。4. 研发投入的绝对额和营收占比如何变化?投入增长是否与新品类扩张、芯片自研和服务生态形成时间上的对应关系?5. 库克时代的资本回报、供应链规模化和服务化,对苹果财务模型产生了哪些可量化影响?6. 两位 CEO 的时代差异如何用“规模、增长、盈利、创新投入、收入结构、股东回报”六个维度呈现?7. 哪些结论属于数据事实,哪些属于基于时间关系的分析推断?在文字中明确区分。最终提炼 3 至 5 条真正由数据支持的核心洞察。每条洞察都要带数字、时间范围和来源,避免空泛评价,也不要把两位 CEO 简化成个人能力排名。四、网页仪表盘创建一个可直接运行的中文响应式网页。首选 Vite、React、TypeScript 与 ECharts 或 D3;若环境无法安装依赖,改用原生 HTML、CSS、JavaScript 与可用的图表库。最终成品必须能够在本地打开或通过本地开发命令运行。网页信息结构:1. 顶部封面:标题《苹果双时代》,副标题“1997 至最新完整财年”,一句由数据推导出的总论点,以及 3 个最有代表性的关键数字。2. 时代总览:乔布斯、交接年、库克三段式时间轴,支持点击高亮对应时期。3. 财务增长:营收、净利润、毛利率、研发支出的年度折线图。支持指标切换、悬停提示、时间范围刷选,以及“实际值 / 以 1997 年为 100 的指数”切换。4. 增长引擎:使用堆叠面积图或百分比堆叠图展示收入结构迁移,并标注 iPod、iPhone、Services 等关键拐点。5. 盈利模型:产品与服务收入、毛利率、净利率的关联视图。只有数据口径支持时才画相关图。6. 地区版图:用小倍图或横向条形图展示主要地区收入结构,避免为了炫技加入缺乏分析价值的世界地图。7. 研发与创新:研发支出、研发占比和重大产品节点的组合图。产品事件作为时间注释,不直接宣称因果。8. 资本回报:回购、分红、现金与债务的变化。若早期数据不完整,明确显示可用区间。9. 双时代计分卡:用六个维度的并列数字与迷你趋势图对比两个时代。雷达图只在尺度可解释时使用,默认采用并列条形图或坡度图。10. 洞察结论与数据来源:列出 3 至 5 条核心洞察、方法说明、数据限制和可展开的来源清单。交互要求:1. 提供时代筛选、指标筛选、悬停详情和图例开关。2. 点击时间轴事件后,对应年份在所有相关图表中同步高亮。3. Tooltip 显示财年、数值、同比、所属时代、来源缩写。4. 提供“查看数据”抽屉,可查看原始值、下载 CSV,并跳转到来源链接。5. 桌面端以 1440 像素宽为主要设计基准,手机端 390 像素宽可正常阅读和操作。6. 支持 prefers-reduced-motion。动效只用于时间轴切换、图表更新和重点数字进入,持续时间控制在 180 至 450 毫秒。五、视觉方向整体采用“Apple 编辑设计加高端数据杂志”的气质。以纯白、雾灰、炭黑为主色,乔布斯时代使用克制的暖橙或珊瑚红,库克时代使用深蓝或电光蓝,交接年使用中性灰。字体优先使用 SF Pro Display、SF Pro Text,并提供 Inter、Helvetica Neue、PingFang SC、系统无衬线回退。版面强调大字号结论、宽阔留白、精确网格、细线分隔和高信息密度图表。每一屏只设一个明确视觉中心。卡片圆角控制在 8 至 16 像素,阴影极轻。禁止使用通用紫蓝渐变、玻璃拟态、满屏发光、悬浮胶囊标签、巨大空洞标题、密集 KPI 卡片墙和装饰性 3D 地球。视觉参考只用于学习结构与信息层级,禁止像素级复制:Dashboard Showcase:【这里有一个参考链接】Observable Plot Gallery:【这里有一个参考链接】D3 Gallery:【这里有一个参考链接】Beautiful Decks:【这里有一个参考链接】Deck.gallery Report:【这里有一个参考链接】Pitch Presentation Gallery:【这里有一个参考链接】六、PPT 叙事结构生成 15 页左右的 16:9 可编辑 PPTX,建议结构如下:1. 封面:苹果双时代,1997 至最新完整财年。2. 一页结论:用一句总论点和三个关键数字建立全局。3. 研究口径:时代划分、数据范围、可比性与限制。4. 28 年总览:一条包含领导者与产品节点的营收时间轴。5. 乔布斯时代:从生存修复到品类重构。6. iPhone 拐点:收入规模和产品结构的跃迁。7. 库克时代:规模化增长与利润扩张。8. 收入结构:硬件中心如何长出服务层。9. 盈利能力:毛利率、净利率与现金流。10. 全球市场:主要地区收入变化。11. 研发投入:绝对额、占比与创新节点。12. 资本配置:回购、分红、现金与债务。13. 双时代对照:六维并列计分卡。14. 核心判断:3 至 5 条数据支持的结论。15. 来源与方法:完整来源、计算方式和限制。PPT 每页只表达一个核心判断,标题尽量写成带结论的句子。正文控制在 2 至 4 个短要点,主图承担主要信息。封面、章节页、全幅趋势图、左右分栏、数字大字报、小倍图和结论页交替出现,保持节奏。图表颜色、时代编码、数据和网页完全一致。每张关键图表下方放 9 至 11 pt 的来源脚注。为每页添加 2 至 4 句演讲者备注,说明这一页要讲什么,以及数据限制。PPTX 中的标题、正文、基础形状和主要图表必须可编辑。复杂图表若必须以 SVG 或高分辨率图片放入,需要同时保留对应 CSV 与生成代码。禁止把整页做成一张不可编辑的截图。另行导出 PDF,并渲染每页预览图用于检查。七、开发与交付建议交付内容:网页源码与运行说明清洗后的 CSV 与来源清单数据清洗、图表或 PPT 生成脚本可编辑 PPTXPPT 导出的 PDF每页 PNG 预览图方法说明文档项目说明文档项目说明文档写清楚数据范围、运行命令、文件清单、更新数据的方法和已知限制。若当前环境具备 PptxGenJS、python-pptx 或其他生成工具,选择最能保证可编辑性的方案。不要因为某个依赖不可用而停止,先尝试安全替代方案,并记录最终采用的技术路线。八、验收标准1. 所有主图使用真实、可追溯数据,来源链接可打开,关键数值与原始报告一致。2. FY2011 清楚标记为交接年,两个时代的 CAGR 和均值使用一致边界。3. 产品分类变更、停止披露和缺失值都有说明,没有伪造连续序列。4. 网页在桌面和手机端都可使用,筛选、联动高亮、Tooltip、数据抽屉和 CSV 下载正常。5. 网页控制台没有持续报错,资源没有 404,首屏没有明显布局跳动。6. PPTX 可以正常打开,比例为 16:9,页面数量约 15 页,关键内容可编辑。7. 将全部 PPT 页面渲染为图片或 PDF,逐页检查文字溢出、图表遮挡、低对比度、脚注过小、对象越界和字体替换。发现问题后修复并重新渲染。8. 网页与 PPT 的数据、配色、时代标签和结论完全一致。9. 最终回复提供可点击的成品文件、网页启动方式、数据终点、核心洞察摘要和仍存在的数据限制。请现在开始执行。先完成数据与来源审计,再完成网页和 PPT,最后运行验收。不要等待我逐步确认,不要把未验证的配置、代码或计划描述为已经完成的成品。
总的来说,五个案例让前端编程、复杂约束、视觉交互、性能优化和多步任务都有了可见结果。它对真实复杂任务和长周期项目已经有参考价值,科研类场景还需要单独验证。
几组案例跑完,也可以和大家聊聊它的性价比了。
这次 Qwen3.8-Max-0902 不仅登上 Code Arena 前端编程总榜第一,在基于帕累托前沿呈现的性能价格图中,也处于最优边界。
![]()
同时看性能和价格。Qwen3.8-Max-0902 每百万 token 综合平均约 5 美元,另外两款前列模型分别约 20 美元和 12 美元,性价比很直观。
排行榜上的分数只有落到真实任务里才有意义。它能听懂需求、调动工具、补齐细节,最后交出一个真正能运行的成品,这才是大家更看重的部分。
现在,Qwen3.8-Max-0902 已经上线千问 AI 平台,并对外提供 API 服务。千问办公、Qoder 和千问 App 也都已经接入,大家可以直接去这些入口使用。
最后,看到阿真三连位置那个大拇指和小红花了吗,现在是腾讯九九公益日期间,点击它一下,腾讯基金会就会以你的名义捐赠 1 角钱啦!点滴都是爱!如果这篇文章对你有帮助,也欢迎点赞、转发,猛猛三连鼓励阿真~
下期见~
特别声明:以上内容(如有图片或视频亦包括在内)为自媒体平台“网易号”用户上传并发布,本平台仅提供信息存储服务。
Notice: The content above (including the pictures and videos if any) is uploaded and posted by a user of NetEase Hao, which is a social media platform and only provides information storage services.