お客様だけが入れる、自分専用ページの入口を作ろう
今日手元に残るもの
教材用アカウントだけが次の画面へ進めるログイン画面。パスワードは伏せ字で、間違えた時は登録済みかどうかが分からない同じ言い方で止まる
時間の目安
最初の完成まで 20〜30分
終わりの合図
開けた・使えた・保存できた
この課題の10ステップを見る
01
今日はこれを作る
最初に、今日手元に何が残れば終わりかだけ見ます。全部を覚える必要はありません。
今日できあがるもの
教材用アカウントだけが次の画面へ進めるログイン画面。パスワードは伏せ字で、間違えた時は登録済みかどうかが分からない同じ言い方で止まる
02
材料をAIに渡す
下の材料を用意して、ChatGPTに入れます。
今回使う材料
Lv.110で完成させた「共有仕事台帳」一式(依頼の一覧、項目の定義、検索・履歴・復元の確認記録)を同じWorkで開き、これから顧客本人へ見せる元データにします。
材料の入れ方前の完成物を使う
- 1上に書かれた方法で、前の完成物を用意する
- 2材料がそろったら、下のプロンプトを送る
Workが表示されるならそこで続けます。なければChatへ同じ内容を送って進めます。
ChatGPTの設定と詳しい使い方ファイル変更を何度も行うため、有料版がおすすめです。使える量はプラン画面で確認してください。
実際のファイルやコードを扱うなら、Codexがおすすめです。
03
ChatGPTに送るプロンプト
プロンプトは、ChatGPTにそのまま貼る指示文です。上に書かれた前の完成物を用意してから、下の文を送ります。
この共有仕事台帳に、お客さん本人だけが入れる入口を付けたい。メールアドレスとパスワードを入れる画面つくって。練習用のアカウントは1つでいい、こっちで決めた文字列で用意して。合ってたら次の画面へ、間違ってたらそこで止まるように。パスワードは画面にも記録にも生の文字で残さないで。実在のメールアドレスは使わないし、まだ誰にもURL配らないで。
04
AIの答えを確認して試す
最初から完璧でなくて大丈夫。まず一度、自分で動かしてみます。
1AIから出てくるもの
教材用アカウントだけが次の画面へ進めるログイン画面。パスワードは伏せ字で、間違えた時は登録済みかどうかが分からない同じ言い方で止まる
まず自分で試す
用意した教材用アカウントで入り、次の画面まで進めるのを見る
パスワードを1文字だけ変えて送り、進めないことと出てくる一行を読む
登録していないアドレスで送り、さっきと同じ文言で止まるか見比べる
パスワード欄が伏せ字になっているか、画面を近くで見て確かめる
追加のプロンプト
当てはまるものだけ、上から順に送ります。
間違えた時の画面が出たら
断り方が親切すぎる。「メールアドレスかパスワードが違います」だけにして、そのアドレスが登録済みかどうかは分からない出し方に変えて。何回続けて失敗したかは下に出して、5回で少し待たせて。
送った後に試す
登録していないアドレスと、正しいアドレス+違うパスワードの2通りで送り、同じ表示になるか見る
05
仕上がりをよくするコツ
気になるものを一つ選んで、ChatGPTに伝えます。
パスワードが丸見え
「パスワード欄は伏せ字にして、目のマークを押している間だけ見えるようにして」
間違えても何も起きない
「間違えた時は入力欄のすぐ下に一行出して、カーソルをパスワード欄へ戻して」
スマホで押しにくい
「スマホの幅で、入力欄とログインボタンを指1本分の高さにして」
06
やりがちなミス
見つけた数：0 / 5
当てはまる所を見つけたら、上のコツを使って直します。
これは合格・不合格を決めるものではありません。保存状態を確認しています。
07
ここまでできたら完成
AIの「できました」で終わらせません。実物を開いて使い、この課題の完成条件を確かめます。
教材用アカウントで次の画面まで進み、パスワードを1文字変えると進めなかった
登録していないアドレスでも、正しいアドレスの時と同じ文言で止まった
パスワードが伏せ字で、画面にも記録にも生の文字で残っていないことを確かめた
Workで作った物を保存するプロンプト
このログイン画面と、用意した教材用アカウントの入り方(パスワードは伏せたまま)、失敗した時の言い方の決まりを、完成フォルダの「マイページ」へ保存して。実在のメールアドレスは使っていないことと、まだURLを誰にも配っていないことも書いて。
共通の保存メモChatでできた物は、自分で保存
Chatの返答欄にファイルができたらダウンロードして「完成」フォルダへ移します。文章だけなら、全文をコピーしてテキストやWordへ貼って保存します。保存した物をもう一度開けた時に「残せた」とします。
できたことを手元に残す
作ったものや気づいたことを、自分のメモに残しておきましょう。
08
自分の仕事なら
今作ったものを、明日の仕事で使える形に変えます。
まず今お客様から電話で聞かれている「私の依頼どうなってます?」の一件だけを、この入口の先で見せる想定にします。実在のお客様のアドレスを入れるのは、置き場所と見られる人を決めてからにします。
本物の顧客名、個人情報、社外秘の資料へ置き換える前に、会社のルールと閲覧権限を確かめます。
09
つまずいたところを整理する
どこまでできて、どこで止まったか。短い言葉で大丈夫です。
うまくいかなかった点をメモする
「やりたかったこと」「試したこと」「実際の結果」を並べると、次に試すことが見つけやすくなります。
メモは自分の端末へ。サイトへの質問の受付は終了しています。
10 / 任意
次に進みたい方へ
ここで完成です。続ける方だけ、下の文を送ります。
次にすること
一度入ったら、入り直さずに済むようにしよう
続けるための追加プロンプト
追加のプロンプト
ログインしたあと、ページを読み込み直すたびに入り直すの面倒だな。入ったままの状態を保てるようにして、画面の右上に今誰で入ってるか出して。
進め方は3つだけ
- 1今使っているChatまたはWorkを、そのまま続ける
- 2下の追加プロンプトをコピーして送る
- 3出てきた物を見て、必要な所だけ一つ直す
今作った物の、ここを使います
今作ったログイン画面と教材用アカウントを、そのまま入口として使い続けます。
できるようになること
画面を移っても入り直さずに済み、ログアウトすれば中身へ戻れなくなります。
この内容を詳しく学ぶ教材
Lv.112「一度ログインすれば使いやすく、ログアウト後は他人に見られないマイページにしよう」