用 ChatGPT + MBTI 打造出高社群擴散的心理測驗網站！
2023-06-25
程式筆記
0
AI 當道，你真的熟悉 ChatGPT 嗎？本文將透過與 ChatGPT 對話，並搭配 MBTI 人格分析，打造出高度社群擴散力的心理測驗網站！
首先先來確認 ChatGPT 是否了解 MBTI 模型
考量 ChatGPT 經常給出錯誤的答案，在一開始先向 ChatGPT 詢問它是否了解 MBTI 人格分析測驗。
先從簡化後的測驗開始吧
傳統的 MBTI 測驗題目很多且需要花費不少時間作答，然而考量我們想要建立的是一個快速、高度擴散的測驗網站，題目數自然不能太多，因此我先請 ChatGPT 提供一個 5 題左右的簡易版 MBTI 測驗。
當 ChatGPT 提供了簡易測驗後，我請它說明每一到題目與選項是如何給出最終結果的，確保這個測驗能具有一定的準確性與可信度。
接著好好包裝一個故事吧
接下來我請 ChatGPT 將前述的測驗包裝成一個情境，這邊我想請他將測驗以受試者是主角，它走入了一個森林中，並將遇到一系列的情境，透過每個情境的抉擇，最終找出它對應的 MBTI 人格。
在 ChatGPT 幫我設計完情境後，我希望它能幫我將 MBTI 的 16 型人格分別給予對應的 16 種動物，以做為整個測驗的結果，同時要求 ChatGPT 提供對應的描述。
除了對應的描述外，我還希望這些動物具有能力值，因此請 ChatGPT 依照活躍度、領導力、智慧值、力量值、敏捷度這 5 個象限，從 1 - 10 分個別給予能力值。
在整個包裝的最後，我請 ChatGPT 提供一段故事引言，並提供一個標題。
接著開始寫成網站吧！當然還是 ChatGPT 來寫
首先，先請 ChatGPT 將前面討論的內容轉化成為一個 Html 與 Javascript 的網站，並告訴 ChatGPT 網站的流程與邏輯。
在第一次提供的程式碼可以發現，並沒有將測驗內容放入程式碼中，因此我請 ChatGPT 將內容填入。
而在這過程中可以發現 ChatGPT 經常性的發生「失憶」現象，因此除了不斷提醒之外，也可以嘗試直接將前面生成的內容複製貼上提供給 ChatGPT。
在這過程中，我們可以將 ChatGPT 所提供的程式碼貼至 Codepen 等網站中，快速測試程式碼是否正常運作。
若發現無法運作，可以將狀況甚至是 Console（主控台）中報的錯誤提供給 ChatGPT 進行修正。
最終成果
最後，在多次嘗試與 ChatGPT 對話與修正之下，終於完成了這個網站。
大家若有興趣的話可以到「這裡」來玩玩看。
（小提醒：文章截圖為方便說明，有部分為事後撰文時的對話，可能與實際網頁及原始對話不同，詳細可參考下方對話過程；另網頁部分程式碼非由 ChatGPT 撰寫，而是由筆者修正調整。）
