App 流程多畫面設計稿(3 連屏一致風格走完一段流程)
把一段操作流程拆成 3-4 張並排手機畫面,元件與風格一致,一眼看懂使用者怎麼走完。
【用途】產出一組 [畫面數量] 張並排的手機 App 流程設計稿(design mockup),展示使用者完成「[流程名稱]」的連續步驟,風格 [設計風格]。
【整體要求|多畫面之間風格元件必須一致】
- [畫面數量] 支手機畫面由左到右等距並排,大小一致、底部對齊。
- 每張畫面上方標一個步驟標籤:「步驟1」「步驟2」…
- 所有畫面共用同一套配色、字體、圖示、按鈕樣式、圓角、間距(8pt 格線)。
[ Log in to see the full prompt ]Sign up free to see the full prompt, copy it, save it, and join the discussion. Free content unlocks on login; Pro content is a separate subscription.
要把一段使用者流程(註冊、下單、預約、付款)一次攤開給團隊或客戶看「從頭到尾長怎樣」時用這條,適合做 onboarding 流程、結帳流程、UX 提案。多畫面最大的挑戰是「一致性」——AI 很容易把三張畫面畫成三種風格,所以 prompt 一定要反覆強調「共用同一套配色/字體/圖示/按鈕樣式、8pt 格線」,並讓每張畫面結構相同(頂部標題→內容→主按鈕)。三個務實提醒:一,畫面數量建議 3 張,最多 4 張,超過每張會縮小、字開始糊、風格也更難維持一致;二,每張畫面的內容別塞太多,一張聚焦一個動作最清楚;三,明寫「只要螢幕內容、不要手機外框與場景」避免變成手握三支手機的情境照。這是溝通用的流程稿,不是能點的原型;若某一張風格跑掉,最有效的做法是叫它「第 N 張改成跟其他張同樣的配色與按鈕樣式,其餘不動」重生。比起逐張分開生再拼,一次生並排版本的風格一致性通常更好。
PRO01高階 3D 收藏玩具頭像
Transform the input photo into a high-end stylized 3D collectible figure…
PRO02櫻花咖啡戶外人像
Edit the provided image while preserving the same face identity, shape,…
PRO03潑灑抹茶街頭手機照片
A realistic vertical smartphone photo of a spilled green iced drink on o…
PRO04古希臘三哲時間軸城市圖
二千五百年前,柏拉圖,蘇格拉底, 亞力士多德,坐在雅典街頭聊天,聊出了世界文明史的源頭。 背景可以加上他們聊天內容,按時間軸的走向,重疊在古希臘…