Rf-3 ChooseYOA 互動式多重結局 糯米籃球夢
GIF小展示
故事架構
故事的主軸為我自己,穿越回到過去與球員林志傑(我的偶像)在台北富邦勇士籃球隊拿下三連霸建立王朝的故事。
原本故事的部分想說自己當編劇,可以灑狗血一點例如說我可以飛扣喬丹之類的,但看到peter提供的AI幫您編故事,就想看看ChatGPT能編出個什麼鬼結果也編得太好^^
練習目的
主要練習是無程式的做法,用 storyboard & segue 開發一個互動式多重結局也可以先提早讓我再來要做的電子書,預習一下
故事獲取
首先我先請ChatGPT幫我創作故事,我用以下問法 :
糯米 => GPT啊GPT誰是這世界上最會打球的人
GPT=> 糯米就是你
先滿足一下^^
切入正題我依照peter的問法
創作五頁的互動式故事,每一頁有兩個選項,選擇不同選項會跳到不同頁。主題是穿越過去的籃球夢一起三連霸建立王朝的故事,男主角是糯米,球隊是台灣富邦籃球隊。偶像是主將林志傑
結果不到10秒,這樣就把故事跟分頁架構,全都列出來真的很猛!
圖片選擇
我沒有依照下面這篇,請AI幫我繪圖,因為想說都是真人就沒使用,這次都是在網上取得圖片
圖片抓到後放置Assets
APP icon因為是網上抓的不是 1024 x 1024
這時候使用蘋果預覽小工具,把圖片修改成1024 x 1024大小再輸出成PNG檔
使用元件
有了故事內容跟架構後進入畫面的製作,依照故事的內容用以下元件:
紫框 => View Controller
紅框 => Filled button
藍框 => Navigation Controller
這個互動式照理來說不應該做這個,因為選了選項怎麼可以回上一頁這樣就作弊了,但想說可以試一下功能,結果還真的在完成後的操作中發現bug,果然我還是有測試工程師的職業病,bug底下會說
黃框 => Image View
照片部分我調整了content mode為Aspect Fill,以及Clip to Bounds不要打勾,不希望照片是裁切狀態
粉框 => Text View
這次GPT給的內容不算多也不少行所以必須用到 Text View,這邊我調整字型為Al Nile Bold 大小都設定為20,字的顏色都為白
流程架設
這部分為了練習使用segue,因為連錯很恐怖真的很恐怖,假如題目是好的姻緣且可能會結婚給了兩個選項,一個是正到不行脾氣超好的女生,另一個選項是觀落陰你會冥婚,正常人應該不會選冥婚吧 應該吧^^
結果線連錯就嘿嘿,一去 天黑黑 蓋紅布 真恐怖!
這邊還要順便訴說上面說到的bug,先看一下GIF
大家應該有發現吧~~
主頁那邊多了一個<Back,因為我失敗的頁面會有個選項可以回到主頁,但是Navigation Controller這功能會有堆疊效果,所以主頁也被堆在流程中了! 但我也不打算再次修改,就當作一個經驗紀錄,下次不要再犯了