Skip to content

Commit

Permalink
Merge pull request #128 from tegnike/develop
Browse files Browse the repository at this point in the history
本番リリース
  • Loading branch information
tegnike authored Aug 14, 2024
2 parents ed44330 + cc5d5d1 commit 87ef616
Show file tree
Hide file tree
Showing 51 changed files with 2,146 additions and 101 deletions.
36 changes: 26 additions & 10 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -21,11 +21,10 @@

## 概要

以下の3つの機能があります
主に以下の2つの機能があります

1. AIキャラとの対話
2. AITuber配信
3. 外部連携モード(β版)

下記の記事に詳細な使用方法を記載しました。

Expand Down Expand Up @@ -57,14 +56,14 @@ npm install
npm run dev
```

3. URLを開きます。[http://localhost:3000](http://localhost:3000)
5. URLを開きます。[http://localhost:3000](http://localhost:3000)

## AIキャラとの対話

- AIキャラと会話する機能です。
- このリポジトリの元になっている[pixiv/ChatVRM](https://github.com/pixiv/ChatVRM)を拡張した機能です。
- 各種LLMのAPIキーさえあれば比較的簡単に試すことが可能です。
- 直近の10会話文を記憶として保持します記憶として保持します。(数字は指定できるように更新予定)
- 直近の会話文を記憶として保持します。
- マルチモーダルで、カメラからの映像やアップロードした画像を認識して回答を生成することが可能です。

### 使用方法
Expand All @@ -77,7 +76,7 @@ npm run dev
- ローカルLLM(APIキーは不要ですが、ローカルAPIサーバーを起動しておく必要があります。)
- Dify Chatbot(APIキーは不要ですが、ローカルAPIサーバーを起動しておく必要があります。)
2. 必要に応じてキャラクターの設定プロンプトを編集します。
3. 必要に応じてVRMファイルを読み込みます
3. 用意がある場合は、VRMファイルおよび背景ファイルをアップロードします
4. 音声合成エンジンを選択し、必要に応じて声の設定を行います。
- VOICEVOXの場合は複数の選択肢から話者を選ぶことができます。予めVOICEVOXアプリを起動しておく必要があります。
- Koeiromapの場合は、細かく音声を調整することが可能です。APIキーの入力が必要です。
Expand All @@ -91,7 +90,7 @@ npm run dev

- Youtubeの配信コメントを取得して発言することが可能です。
- Youtube APIキーが必要です。
- 「#」から始まるコメントは読まれません。(文字列は指定できるように更新予定)
- 「#」から始まるコメントは読まれません。

### 使用方法

Expand All @@ -101,24 +100,38 @@ npm run dev
4. Youtubeの配信を開始し、キャラクターがコメントに反応するのを確認します。
5. 会話継続モードをONにすると、コメントが無いときにAIが自ら発言することができます。

## 外部連携モード(β版)
## その他の機能

### 外部連携モード(β版)

- WebSocketでサーバーアプリにメッセージを送信して、レスポンスを取得することができます。
- 上記2つと異なり、フロントアプリで完結しないため少し難易度が高いです。
-メンテナンスできていないため、動かない可能性があります。
-現在メンテナンスしきれていないため、動かない可能性があります。

### 使用方法
#### 使用方法

1. サーバーアプリを起動し、`ws://127.0.0.1:8000/ws` エンドポイントを開きます。
2. 設定画面でWebSocketモードをONにします。
3. 他の設定は「AIキャラとの対話」と同様に行います。
4. サーバーアプリからのメッセージを待ち、キャラクターが反応するのを確認します。

### 関連
#### 関連

