Intro
AI Avatar is a completely free app that lets your VRoid (VRM) 3D avatar animate in response to AI chat and the Enter key in VS Code and Chrome (Edge). I have been updating AI Avatar since March. This time, I made two big updates: new AI functions and a complete renewal of the Animation Editor. Let's take a look at them.
1. New AI Functions
1-1. AI Chat
AI Avatar triggers 3D avatar animations through Claude Code and GitHub Copilot chat as an AI feature. However, I haven't integrated API-based AI or local LLMs yet. My DEV.to friends @gramli used local LLMs, and @benjamin_nguyen_8ca6ff360 used API-based AI in their posts. So I was inspired by them to add these features and started with a simple AI chat.
I chose the Gemini API for API-based AI because there is a free plan, so users can get their own API key and test it easily for free. I selected the lightweight model Gemini 3.1 Flash-Lite as the default since I considered the use case to be simple AI chat. Users can change the model in the settings.
I chose Ollama for handling local LLMs. First, I tried Qwen3.5:2b because it is a small model and requires only about 2GB of memory. My laptop has 8GB of memory without a GPUπ, but I thought this lightweight model would work. However, it timed out after 2 minutes even if I only sent "hi" as a test. Next, I changed to a lighter model, Qwen3.5:0.8b, but it still timed out. I tested these models directly in the Ollama app and found that Qwen3.5 is a thinking model, so it overthinks and responds too much even to a simple "hi". Here is what it was thinking in the background. βπ€£
"Hello! π How's your day going? Anything I can help you with?"
Or just: "Hi! How are you doing?"
Let's combine friendliness with a call to action.
"Hi! π How's it going? Anything I can help you with today?"
Wait, I need to make sure I don't sound too robotic.
"Hey! π How's your day going? Anything I can help you with?"
Okay, final choice.
"Hi! π How are you doing today? Is there anything I can help you with?"
Or more concise: "Hi! π How can I help you today?"
Let's go with: "Hi! π How's your day going? Is there anything I can help you with?"
Wait, looking at the instruction again, just "hi". Simple is best.
"Hi! π How's your day going? Anything I can help you with?"
Next, I changed to Qwen2.5:3b, which is not a thinking model, and finally the chat worked without a 2-minute timeout. Users can switch to other models from the settings.
Local LLMs are quite slow on the first call because they need to be loaded into memory, but they get much faster afterward. So I added a warm-up feature to make the initial call faster.
It depends on your PC specifications, but usually local LLMs are slower and less capable than API-based AI. However, local LLMs are free and safe because they run on your PC. So please choose between API-based AI and local LLMs based on your needs.
1-2. AI Cheering Messages
AI Avatar triggers not only animations but also cheering messages when you press the Enter key and send prompts to AI. Although you can customize the messages as you like, they were previously selected randomly from a registered list. Since I had just added Gemini API and Ollama for AI chat, I also updated the cheering messages to be generated by AI according to your prompts. AI Cheering Messages make AI Avatar more lively and feel closer to you.
2. Animation Editor Hyper
AI Avatar has an Animation Editor for creating avatar animations. However, it might be a little complicated for beginners to make animations. So this time, I updated the Animation Editor with 8 improvements so that everyone, including beginners and children, can enjoy animation. It's the all-in-one Animation Editor Hyper! I think it is easier than making animations in Blender. Let's take a quick look at how the new Animation Editor Hyper is beginner-friendly.
2-1. Full Tab Display
| Detail | |
|---|---|
| Before | The editor was inside a small side panel. Users needed to switch between buttons, sliders, and inputs every time they edited. Users needed many clicks for editing. |
| After | I made a new full tab only for animation editing. All the buttons, sliders, and inputs are on one screen. Users need fewer clicks and less movement for editing. |
2-2. 3-Side Display
| Detail | |
|---|---|
| Before | The editor only displayed the avatar from the front. Users needed to rotate it to see side views. |
| After | The editor displays right, front, and left views in one tab. Users do not need to rotate and can see all the views at once. |
2-3. Image Holder
| Detail | |
|---|---|
| Before | The editor had no image holder. Users needed to open the reference image in another window. |
| After | The editor has an image holder next to the avatar. Users can easily refer to a sample pose image. |
2-4. Bone Trail
| Detail | |
|---|---|
| Before | The editor had no bone trail. It was hard for beginners to understand how the bones move. |
| After | The editor has a bone trail. Beginners can easily understand how each bone moves with the support of the bone trail. |
2-5. Pose Presets
| Detail | |
|---|---|
| Before | The editor had no presets. Users had to make animations from the beginning. |
| After | The editor has presets. Users can create animations from presets and speed up the animation process. |
2-6. VRMA Export of Animations
| Detail | |
|---|---|
| Before | The editor saved animations only as JSON. Users could only use the JSON in this app. |
| After | The editor saves animations as JSON and VRMA. Users can use VRMA in other apps. |
2-7. Random Animation Custom Mode
| Detail | |
|---|---|
| Before | The app had only preset random animations. Although there were 256 patterns, users might get tired of them soon. |
| After | The app has custom random animations. Users can enjoy random animations as they like by setting custom files. |
2-8. Random Animation Editor
| Detail | |
|---|---|
| Before | It was not implemented in the editor. Users could only use preset random animations. |
| After | It is included in the editor. Users can easily create random animations in the editor. |
How to Use the AI Avatar VS Code Extension Version (Thank you 100+ installs!)
You can download the AI Avatar VS Code extension in two ways.
Option 1: Install from VS Code:
Extensionsbutton in the left sidebar > Search AI Avatar >Installββ
Option 2: Install from the VS Code Marketplace: https://marketplace.visualstudio.com/items?itemName=web-developer-hyper.ai-avatar ββ
How to Use the AI Avatar Chrome Version
Install from Chrome Web Store: ββ
https://chromewebstore.google.com/detail/ai-avatar/afmcfaeaaojalninahhhjnonhmlmiidi
Special Thanks
My DEV Community friend and CTOπ€£, @gramli helped update AI Avatar in version 2 and keeps supporting me. Thank you very much!
My DEV Community friend and CMOπ€£, @itsugo. Our avatar collaboration project was the beginning of AI Avatar and keeps supporting me. Thank you very much!
My colleague Maximum Blue helped make unique avatars in version 6 and keeps supporting me. Thank you very much!
Version 11 Update
I'm already working on the version 11 update. More fun updates, so please stay tuned!
Outro
This is just the beginning of AI features, and Iβm thinking of adding more fun AI features in the future! Also, I added everything I could imagine to make creating animations easier in Animation Editor Hyper. I hope its user experience has gotten better than before. Please have a fun time creating animations for your favorite avatar. Thank you for reading, and have a great AI Avatar life.
Comments Welcome!
- Do you have any ideas to make AI Avatar even more fun?
- Do you have any ideas to add more AI features?
- Do you have any ideas for making cool avatars and animations?
- Do you have any ideas to improve the user experience?
- Do you have any ideas for increasing the number of users of AI Avatar?
Any other comments are also welcome!
