Home

Awesome

<div align="center"><a name="readme-top"></a> <img height="120" src="https://registry.npmmirror.com/@lobehub/assets-logo/1.0.0/files/assets/logo-3d.webp"> <img height="120" src="https://gw.alipayobjects.com/zos/kitchen/qJ3l3EPsdW/split.svg"> <img height="120" src="https://registry.npmmirror.com/@lobehub/assets-emoji-anim/1.0.0/files/assets/teddy-bear.webp">

Lobe Vidol

Experience the magic of virtual idol creation with Lobe Vidol. Enjoy our exquisite UI design, support for MMD dance content, and seamless conversations with characters—all integrated into one cohesive platform.

<sup>Anyone can create a virtual idol</sup>

English · 简体中文 · Documentation · Changelog · Report Bug · Request Feature

<br/> <br>

</div>

[!NOTE] Lobe Vidol is currently in early development and is now open for Beta testing. We welcome you to join us and contribute!

<details> <summary><kbd>Table of Contents</kbd></summary>

TOC

</details>

👋🏻 Getting Started & Communication

Lobe Vidol is actively under development. If you have any requests or questions, feel free to submit [issues][issues-link].

No installation or registration required! Visit our website for a quick experience.
Join our Discord community! This is where you can interact with developers and other enthusiastic LobeHub users.

[!IMPORTANT]

Star the project to receive all release notifications from GitHub without delay!~⭐️

<img width="1749" alt="star (1)" src="https://github.com/user-attachments/assets/73f96340-ef2b-4d9b-ab6f-71f30c0c02fb"> <details><summary><kbd>Star History</kbd></summary> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://api.star-history.com/svg?repos=lobehub%2Flobe-vidol&theme=dark&type=Date"> <img src="https://api.star-history.com/svg?repos=lobehub%2Flobe-vidol&type=Date"> </picture> </details> <div align="right">

</div>

✨ Feature Overview

1. Text Chat Mode

Streamed responses provide a smooth conversational experience, allowing you to create an immersive dialogue by setting up character dialogue scenarios.

<img width="1285" alt="fluent chat experience" src="https://github.com/user-attachments/assets/d2585e90-b44e-494b-ac55-113f924abefc">

2. Video Chat Mode

With the video button in the message box, you can engage in richer interactions with character models, such as face-to-face chats, character performances, and more. You can also set the background, stage, actions, and dances for the characters.

<img width="1285" alt="video chat experience" src="https://github.com/user-attachments/assets/4af0dfb3-97b9-468e-b1c9-a672242d8aad">

You can enhance the dialogue's context by setting background images:

<img width="1318" alt="background setting" src="https://github.com/user-attachments/assets/e62b635c-168d-4f4e-8741-39aac0f7cfd3">

With a built-in library of Mixamo character motions and poses, you can have characters strike the desired poses or perform actions during the conversation:

<img width="1323" alt="motions and postures" src="https://github.com/user-attachments/assets/95d9a42e-4215-45f2-8171-f631a91065c9">

Using the character editor, you can create your own virtual idol, set touch responses, upload VRM models to the site, and interact with them.

<img width="1291" alt="role edit" src="https://github.com/user-attachments/assets/3d319554-ae14-4932-b527-e220c910fd51">

With the support of mmd-parser, you can dance with your favorite idols using vmd files; Just Dance!

https://github.com/user-attachments/assets/c017be86-dbac-4ce1-9f00-a10248b58621

We have added stage loading features and built-in a variety of stage options, allowing characters to dance with different stage styles:

<img width="1317" alt="pmx stage" src="https://github.com/user-attachments/assets/ec436b96-c270-431a-acef-f140584e6938">

By clicking on different body parts of the character, they will respond in various ways. You can also edit the character's touch responses to create unique interactive effects:

https://github.com/user-attachments/assets/a283bca0-222c-4ac8-8757-8c56ce3873c2

3. Multi-Model Provider Support

<img width="1285" alt="multi model provider" src="https://oss.vidol.chat/docs/2024/12/7ae6ec6df8f75837f30204069b823736.png">

The diversity of model providers is crucial for meeting community needs when providing AI conversation services. Therefore, we have expanded our support to multiple model providers, rather than being limited to a single one, to offer users a richer and more diverse conversation selection. This way, LobeVidol can flexibly adapt to different user needs while providing developers with a broader range of options.

Supported Model Providers

We have implemented support for the following model providers:

We are also planning to support more model providers to further enrich our provider library. If you would like LobeVidol to support your favorite provider, feel free to join our community discussion.

<div align="right">

</div>

4. Character and Dance Market

The character market at LobeVidol brings together a variety of meticulously designed characters, allowing you to experience different scenarios and interactions, providing you with a unique companionship experience. Our market is not just a showcase platform; it is also a collaborative space where everyone can contribute their imagination and share their personally designed characters.

[!TIP]

With the character creation feature, you can easily submit your character creations to our platform. We emphasize that LobeVidol has established a sophisticated automated internationalization (i18n) workflow, which seamlessly transforms your characters into multiple language versions. This means that regardless of the language your users speak, they can experience your characters without barriers.

<img width="1320" alt="discover" src="https://github.com/user-attachments/assets/9f155227-6856-4957-9f6e-a9b3f534df24">

The dance market at LobeVidol is enriched with a variety of MMD dance resources, creating a rich visual experience. You can combine different characters, stages, music, and dances to create a unique viewing experience.

