Readme update

.gitignore

@@ -1,3 +1,7 @@
+# next.js
+/.next/
+/out/
+
 *.log
 addon/extension_group/
 agoradns.dat

README.md

@@ -18,11 +18,11 @@
 <a href="./README.md"><img alt="README in English" src="https://img.shields.io/badge/English-lightgrey"></a>
 <a href="./README-CN.md"><img alt="简体中文" src="https://img.shields.io/badge/简体中文-lightgrey"></a>
 
-[Lightning Fast](https://github.com/rte-design/ASTRA.ai/blob/main/astra-service.md#astra-service)
+[Lightning Fast](https://github.com/rte-design/ASTRA.ai/blob/main/astra-architecture.md#astra-architecture)
 <span>&nbsp;&nbsp;•&nbsp;&nbsp;</span>
-[Multimodal Interactive](https://github.com/rte-design/ASTRA.ai/blob/main/astra-service.md#astra-extension)
+[Multimodal Interactive](https://github.com/rte-design/ASTRA.ai/blob/main/astra-architecture.md#astra-extension)
 <span>&nbsp;&nbsp;•&nbsp;&nbsp;</span>
-[Highly Customizable](https://github.com/rte-design/ASTRA.ai/blob/main/astra-service.md#astra-extension)
+[Highly Customizable](https://github.com/rte-design/ASTRA.ai/blob/main/astra-architecture.md#astra-extension)
 
 </div>
 
@@ -39,7 +39,7 @@ ASTRA is a versatile platform capable of building a wide range of agents. Here,
 
 <h3>Run Voice Agent Locally</h3>
 
-Of course, you are more than welcome to run the example voice agent locally. We have a Docker image ready for you to build and run the agent on both macOS and Windows.
+Of course, you are more than welcome to run the showcased voice agent locally. We have a Docker image ready for you to build and run the agent on both macOS and Windows.
 
 To start, make sure you have:
 
@@ -49,7 +49,7 @@ To start, make sure you have:
 - [Docker](https://www.docker.com/)
 
 ```bash
-# run the pre-built agent image
+# Run the pre-built agent image
 docker run --restart=always -itd -p 8080:8080 \
         -v /tmp:/tmp \
         -e AGORA_APP_ID=<your_agora_appid> \
@@ -63,6 +63,8 @@ docker run --restart=always -itd -p 8080:8080 \
         agoraio/astra_agents_server:latest
 ```
 
+This should start an agent server running on port 8080.
+
 #### Mac with Apple Silicon
 
 You will need to uncheck "Use Rosetta for x86_64/amd64 emulation on apple silicon" option for Docker if you are on Apple Silicon.
@@ -73,39 +75,80 @@ You will need to uncheck "Use Rosetta for x86_64/amd64 emulation on apple silico
 
 </div>
 
-This should start an agent server running on port 8080.
-
 <h3>Connect to Your Agent</h3>
 
-You can use the playground project to test with the server you just started.
+You can use the showcase voice agent, in `/playground` folder, to test with the server you just started.
 
-The Playground project is built on NextJS 14, hence it needs Node 18+.
+The project is built on NextJS 14, hence it needs Node 18 or later.
 
 ```bash
-# set up an .env file
+# Set up an .env file
 cp ./playground/.env.example ./playground/.env
 cd playground
 
-# install npm dependencies & start
+# Install npm dependencies & start
 npm i && npm run dev
 ```
 
-🎉 Congratulations! You now have our ASTRA powered voice agent running locally.
+🎉 Congratulations! You now have a ASTRA powered voice agent running locally.
 
-<br />
+<br>
 <h2>Agent Customization</h2>
 
-Our voice agent is a great place for you to start with, it uses following Extensions:
-
-- _agora_rtc_ / [Agora](https://docs.agora.io/en) for RTC transport + VAD + Azure speech-to-text (STT)
-- _azure_tts_ / [Azure](https://azure.microsoft.com/en-us/products/ai-services/text-to-speech) for text-to-speech (TTS)
-- _openai_chatgpt_ / [OpenAI](https://openai.com/index/openai-api/) for LLM
-- _chat_transcriber_ / A utility ext to forward chat logs into channel
-- _interrupt_detector_ / A utility ext to help interrupt agent
+To explore further, the ASTRA voice agent is an excellent starting point. It incorporates the following extensions, some of which will be interchangeable in the near future. Feel free to choose the ones that best suit your needs and maximize ASTRA’s capabilities.
 
 <div align="center">
 
-<image alt="ASTRA" src="./images/image-2.png">
+<table style="width: 100%;">
+  <tr>
+    <th align="center">Extension</th>
+    <!-- <th align="center">Interchangeable</th>  -->
+    <th align="center">Feature</th>
+    <th align="center">Description</th>
+  </tr>
+  <tr>
+  <td align="center">openai_chatgpt</td>
+    <!-- <td align="center">✅</td> -->
+    <td align="center">LLM</td>
+    <td align="center">Large Language Modal</td>
+  </tr>
+  <tr>
+  <td align="center">elevenlabs_tts</td>
+    <!-- <td align="center">✅</td> -->
+    <td align="center">Text-to-speech</td>
+    <td align="center">Convert text to audio</td>
+  </tr>
+  <tr>
+  <td align="center">azure_tts</td>
+    <!-- <td align="center">✅</td> -->
+    <td align="center">Text-to-speech</td>
+    <td align="center">Convert text to audio</td>
+  </tr>
+  <tr>
+  <td align="center">azure_stt</td>
+    <!-- <td align="center">NA</td> -->
+    <td align="center">Speech-to-text</td>
+    <td align="center">Convert audio to text</td>
+  </tr>
+  <tr>
+  <td align="center">chat_transcriber</td>
+    <!-- <td align="center">NA</td> -->
+    <td align="center">Transcriber</td>
+    <td align="center">A utility ext to forward chat logs into channel</td>
+  </tr>
+   <tr>
+  <td align="center">agora_rtc</td>
+  <!-- <td align="center">NA</td> -->
+    <td align="center">Transporter</td>
+    <td align="center">A low latency transporter powered by agora_rtc</td>
+  </tr> 
+  <tr>
+  <td align="center">interrupt_detector</td>
+  <!-- <td align="center">NA</td> -->
+  <td align="center">Interrupter</td>
+  <td align="center">A utility ext to help interrupt agent</td>
+  </tr>
+</table>
 
 </div>
 
@@ -116,41 +159,58 @@ You might want to add more flavors to make the agent better suited to your needs
 You need to prepare the proper `manifest.json` file first.
 
 ```bash
-# rename manifest example
+# Rename manifest example
 cp ./agents/manifest.json.example ./agents/manifest.json
 
-# pull the docker image with dev tools and mount your current folder as workspace
+# Pull the docker image with dev tools and mount your current folder as workspace
 docker run -itd -v $(pwd):/app -w /app -p 8080:8080 --name astra_agents_dev agoraio/astra_agents_build
 
-# enter docker image
+# Enter docker image
 docker exec -it astra_agents_dev bash
 
-# build agent
+# Build agent
 make build
 ```
 
-This code generates an agent executable. To customize your prompts and OpenAI parameters, modify the source code in agents/addon/extension/openai_chatgpt/openai_chatgpt.go.
+The above code generates an agent executable. To customize your prompts and OpenAI parameters, modify the source code in `agents/addon/extension/openai_chatgpt/openai_chatgpt.go`.
 
-Once you have made the necessary changes, you can use the following commands to start a server. You can then test it out using the ASTRA voice agent playground as we did in previous steps.
+Once you have made the necessary changes, you can use the following commands to start a server. You can then test it out using the ASTRA voice agent from the showcase.
 
 ```bash
 
+# Agora App ID and Agora App Certificate
 export AGORA_APP_ID=<your_agora_appid>
 export AGORA_APP_CERTIFICATE=<your_agora_app_certificate>
+
+# OpenAI API key
+export OPENAI_API_KEY=<your_openai_api_key>
+
+# Azure STT key and region
 export AZURE_STT_KEY=<your_azure_stt_key>
 export AZURE_STT_REGION=<your_azure_stt_region>
-export OPENAI_API_KEY=<your_openai_api_key>
+
+# Here are two TTS options, either one will work
+# Make sure to comment out the one you don't use
+
+# 1. using Azure
+export TTS_VENDOR_CHINESE=azure
 export AZURE_TTS_KEY=<your_azure_tts_key>
 export AZURE_TTS_REGION=<your_azure_tts_region>
 
+# 2. using ElevenLabs
+export TTS_VENDOR_ENGLISH=elevenlabs
+export ELEVENLABS_TTS_KEY=<your_elevanlabs_tts_key>
+
 # agent is ready to start on port 8080
 
 make run-server
 ```
 
 🎉 Congratulations! You have created your first personalized voice agent.
 
-To understand how the ASTRA service works under the hood, please refer to the [ ASTRA service documentation ](astra-service.md).
+<h3>Build More</h3>
+
+Now that you’ve created your first AI agent, the creativity doesn’t stop here. To develop more amazing agents, you’ll need an advanced understanding of how the ASTRA works under the hood. Please refer to the [ ASTRA architecture documentation ](astra-architecture.md).
 
 <br>
 <h2>Stay Tuned</h2>
@@ -160,8 +220,6 @@ Star our repository and get instant notifications for all new releases!
 
 ![ASTRA star us gif](https://github.com/rte-design/ASTRA.ai/raw/main/images/star-the-repo-confetti-higher-quality.gif)
 
-<br>
-
 <br>
 <h2>Join Community</h2>
 

astra-service.md → astra-architecture.md

@@ -1,6 +1,6 @@
-<h2>ASTRA Service</h2>
+<h2>ASTRA Architecture</h2>
 
-Now let's discuss what's under the hood. The ASTRA Service is composed of various ASTRA extensions, developed in different programming languages. These extensions are interconnected using Graph, which describes their relationships and illustrates the flow of data. Furthermore, sharing and downloading extensions are simplified through the ASTRA Extension Store and the ASTRA Package Manager.
+Now let's discuss what's under the hood. The ASTRA architecture is composed of various ASTRA extensions, developed in different programming languages. These extensions are interconnected using Graph, which describes their relationships and illustrates the flow of data. Furthermore, sharing and downloading extensions are simplified through the ASTRA Extension Store and the ASTRA Package Manager.
 
 <div align="center">