首頁 > 其他 > 墨刀AI怎麼用?新手生成原型圖

墨刀AI怎麼用?新手生成原型圖

更新時間:2026-10-12 06:07:38 發布時間:4小時前 閱讀:2 views次

我第一次用墨刀AI時沒有設計基礎,只想做出登入頁和首頁,能點開、能講清流程就行。墨刀AI的上手方式,就是用自然語言生成原型初稿,再手動檢查和修改。實際操作是先確定手機端和頁麵范圍,再把需求寫進提示詞,生成後預覽、進工作台調整,做完分享給同事看。

還沒帳號?立即註冊

墨刀AI怎麼用新手生成原型圖

動手前先想清楚這幾件事

產品是App還是網頁

我做的是手機App,所以在描述裡明確寫了”手機端登入頁和首頁”。這句話看起來簡單,卻能減少畫布比例和導覽形式跑偏的情況。網頁項目則要說明是桌麵端還是移動網頁,是否需要頂部導覽、側邊欄或響應式布局。

新手常會直接輸入”做一個好看的登入頁”。我第一次也這麼寫,結果頁麵風格和布局都比較隨意。後來補上設備類型、目標使用者和頁麵用途,生成結果才接近我想要的方向。

先列哪幾個頁麵

我把范圍壓到兩個頁麵:登入頁和登入後的首頁。登入頁包括手機號輸入框、驗證碼輸入框、登入按鈕和協議提示;首頁包括歡迎語、功能入口和近期記錄。先做一條最短主流程,檢查起來更輕松。

第一步寫提示詞

提示詞模板

我會按”產品類型+使用者+頁麵+組件+交互+風格”來寫。下面是我實際采用的簡化版本:

“製作一款麵向新使用者的手機端生活服務App,生成登入頁和首頁。登入頁包含手機號輸入框、驗證碼輸入框、獲取驗證碼按鈕、登入按鈕和使用者協議提示;點擊登入後進入首頁。首頁有歡迎語、三個常用功能入口和近期記錄列表。整體采用簡潔淺色風格,按鈕清晰,文字適合手機閱讀。”

頁麵要求寫成清單,比堆很多形容詞更管用。我還會注明哪些內容不需要,例如”首頁不生成底部广告欄”,避免多出不需要的模塊。

寫太泛會怎樣

我踩的第一個坑就是提示詞只有”做一個生活服務App”。生成稿裡出現了我沒提過的營銷卡片,登入頁也缺少驗證碼入口。問題不在操作步驟,而是需求描述沒有交代頁麵組成和頁麵跳轉。

我的修正辦法是把需求拆成短句,每句話只說一類訊息:要哪些頁麵、頁麵放什麼、按鈕做什麼、頁麵采用什麼風格。一次補清楚,比生成後再猜AI為什麼這樣排更省事。

第二步生成和預覽

生成後先看什麼

生成完成後,我先不急着改顏色,先檢查頁麵是否齊全、登入頁字段是否漏掉、登入按鈕是否能進入首頁。再看頁麵內容有沒有重複,重要按鈕是否容易找到。墨刀AI支持根據文字描述生成原型,生成內容可以繼續編輯;具體入口和可用選項以工作區當前頁麵為准。

第二個坑是首頁看起來內容很多,實際缺了登入成功後的使用者狀態。我回到頁麵清單,補上歡迎語和近期記錄,再重新檢查從登入頁到首頁的連接。頁麵”看起來完整”不代表流程已經完整。

不滿意怎麼重生成

我不會只寫”重新生成好看一點”。我會指出具體問題,例如:”保留登入頁字段,把驗證碼按鈕放在驗證碼輸入框右側;首頁刪掉促銷卡片,三個功能入口改成同尺寸卡片。”每輪只處理一兩項,方便判斷修改有沒有生效。

第三個坑是一次要求改布局、配色、文案和圖標,結果生成後很難看出哪項起了作用。我改成分輪調整:先修頁麵結構,再統一顏色和文字,最後檢查圖標與間距。

第三步進工作台改組件

按鈕文字怎麼改

初稿進入編輯狀態後,我先改最影響理解的文字。登入按鈕寫成”登入并進入”,驗證碼按鈕寫成”獲取驗證碼”,首頁入口直接使用功能名稱。文案越具體,同事評審時越容易圍繞真實操作提意見。

我還檢查了占位文字和錯誤提示。輸入框裡放”請輸入手機號”,比只放”手機號”更清楚;驗證碼為空時,也應該能看出使用者接下來需要做什麼。原型裡有這些狀態,討論流程會更順。

顏色和間距怎麼調

我踩過一個小坑:只改了登入按鈕顏色,首頁入口卡片卻保留着另一套強調色,兩個頁麵像是不同產品。我先選定主色,再逐個檢查按鈕、鏈接和功能入口;頁麵間距則保持相近,避免登入頁緊湊、首頁松散。

調整時先處理組件尺寸和位置,再看字體、顏色等細節。輸入框、按鈕保持同一寬度,卡片之間留出相近空隙。改完後回到預覽狀態檢查手機螢幕上的閱讀效果,長文字和按鈕邊緣都要看一遍。

第四步分享和評審

發鏈接給同事

原型流程檢查好後,我從項目的分享或預覽入口生成鏈接,再發給同事。我會在訊息裡說明評審范圍:”請看登入頁字段、登入後是否進入首頁、首頁三個功能入口是否清楚。”給出具體檢查點,收到的意見更容易落到頁麵修改上。

發出前我自己完整點了一遍:填寫手機號和驗證碼,點擊登入,確認進入首頁。第四個踩坑是我只看了靜態頁麵,沒發現登入按鈕沒有連到首頁。把主流程走完,才發現并修正了這個連接問題。

留言怎麼用

評審時,我讓同事把意見落在具體頁麵和位置上,比如”登入按鈕與協議說明距離太近”,比只在聊天裡說”頁麵有點擠”更容易處理。收到意見後,我按頁麵逐條修改,再分享更新後的版本,請大家復看有變動的區域。