墨刀AI怎么根据产品需求生成原型 AI产品设计使用教程

雨敏吖_4530

雨敏吖_4530

2026-08-20

548人浏览

原创

墨刀ai生成原型功能可在项目编辑态下通过左侧面板“ai生成”入口,输入具体页面需求描述后自动生成可编辑的原型页面。需先创建项目并进入编辑器,授权访问项目结构,再用清晰业务语言描述布局与字段,生成后支持替换图片、统一样式和补全交互。

☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜

墨刀ai怎么根据产品需求生成原型 ai产品设计使用教程 - php中文网

想用一句话让墨刀自动画出登录页、商品列表页或后台管理首页,不用拖组件、不手动排版,直接拿到可编辑的原型初稿——墨刀AI生成原型功能就是为此设计的。

确认账号与环境准备

登录墨刀网页版(modao.cc)或打开最新版桌面端,确保已注册并登录个人账号。免费版即可使用AI生成功能,但【必须处于项目编辑态】——即已创建好一个原型项目并进入编辑器界面,不能在工作区主页或新建项目弹窗里直接调用AI。

若尚未建项目,先点右上角「新建」→「原型」→ 命名为“AI测试” → 选择「iPhone 14」或「Web宽屏」模板再进入编辑器。

触发AI生成入口

在编辑器左侧面板顶部,找到并点击「AI生成」图标(闪电+字母A组合图形),不是「工具」菜单里的其他选项。

首次点击会弹出权限提示,勾选「允许访问当前项目结构」后点「开始使用」——这一步跳过会导致后续生成页面无法自动关联到当前项目页面列表。

输入有效的产品需求描述

在弹出的AI对话框中,用中文清晰描述你想要的页面,例如:“一个面向宠物医生的预约管理后台首页,包含顶部导航栏(含logo、用户头像、消息通知)、左侧垂直菜单(首页、今日预约、患者档案、药品库存、设置)、右侧主内容区显示今日3条待接诊预约卡片,每张卡片含宠物名、主人电话、到院时间、状态标签(未到/进行中/已完成)。”

避免只写“做一个APP首页”或“好看一点的登录页”这类模糊表述;AI依赖具体字段、布局层级和业务逻辑关键词来理解意图。如果第一次结果偏差大,不要删掉整个对话重来,直接在下方追加一句:“把左侧菜单改为带图标的折叠式,且默认展开‘今日预约’子项。”

墨刀AI
墨刀AI

一款AI图像与设计工具,主要用于产品经理的专属智能体,适合需要提升相关任务效率的用户。

下载

生成并导入原型页面

点击「生成」按钮后等待3~8秒,AI会返回预览图和页面结构说明。

确认预览效果基本符合预期,点击右下角「插入为新页面」——此时页面会自动添加进左侧页面列表,命名如“AI_预约管理首页”,并跳转至该画布。

注意:【生成后不可直接编辑HTML结构】,所有组件均为墨刀原生可编辑对象(文字可双击改、按钮可设交互、容器可调圆角),但初始布局可能需微调对齐或字号。

快速优化生成结果

方法一:替换占位图
选中任意图片组件 → 右侧属性面板点「更换图片」→ 上传真实UI资源或从素材广场搜“宠物”“医疗”等关键词插入。

方法二:批量统一字体
按住Ctrl(Windows)或Cmd(macOS)多选所有文本组件 → 右侧字体设为「PingFang SC」→ 大小统一设为14px → 行高设为1.5。

方法三:补全关键交互
选中“今日预约”菜单项 → 点右上角闪电图标 → 拖到刚生成的“AI_预约管理首页”页面 → 在弹窗中选「点击→跳转」→ 动效选「滑入(从左)」。

相关文章

PHP速学视频免费教程(入门到精通)
PHP速学视频免费教程(入门到精通)

PHP怎么学习?PHP怎么入门?PHP在哪学?PHP怎么学才快?不用担心,这里为大家提供了PHP速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载

