Anthropic / V283

Claude｜个人财务

用一个旅行愿望贯穿财务演示。数据负责回答能否实现、怎样实现，最后回到生活场景。

构图与编排可播放 · 可替换内容

整体编排规则示例

0.00 / 91.17 秒

查看 HTML 源码

<!doctype html><html lang="zh-CN"><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Claude｜个人财务 · sequence</title><style>html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#f8f7f1}canvas{display:block;width:100%;height:100%;object-fit:contain}</style><body data-mode="sequence"><canvas width="1000" height="600"></canvas><script src="data.js"></script><script src="common.js"></script><script src="scene.js"></script><script src="bridge.js"></script></body></html>

画面元素愿望场景聊天请求账户连接收支图卡预算日历目的地结果

MOTION LANGUAGE

动作与构图

局部动作 · 构图规则

愿望先于数据出现

开场用旅行画面和一个具体问题建立目标。生活镜头铺满画面；转入工具后用暖白底、聊天气泡和衬线说明，形成场景与论证的分工。

账户连接是计划的前提

账户连接是计划的前提规则示例

0.00 / 18.00 秒

14–32 秒 · 动作示意独立打开 ↗

查看 HTML 源码

<!doctype html><html lang="zh-CN"><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Claude｜个人财务 · sequence</title><style>html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#f8f7f1}canvas{display:block;width:100%;height:100%;object-fit:contain}</style><body data-mode="clip" data-start="14" data-end="32"><canvas width="1000" height="600"></canvas><script src="data.js"></script><script src="common.js"></script><script src="scene.js"></script><script src="bridge.js"></script></body></html>

提出财务问题后先显示连接账户，再展开收支总览。授权、数据和建议按顺序出现，避免一上来就给结论。