{"id":28754444,"url":"https://github.com/aimaster-dev/call-with-ai-agent","last_synced_at":"2026-04-09T21:08:10.631Z","repository":{"id":298849758,"uuid":"1001311497","full_name":"aimaster-dev/call-with-ai-agent","owner":"aimaster-dev","description":"A voice-based AI chat interface built with Next.js and ElevenLabs. Start and stop real-time conversations with an animated UI that reflects agent status. Fully responsive and deployable via Vercel with environment-based agent configuration.","archived":false,"fork":false,"pushed_at":"2025-06-13T07:59:03.000Z","size":36,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-06-13T08:41:49.992Z","etag":null,"topics":["ai-assistant","ai-voice","animated-ui","client-side-agent","conversation-agent","elevenlabs","microphone-access","nextjs","real-time-chat","speech-ai","tailwind-css","typescript","vercel","voice-chat","voice-interaction","web-application"],"latest_commit_sha":null,"homepage":"https://call-with-ai-agent.vercel.app","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/aimaster-dev.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-06-13T07:03:10.000Z","updated_at":"2025-06-13T08:02:35.000Z","dependencies_parsed_at":"2025-06-13T08:42:25.893Z","dependency_job_id":"651f5e85-aad8-4f2b-886a-f96375f04c13","html_url":"https://github.com/aimaster-dev/call-with-ai-agent","commit_stats":null,"previous_names":["aimaster-dev/call-with-ai-agent"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/aimaster-dev/call-with-ai-agent","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aimaster-dev%2Fcall-with-ai-agent","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aimaster-dev%2Fcall-with-ai-agent/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aimaster-dev%2Fcall-with-ai-agent/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aimaster-dev%2Fcall-with-ai-agent/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/aimaster-dev","download_url":"https://codeload.github.com/aimaster-dev/call-with-ai-agent/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aimaster-dev%2Fcall-with-ai-agent/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":260269457,"owners_count":22983648,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["ai-assistant","ai-voice","animated-ui","client-side-agent","conversation-agent","elevenlabs","microphone-access","nextjs","real-time-chat","speech-ai","tailwind-css","typescript","vercel","voice-chat","voice-interaction","web-application"],"created_at":"2025-06-17T01:09:27.343Z","updated_at":"2026-04-09T21:08:10.581Z","avatar_url":"https://github.com/aimaster-dev.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 🧠 Call with AI Agent\n\nA voice-interactive web UI built with **Next.js** and **ElevenLabs**, enabling real-time conversations with an ElevenLabs agent. Users can start and stop a session, and visually observe when the agent is speaking or listening through animated button feedback.\n\n- 🔗 GitHub: [github.com/aimaster-dev/call-with-ai-agent](https://github.com/aimaster-dev/call-with-ai-agent)\n- 🌐 Live Demo: [call-with-ai-agent.vercel.app](https://call-with-ai-agent.vercel.app)\n\n---\n\n## 🚀 Features\n\n- 🎙️ Voice input using browser microphone access\n- 🧠 Agent session control using ElevenLabs' SDK\n- 💬 Live status updates for speaking vs listening\n- ✨ Animated visual feedback via Tailwind CSS\n- 🔐 Environment-based agent ID management\n\n---\n\n## 📁 Project Structure\n\n```\n\n.\n├── public/\n├── src/\n│   └── app/\n│       ├── components/\n│       │   └── conversation.tsx      # Core conversation logic and UI\n│       ├── globals.css\n│       ├── layout.tsx\n│       └── page.tsx                  # Root page using \u003cConversation /\u003e\n├── .gitignore\n├── next.config.ts\n├── package.json\n├── tsconfig.json\n└── README.md\n\n````\n\n---\n\n## 🛠️ Getting Started\n\n### 1. Clone the project\n\n```bash\ngit clone https://github.com/aimaster-dev/call-with-ai-agent.git\ncd call-with-ai-agent\n````\n\n### 2. Install dependencies\n\n```bash\nnpm install\n```\n\n### 3. Configure environment variables\n\nCreate a `.env.local` file at the root:\n\n```env\nNEXT_PUBLIC_AGENT_ID=your_elevenlabs_agent_id_here\n```\n\n\u003e ✅ Must begin with `NEXT_PUBLIC_` to be available on the client side.\n\n### 4. Start development server\n\n```bash\nnpm run dev\n```\n\nOpen `http://localhost:3000` to view it in your browser.\n\n---\n\n## 🧪 Deployment\n\nThis project is deployed using [Vercel](https://vercel.com/).\n\n### 🔧 Vercel Setup\n\n1. Go to your project on Vercel\n2. Navigate to **Settings → Environment Variables**\n3. Add:\n\n```\nName: NEXT_PUBLIC_AGENT_ID\nValue: your_agent_id\nEnvironment: All (Production, Preview, Development)\n```\n\n4. Redeploy the project.\n\n---\n\n## 📦 Tech Stack\n\n* **Next.js 15+**\n* **TypeScript**\n* **Tailwind CSS**\n* **@11labs/react**\n* **Vercel (for hosting)**\n\n---\n\n## 🧠 Powered by\n\n[ElevenLabs](https://www.elevenlabs.io/) — Realistic voice AI for conversational experiences.\n\n---\n\n## 📄 License\n\nMIT — free to use, modify, and distribute.\n\n---\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faimaster-dev%2Fcall-with-ai-agent","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Faimaster-dev%2Fcall-with-ai-agent","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faimaster-dev%2Fcall-with-ai-agent/lists"}