iloom-flatten/outputs/demo-animation-guide.md

3.4 KiB
Raw Permalink Blame History

纺织行业采购计划管理系统 - 演示动画制作指南

演示动画脚本 (15-20秒)

场景1: 采购商创建计划 (0-4秒)

  • 画面: 采购商工作台界面
  • 动作: 点击"新建计划"按钮,填写表单
  • 关键信息展示:
    • 成品名称: 水洗棉花糖
    • 颜色: 灰色
    • 坯布码: SX1
    • 计划产量: 10000米
  • 文字说明: "采购商创建生产计划"

场景2: 生成分享链接 (4-7秒)

  • 画面: 计划详情页,点击分享按钮
  • 动作: 系统生成加密链接
  • 关键信息展示:
    • 原始数据: { planId: "xxx", factoryType: "textile" }
    • 加密后: /#/import?token=62eyJw...
  • 文字说明: "敏感信息加密仅传输计划ID"

场景3: 纺织厂导入计划 (7-10秒)

  • 画面: 纺织厂导入页面
  • 动作: 粘贴链接,点击导入
  • 关键信息展示:
    • 可见: 计划编号、坯布码、产量、纱用量
    • 隐藏: 成品名称、颜色、色号
  • 文字说明: "纺织厂只能看到生产相关信息"

场景4: 生产流程确认 (10-13秒)

  • 画面: 纺织厂计划详情,流程节点
  • 动作: 依次确认: 采纱 → 染纱 → 上机 → 坯布入库
  • 关键信息展示:
    • 每个节点点击确认
    • 进度条更新
  • 文字说明: "实时跟踪生产进度"

场景5: 入库同步与通知 (13-17秒)

  • 画面: 分屏显示
    • 左侧: 纺织厂入库操作 (49匹/4400米)
    • 右侧: 采购商仓库实时同步显示
  • 动作:
    • 纺织厂点击"确认入库"
    • 数据实时同步到采购商仓库
    • 通知弹窗: "坯布入库完成"
  • 文字说明: "数据双向同步,实时通知"

场景6: 系统特性总结 (17-20秒)

  • 画面: 系统Logo + 特性列表
  • 文字展示:
    • "多角色协作"
    • "敏感信息保护"
    • "实时数据同步"
    • "智能通知提醒"
  • 结束语: "协作管理demo样机"

技术实现建议

方案1: 使用 Excalidraw + 录屏

  1. 打开 textile-system-demo.excalidraw 文件
  2. 使用录屏软件 (如 OBS、Screen Studio)
  3. 按照脚本逐步展示每个场景
  4. 添加文字说明和转场效果

方案2: 使用 Framer Motion 制作动画

创建 React 组件,使用 Framer Motion 实现自动播放的演示动画

方案3: 使用视频编辑工具

  1. 截取系统实际运行画面
  2. 使用 Premiere Pro / Final Cut Pro / 剪映 编辑
  3. 添加转场、文字、背景音乐

关键画面截图建议

  1. 登录页: 展示纺织主题动画效果
  2. 采购商Dashboard: 统计卡片 + 快捷操作
  3. 新建计划页: 表单填写过程
  4. 分享链接弹窗: 加密链接展示
  5. 导入计划页: 对比显示可见/隐藏字段
  6. 流程节点页: 5个步骤的确认过程
  7. 仓库管理页: 入库记录和库存统计
  8. 通知中心: 实时通知弹窗

配音脚本 (可选)

"协作管理demo样机专为纺织行业打造。
采购商创建计划,敏感信息自动加密。
纺织厂通过链接导入,只能看到生产相关信息。
实时跟踪生产进度,每个节点一键确认。
入库数据双向同步,实时通知确保信息不遗漏。
多角色协作,敏感信息保护,实时数据同步。
协作管理demo样机让纺织生产更高效。"

输出文件

  • textile-system-demo.excalidraw - Excalidraw 流程图源文件
  • 可在 https://excalidraw.com 打开编辑
  • 支持导出为 PNG/SVG/剪贴板