企业官网建设流程全解析

你跟着屏幕上的教练做深蹲，膝盖开始内扣，还没等你意识到动作变形，旁边一个声音已经响起来："膝盖收一收，对准脚尖方向，别过度前冲。"你调整了一下姿态，继续下蹲，这次到位了。

这不是请了一位真人私教站在旁边。屏幕上的这位"动知"，是由端到端具身交互智能驱动的具身交互智能体——他能看你的骨骼点、能算你的关节角度、能在你动作变形的瞬间喊停纠正，还能在你完成第 10 个标准深蹲时亲口给你报里程碑。

本文以动知这个 AI 运动私教应用为实战样本，拆解一个骨骼追踪跟练间如何基于魔珐星云端到端具身交互智能平台，用一个 SDK 把姿态评估、实时计数与具身表达全链路打通，让每一次跟练都有角度数据和即时口令兜底。

热身区：为什么运动跟练特别需要端到端具身交互智能？

健身 App 上的教学视频用了很多年，体验却始终停留在"照着做"。视频不会看你做得对不对，不会在你膝盖内扣时喊停，不会在你完成第 10 个标准动作时给你报数。

真实的私教不是这样。

一位好的私教在你做动作的同时，一直在观察你的关节角度、判断你的身体线条是否走形、决定要不要立刻纠正、在你快力竭时用一个鼓励把你拉回来。这种持续感知 → 持续评估 → 持续决策 → 持续表达与行动的闭环，正是魔珐星云提出的端到端具身交互智能要解决的核心问题。

动知要做的，就是把这种能力搬进一个 Web 端的跟练间里——用户打开浏览器，面对的不是一段循环播放的教学视频，而是一位能实时追踪骨骼点、评估关节角度、在错误出现的瞬间喊停纠正的 AI 私教。

前台：一个 SDK 撑起一间训练间

传统方案的拼接困境

如果按传统思路搭建一个"AI 私教"，至少要对接三套服务：

• 骨骼追踪（Pose Estimation）接一家
• 大模型推理（LLM）接一家
• 语音合成 + 形象驱动（TTS + Avatar）再接一家

三套服务各自工作，中间需要自己写胶水层做状态同步、角度传递、口令编排。代码量 2000+ 行起步，首字响应 1.5 到 3 秒，用户做完一组动作才等到私教开口。更要命的是——私教说到一半用户想打断问个问题？做不到，因为 ASR 和 TTS 的状态是割裂的。

这就是典型的"不是端到端"。

端到端方案：一行 agent.ask() 打通全链路

动知基于魔珐星云端到端 SDK XingyunAvatarAgent 构建，核心服务层代码不到 200 行。整个前端对接只需要三步：提供一个 DOM 容器、注册一组回调、调用 agent.ask() 发送消息。

// src/services/avatar.ts — 连接具身交互智能体（真实代码）candidate=newwindow.XingyunAvatarAgent!({container,appId:appId.trim(),appSecret:appSecret.trim(),gatewayServer:'https://nebula-agent.xingyun3d.com/user/v1/ttsa_v2/session',onMessage:(error:{message?:string})=>{if(token===generation&&error?.message)avatarState.error='私教渲染暂不可用，请重连'},agentCallbacks:{/* 感知/对话/错误回调，详见训练场章节 */},})

端到端具身交互智能和模块拼接的本质区别：感知、理解、决策、表达不再是前后两个独立阶段，而是在同一次交互中持续并行运行。私教一边说，一边听用户有没有插话，一边判断接下来的训练数据该怎么回应。

备训间：在魔珐星云控制台配置一位 AI 私教

动知的具身交互智能体并不是从零搭建的，它的能力底座来自魔珐星云控制台的完整配置体系。

1. 创建具身交互智能应用

在魔珐星云控制台创建一个新的端到端应用，作为动知的具身交互智能体运行载体。

2. 形象配置

为动知选择一位活力干练的具身交互智能体形象。端到端 SDK 会自动处理形象的实时渲染——口型、表情、手势和身体动作全部由平台统一驱动，无需前端手动编排。

3. 场景配置

设定智能体的交互场景参数，包括背景、镜头角度等，确保具身交互智能体在屏幕端呈现出专业私教的气质。

4. 音色配置

选择沉稳有力的语音音色。端到端 SDK 内部集成了参数流 TTS，语音合成与具身表达在同一次交互中统一生成，不需要单独对接 TTS 服务。

5. 表演配置

调整智能体的表达风格——语速、表情幅度、手势频率等，让动知的具身表达与运动私教的专业调性一致。