- 私が作成したサーバーアプリのリポジトリで試すことが可能です。[tegnike/aituber-server](https://github.com/tegnike/aituber-server)
- 詳しい設定は「[美少女と一緒に開発しようぜ!!【Open Interpreter】](https://note.com/nike_cha_n/n/nabcfeb7aaf3f)」を読んでください。

### スライドモード

- スライドをAIキャラが自動で発表するモードです。
- 予めスライドと台本ファイルを用意しておく必要があります。

#### 使用方法

1. 予めAIキャラと対話できるところまで進めておきます。
2. スライドフォルダと台本ファイルを指定のフォルダに配置します。
3. 設定画面でスライドモードをONにします。
4. スライド開始ボタンを押して発表を開始します。

## TIPS

### VRMモデル、背景固定方法
Expand Down Expand Up @@ -180,6 +193,9 @@ npm run dev
<a href="https://github.com/tsubouchi" title="tsubouchi">
<img src="https://github.com/tsubouchi.png" width="40" height="40" alt="tsubouchi">
</a>
<a href="https://github.com/bunkaich" title="bunkaich">
<img src="https://github.com/bunkaich.png" width="40" height="40" alt="bunkaich">
</a>
</p>

他、プライベートスポンサー 複数名
Expand Down
42 changes: 30 additions & 12 deletions docs/README_en.md
Original file line number Diff line number Diff line change
Expand Up @@ -21,11 +21,10 @@

## Overview

This repository has the following 3 features:
This repository has mainly the following 2 features:

1. Conversation with AI character
2. AITuber streaming
3. External integration mode (β version)

I've written a detailed usage guide in the article below:

Expand Down Expand Up @@ -57,14 +56,14 @@ npm install
npm run dev
```

3. Open the URL [http://localhost:3000](http://localhost:3000)
5. Open the URL [http://localhost:3000](http://localhost:3000)

## Conversation with AI Character

- This is a feature to converse with an AI character.
- It is an extended feature of [pixiv/ChatVRM](https://github.com/pixiv/ChatVRM), which is the basis of this repository.
- It can be tried relatively easily as long as you have an API key for various LLMs.
- The recent 10 conversation sentences are retained as memory. (The number will be configurable in future updates)
- The recent conversation sentences are retained as memory.
- It is multimodal, capable of recognizing images from the camera or uploaded images to generate responses.

### Usage
Expand All @@ -77,7 +76,7 @@ npm run dev
- Local LLM (No API key is required, but a local API server needs to be running.)
- Dify Chatbot (No API key is required, but a local API server needs to be running.)
2. Edit the character's setting prompt if necessary.
3. Load a VRM file if needed.
3. Load a VRM file and background file if available.
4. Select a speech synthesis engine and configure voice settings if necessary.
- For VOICEVOX, you can select a speaker from multiple options. The VOICEVOX app needs to be running beforehand.
- For Koeiromap, you can finely adjust the voice. An API key is required.
Expand All @@ -91,7 +90,7 @@ npm run dev

- It is possible to retrieve YouTube streaming comments and have the character speak.
- A YouTube API key is required.
- Comments starting with '#' are not read. (The string can be specified in future updates)
- Comments starting with '#' are not read.

### Usage

Expand All @@ -101,23 +100,39 @@ npm run dev
4. Start streaming on YouTube and confirm that the character reacts to comments.
5. Turn on the conversation continuity mode to be able to speak even if there are no comments.

## External Integration Mode (β version)
## Other Features

### External Integration Mode (β version)

- You can send messages to the server app via WebSocket and get a response.
- Unlike the above two, it does not complete within the front-end app, so the difficulty level is a bit higher.
- ⚠ This mode is not maintained, so it may not work.
- ⚠ This mode is currently not fully maintained, so it may not work.

### Usage
#### Usage

1. Start the server app and open the `ws://127.0.0.1:8000/ws` endpoint.
2. Turn on WebSocket mode in the settings screen.
3. Configure other settings the same way as "Conversation with AI Character".
4. Wait for messages from the server app and confirm that the character reacts.

### Related
#### Related

- You can try it with the server app repository I created. [tegnike/aituber-server](https://github.com/tegnike/
aituber-server)
- For detailed settings, please read "[Let's develop with a beautiful girl!! [Open Interpreter]](https://note.
com/nike_cha_n/n/nabcfeb7aaf3f)".

### Slide Mode

- You can try it with the server app repository I created. [tegnike/aituber-server](https://github.com/tegnike/aituber-server)
- For detailed settings, please read "[Let's develop with a beautiful girl!! [Open Interpreter]](https://note.com/nike_cha_n/n/nabcfeb7aaf3f)".
- This is a mode where the AI character automatically presents slides.
- You need to prepare slides and script files in advance.

#### Usage

1. Proceed to the point where you can interact with the AI character.
2. Place the slide folder and script file in the designated folder.
3. Turn on Slide Mode in the settings screen.
4. Press the Start Slide button to begin the presentation.

## TIPS

Expand Down Expand Up @@ -180,6 +195,9 @@ Your support will greatly contribute to the development and improvement of the A
<a href="https://github.com/tsubouchi" title="tsubouchi">
<img src="https://github.com/tsubouchi.png" width="40" height="40" alt="tsubouchi">
</a>
<a href="https://github.com/bunkaich" title="bunkaich">
<img src="https://github.com/bunkaich.png" width="40" height="40" alt="bunkaich">
</a>
</p>

Plus multiple private sponsors
Expand Down
34 changes: 25 additions & 9 deletions docs/README_ko.md
Original file line number Diff line number Diff line change
Expand Up @@ -21,11 +21,10 @@

## 개요

이 저장소에는 다음과 같은 3가지 기능이 있습니다.
이 저장소에는 주로 다음과 같은 2가지 기능이 있습니다.

1. AI 캐릭터와 대화
2. AITuber 스트리밍
3. 외부 통합 모드(베타 버전)

아래 기사에 자세한 사용 방법을 작성했습니다.

Expand Down Expand Up @@ -57,14 +56,14 @@ npm install
npm run dev
```

3. URL을 엽니다. [http://localhost:3000](http://localhost:3000)
5. URL을 엽니다. [http://localhost:3000](http://localhost:3000)

## AI 캐릭터와 대화

- AI 캐릭터와 대화할 수 있는 기능입니다.
- 이 저장소의 기반이 되는 [pixiv/ChatVRM](https://github.com/pixiv/ChatVRM)을 확장한 기능입니다.
- 다양한 LLM의 API 키만 있으면 비교적 쉽게 시도해볼 수 있습니다.
- 최근 10개의 대화 문장을 기억으로 보존합니다. (숫자는 향후 업데이트에서 지정할 수 있도록 할 예정입니다)
- 최근의 대화 문장을 기억으로 보존합니다.
- 멀티모달로, 카메라에서의 영상이나 업로드한 이미지를 인식하여 답변을 생성할 수 있습니다.

### 사용 방법
Expand All @@ -91,7 +90,7 @@ npm run dev

- YouTube 스트리밍 댓글을 가져와서 캐릭터가 말하도록 할 수 있습니다.
- YouTube API 키가 필요합니다.
- '#'로 시작하는 댓글은 읽히지 않습니다. (향후 업데이트에서 문자열을 지정할 수 있습니다)
- '#'로 시작하는 댓글은 읽히지 않습니다.

### 사용 방법

Expand All @@ -101,24 +100,38 @@ npm run dev
4. YouTube에서 스트리밍을 시작하고 캐릭터가 댓글에 반응하는지 확인합니다.
5. 대화 연속 모드를 켜면 댓글이 없어도 AI가 스스로 발언할 수 있습니다.

## 외부 통합 모드(베타 버전)
## 기타 기능

### 외부 통합 모드(베타 버전)

- WebSocket을 통해 서버 앱에 메시지를 보내고 응답을 받을 수 있습니다.
- 위의 두 가지와 달리 프론트엔드 앱 내에서 완료되지 않으므로 난이도가 약간 높습니다.
- ⚠ 이 모드는 지속적으로 유지되지 않으므로 작동하지 않을 수 있습니다.
- ⚠ 이 모드는 현재 완전히 유지보수되지 않아 작동하지 않을 수 있습니다.

### 사용 방법
#### 사용 방법

1. 서버 앱을 시작하고 `ws://127.0.0.1:8000/ws` 엔드포인트를 엽니다.
2. 설정 화면에서 WebSocket 모드를 켭니다.
3. 다른 설정은 "AI 캐릭터와 대화"와 동일한 방식으로 구성합니다.
4. 서버 앱에서 메시지를 기다리고 캐릭터가 반응하는지 확인합니다.

### 관련 사항
#### 관련 사항

- 내가 만든 서버 앱 저장소로 시도해볼 수 있습니다. [tegnike/aituber-server](https://github.com/tegnike/aituber-server)
- 자세한 설정은 "[아름다운 소녀와 함께 개발해 보자!! 【Open Interpreter】](https://note.com/nike_cha_n/n/nabcfeb7aaf3f)"를 읽어보세요.

### 슬라이드 모드

- AI 캐릭터가 자동으로 슬라이드를 발표하는 모드입니다.
- 사전에 슬라이드와 스크립트 파일을 준비해야 합니다.

#### 사용 방법

1. AI 캐릭터와 대화할 수 있는 단계까지 진행합니다.
2. 지정된 폴더에 슬라이드 폴더와 스크립트 파일을 배치합니다.
3. 설정 화면에서 슬라이드 모드를 켭니다.
4. 슬라이드 시작 버튼을 눌러 발표를 시작합니다.

##

### VRM 모델 및 배경 고정 방법
Expand Down Expand Up @@ -180,6 +193,9 @@ npm run dev
<a href="https://github.com/tsubouchi" title="tsubouchi">
<img src="https://github.com/tsubouchi.png" width="40" height="40" alt="tsubouchi">
</a>
<a href="https://github.com/bunkaich" title="bunkaich">
<img src="https://github.com/bunkaich.png" width="40" height="40" alt="bunkaich">
</a>
</p>

그 외, 다수의 비공개 스폰서
Expand Down
36 changes: 26 additions & 10 deletions docs/README_zh.md
Original file line number Diff line number Diff line change
Expand Up @@ -21,11 +21,10 @@

## 概覽

此存儲庫具有以下3個功能
此存儲庫主要具有以下2個功能

1. 與AI角色對話
2. AITuber直播
3. 外部整合模式(β版本)

我在下面的文章中寫了詳細的使用指南:

Expand Down Expand Up @@ -57,14 +56,14 @@ npm install
npm run dev
```

3. 打開URL [http://localhost:3000](http://localhost:3000)
5. 打開URL [http://localhost:3000](http://localhost:3000)

## 與AI角色對話

- 這是與AI角色對話的功能。
- 它是此存儲庫的基礎[pixiv/ChatVRM](https://github.com/pixiv/ChatVRM)的擴展功能。
- 只要您有各種LLM的API密鑰,就可以相對輕鬆地嘗試。
- 最近的10個對話句子作為記憶保留。(數字將在未來更新中可以指定)
- 最近的對話句子作為記憶保留。
- 它是多模態的,能夠識別來自攝像頭的圖像或上傳的圖像來生成回應。

### 使用方法
Expand All @@ -77,7 +76,7 @@ npm run dev
- Local LLM(不需要API密鑰,但需要運行本地API服務器。)
- Dify Chatbot(不需要API密鑰,但需要運行本地API服務器。)
2. 如有必要,編輯角色的設置提示。
3. 如有必要,加載VRM文件
3. 如有需要,加載VRM文件和背景文件
4. 選擇語音合成引擎並根據需要配置語音設置。
- 對於VOICEVOX,您可以從多個選項中選擇發言者。需要事先運行VOICEVOX應用程序。
- 對於Koeiromap,您可以細微調整語音。需要API密鑰。
Expand All @@ -91,7 +90,7 @@ npm run dev

- 可以檢索YouTube直播評論並讓角色發言。
- 需要YouTube API密鑰。
- 以「#」開頭的評論不會被讀取。(未來更新可以指定字符串)
- 以「#」開頭的評論不會被讀取。

### 使用方法

Expand All @@ -101,24 +100,38 @@ npm run dev
4. 開始在YouTube上直播並確認角色對評論的反應。
5. 開啟会話継続模式,在沒有評論時,AI可以自動發言。

## 外部整合模式(β版本)
## 其他功能

### 外部整合模式(β版本)

- 您可以通過WebSocket向服務器應用程序發送消息並獲得響應。
- 與上述兩者不同,它不在前端應用程序中完成,因此難度略高。
-此模式不受支持,可能无法正常运行
-此模式目前未完全維護,可能無法正常運行

### 使用方法
#### 使用方法

1. 啟動服務器應用程序並打開 `ws://127.0.0.1:8000/ws` 端點。
2. 在設置屏幕中打開WebSocket模式。
3. 與"與AI角色對話"相同的方式配置其他設置。
4. 等待服務器應用程序的消息並確認角色的反應。

### 相關
#### 相關

- 您可以嘗試我創建的服務器應用程序存儲庫。[tegnike/aituber-server](https://github.com/tegnike/aituber-server)
- 請閱讀"[與美少女一起開發吧!!【Open Interpreter】](https://note.com/nike_cha_n/n/nabcfeb7aaf3f)"以獲得詳細設置。

### 幻燈片模式

- 這是AI角色自動展示幻燈片的模式。
- 您需要提前準備幻燈片和腳本文件。

#### 使用方法

1. 進行到可以與AI角色互動的階段。
2. 將幻燈片文件夾和腳本文件放在指定的文件夾中。
3. 在設置屏幕中打開幻燈片模式。
4. 按下開始幻燈片按鈕開始演示。

## 小貼士

### VRM模型和背景固定方法
Expand Down Expand Up @@ -180,6 +193,9 @@ npm run dev
<a href="https://github.com/tsubouchi" title="tsubouchi">
<img src="https://github.com/tsubouchi.png" width="40" height="40" alt="tsubouchi">
</a>
<a href="https://github.com/bunkaich" title="bunkaich">
<img src="https://github.com/bunkaich.png" width="40" height="40" alt="bunkaich">
</a>
</p>

以及多位匿名贊助者
Expand Down
Loading

0 comments on commit 87ef616

Please sign in to comment.