推出 Eleven v4认识 Eleven v4:迄今情感表现最丰富的模型。

跳至内容

与雕像对话:构建多模态 ElevenAgents 驱动的应用

作者
Joe Reeve
发布时间
最近更新

收听收听本文

拍摄一座雕像,识别其中的人物。然后与他们进行实时语音对话——每个角色都使用独特且符合时代背景的声音。

借助 ElevenLabs 的声音设计和智能体 API,你就能构建这样的应用。本文将介绍一款移动端 Web 应用的架构:它结合计算机视觉与语音生成,将公共纪念碑变成可互动的体验。以下 API 和代码示例均可复现。

跳过教程:用一条提示词构建

下方的整个应用仅通过一条提示词构建,并已在空白 NextJS 项目中测试,可通过 Cursor 搭配 Claude Opus 4.5(high)一次成功生成。如果想直接构建自己的版本,请将以下内容粘贴到编辑器中:

We need to make an app that:
- is optimised for mobile
- allows the user to take a picture (of a statue, picture, monument, etc) that includes one or more people
- uses an OpenAI LLM api call to identify the statue/monument/picture, characters within it, the location, and name
- allows the user to check it's correct, and then do either a deep research or a standard search to get information about the characters and the statue's history, and it's current location
- then create an ElevenLabs agent (allowing multiple voices), that the user can then talk to as though they're talking to the characters in the statue. Each character should use voice designer api to create a matching voice.
The purpose is to be fun and educational.

https://elevenlabs.io/docs/eleven-api/guides/how-to/voices/voice-design
https://elevenlabs.io/docs/eleven-agents/quickstart 
https://elevenlabs.io/docs/api-reference/agents/create


你也可以使用 ElevenLabs Agent Skills,而非链接到文档。这些技能基于文档构建,效果可能更好。

本文其余部分将拆解这条提示词生成的内容。

工作原理

整个流程分为 5 个阶段:

  1. 拍摄图像
  2. 识别艺术品及其中的人物(OpenAI)
  3. 研究历史背景(OpenAI)
  4. 为每个角色生成独特声音(ElevenAPI)
  5. 通过 WebRTC 开始实时语音对话(ElevenAgents)

使用视觉识别雕像

用户拍摄雕像后,图像将发送至具备视觉能力的 OpenAI 模型。结构化系统提示词会提取艺术品名称、地点、艺术家、日期,以及最关键的——每个角色的详细声音描述。系统提示词包含预期的 JSON 输出格式:

{
  "statueName": "string - name of the statue, monument, or artwork",
  "location": "string - where it is located (city, country)",
  "artist": "string - the creator of the artwork",
  "year": "string - year completed or unveiled",
  "description": "string - brief description of the artwork and its historical significance",
  "characters": [
    {
      "name": "string - character name",
      "description": "string - who this person was and their historical significance",
      "era": "string - time period they lived in",
      "voiceDescription": "string - detailed voice description for Voice Design API (include audio quality marker, age, gender, vocal qualities, accent, pacing, and personality)"
    }
  ]
}
const response = await openai.chat.completions.create({
  model: "gpt-5.2",
  response_format: { type: "json_object" },
  messages: [
    { role: "system", content: SYSTEM_PROMPT },
    {
      role: "user",
      content: [
        {
          type: "text",
          text: "Identify this statue/monument/artwork and all characters depicted.",
        },
        {
          type: "image_url",
          image_url: {
            url: `data:image/jpeg;base64,${base64Data}`,
            detail: "high",
          },
        },
      ],
    },
  ],
  max_completion_tokens: 2500,
});

对于伦敦威斯敏斯特桥上布狄卡雕像的照片,响应如下:

{
  "statueName": "Boudica and Her Daughters",
  "location": "Westminster Bridge, London, UK",
  "artist": "Thomas Thornycroft",
  "year": "1902",
  "description": "Bronze statue depicting Queen Boudica riding a war chariot with her two daughters, commemorating her uprising against Roman occupation of Britain.",
  "characters": [
    {
      "name": "Boudica",
      "description": "Queen of the Iceni tribe who led an uprising against Roman occupation",
      "era": "Ancient Britain, 60-61 AD",
      "voiceDescription": "Perfect audio quality. A powerful woman in her 30s with a deep, resonant voice and a thick Celtic British accent. Her tone is commanding and fierce, with a booming quality that projects authority. She speaks at a measured, deliberate pace with passionate intensity."
    },
    // Other characters in the statue
  ]
}

编写有效的声音描述

声音描述的质量直接决定生成声音的质量。 声音设计提示词指南对此有详细说明,但应包含以下关键属性:音频质量标记(“Perfect audio quality.”)、年龄和性别、音调/音色(深沉、洪亮、沙哑)、精确口音(如“thick Celtic British accent”,而不只是“British”)以及语速。描述越具体,结果越准确——“一位 60 多岁、带有冷幽默感且略显疲惫的纽约女性”总会优于“年长女性声音”。