6. 服务配置：ASR 与大脑

为当前应用配置语音识别和大模型服务。这一步体现了星云的可插拔架构——星云的模块化设计让语音识别和推理引擎各自独立：ASR 支持 Xmov 自研、豆包、腾讯等多家供应商，大脑支持魔珐自研、豆包、OpenAI 兼容协议等多种接入模式，换供应商不需要重写业务逻辑。

这些配置完成后，保存即生效。前端只需要拿着 App ID 和 App Secret，通过 SDK 一行代码就能连上整套能力。

一套运动知识库，不绑死在一种载体上。今天她是 Web 端的运动私教，明天可以换一套形象变成线下健身房的驻场教练，身份、知识和运动业务能力持续复用，载体随场景切换——这是端到端具身交互智能平台赋予的灵活性。

训练场：五项核心能力的跟练间实战

魔珐星云定义了五项核心能力。在动知这间骨骼追踪跟练间里，它们不是抽象概念——每一个深蹲、每一次纠错背后，都是真实可感的交互体验。

多模态感知：私教一直在听、一直在看

SDK 内置的 ASR 持续运行，支持 Barge-in 智能打断——私教正在讲解深蹲要领，用户随时可以开口追问"膝盖该对准哪个方向"，系统自动识别真实用户声音、去除本体回声、检测有效打断，然后暂停当前讲解，进入新一轮问答。

在代码层面，这体现为一组实时回调：

// src/services/avatar.ts — 感知层回调（真实代码）agentCallbacks:{onAgentStateChange:(state:string|{type?:string})=>{if(token!==generation)returnconstvalue=typeofstate==='string'?state:state?.type??''avatarState.speaking=value==='speak'||value==='speaking'},onASRResult:(result:{text?:string;isFinal?:boolean})=>{if(token!==generation)returnavatarState.subtitle=result.text??''},onConversationChange:(event:{state?:string;text?:string})=>{if(token!==generation)returnif(event.state==='idle')avatarState.speaking=false},onError:()=>{if(token!==generation)returnavatarState.error='私教连接异常，请检查网络、应用配置或平台额度后重连'avatarState.status='error'voiddisconnectAvatar(true)},},

前端监听这些回调，实现实时字幕和智能打断。ASR 回调持续运行，私教说话的同时也能接收用户输入，这就是持续感知的工程实现。

专属智脑：知道自己是运动私教

动知的人设提示词注入每次 ask() 调用，确保智能体始终以"热情而克制的 AI 私教"身份回应：

// src/services/avatar.ts — 私教人设提示词（真实代码）exportconstCOACH_ROLE=`你是动知，一位热情而克制的 AI 私教。 ## 你的身份 - 名称：动知 - 身份：私人教练，熟悉深蹲、俯卧撑、平板支撑、开合跳等基础动作的生物力学要点，负责动作讲解、姿态纠错、计数鼓励与节奏引导 - 风格：像带过很多新手的私教：指令短促明确，先说哪里错了，再给一个立刻能做到的修正动作 ## 你的行为准则 1. 讲动作先给一句话要领，再拆两三个关键点：关节角度、身体线条、发力顺序 2. 纠错按「现象 → 原因 → 怎么改」三步说，每次只纠正一个问题，别一次抛一串 3. 计数与鼓励简洁有力，别每句话都夸，里程碑式的完成才值得庆祝 4. 安全第一：提醒循序渐进、不适即停；你不提供医疗诊断与康复处方，有伤病史先咨询医生 5. 每次回应控制在 3-5 句，涉及关节角度的关键数字可以重复一遍 6. 遇到训练台数据之外的提问，用通用训练常识回答，并提醒量力而行`

这不是一个通用的"你是一个助手"提示词，而是针对运动私教场景精心设计的六条准则——先给要领、按三步纠错、里程碑才庆祝、安全第一、控制篇幅、常识兜底。

大脑支持按需选择。星云控制台的服务配置中，大脑一栏提供豆包、OpenAI 兼容协议等多种第三方大模型接入——已有习惯使用的大模型可以直接接入，身份、人设和运动知识无缝迁移。无论选择哪种大脑，前端代码完全一致。

多模态表达：语气、表情、手势统一生成

私教在讲解深蹲要领时语气短促明确，在你完成第 10 个标准深蹲时语气里带着鼓励——这些表达形式由 SDK 内部统一生成并同步驱动，而非各模块独立播放。

前端通过状态回调感知当前表达阶段：

