LLM Arena 2026年9月
案例说明- 模型
- Claude Opus 5.5
- 设计任务
- 打造一段穿行于想象中宋代汴京的交互式灯火之旅。
- 输出结果
- 网站
适用场景
- 文化叙事围绕一个地点串联场景、文字和轻量互动。
- 数字展览无需预订转化流程,引导访客依次浏览主题内容。
- 交互式诗词让选中的诗句成为后续场景的一部分。
核心亮点
- 一河贯穿五个篇章连贯的城市场景将城门、桥、市集与结尾串联起来。
- 一行流转的诗句所选诗句会以个人灯笼寄语的形式再次出现。
- 节奏转换市集效果之后转入更安静的阅读,再进入最终操作。
探索汴京夜游
1 / 5
以五个篇章讲述开封夜游网站设计
《汴京入夜》将一座想象中的城市构建为夜间手卷。开场左侧采用超大中文字符,搭配灯火映照的河流、木构建筑和倒影。金色点缀与明亮窗户在深蓝色环境中格外醒目。页面引导用户进入这一场景序列,而非搜索目的地或预订行程。
同一河城世界延续至后续篇章的背景中。滚动时,镜头与前景文字同步变化,而顶部导航和带编号的篇章导航始终可用。这样无需为每一站单独设置页面,也能在城门、桥、市集、诗词和最终的放灯场景之间形成连续体验。

作为场景组成部分的字体排版
大型中文标题以紧凑的竖向组合排列,把屏幕较宽的区域留给河流和建筑。较小的英文品牌文字位于开场标题下方。两者通过不同字号建立阅读顺序,而不是试图在同一空间中让每种语言占据同等的展示权重。
两种定位当前位置的方式
顶部导航标明各项活动,右侧导航则为五个篇章编号。名称说明每一站包含什么内容;编号说明该站在序列中的位置。由于视觉背景保持连续,篇章边界可能难以识别,因此这种重复定位方式很实用。
作为重复视觉母题的光
窗格、悬挂的灯笼和倒影在场景中不断重复暖色光点。最终的放灯操作采用了从开场起便一直可见的同一对象。它更像既定视觉故事的结局,而不是在最后附加的无关效果。
将所选诗句带入放灯场景
诗词篇章改变了参与方式。访客不再触发另一种市集奇观,而是先选择一首诗,再选择其中一句。所选诗句会在独立的寄语区域重复显示,并被带入收尾场景。这一小段状态信息连接了两个篇章:阅读会在旅程后段产生可见的结果。
来源内容将出处与背景说明放在诗词旁边,而不是只放在鸣谢页面中。说明指出,借用这首南宋词是为了呈现其灯夜意象,而非将其作为汴京历史记录。这一区分使体验可以运用富有感染力的文字,同时不把艺术联想伪装成文献证据。
提供范围明确的阅读选择
两个诗词选项卡将选择范围控制在一眼即可理解的程度。每首诗都有各自的出处和背景。访客无需搜索档案或打开单独的阅读页面,也能作出会影响这段简短体验的选择。
继续之前重复显示所选诗句
寄语区域会在诗词下方再次显示所选诗句。这是一种有效的确认方式,因为可点击的诗句本身仍被其他诗行环绕。随后,继续操作便可带着已选定的具体文本进入灯笼篇章。
为结尾提供两个相关操作
最终篇章在已带入的寄语旁提供天灯和河灯。两者都契合既定世界,而不同的移动方向又使其成为明确有别的选择。重播操作单独设置,因此重复城市旅程不会与再次放灯混为一谈。
安排夜市、诗词与收尾场景的节奏
市集篇章是最活跃的一站。它提供打铁花与烟花效果、街头叫卖控制,以及与茶、丝绸和船有关的简短故事。这些互动并不完全等同:有些改变氛围,有些则改变文本。将它们归入市集,使这种多样性拥有一个易于识别的场景背景。
| 篇章 | 主要操作 | 在序列中的作用 |
|---|---|---|
| 城门与桥 | 进入城市并发现一句诗 | 建立地点印象,并引出后续的阅读互动。 |
| 夜市 | 选择一种奇观或一个日常故事 | 提升活跃度,同时让每项操作都与街市场景相关联。 |
| 诗词 | 阅读、选择并带走一句诗 | 放缓节奏,并创建一个可持续保留的小型选择状态。 |
| 放灯 | 将所选寄语送入场景 | 通过可见的收尾操作回应此前的选择。 |
艺术化夜游,而非历史复原
这是一种受河城意象、诗词和当代想象启发的虚构数字体验。其城市场景并非精确复原,来源内容也明确说明插图由 AI 创作。预览保留了所提供的本地交互;并未添加票务功能、真实行程或经过核实的历史地图。画廊是一组按顺序呈现的滚动场景渲染图,而不是一张普通的完整文档截图。
如何在 OpenDesign 中创建开封夜游网站设计
先定义旅程,再添加效果
先确定五个篇章各自的目的,以及一个贯穿始终的对象。此处,灯笼不断出现在环境中,而选定的诗句则为结尾赋予具体含义。请在第一条请求中明确说明这些关系。
建议提示词为名为《汴京入夜》的虚构体验创建一款开封夜游网站设计。采用连贯的灯火河城场景,以深蓝色水面、暖色木构建筑和大型中文展示标题为主要视觉元素。设置五个滚动篇章:城门、桥、市集、诗词和放灯。顶部保留带名称的导航,侧边设置带编号的篇章导航。让市集提供少量在本地运行的视觉效果,以及关于茶、丝绸和船的简短故事。在诗词篇章中,让访客选择一句标明出处的诗句,并在最终的灯笼寄语中再次显示。分别添加放飞天灯和放河灯的操作,并提供重播功能。明确说明该作品属于艺术想象,并非历史复原或真实旅游服务。在减少动态效果时,仍须保留清晰可读的文字浏览路径。
跨篇章追踪所选诗句
选择另一句诗,前往结尾并检查那里是否出现相同文本。更换诗句后重复检查。这样可以直接测试叙事关联,而不是把每个篇章视为相互独立的视觉效果。
根据每个镜头位置检查文本
在完整文本和控件均可见的情况下,检查桥、市集和诗词场景。随着镜头移动,明亮的窗户和倒影可能出现在不同文字后方。优化文字衬底或框架,但不要用深色遮罩把整个场景压平。
导出并获取分享链接
导出完成的设计稿,然后在 OpenDesign 中使用「Share」功能获取分享链接。在单独的浏览器窗口中打开链接,确认目标版本及其资源均可正常访问后,再将链接发送给他人。