相关标签:

墨刀 墨刀ai

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

相关专题

更多
墨刀AI使用教程大全
墨刀AI使用教程大全

PHP中文网墨刀AI专区提供完整使用教程,涵盖AI生成原型、智能对话、草图识别、代码导出等核心功能,从入门到进阶,助你快速掌握AI设计工具,提升产品设计与协作效率,轻松实现从灵感到高保真原型的一键落地。

2026.06.26

91

10

墨刀AI零基础入门指南
墨刀AI零基础入门指南

PHP中文网推出墨刀AI零基础入门指南与进阶教程合集。从账号注册、界面导览到AI生成原型、智能文档等核心功能,手把手带你从新手快速成长为设计达人,轻松掌握高效产品设计技能!

2026.06.26

226

30

墨刀设计原型工具使用方法合集
墨刀设计原型工具使用方法合集

PHP中文网墨刀设计原型AI工具专区,汇集从入门到精通的实战教程。涵盖AI生成原型、PPT联动及多人协作等核心技巧,助您快速掌握高效设计方法,轻松实现从灵感到高保真原型的跨越,大幅提升产品设计与团队协作效率。

2026.06.26

195

19

Vibeknow在线使用入口合集
Vibeknow在线使用入口合集

本专题汇总了Vibeknow在线创作视频的官方入口及网页版使用教程,涵盖PPT、PDF、Word等文档一键转讲解视频的核心操作,并整理了免费版水印规则与手机端浏览器访问指南,助你快速将知识内容视频化。

2026.09.21

0

20

NumPy随机数文件读写与dtype数据类型
NumPy随机数文件读写与dtype数据类型

本专题整理 NumPy 随机数、文件读写与 dtype 数据类型相关教程,覆盖 Generator/random、随机数种子、正态分布采样、npy/npz/CSV/TXT 保存读取、loadtxt/savetxt、memmap、大文件处理、astype 类型转换、结构化 dtype、整数溢出和精度丢失等场景。

2026.09.21

0

24

NumPy矩阵运算与线性代数计算
NumPy矩阵运算与线性代数计算

本专题整理 NumPy 矩阵运算与线性代数计算相关教程,覆盖矩阵乘法、dot 与 @ 运算符、逆矩阵、行列式、特征值与特征向量、SVD、线性方程组、欧氏距离、矩阵分解和大规模矩阵性能优化等内容,帮助读者掌握 np.linalg 与矩阵计算实战。

2026.09.21

0

20

NumPy广播机制数学运算与统计分析
NumPy广播机制数学运算与统计分析

本专题整理 NumPy 广播机制、数组数学运算与统计分析相关教程,覆盖广播规则、维度对齐、矩阵与数组加减除法、向量化计算、均值方差、分位数、中位数、直方图和 unique 频次统计等场景,帮助读者掌握 ndarray 高效计算与统计处理方法。

2026.09.21

0

17

NumPy数组创建索引切片与数据选择
NumPy数组创建索引切片与数据选择

本专题整理 NumPy 数组创建、索引、切片与数据选择相关教程,覆盖 np.array、zeros/ones、多维数组形状、基础切片、花式索引、布尔索引、条件筛选、视图与副本等常用场景,帮助读者系统掌握 ndarray 数据构造与高效提取方法。

2026.09.21

0

12

Aionclaw智能助手介绍
Aionclaw智能助手介绍

本专题汇总了AionClaw(AI龙虾助手)的功能介绍与在线使用入口。AionClaw是杭州趣猿人工智能有限公司推出的桌面级AI智能体,能直接在电脑上读写文件、运行脚本、操作浏览器,自动交付Word、PPT、Excel等成品。

2026.09.20

20

13

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
墨刀帮助中心
墨刀帮助中心

共0课时 | 0人学习

墨刀帮助中心
墨刀帮助中心

共0课时 | 0人学习