墨刀AI草圖轉原型怎麼上傳

墨刀AI草圖轉原型的入口在“AI工作臺”裡的“AI生成原型”功能，手機端在App底部導航欄點“+”選“AI生成原型”。手繪草圖用手機拍就行，最好平鋪正對、光線均勻、邊緣清晰，AI對潦草手寫文字識別率有限，但按鈕位置、輸入框輪廓、列表結構基本都能還原-6。支援PNG、JPEG等常見圖片格式，從相簿選或直接拍照都行，單張建議不超過5MB。

想免費用墨刀AI？點這裡註冊：墨刀AI官網，新使用者送免費額度

第一步：進入AI生成原型入口

瀏覽器開啟墨刀官網 modao.cc，登入後點左側導航欄的“墨刀AI”，或者直接訪問 modao.cc/ai 進入工作臺。手機端開啟墨刀App（需更新至 v6.8.0 及以上版本），首頁底部點 “+”，選 “AI生成原型”。確認能看到“上傳草圖”或“上傳附件”的按鈕，說明入口正常-1-6。

第二步：拍好手繪草圖

拍照質量直接決定識別效果。手機平拍、正對草圖、光線均勻、四邊齊整，避免斜角拍攝或陰影遮擋關鍵佈局線。用黑筆粗線勾勒主框架，文字區域用方框標註“此處為標題”，圖示旁手寫“搜尋圖示”這類語義標註——AI不識手寫字型，但能理解標註含義。必須擦除所有塗改痕跡和輔助線，橡皮沒擦乾淨的虛線會被AI當成額外的分割線，生成多餘的容器框-7。

第三步：上傳草圖圖片

在對話方塊右下角找到 “上傳附件” 按鈕，點進去從裝置選圖片；也可以直接把圖片 Ctrl+V 貼上到對話方塊裡，比點按鈕快。一次最多可傳 5張草圖，多頁流程（如登入→首頁→個人中心）建議按順序編號命名再批次上傳，AI會自動按檔名排序生成對應頁面。上傳後等待 3到8秒完成解析，期間不要退出頁面或切後臺，中途關閉會丟失本次解析結果，需要重新上傳-1-6-7。

第四步：校準識別結果

解析完成後，頁面會先展示一份 功能說明文件，包含頁面型別判斷、元件清單、配色建議。別急著點“生成原型”，先檢查文件裡的描述跟你的草圖是否一致。比如AI寫的是“頂部導航欄含3個Tab”，但你草圖裡畫的是兩個圓圈加一個搜尋框，就在文件對應位置手動改成“頂部含頭像、設定按鈕和搜尋入口”。文件改得越準，生成的原型越貼近你的真實意圖-6-7。

第五步：生成可編輯原型

核對說明文件無誤後，點 “生成原型” 按鈕，生成過程約 2秒。完成後自動跳轉至編輯器介面，所有元件已按草圖位置排布完畢。頂部狀態列顯示 “已生成 | 可編輯 | 未儲存”，此時可以拖動調整、雙擊改文字、右滑調出屬性面板改圓角/邊框/動效。比如把草圖裡的“頭像框”換成真實Avatar元件，或者給“提交按鈕”新增點選跳轉互動-6。

第六步：用“選擇模式”精準修改

生成後切換到頂部 “選擇模式”，點選誤識別的元件，在右側AI對話方塊輸入修改指令。指令越具體越好：只說“換個圖示”AI可能隨機替換，說“把這個圖示換成iOS系統自帶的音量+圖示，灰色，尺寸24×24”才能精準命中。修改後的元件會實時重繪，其餘佈局保持不變-7。

第七步：匯入墨刀做深度編輯

點右上角 “匯出至墨刀”，原型進入墨刀編輯區，跟傳統原型工具的操作方式完全一致。在這裡可以手動連線頁面跳轉、新增彈窗和反饋、補全異常狀態。如果需要生成前端程式碼，在預覽介面切換至 “程式碼模式” 即可檢視對應的HTML程式碼，支援一鍵複製-1-11。

第八步：幾個實用注意點

草圖別畫得太潦草，AI對手寫文字的識別率有限，文字儘量寫清楚，按鈕和輸入框的邊界畫明確。上傳前給檔案命名帶狀態，比如“登入頁-空狀態”“登入頁-輸入中”，生成後更容易對應。解析中途千萬別切後臺，App端切走會直接丟失本次結果。一次最多傳5張，超過的話分批次上傳，別硬塞。