3DキャラクターのAIチャットアプリをVercelでデプロイしたら一瞬だった
はじめに
ピクシブ社が開発した3DキャラクターとAIを使ってチャットできるオープンソースアプリ「ChatVRM」が面白いです！
前回はローカルサーバーでLLMをAPI化して3Dキャラクターとお話してみました。
今回はこのチャットアプリをVercelというサービスを使って一瞬でデプロイしてみました。
Githubと繋いでデプロイまで本当に一瞬だったのでこの感動を伝えていきたいです。
3DキャラクターとAIチャットできるアプリ「ChatVRM」とは
今回デプロイしたピクシブ社が開発したチャットアプリ「ChatVRM」について紹介していきます！
pixivより引用
ChatVRMは3DキャラクターとAIを使ってお話できるデモアプリです。OpenAIのAPIキーを使用します。カスタマイズが結構できて柔軟性あります！
「ChatVRM」は、テキスト・口頭で話しかけた言葉にキャラクターがフルボイスで回答してくれる「キャラクターと会話できる」デモです。WEBブラウザ上で動作でき、3Dキャラクターのインポート・切り替え、キャラクターに併せて声を調整することもできます。(以下のWEBより引用)
https://inside.pixiv.blog/2023/04/28/160000
オリジナルのキャラクターを作ってアプリにインポートして使えるのも超魅力です。
では早速このアプリをGithubで自分のアカウントにForkしていきましょう。
1. GithubからアプリをForkしよう
Githubのアカウントがすでに作成されている前提で話を進めていきます。
早速ChatVRMをgithubからForkしていきましょう。
Create forkを押して自分のアカウントにForkできたらGithubでの操作は以上になります。
2. Vercelに登録しよう
ChatVRMはTypescriptという言語で書かれているため、Vercelを使うと環境設定をすることなくGithubからアプリをインターネットにすぐに公開できるのでとてもおすすめです！
VercelというサービスにForkしたチャットアプリをデプロイしていきましょう。
その前にVercelにアカウント登録していきましょう。
以下から以下からVercelにアクセスできます。
画面右上の「Sign Up」ボタンを押してアカウントを作成していきます。
無料で使える「Hobby」を選んで名前を入力します。
次に連携するサービスを選びます。今回はGithubを選びます。
アカウント連携のための確認ができたら完了です！
3. Vercelにリポジトリを連携してデプロイしよう
VercelとGithubが連携できたら先程Forkしたアプリケーションのリポジトリを選んでいきましょう。
以下からNew Projectを作成していきます。
先程Forkしたアプリケーションのリポジトリ名を検索します。
表示されたら「import」ボタンを押しましょう。すると、次の画面へと変わります。
「You're almost done.」と書いてあります。ここまで来たら本当にあと少しでデプロイ完了です。初期設定で大丈夫なので、このまま「deploy」ボタンを押しましょう。
1分ほどでアプリケーションが公開されました！
一瞬でデプロイ完了です！！！
本当にデプロイされているのか、表示されているアプリケーションの画像の部分をクリックしてみます。
無事にデプロイされたアプリケーションが表示されました！
[おまけ]オリジナル3Dキャラクターを作ろう
記事のはじめにで紹介した画像では、オリジナルキャラクターを表示させています。
みなさんにもぜひオリジナルキャラクターを作ってみてほしい！と思います。ピクシブはそんな希望も叶えてくれるアプリをすでに無料公開しているんです。
私はIpadにVRoid StudioをダウンロードしてVRMを作ってみました。
ニンテンドースイッチのMiiを作るみたいにパーツを選んで超簡単にオリジナルキャラクターができました。
以下からダウンロードできるのでぜひ作ってみてくださいね。
まとめ
ローカルでアプリケーションを動かして満足してしまいがちですが、こんなにも簡単にVercelでデプロイできるならもっと挑戦していきたいですね。公開することでアプリケーションを通した体験を共有できればもっと良いなと感じました！
ここまで読んでいただきありがとうございました！
Discussion