「利用 AI 開發應用程式」這件事本身,如今已經不是什麼稀奇的事了。
不久之前,AI 給人的印象還是能幫忙整理文章、提供點子的「優秀助手」,但最近它已逐漸轉變為能主導開發工作的「可靠夥伴」。
公司同仁接觸 AI 的機會也越來越多,而「我也來做點什麼看看吧」的念頭,正是這次應用程式開發的起點。
original text
最近我迷上了看電影,每週都會看好幾部,並把想看的片單和喜歡的作品全都記在 iPhone 的備忘錄裡。
然而,清單增加的速度很快,而且類似的片名也很多,常常出現「咦,這部我看過了嗎?」的情況。最後,用備忘錄管理的方式終於崩潰了。
於是我想「乾脆做一個專屬自己的工具吧」,因而製作了這次要介紹的「電影觀看清單」。
即使是粗略的提示,也能做出可運作的應用程式
提到使用 AI 開發,很多人可能會覺得必須寫出把細節需求都拆解清楚的提示詞吧。
也有不少人認為,必須先整理好背景與規格,把需求毫無遺漏地傳達出去,才能做出真正可以運作的東西吧。
當然,如果能一併提供背景與規格,那是最好不過的。不過這次實際嘗試後發現,即使指示非常粗略,它也會確實理解我的意圖並完成實作。
或許是因為這是個簡單的應用程式,但只是把想做的功能一股腦寫進提示詞,就做出了能正常運作的應用程式。以下是最初的提示詞。
我想製作一個電影的待看清單。
因為只是原型,請只用一個 HTML 檔案完成,讓它在瀏覽器中打開就能立即運作。
功能方面,希望能輸入作品標題與串流平台(如 U-next、Prime Video 等)進行登錄,並能以清單形式顯示已登錄的作品。
另外,也請加入「已觀看」的勾選功能。
若不使用 AI 進行傳統開發,即使是再簡單的東西,光是「思考 UI」「挑選要用的技術」「撰寫程式碼」,就會輕易耗掉好幾個小時。但 Claude 只花了短短幾分鐘,就理解了想做的事,從挑選最適合的 UI 與工具到完成實作,都俐落地搞定了。
速度之快,讓我不只是佩服,甚至還有些許的恐懼感。
速度這麼快,我這邊的慾望也跟著不斷冒出來。基礎架構完成後,我就不停地丟出想到的所有需求。當時的提示詞也談不上整齊,只是把在意的地方條列出來,然後說一句「改這裡」,如果對象是人類工程師,一定會被嫌棄到不行的粗糙程度。
就這樣進行了幾次隨性的來回對話後,待看清單的大致架構很快就完成了。
包含細部調整在內,從初版應用程式完成到能用,大約花了一個小時。
想到就立刻實作,邊做邊慢慢完善。
架構完成的幾天後,大家安排了一個分享會,各自介紹自己用 AI 製作的應用程式,我也有機會看到其他成員的作品。其中,有一位成員開發的應用程式整合了「Gemini Nano」。
看到那個作品的瞬間,我突然想到:「說起來,我自己在找想看的電影時也會用 Gemini。如果把它整合進應用程式,是不是就能以觀看清單為基礎來搜尋電影?」於是回家後立刻重新開始開發。
如果是對真人提出,「開發途中擅自增加規格」大概會被罵到臭頭,但 AI 的厲害之處就在於,這類需求也能輕鬆應對。這次也只花了幾分鐘,就幫我實作完成了電影搜尋功能。
搜尋功能就這樣順利完成了,接下來我開始在意的是「準確度」。
最初的規格相當粗略:只根據加入觀看清單的電影標題和類型,請 AI 推薦◯部作品。因此,雖然類型符合,但經常推薦出與我的喜好不太一致的電影,這是個問題。我也嘗試過改為以收藏的作品為基礎來挑選推薦,但結果並沒有改變。
我心想,光是標題和類型可能資訊不足,於是決定為每部電影加入劇情簡介作為資料。不過,要我一部一部手動輸入劇情簡介實在太麻煩了,絕對不想做……。想來想去,最後還是決定在這裡也借助 AI 的力量。
改為「根據清單中輸入的標題,自動登錄劇情簡介」的機制。為了確保劇情簡介的準確度,我請 Claude 再次撰寫程式碼:透過 Wikipedia 的 API,從登錄的標題取得相關資訊,並以此為基礎由 AI 自動生成劇情簡介。
老實說,即使如此,仍有些地方準確度不夠理想,我也正在考慮最終改為整合 TMDB 的 API。不過,已經達到「小小的錯誤也能一笑置之」的程度了。這一連串的微調也只花了大約 2 到 3 個小時。
順帶一提,後來準備在實機上使用時,發現 Gemini Nano 似乎無法使用,因此最後改用了 Gemini API。免費方案雖然有請求次數的限制,但可以使用比 Gemini Nano 更好的模型,因此準確度大幅提升了。
完成的應用程式簡介
雖然是隨心所欲地邊調整邊打造、真正「邊用邊成長」的應用程式,不知不覺間已累積了這麼多功能。
【待看清單】
- 登錄電影片名、類型、串流服務與劇情簡介
- 運用多種 API 的「劇情簡介自動生成」
- 「未觀看 / 已觀看」的切換勾選
- 依類型、收藏,以及未觀看/已觀看進行篩選的功能
【作品搜尋】
- 根據收藏資訊,由 Gemini 推薦電影
- 可指定類型與推薦部數
- 一鍵將推薦的作品加入待看清單
- 已看過的電影也能加入清單,並標註為已觀看狀態
過去「找電影」和「記錄電影」是分開進行的工作,現在全部集中在這一個應用程式中。
以前每次搜尋都得向AI說明自己的喜好,現在這道手續也省下了,隨時都能找到符合口味的電影。
原本的主要目的——待看清單,也能依觀看狀態、收藏與類型進行篩選,管理起來比用記事本時代方便太多了。
讓我特別開心的是,搜尋結果中若出現清單上漏掉的作品,只要一鍵就能加入。
也不必再特地輸入片名來登錄,省了不少功夫。
總結
看到這裡您可能已經發現,這次開發應用程式時,我一行程式碼都沒有寫。只要用文字告訴Claude「我想要這樣的功能」,它就全部幫我實作完成了。
實際試過後,最大的感受是「不必一開始就決定完整的成品」。一邊使用,一邊發現「這個也想要」「這裡好像不太對」,然後每次都告訴Claude。與其說是在「製作」應用程式,不如說更接近「培養」它的感覺。
如果有人覺得「提示詞一定要寫得很完整才行」而猶豫不前,請先隨意丟給它試試看。做出來的成品若與想像不同,再慢慢修正就好,其實沒有什麼真正的失敗。只要實際試一次,就會有「咦,意外地可行嘛」的感覺。
請務必輕鬆地試試看。
以新進員工身分入社,目前正努力成為一名步步高升的總監!我每天都在挑戰,立志成為橫跨設計到廣告營運等各領域的多面手。工作上追求俐落的指導方式,私下則在名為「家」的要塞裡享受宅居生活。喜歡動畫。
焊接小姐
Web 總監 / 2022 年入社