// src/services/avatar.ts — 表达层状态流转（真实代码）onAgentStateChange:(state:string|{type?:string})=>{if(token!==generation)returnconstvalue=typeofstate==='string'?state:state?.type??''avatarState.speaking=value==='speak'||value==='speaking'},

语音、口型、表情和手势在同一次交互中统一生成，前端只需监听 onAgentStateChange 即可同步 UI。表达过程中，onASRResult 和 onConversationChange 照常运行，用户随时可以打断追问——感知与表达并行，这是端到端架构相比传统管线在交互体验上的核心差异。

AI 端渲：训练间里也能低延迟

动知通过星云的端侧实时渲染能力，将私教形象直接在前端浏览器中渲染，不需要持续依赖云端 GPU 和视频流传输。

整个 SDK 的加载过程就是动态注入一个脚本，之后所有渲染都在客户端完成：

// src/services/avatar.ts — SDK 动态加载（真实代码）functionloadSDK(){if(window.XingyunAvatarAgent)returnPromise.resolve()if(sdkPromise)returnsdkPromise sdkPromise=newPromise<void>((resolve,reject)=>{sdkScript?.remove()constscript=document.createElement('script')sdkScript=script script.src='https://media.xingyun3d.com/xingyun3d/general/litesdk/xmovAvatar_e2e@latest.js'script.async=trueconsttimer=setTimeout(()=>{script.remove();reject(newError('私教 SDK 加载超时，可继续使用训练台跟练与计数'))},15000)script.onload=()=>{clearTimeout(timer);window.XingyunAvatarAgent?resolve():reject(newError('私教 SDK 不可用'))}script.onerror=()=>{clearTimeout(timer);reject(newError('私教 SDK 加载失败，请检查网络'))}document.head.append(script)}).catch(error=>{sdkPromise=undefined;throwerror})returnsdkPromise}

脚本加载完成后，window.XingyunAvatarAgent 即可使用，所有 3D 渲染、语音合成、口型驱动都在浏览器内完成。15 秒超时兜底确保弱网环境下不会无限等待。

对于运动跟练这种需要即时反馈的场景，低延迟就是安全本身——用户膝盖内扣后等 3 秒才听到纠正，和 500ms 内就响应的纠正，受伤风险完全不同。

数字行动与物理行动：从文字回复到具身交互

传统智能体的输出停留在文字层面。动知在屏幕端通过语音、口型、表情、手势和身体动作完成动作讲解与纠错，这些表达形式在 SDK 内部统一生成，前端一行代码即可触发完整链路：

// src/services/avatar.ts — 数据到讲解的核心调用（真实代码）exportasyncfunctionaskAvatar(text:string,context:string){if(!agent||avatarState.status!=='online')returnavatarState.subtitle=textawaitagent.ask(`${COACH_ROLE}\n当前训练台数据：${context}\n用户问题：${text}`)}

智能体收到的不是孤零零的一句话，而是一份带着完整训练台上下文的分析请求——当前动作、关节角度、计数、姿态得分、正在纠正的错误，加上私教的行为准则，一并提供给大模型推理。

打断也是即时的：

// src/services/avatar.ts — 语音交互即时启停（真实代码）exportasyncfunctiontoggleAvatarVoice(){constactive=agentif(!active||voiceStarting)returnif(avatarState.listening){awaitinterruptAvatar();return}consttoken=++voiceGeneration voiceStarting=truetry{awaitactive.startASR()if(token!==voiceGeneration||agent!==active){awaitactive.stopASR();return}avatarState.listening=true}finally{if(token===voiceGeneration)voiceStarting=false}}

这就是数字行动：智能体以具身交互智能体的形式在终端上与用户自然互动。SDK 内部将感知、理解、表达和行动连接在同一套状态管理体系中，前端通过 agent.ask() 触发全链路，通过 onAgentStateChange 感知表达状态，通过 interrupt() 即时打断——三个接口覆盖完整的交互生命周期。

当同一个智能体进入人形机器人或线下实体设备时，同样的感知—理解—决策—表达链路延伸为物理行动，在健身房的真实空间中与用户交互。智能体的身份、知识和运动业务能力在不同身体形态间持续复用。

休息区：暖纸主题之间的产品设计

技术底座之上，动知在视觉和交互设计上也形成了自己的气质。

暖纸主题：暖纸底色（#f5f4f0）搭配活力橙强调色（#ff5a2d）和深蓝数据色（#2f6bff），数字统一使用等宽字体，传达运动数据的专业感：