指南中还有几点值得注意:描述口音强度时应使用 “thick” 而非 “strong”;避免使用 “foreign” 等模糊词汇;对于虚构或历史角色,可以用现实世界中的口音作为参考(例如,“一位带着浓重英国口音、威严且强势的古凯尔特女王”)。

使用 声音设计

声音设计 API可根据文本描述生成新的合成声音——无需声音样本或克隆。因此,它非常适合没有原始录音资料的历史人物。

该流程分为两步。

生成预览

const { previews } = await elevenlabs.textToVoice.design({
  modelId: "eleven_multilingual_ttv_v2",
  voiceDescription: character.voiceDescription,
  text: sampleText,
});

text 参数很重要。更长且符合角色特点的示例文本(50+ 词)能产生更稳定的结果——应让对白贴合角色,而不是使用通用问候语。 声音设计提示词指南对此有更详细的说明。

保存声音

生成预览后,选择其中一个并创建永久声音:

const voice = await elevenlabs.textToVoice.create({
  voiceName: `StatueScanner - ${character.name}`,
  voiceDescription: character.voiceDescription,
  generatedVoiceId: previews[0].generatedVoiceId,
});

对于多角色雕像,声音创建会并行进行。生成 5 个角色的声音所需时间与生成 1 个大致相同:

const results = await Promise.all(
  characters.map((character) => createVoiceForCharacter(character))
);

构建多声音 ElevenLabs Agent

创建声音后,下一步是配置一个可在角色声音之间实时切换的 ElevenLabs Agent。

const agent = await elevenlabs.conversationalAi.agents.create({
  name: `Statue Scanner - ${statueName}`,
  tags: ["statue-scanner"],
  conversationConfig: {
    agent: {
      firstMessage,
      language: "en",
      prompt: {
        prompt: systemPrompt,
        temperature: 0.7,
      },
    },
    tts: {
      voiceId: primaryCharacter.voiceId,
      modelId: "eleven_v3",
      supportedVoices: otherCharacters.map((c) => ({
        voiceId: c.voiceId,
        label: c.name,
        description: c.voiceDescription,
      })),
    },
    turn: {
      turnTimeout: 10,
    },
    conversation: {
      maxDurationSeconds: 600,
    },
  },
});

多声音切换

supportedVoices 数组会告知智能体哪些声音可用。Agents 平台会自动处理声音切换——当 LLM 的响应表明由其他角色发言时,TTS 引擎会将该片段路由至正确的声音。

群组对话的提示词工程

要让多个角色像真实群体一样互动,而不是依次问答,需要精心设计提示词:

const multiCharacterRules = `
MULTI-CHARACTER DYNAMICS:
You are playing ALL ${characters.length} characters simultaneously.
Make this feel like a group conversation, not an interview.

- Characters should interrupt each other:
  "Actually, if I may -" / "Wait, I must say -"

- React to what others say:
  "Well said." / "I disagree with that..." / "Always so modest..."

- Have side conversations:
  "Do you remember when -" / "Tell them about the time you -"

The goal is for users to feel like they are witnessing a real exchange
between people who happen to include them.
`;

通过 WebRTC 实现实时语音

最后一部分是客户端连接。ElevenLabs Agents 支持通过 WebRTC 进行低延迟语音对话——比基于 WebSocket 的连接明显更快,这对自然的轮流交谈至关重要。

服务端:获取对话令牌

const { token } = await client.conversationalAi.conversations.getWebrtcToken({
    agentId,
});

客户端:启动会话

import { useConversation } from "@elevenlabs/react";

const conversation = useConversation({
  onConnect: () => setIsSessionActive(true),
  onDisconnect: () => setIsSessionActive(false),
  onMessage: (message) => {
    if (message.source === "ai") {
      setMessages((prev) => [...prev, { role: "agent", text: message.message }]);
    }
  },
});

await conversation.startSession({
  agentId,
  conversationToken: token,
  connectionType: "webrtc",
});

useConversation Hook 可处理音频采集、流式传输、语音活动检测和播放。

通过网络搜索深化研究

对于想在开始对话前了解更多历史背景的用户,可以使用 OpenAI 的网络搜索工具添加增强研究模式:

const response = await openai.responses.create({
  model: "gpt-5.2",
  instructions: RESEARCH_SYSTEM_PROMPT,
  tools: [{ type: "web_search_preview" }],
  input: `Research ${identification.statueName}. Search for current information
including location, visiting hours, and recent news about the artwork.`,
});

我们的收获

这个项目表明,结合文本、研究、视觉和音频等不同 AI 模态后,可以构建连接数字世界与现实世界的体验。多模态智能体仍有大量未探索的潜力,期待更多人将其用于教育、工作和娱乐。

开始构建

本项目使用的 API—— 声音设计、 ElevenAgents和 OpenAI——现已全部可用。

作者

Joe is on the Growth team at ElevenLabs, focused on helping developers get the most out of the company's frontier audio models. Previously, he was an Engineering Manager at Amplitude and served as CTO of the Coronavirus Tech Handbook, building a real-time collaborative editing platform used by thousands of contributors.

相关内容

用高质量 AI 音频创作