筛选有反馈
选了什么条件、找到多少结果、如何清空，都要在界面上看得见。
墨刀 · 界面设计
UI界面设计让好想法，
成为好界面
从 App、网页到业务后台，把布局、内容与操作放在同一张画布上。用墨刀整理页面、复用组件，再和团队一起完善细节。
在线编辑 · 组件复用 · 团队协作
看看不同场景的界面设计
让人看得懂，
也用得顺手
UI界面设计把信息、视觉样式与操作组织在一起。做好一个页面，需要同时考虑内容怎么排、重点在哪里、用户下一步做什么。
01
先确定页面任务
是浏览、选择还是填写？让主要操作有清楚的位置。
02
保持视觉一致
用统一的文字、颜色和组件，连接同一产品的不同页面。
03
把状态补完整
考虑正常、空内容、加载与出错时的显示和下一步。
02 / WEB
把内容讲清楚，
也把风格留下来
网页界面设计从内容层级开始。品牌介绍、商品信息和主要操作各占其位，再用字体、图片和留白建立风格。
- 桌面看整体安排导航、首屏主信息与连续内容区。
- 手机看顺序重新检查行长、图片裁切和按钮位置。
- 内容变化也能容纳用真实标题和不同长度的内容检查布局。
03 / 业务后台
复杂业务，
也可以清楚呈现
后台界面设计需要处理筛选、表格、详情和表单。先让用户找到数据、判断状态，再完成关键操作，让信息密度服务于工作效率。
状态有区别
待处理、已完成、出错等状态同时使用文字与视觉提示。
关键操作可确认
删除、提交、发货等动作补上确认、结果和返回路径。
从一个页面，到一套界面
少一点重复调整，
多一点设计一致
颜色、文字、按钮和输入框反复出现。先定义常用样式与组件，再扩展页面，能更清楚地管理共用元素和局部差异。
- 组件与样式整理导航、卡片、按钮等高频元素，复用成熟设计。
- 默认与异常状态为输入、选中、禁用和错误提示准备明确样式。
- 内容和布局一起检查关注文字变长、数据为空或元素增多时的表现。
从界面创作，到团队交付
设计细节，
值得被准确理解
把评审意见放到具体页面，把尺寸、样式与状态要求交代清楚。产品、设计和研发围绕同一份文件讨论，减少来回寻找信息。
在线协作与评论
集中讨论页面中的具体问题，明确这次要改什么。
交互演示与确认
沿着核心流程查看跳转、反馈与异常状态。
标注与资源交接
结合尺寸、样式和切图补充实现所需信息。
更多屏幕，同样从任务出发
为不同场景，
找到合适的表达
除了 App、网页和后台，也可以借助模板、图标与可复用组件，探索更多界面形态。
轻量任务，清楚完成
围绕浏览、预约、下单等流程搭建页面，注意生态入口与返回逻辑。
一眼看懂，顺畅参与
把活动信息、参与条件与关键按钮排清楚，检查不同屏幕的阅读顺序。
让数据有重点
通过图表与分区组织信息，检查观看距离、数字层级和状态变化。
围绕操作与状态设计
梳理设备信息、控制动作与异常提示，用原型演示关键操作路径。
选择适合你的起点
先有画面，
再把细节做完整
已有设计方向就从画布开始；需要尝试不同方案，可以先用 AI 起稿；需要验证操作流程，则进入原型设计。
从界面画布开始
安排页面结构、制作组件、调整文字与样式。
开始UI设计 ↗用AI探索初稿
描述页面和内容要求，再根据自己的任务继续修改。
了解AI生成设计稿 ↗把操作接成原型
组织页面跳转、反馈和异常路径，交给团队体验。
制作交互原型 ↗开始前，了解这些
关于UI界面设计
UI界面设计和原型设计有什么区别？
UI界面设计关注页面布局、视觉层级和组件样式；原型设计更侧重页面之间的操作流程与交互反馈。你可以先设计界面，再把核心操作连接成可演示的原型。
App、网页和后台界面，可以使用同一套组件吗？
颜色、文字和部分基础组件可以统一，但导航、信息密度与操作方式需要按屏幕和用户任务调整。移动端要检查触控与阅读，后台则更关注数据查找、比较和批量操作。
没有现成设计稿，可以从哪里开始？
先列出页面要展示的信息和主要操作，用组件或模板搭出第一版；也可以通过AI生成初稿，再调整内容、样式和流程。优先把一个核心任务的页面做完整，再扩展其他功能。
完成界面后，怎么交给研发？
分享设计或原型文件，结合标注、样式与切图说明布局细节，同时补充字段规则、操作反馈和异常状态。界面中的真实数据、业务接口与权限逻辑需要在开发阶段实现。
在线设计需要安装软件吗？如何查看收费？
可以通过浏览器进入墨刀工作区。账号的功能、协作和资源权益与当前方案有关，可先查看墨刀定价页，再选择适合个人或团队的使用方式。
边做，边补齐方法
UI设计与界面制作指南
01
2026年UI设计软件盘点：5款工具的功能与适用场景
比较常见工具的界面创作、协作与交付方式，按任务选择。
02APP界面设计模板怎么用？选择、改造与评审方法
从模板选择到内容替换，整理页面并组织评审。
03APP界面设计怎么做？6种常见布局与选择方法
比较常见布局，按内容量和用户任务选择页面结构。
04AI界面设计工具怎么选？11款工具按UI产出类型对比
区分AI界面、原型等产出，确认生成之后如何继续修改。
05UI设计是什么？工作内容、设计流程、规范与工具
理解UI设计的工作、流程、组件规范与交付内容。
06UI设计工具链怎么搭？10款工具覆盖线框、原型、交互与网页上线
按线框、原型和交付阶段梳理工具组合与交接方式。