按理说，

真实面试体验的痛点

在市面上大多数「模拟面试」工具里流程往往是：你输入答案 → 机器给你范文 → 下一题。但真正让人手心冒汗的并不是题目本身。而是那句「你刚才说用了缓存，那缓存击穿怎么办？」——面试官盯着你的回答顺藤摸瓜地追问。再看使用者痛点，

• 缺少实时追问。像念题机一样机械，说起来，
• 无法感受到真实候选人与面试官之间的交互闭环。按理说，
• 对话节奏被打乱。回答后没有即时反馈与后续问题。

云面 YunMian AI：一站式会追问、会点评、能听你说话的数字人

云面的目标很直接：做一个会追问、会点评、能听你说话的面试官。让它以数字人的形态站在屏幕右下角，实时开口。背后是魔珐星云的具身交互智能——不是播放录好的视频。而是大模型实时生成问题、云端实时解算口型与表情，端到端延迟压在 500ms 上下。

一面 · 产品架构：决定交互闭环的三个技术选型

再看交互入口。结构化职位画像驱动的提问锚点

最朴素的聊天框暴露了硬伤——候选人不知道自己该被问什么面试官也没有上下文，只能问些空泛的问题。至于方法，入口改为职位卡片，让使用者先选岗位。每张卡片预置考察主要、难度和题量，直接给数字人提供提问方向锚点。

会话发起这方面，候选人视角的 Prompt 组装策略

数字人不自说自话。而是在使用者点击“开始”时以候选人的口吻组装提示词发送给大模型，例如：

appState.ui.text = `我来应聘「${p.title}」岗位。请你作为专业面试官...`;

从布局分治来看。数字人渲染层与详情卡片的空间避让

数字人固定在右下角，职位详情卡片靠左弹出，避免视觉冲突，使得数字人成为画面的主角而非装饰。

二面 · 环境搭建：魔珐星云数字人应用配置全流程

步骤一这方面，创建横屏驱动应用

• 说到应用名称。“云面 · AI 模拟面试官”
• 至于预览模式，横屏模式

从步骤二来看，选择数字人形象模型

这里使用黑璨形象，沉稳专业；可根据场景换成其他形象，

从步骤三来看。配置透明背景全身渲染场景

透明背景让数字人无缝叠加于网页粒子背景之上，提高沉浸感。

至于步骤四。调校音色与语速语调

通过音色配置调节语速、语调和音量，使声音更贴近真人。

再看步骤五。 绑定待机与说话表演动作

配合微表情和肢体语言，让对话更自然；完成后获取 AppID 与 AppSecret 用于网页连接。

三面 · 代码实现：拆解「会追问」的六个主要模块

M1 模块一 – Position 数据模型与岗位画像结构

export interface Position {
至于id，string;title: string;titleEn: string;category: string;level: string;// 初级 / 中级 / 高级 / 专家
difficulty: number;// -
tags这方面，string;description: string;focus: string;// 考察主要
questionCount: number;duration: string;// 时长
icon这方面，string;// emoji 图标
gradient: string;// 卡片主色渐变
}

• level & difficulty：
• focus：

M2 模块二 – Three.js 粒子背景 & 实时筛选计算属性

// 初始化粒子背景
const PARTICLE_COUNT = function initBackground {
if return;const w = bgContainer.value.clientWidth;const h = bgContainer.value.clientHeight;scene = new THREE.Scene;camera = new THREE.PerspectiveCamera;renderer = new THREE.WebGLRenderer;按理说，}

• 'alpha:true'：

const filteredPositions = computed => {
let list = positions;if {
list = list.filter;}
const keyword = searchText.value.trim.toLowerCase;if {
list = list.filter(p =>
p.title.includes ||
p.titleEn.toLowerCase.includes ||
p.category.includes ||
p.tags.some.includes)
);}
return list;})，

M3 模块三 – 开场 Prompt 的组装与组件编排

function handleStart {
const p = props.position;appState.ui.text =
`我来应聘「${p.title}」岗位。请你作为专业面试官...`;emit，}

M4 模块四 – 流式断句算法 & 首句优先播报