アプリに関する詳細・API仕様・ドキュメントなどはtutoriallm.comを、 アプリのデモ(一部機能)はdemo.tutoriallm.comからお試しください。
2024年12月現在、デモサイトはコスト削減のため非常に低速なサーバーを利用しています。アクセスできない場合は時間を空けてから再度お試しください。
システム全体の構成
システム構成は全て語ると非常に複雑になってしまいますが、主に3つ部分に分かれています。
- プログラミングを学ぶ人の UI
- 学習者はAIが提供するチュートリアルを通して、プログラムの制作を行い、製作したコードをサーバーサイドで実行することができます。サーバーサイドで実行するメリットを活かして、Scratchのようなキャンバスの中の世界だけでなく、Minecraft / Web / Micro:bitなどの外の世界で実行したり、接続したりすることができます。また、AIから提供されるチュートリアルはアプリ内に完全に統合されており、UIの生成やユーザーに合わせたガイドなどを提供します。
- プログラミングを教える人のUI
- 教育者は、専用のエディターを利用して、AIに対して「何をユーザーに提供するか」を決めるだけでチュートリアルを作成できます。
- そして、ユーザーの利用状況を遠隔で一括管理することができます。これにより、今までのような対面での授業で発生していた、初歩的なミスの対応などの、無駄な時間を軽減し、より効果的な教育の提供に繋げます。
- API
- APIでは、セッションの管理、チュートリアルの管理、コード実行などの機能を提供します。
- 内部APIにとどまらず、将来的には外部との接続も想定して設計しているため、外部サービスとの連携などの実装も可能です。
利用している技術
ユーザー側のアプリケーションは、React+Viteを利用して作成しています。また、PWAに対応しているため、対応ブラウザを使えば非常に高速にロードを行うことができます。 ブロックエディタにはGoogle社が開発したBlocklyというフレームワークを利用しています。 AIとの対話機能には、OpenAI社のGPT APIを利用しています。 UIにはTailwind CSSとRadix UIを主に利用しています。
開発者側のアプリケーションも、ユーザー側のアプリと統合されているため、基本的な構成は同じです。
構成は、2024年11月4日時点のものです。現在、大規模なリファクタリングを行なっています。
API(サーバー)にはExpress.jsを利用しており、セッション参加時の、クライアントとの常時接続にはSocket.ioを利用しています。セッションの一時的なデータ保存にはRedis、チュートリアルやユーザーなどの情報はPostgreSQLに保存しています。 サーバーと常時接続を行うため、インターネット接続が必要になりますが、複数ユーザーでの同一セッション参加や、AIによるリアルタイムな応答が行えるようになりました。
また、ユーザーのコード実行には、サーバー内のワーカースレッド上に作成し、割り当てられたVMスペースを利用します。どちらもnode.jsの標準機能です。VMは隔離されており、限定したモジュールしか利用できません。現状では、honoという、Express.jsに類似した軽量なフレームワークをVMの実行コンテキストとして利用でき、これを通して外部の世界と通信することができます。Honoを使っているため、デフォルトでHTTP通信に対応しており、また、オプションでWebsocket通信に対応しています。
ScratchやMakecodeなどの類似のブロックプログラミングシステムでは、基本的にローカル環境での実行に限定されていたため、外部の世界と通信するにはコネクターアプリなどのダウンロードをする必要があり、さらにそれらをすべて同一のコンピューター上に限定されていました。また、チュートリアル機能などもありましたが、作成するのが非常に大変なため、あまり使われることがありませんでした。 TutoriaLLMではサーバーサイドでのコード実行を用いて出力を行うことでコードの実行をより簡単にし、チュートリアルをAIが提供するようにしたことで、これらの問題を解決し、ユーザーはブラウザを開くだけで、開発、学習、実行のすべてのプロセスを行えるようになりました。
現在は、Minecraftと接続してコードを実行する機能を提供しています。これは、MinecraftとWebsocket通信を用いて接続することで、ワールド内でコマンドを実行したり、「エージェント」と呼ばれる小さなロボットをゲーム内に登場させて動かしたりすることができる機能です。
RedisとPostgreSQLを除き、アプリ全体は1つのDockerイメージとして作成されています。そのため、composeコマンドを1度利用するだけで、アプリ全体のデプロイが可能です。
効果
このアプリは実際にテストを行いながら開発しており、すでにプログラミング教室や、フリースクールなどの小〜中規模な団体で実際に使ってもらっています。
私は過去に小中学生程度の生徒に対して授業が行ったことがあったため、私自身がこのアプリを利用し、比較することにしました。 実際にAIを利用して対話を行い、プログラムを作成、実行するという一連のフローをこのアプリ上で完了することができ、さらにこのアプリを使うことで今までは同時に2、3人程度にしか対応できなかったオンライン上でのレッスンなども、大半の質問などをAIが汲み取ることにより、7、8人程度の大人数に対して比較的高いレベルで教育を提供することができると感じました。 また、現状はMinecraftとの接続でプログラムを実行する機能のみの提供となっていますが、実行環境(VM)上ではHonoなどの高レベルなフレームワークが利用可能なため、これを活かしてWebアプリの制作や、他のプログラミング教育ソフト、ツールなどの接続ができると考えています。
そして、非常に役に立った機能として、複数ユーザーによる同一セッションの参加が挙げられます。 これは、AIに対応できないトラブルなどが発生した時に先生などがユーザーのセッションに直接参加し、手助けなどを行うことができたり、複数生徒が協力してプログラムの制作などを行うことができるようになるため、個人的にとても作って良かった機能だなと思いました。
実体験を元に課題を整理し解決策を自作されている点や、今後の教員の人材不足などに対する一つの解になっていく可能性があること、完成度が高くUI/UXの設計も非常に高いレベルで実現している点などを評価し選出