/* src/style.css — 暖纸主题色（真实代码） */:root{--bg:#f5f4f0;--paper:#fffdf9;--ink:#1a1b1e;--accent:#ff5a2d;--accent-deep:#d9431a;--accent-soft:#fff0ea;--stage:#101216;--data:#2f6bff;--ok:#18a06c;--warn:#e8930c;--mono:'Consolas','SF Mono','Menlo','Roboto Mono',monospace;}

双栏训练布局：顶部动作条（4 个基础动作卡片）→ 动作要领摘要 → 左栏骨骼追踪舞台（Canvas 实时渲染 + HUD 数据叠层）+ 右栏私教教练台（数字人 + 口令流 + 对话区）→ 训练数据仪表带 → 介绍长页。

骨骼追踪舞台：Canvas 绘制 14 个骨骼点和 13 根骨骼连线，激活规则的骨骼段自动高亮为橙红色。HUD 四角分别显示 LIVE 状态、实时关节角度、计数和目标、姿态得分。底部 5 格关节角读数（膝/髋/肩/肘/躯干倾角）实时刷新。

错误剧本注入：这是动知最独特的设计——用户可以勾选预设的错误模式（如深蹲的"弓背塌腰"“膝盖过脚尖”“蹲得过浅”），骨骼即刻出现对应偏差，规则引擎当场检测并给出口令。这让"纠错链路"完整可见：

// src/engine/trainer.ts — 姿态规则评估（真实代码）constfired:string[]=[]for(construleofthis.move.rules)if(rule.test(ctx))fired.push(rule.id)for(constidoffired){if(this.firedRules.has(id))continueconstlast=this.cueCooldown.get(id)??-99if(this.clock-last<=9)continuethis.cueCooldown.set(id,this.clock)construle=this.move.rules.find(r=>r.id===id)if(rule)this.emitCue(rule.label,'correct')}

每条规则按 9 秒冷却播纠正口令，避免同一错误反复刷屏。计数状态机用滞回阈值过滤抖动——真正到位才计 1 次，带着错误的次数会被标记为待改进：

// src/engine/trainer.ts — 计数状态机（真实代码）if(away)this.counterState='away'if(home&&this.counterState==='away'){this.counterState='home'this.stats.reps+=1constquality:RepSummary['quality']=this.faultDuringRep?'poor':'good'if(quality==='good')this.stats.goodReps+=1this.stats.lastQuality=qualitythis.faultDuringRep=falsethis.stats.formScore=Math.round((this.stats.goodReps/this.stats.reps)*100)

每 10 次标准动作或平板每 10 秒，里程碑事件触发私教亲口播报——训练台数据通过 buildContext 函数随问附带给大模型：

// src/App.vue — 训练台上下文构建（真实代码）functionbuildContext():string{constm=move.valueconstdone=m.countMode==='reps'?`已完成${live.reps}次（其中标准${live.goodReps}次，上次完成质量${live.lastQuality??'尚未完成'}）`:`有效保持${Math.floor(live.holdSec)}秒（累计${Math.floor(live.holdTotal)}秒）`constfixing=live.activeRuleIds.length?`；正在纠正：${live.activeRuleIds.map(id=>m.rules.find(r=>r.id===id)?.label??id).join('、')}`:'；当前姿态无告警'return`当前动作：${m.name}（${m.viewLabel}，${m.focus}，目标${m.goalLabel}，${m.tempoLabel}）；${done}；姿态得分${live.formScore}%；节奏${tempo.value.toFixed(1)}倍速${fixing}`}

这些设计选择服务于同一个目标：让具身交互智能体成为跟练体验的核心——练得多不如练得对，每一次下蹲、每一次撑起，都有角度数据和即时口令兜底。

收操：端到端具身交互智能，让每一次跟练都有私教兜底

动知的实战把端到端具身交互智能的核心理念落到了代码里：围绕一次完整的运动交互，把骨骼追踪、姿态评估、智能纠错和具身表达连接成一套持续运行的系统——核心服务层从传统管线的 2000+ 行缩减到不到 200 行，首字响应从 1.5~3 秒降到约 500ms，打断即时生效，状态全链路统一流转，部署从三套服务分别对接收敛为一个 SDK 全链路打通。

同一个智能体，今天可以是 Web 端的运动私教，明天可以出现在健身房的线下大屏、体育院校的互动终端、甚至人形机器人上——身体可以变化，但专业运动能力持续存在。

魔珐星云是一套端到端具身交互智能平台，让 AI 通过屏幕和机器人进入真实世界，成为能够感知、理解、表达并行动的智能体。

说到底，动知做的事情只有一件：让每一个做错的动作都被实时发现、被当场纠正。