AIが講師代わり！簡単にチュートリアルを作成してくれるアプリ『チュートリアルMaker』を紹介

初めまして、ガマリと申します。

普段は、AIに関するアプリを作ったり情報を発信したりしています。

今回は、私が開発しています「チュートリアルMaker」というアプリを紹介させてください。

チュートリアルMakerとは簡単に言えば「AIが講座を作ってくれる」というアプリです。

こちらから利用可能です。

https://tutorial-maker-iota.vercel.app/

では、さっそく本題に入ります。

# チュートリアルMakerとは？

チュートリアルMakerは**チュートリアルをAIが作成してくれる**というコンセプトの元、作成したアプリになります。

![main1](https://storage.googleapis.com/zenn-user-upload/c582bac5c5b3-20230705.png)

こんな感じの画面を使って、チュートリアルを作成します。

もう少し詳細を見ていきますと、チュートリアルMakerでは以下のステップを踏むことで、チュートリアルを作成できます。

1. 「したいこと」を入力。
2. チュートリアルの提案。
3. チュートリアルを編集。
4. 講座内容を生成。

おおよそ、こんな感じです。

難しい操作は無く、単純に「したいこと」を書けばあとは**ボタンポチポチ**でチュートリアルを作成してくれます。

次から、具体的な操作を見ながら解説していきます。

# チュートリアルMakerの具体的操作

## 1. APIキーの登録

現在、チュートリアルMakerでは、APIキー登録を必須としています。

**Action:** まず、トップ画面を開き、ヘッダーにある「ユーザー情報」ボタンを押下します。

![step1](https://storage.googleapis.com/zenn-user-upload/e528fb78a6b9-20230705.png)

**Action:**  そして表示された画面にて、OpenAIのAPIキーを登録します。

![step2](https://storage.googleapis.com/zenn-user-upload/614dfc7d4839-20230705.png)

APIキー登録に成功すると、トップ画面に戻ってきます。

### (APIキーとは？)

APIキーとは、OpenAIの機能を利用するために必要なキーのことです。

OpenAIのAPIキーは、「こちら」というリンクをクリックしていただき、OpenAIのAPIキー管理画面を開いていただくと、API作成が可能な場所があります。

そこで作成していただき、登録してください。


## 2. チュートリアルの提案を作成

次に、AIにチュートリアルの講座を提案してもらいます。

**Action:** まず、トップ画面の「チュートリアル作成フォーム」にて、今学びたいことを入力します。

![step3](https://storage.googleapis.com/zenn-user-upload/2511ad7c4dc1-20230705.png)

今回は「Rust入門したい」という大雑把な形で入力してみます。

**Action:** 「作成」ボタンを押下します。

数十秒経つと、下部に次のような提案内容が表示されます。

![step4](https://storage.googleapis.com/zenn-user-upload/e6b041777e3b-20230705.png)

**Action:** 「一覧に追加」ボタンを押下します。

左側のチュートリアル一覧に、チュートリアルが追加されたのが分かります。

![list](https://storage.googleapis.com/zenn-user-upload/943eebe5c6d2-20230705.png)

これにて、チュートリアル提案のフローは完了です。

次は、チュートリアルの**具体的な内容**を作成していきます。

# チャプター内容の作成

ここからはチュートリアルの内容を作成していきます。

チュートリアルMakerではチュートリアルに対してチャプターというものを複数持たせることで構成しています。

このチャプターの具体的な内容は、現段階では作成されていません。

それを作成していきます。

**Action:** チュートリアル一覧から編集したチュートリアルを選択する（今回はRust入門チュートリアル）

![list](https://storage.googleapis.com/zenn-user-upload/943eebe5c6d2-20230705.png)
すると次のような画面が表示されます。

**Action:** 編集したチャプターをクリックする。

![step5](https://storage.googleapis.com/zenn-user-upload/4dc970253a1b-20230705.png)

今回は所有権と借用を選択します。

すると、次のような画面が表示されます。

![step6](https://storage.googleapis.com/zenn-user-upload/d0ae550381c7-20230705.png)

確かに**チャプター内容が生成されていない**ことが分かります。

これは、正規版にて導入するための布石としてこういった仕様にしています。

正規版では、チャプターに対して複数の内容を連結できるようにしたいためです。

今回はデモ版なので、チャプター内容は一つしか作成できませんが、正規版では複数作成できると思って下さい。

**Action:** 編集ボタンを押す（保存ボタンに切り替わる）

**Action:** 講義生成ボタンを押す

![step7](https://storage.googleapis.com/zenn-user-upload/13740bcef698-20230705.png)

数分待つと、次のような内容が生成されます。

![step8](https://storage.googleapis.com/zenn-user-upload/1ab4abdd7a0a-20230705.png)

**Action:** 左下の「保存」ボタンを押してください

これにて、チュートリアルMakerの基本的な処理は完了です。

あとは、学習したいチャプターを生成しては勉強し、を繰り返せばオッケーです。

ちなみに、右下にある「質問」ボタンでは質問をすることが可能です。

![step9](https://storage.googleapis.com/zenn-user-upload/a2b8768a7536-20230705.png)

分からないことがあったら利用してみてください。


# チュートリアルMakerの良いところ・悪いところ

ここからは、チュートリアルMakerを触ってみて感じた「いいところ」「悪いところ」を紹介します。

## 良いところ

### すぐに勉強ができる

従来の学習では書籍を探したり、ドキュメントを読み漁ったりと、何かしらの学習をする際にそれを探す時間が必要でした。

チュートリアルMakerを使えば、そういった「探す」という時間は無くなり、すぐに勉強に取り掛かれます。

熱量を持った段階で勉強できるのがいいポイントでしょうか。

### 自分なりの講座を作成できる。

「したいこと」に自分なりの条件を放り込めば、ある程度、自分なりにカスタマイズした内容にすることができます。

正規版では、全てのチャプターを自分なりにカスタマイズできるように考えてはいますが、現状で十分でしたら、このままでいきたいと思っています。

### 気に入らなければ講座を作り直せる

書籍などとは違い、気に入らなければ何度でも作り直せます。

チャプター単体で作り直してもいいですし、チュートリアル全体を作り直してもいいです。

## 悪いところ

### 高い

一回の講座を全てやり切ろうとすると、おそらく20円ぐらいかかってしまいます。

これを連発しますと、いくら数十円とはいえ、簡単に千円とか超えてしまいます。

とはいえ、トークン数を削減すると、内容の精度が落ちますし、難しいところです。

### 内容が正しいか分からない

GPTの特徴として、嘘の情報も本当のように言ってしまう傾向があり、内容が正しくなくても「これ本当だよ」と思わせてしまう部分も多々あります。

特に、入門する人にとって、それが本当に正しいかは分かりません。

これを解決するためにも、チュートリアルの内容は全体で共有できるようにした方がいいかもしれません。

# チュートリアルMakerの今後

チュートリアルMakerは現状、デモ版の段階です。
下記のURLから試してみてください。

https://tutorial-maker-iota.vercel.app/

正規版の予約フォームはこちらです。

https://docs.google.com/forms/d/e/1FAIpQLSdL6TZ2J0h_WrmXC58SvYfDlOxaFsL-IlxZSnNJQZbOxMsl7g/viewform

正規版では次のようなことを考えています。

**正規版で取り入れる機能**

1. チュートリアル共有機能
    1. 他人が作ったチュートリアルをみんなで共有できる機能
2. チャプター表示機能
    1. 　チャプターをより見やすくしたページを用意します。
3. 講座追加機能
    1. 追加したい内容を入力すると、それに合わせてチャプターを増やしてくれる機能

などです。

予約数が一定の数に到達しましたら、プロジェクトを開始しますので、なにとぞよろしくお願いいたします。

最後に、私は色々なAIアプリを開発していますので、同行が気になる方は是非フォローのほどよろしくお願いいたします。

<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">チュートリアルMakerのデモ版を今日の13時あたりから公開します。<br><br>チュートリアルMakerはGPTを活用した「講座自動生成ツール」です。<br><br>「学びたいこと」や「やりたいこと」を入力すると、それに沿って講座を作成してくれます。<br><br>使ってみた方は是非！<a href="https://twitter.com/hashtag/%E6%8B%A1%E6%95%A3%E5%B8%8C%E6%9C%9B?src=hash&amp;ref_src=twsrc%5Etfw">#拡散希望</a> <a href="https://twitter.com/hashtag/%E5%80%8B%E4%BA%BA%E9%96%8B%E7%99%BA?src=hash&amp;ref_src=twsrc%5Etfw">#個人開発</a> <a href="https://twitter.com/hashtag/ChatGPT?src=hash&amp;ref_src=twsrc%5Etfw">#ChatGPT</a> <a href="https://twitter.com/hashtag/%E3%83%93%E3%82%B8%E3%83%8D%E3%82%B9%E8%AC%9B%E5%BA%A7%E3%82%82?src=hash&amp;ref_src=twsrc%5Etfw">#ビジネス講座も</a> <a href="https://t.co/tZBTt4KHXd">pic.twitter.com/tZBTt4KHXd</a></p>&mdash; ガマリ@AI個人開発 (@Marine765_) <a href="https://twitter.com/Marine765_/status/1676389852647165952?ref_src=twsrc%5Etfw">July 5, 2023</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>