<img width="1323" alt="Snipaste_2024-11-05_21-22-47" src="https://github.com/user-attachments/assets/684ba6ad-17a9-4af3-9943-fcaaee121216">

5. TTS & STT Voice Conversations

LobeVidol supports Text-to-Speech (TTS) and Speech-to-Text (STT) technologies, enabling our application to convert text information into clear voice output. Users can interact with our conversational assistant as if they were talking to a real person. Users can choose from a variety of voices to match their assistant with the appropriate sound source. Additionally, for those who prefer auditory learning or want to gather information while busy, TTS offers an excellent solution.

At LobeVidol, we have carefully selected a range of high-quality voice options (OpenAI Audio, Microsoft Edge Speech) to meet the needs of users from different regions and cultural backgrounds. Users can choose the appropriate voice based on personal preferences or specific scenarios, thus obtaining a personalized communication experience.

<div align="right">

![][back-to-top]

</div>

6. Progressive Web Application (PWA)

We understand the importance of providing a seamless experience for users in today's multi-device environment. To this end, we have adopted Progressive Web Application PWA technology, which elevates web applications to a near-native app experience. Through PWA, LobeVidol can deliver a highly optimized user experience on both desktop and mobile devices while maintaining lightweight and high-performance characteristics.

Visually and functionally, we have also designed it carefully to ensure that its interface is indistinguishable from native applications, providing smooth animations, responsive layouts, and adapting to different device screen resolutions.

[!NOTE]

If you are unfamiliar with the PWA installation process, you can follow these steps to add LobeVidol as your desktop application (also applicable to mobile devices):

<div align="right">

![][back-to-top]

</div>

📦 Ecosystem

NPMRepositoryDescriptionVersion
@lobehub/uilobehub/lobe-uiAn open-source UI component library designed for building AIGC web applications
@lobehub/iconslobehub/lobe-iconsA collection of SVG logos and icons for mainstream AI / LLM models and companies
@lobehub/ttslobehub/lobe-ttsA React Hooks library for AI TTS / STT voice synthesis / recognition
@lobehub/lintlobehub/lobe-lintLobeHub code style guidelines for ESlint, Stylelint, Commitlint, Prettier, Remark, and Semantic Release
<div align="right">

</div>

⌨️ Local Development

You can use GitHub Codespaces for online development:

Or use the following commands for local development:

$ git clone https://github.com/lobehub/lobe-vidol.git
$ cd lobe-vidol
$ bun install
$ bun dev
<div align="right">

![][back-to-top]

</div>

🤝 Contributing

We warmly welcome contributions in various forms. If you're interested in contributing code, please check out our GitHub [Issues][github-issues-link] and [Projects][github-project-link] to showcase your creativity and ideas.

[![][pr-welcome-shield]][pr-welcome-link]

<a href="https://github.com/lobehub/lobe-vidol/graphs/contributors" target="_blank"> <table> <tr> <th colspan="2"> <br><img src="https://contrib.rocks/image?repo=lobehub/lobe-vidol"><br><br> </th> </tr> <tr> <td> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://next.ossinsight.io/widgets/official/compose-org-active-contributors/thumbnail.png?activity=active&period=past_90_days&owner_id=131470832&repo_ids=784800776&image_size=2x3&color_scheme=dark"> <img src="https://next.ossinsight.io/widgets/official/compose-org-active-contributors/thumbnail.png?activity=active&period=past_90_days&owner_id=131470832&repo_ids=784800776&image_size=2x3&color_scheme=light"> </picture> </td> <td rowspan="2"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://next.ossinsight.io/widgets/official/compose-org-participants-growth/thumbnail.png?activity=active&period=past_90_days&owner_id=131470832&repo_ids=784800776&image_size=4x7&color_scheme=dark"> <img src="https://next.ossinsight.io/widgets/official/compose-org-participants-growth/thumbnail.png?activity=active&period=past_90_days&owner_id=131470832&repo_ids=784800776&image_size=4x7&color_scheme=light"> </picture> </td> </tr> <tr> <td> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://next.ossinsight.io/widgets/official/compose-org-active-contributors/thumbnail.png?activity=new&period=past_90_days&owner_id=131470832&repo_ids=784800776&image_size=2x3&color_scheme=dark"> <img src="https://next.ossinsight.io/widgets/official/compose-org-active-contributors/thumbnail.png?activity=new&period=past_90_days&owner_id=131470832&repo_ids=784800776&image_size=2x3&color_scheme=light"> </picture> </td> </tr> </table> </a> <div align="right">

![][back-to-top]

</div>

🩷 Community Sponsorship

Every bit of support is incredibly valuable, coming together to form the brilliant galaxy we support! You are like a shooting star that lights up our path forward. Thank you for your trust — your support acts like a guiding star, illuminating the way for the project time and again.

<a href="https://opencollective.com/lobehub" target="_blank"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://github.com/lobehub/.github/blob/main/static/sponsor-dark.png?raw=true"> <img src="https://github.com/lobehub/.github/blob/main/static/sponsor-light.png?raw=true"> </picture> </a> <div align="right">

![][back-to-top]

</div>

🔗 More Tools

More Projects

Related Links

<div align="right">

![][back-to-top]

</div>

📝 License

Copyright © 2024 [lobehub][profile-link]. <br /> This project is licensed under the Apache 2.0.