.webp&w=3840&q=95)
Company
.webp&w=3840&q=95)
ElevenLabs partners with the UK Government on voice AI safety research
UK AI Security Institute researchers will explore the implications of AI voice technology
Prata med en staty: Bygg en multimodal app med ElevenAgents
.webp&w=3840&q=95)
Fotografera en staty. Identifiera personerna som avbildas. Ha sedan ett samtal med dem i realtid – varje karaktär talar med en unik, tidstypisk röst.
Det här är vad du kan skapa med ElevenLabs Voice Design och Agent API:er. I det här inlägget går vi igenom hur en mobil webbapp är uppbyggd som kombinerar datorseende med röstgenerering för att göra offentliga monument till interaktiva upplevelser. Allt här kan återskapas med API:erna och kodexemplen nedan.
Hoppa över guiden – bygg allt med en prompt
Hela appen nedan byggdes från en enda prompt, testad och fungerade direkt iMarkör med Claude Opus 4.5 (high) från ett tomt NextJS-projekt. Om du vill hoppa direkt till bygget, klistra in detta i din editor:
| 1 | We need to make an app that: |
| 2 | - is optimised for mobile |
| 3 | - allows the user to take a picture (of a statue, picture, monument, etc) that includes one or more people |
| 4 | - uses an OpenAI LLM api call to identify the statue/monument/picture, characters within it, the location, and name |
| 5 | - 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 |
| 6 | - 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. |
| 7 | The purpose is to be fun and educational. |
| 8 | |
| 9 | https://elevenlabs.io/docs/eleven-api/guides/cookbooks/voices/voice-design |
| 10 | https://elevenlabs.io/docs/eleven-agents/quickstart |
| 11 | https://elevenlabs.io/docs/api-reference/agents/create |
Du kan också använda ElevenLabs Agent-färdigheter istället för att länka till dokumentationen. De bygger på dokumentationen och kan ge ännu bättre resultat.
Resten av inlägget förklarar vad prompten gör.
Så fungerar det
Flödet har fem steg:
- Ta en bild
- Identifiera konstverket och dess karaktärer (OpenAI)
- Undersök historiken (OpenAI)
- Skapa unika röster för varje karaktär (ElevenAPI)
- Starta ett röstsamtal i realtid via WebRTC (ElevenAgents)
Identifiera statyn med datorseende
När en användare fotograferar en staty skickas bilden till en OpenAI-modell med bildigenkänning. En strukturerad systemprompt tar fram konstverkets namn, plats, konstnär, datum och – viktigast – en detaljerad röstbeskrivning för varje karaktär. Systemprompten innehåller det förväntade JSON-formatet:
| 1 | { |
| 2 | "statueName": "string - name of the statue, monument, or artwork", |
| 3 | "location": "string - where it is located (city, country)", |
| 4 | "artist": "string - the creator of the artwork", |
| 5 | "year": "string - year completed or unveiled", |
| 6 | "description": "string - brief description of the artwork and its historical significance", |
| 7 | "characters": [ |
| 8 | { |
| 9 | "name": "string - character name", |
| 10 | "description": "string - who this person was and their historical significance", |
| 11 | "era": "string - time period they lived in", |
| 12 | "voiceDescription": "string - detailed voice description for Voice Design API (include audio quality marker, age, gender, vocal qualities, accent, pacing, and personality)" |
| 13 | } |
| 14 | ] |
| 15 | } |
| 1 | const response = await openai.chat.completions.create({ |
| 2 | model: "gpt-5.2", |
| 3 | response_format: { type: "json_object" }, |
| 4 | messages: [ |
| 5 | { role: "system", content: SYSTEM_PROMPT }, |
| 6 | { |
| 7 | role: "user", |
| 8 | content: [ |
| 9 | { |
| 10 | type: "text", |
| 11 | text: "Identify this statue/monument/artwork and all characters depicted.", |
| 12 | }, |
| 13 | { |
| 14 | type: "image_url", |
| 15 | image_url: { |
| 16 | url: `data:image/jpeg;base64,${base64Data}`, |
| 17 | detail: "high", |
| 18 | }, |
| 19 | }, |
| 20 | ], |
| 21 | }, |
| 22 | ], |
| 23 | max_completion_tokens: 2500, |
| 24 | }); |
För ett foto av Boudica-statyn vid Westminster Bridge i London ser svaret ut så här:
| 1 | { |
| 2 | "statueName": "Boudica and Her Daughters", |
| 3 | "location": "Westminster Bridge, London, UK", |
| 4 | "artist": "Thomas Thornycroft", |
| 5 | "year": "1902", |
| 6 | "description": "Bronze statue depicting Queen Boudica riding a war chariot with her two daughters, commemorating her uprising against Roman occupation of Britain.", |
| 7 | "characters": [ |
| 8 | { |
| 9 | "name": "Boudica", |
| 10 | "description": "Queen of the Iceni tribe who led an uprising against Roman occupation", |
| 11 | "era": "Ancient Britain, 60-61 AD", |
| 12 | "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." |
| 13 | }, |
| 14 | // Other characters in the statue |
| 15 | ] |
| 16 | } |
Skriva effektiva röstbeskrivningar
Kvaliteten på röstbeskrivningen avgör direkt kvaliteten på den genererade rösten. Guiden för Voice Design-promptar går igenom detta i detalj, men viktiga saker att ta med är: ljudkvalitet ("Perfekt ljudkvalitet."), ålder och kön, ton/klang (djup, resonant, skrovlig), exakt accent ("kraftig keltisk brittisk accent" istället för bara "brittisk"), och tempo. Ju mer beskrivande prompt, desto bättre resultat – "en trött New York-bo i 60-årsåldern med torr humor" ger alltid bättre resultat än "en äldre kvinnlig röst".
Några tips från guiden: använd "kraftig" istället för "stark" när du beskriver accent, undvik vaga ord som "utländsk", och för fiktiva eller historiska karaktärer kan du föreslå verkliga accenter som inspiration (t.ex. "en uråldrig keltisk drottning med kraftig brittisk accent, kunglig och bestämd").
Skapa karaktärsröster med Voice Design
Voice Design API skapar nya syntetiska röster utifrån textbeskrivningar – inga röstprover eller kloning krävs. Det passar perfekt för historiska personer där inget original-ljud finns.
Processen har två steg.
Skapa förhandslyssningar
| 1 | const { previews } = await elevenlabs.textToVoice.design({ |
| 2 | modelId: "eleven_multilingual_ttv_v2", |
| 3 | voiceDescription: character.voiceDescription, |
| 4 | text: sampleText, |
| 5 | }); |
Textparametern är viktig. Längre, karaktärsanpassad text (50+ ord) ger stabilare resultat – matcha dialogen till karaktären istället för att använda ett generiskt hälsningsmeddelande. Guiden för Voice Design-promptar går igenom detta mer i detalj.
Spara rösten
När förhandslyssningarna är klara, välj en och skapa en permanent röst:
| 1 | const voice = await elevenlabs.textToVoice.create({ |
| 2 | voiceName: `StatueScanner - ${character.name}`, |
| 3 | voiceDescription: character.voiceDescription, |
| 4 | generatedVoiceId: previews[0].generatedVoiceId, |
| 5 | }); |
För statyer med flera karaktärer skapas rösterna parallellt. Fem karaktärers röster genereras på ungefär samma tid som en:
| 1 | const results = await Promise.all( |
| 2 | characters.map((character) => createVoiceForCharacter(character)) |
| 3 | ); |
Bygga en ElevenLabs Agent med flera röster
När rösterna är klara är nästa steg att konfigurera enElevenLabs Agent som kan växla mellan karaktärsröster i realtid.
| 1 | const agent = await elevenlabs.conversationalAi.agents.create({ |
| 2 | name: `Statue Scanner - ${statueName}`, |
| 3 | tags: ["statue-scanner"], |
| 4 | conversationConfig: { |
| 5 | agent: { |
| 6 | firstMessage, |
| 7 | language: "en", |
| 8 | prompt: { |
| 9 | prompt: systemPrompt, |
| 10 | temperature: 0.7, |
| 11 | }, |
| 12 | }, |
| 13 | tts: { |
| 14 | voiceId: primaryCharacter.voiceId, |
| 15 | modelId: "eleven_v3", |
| 16 | supportedVoices: otherCharacters.map((c) => ({ |
| 17 | voiceId: c.voiceId, |
| 18 | label: c.name, |
| 19 | description: c.voiceDescription, |
| 20 | })), |
| 21 | }, |
| 22 | turn: { |
| 23 | turnTimeout: 10, |
| 24 | }, |
| 25 | conversation: { |
| 26 | maxDurationSeconds: 600, |
| 27 | }, |
| 28 | }, |
| 29 | }); |
Växla mellan flera röster
Arrayen supportedVoices talar om för agenten vilka röster som finns tillgängliga. Agents-plattformen hanterar röstväxlingen automatiskt – när LLM:ens svar visar att en annan karaktär talar, skickas den delen till rätt röst i TTS-motorn.
Promptdesign för gruppsamtal
För att flera karaktärer ska kännas som en riktig grupp – och inte bara en rad frågor och svar – krävs genomtänkt promptdesign:
| 1 | const multiCharacterRules = ` |
| 2 | MULTI-CHARACTER DYNAMICS: |
| 3 | You are playing ALL ${characters.length} characters simultaneously. |
| 4 | Make this feel like a group conversation, not an interview. |
| 5 | |
| 6 | - Characters should interrupt each other: |
| 7 | "Actually, if I may -" / "Wait, I must say -" |
| 8 | |
| 9 | - React to what others say: |
| 10 | "Well said." / "I disagree with that..." / "Always so modest..." |
| 11 | |
| 12 | - Have side conversations: |
| 13 | "Do you remember when -" / "Tell them about the time you -" |
| 14 | |
| 15 | The goal is for users to feel like they are witnessing a real exchange |
| 16 | between people who happen to include them. |
| 17 | `; |
Röst i realtid via WebRTC
Sista steget är klientanslutningen. ElevenLabs Agents stödjer WebRTC för röstsamtal med låg fördröjning – märkbart snabbare än WebSocket-baserade anslutningar, vilket är viktigt för naturliga samtal.
Server: hämta en samtalstoken
| 1 | const { token } = await client.conversationalAi.conversations.getWebrtcToken({ |
| 2 | agentId, |
| 3 | }); |
Klient: starta sessionen
| 1 | import { useConversation } from "@elevenlabs/react"; |
| 2 | |
| 3 | const conversation = useConversation({ |
| 4 | onConnect: () => setIsSessionActive(true), |
| 5 | onDisconnect: () => setIsSessionActive(false), |
| 6 | onMessage: (message) => { |
| 7 | if (message.source === "ai") { |
| 8 | setMessages((prev) => [...prev, { role: "agent", text: message.message }]); |
| 9 | } |
| 10 | }, |
| 11 | }); |
| 12 | |
| 13 | await conversation.startSession({ |
| 14 | agentId, |
| 15 | conversationToken: token, |
| 16 | connectionType: "webrtc", |
| 17 | }); |
Hooken useConversation hanterar ljudinspelning, streaming, röstaktivitetsdetektion och uppspelning.
Lägg till djup med webbsökning
För användare som vill ha mer historisk bakgrund innan samtalet kan du lägga till ett utökat forskningsläge med OpenAI:s webbsökningsverktyg:
| 1 | const response = await openai.responses.create({ |
| 2 | model: "gpt-5.2", |
| 3 | instructions: RESEARCH_SYSTEM_PROMPT, |
| 4 | tools: [{ type: "web_search_preview" }], |
| 5 | input: `Research ${identification.statueName}. Search for current information |
| 6 | including location, visiting hours, and recent news about the artwork.`, |
| 7 | }); |
Vad vi lärt oss
Det här projektet visar att när vi kombinerar olika AI-modaliteter – text, forskning, bild och ljud – kan vi skapa upplevelser som kopplar ihop den digitala och verkliga världen. Det finns mycket outforskad potential i multimodala agenter som vi gärna ser fler utforska för utbildning, arbete och nöje.
Börja bygga
API:erna som används i det här projektet –Voice Design,ElevenAgents och OpenAI – finns tillgängliga redan nu.
Utforska artiklar av ElevenLabs-teamet
Developer
How to use Agent Skils
Agent Skills are one of the highest-leverage ways to use LLMs. They provide the appropriate context for the task you want to accomplish in a repeatable manner.