样机 Mockup 使用手册：什么时候该上设备图，什么时候该直接展示原稿

样机是最容易被误用的设计资源之一。它能快速提升完成度，但如果每一张都上设备、每一页都做透视，反而会让作品缺乏重点，甚至把真正需要展示的界面细节全部遮掉。

尤其在设计资源网站的语境下，样机教程更应该强调“怎么判断是否该用”，而不是一味推荐模板。因为对设计师来说，样机真正解决的是展示策略，而不是视觉补救。

为什么这类设计文章值得单独整理

资源网站的文章如果只停留在“列清单”，用户看完很快就会忘。真正能留下来的内容，应该帮助读者把资源与真实项目、真实页面和真实协作场景连接起来。

因此本篇写法会刻意把素材选择、页面结构和使用边界放在一起讲，让读者在浏览资源时就能同时建立方法感，而不是只记住几个截图。

先判断你的目标：是讲使用场景，还是讲设计细节

如果你想让用户快速理解产品使用环境，例如手机、电商包装、海报上墙、杂志封面、桌面端系统界面等，样机能很好地提供场景感；但如果你要展示排版、按钮细节、间距系统或字体节奏，直接上原稿通常更有效。

很多作品之所以显得“看着精致但说服力不足”，就是因为该展示原稿细节的时候还在用样机遮挡，导致评审者根本看不到关键设计点。

设备样机和原稿最好交替出现

一个成熟的展示节奏通常是：先用一张样机建立场景感，再跟一到两张干净的原稿页面解释设计细节，最后再用一张更完整的组合样机做收束。这样既有氛围，也不会牺牲信息透明度。

对于 App、SaaS 后台和营销网站来说，这种“场景图 + 原稿细节 + 组合图”的节奏，几乎总是比一整页都放样机更有效。

样机越真实，越要控制背景噪音

现在很多高质量样机会带有复杂灯光、桌面道具和真实拍摄纹理，它们确实能提升质感，但也会抢走界面的注意力。因此在使用时，背景越复杂，界面本身越要保持简洁。

如果你的设计本身色彩已经很强，样机背景最好尽量克制；反过来，如果设计较为中性，可以让样机背景承担更多氛围任务。样机不是主角，作品才是。

常见误区

• 每一页都放透视设备图。
• 用复杂背景掩盖界面细节不足。
• 只有样机没有原稿。
• 不同场景样机混搭导致作品语气漂移。

落地检查清单

1. 先判断展示目标。
2. 样机图与原稿图交替排布。
3. 背景复杂度服从作品信息量。
4. 同一项目的样机语气保持一致。
5. 关键细节至少有一张原稿直出图。

延伸阅读资源

如果你准备把这篇方法真正落地，建议顺手把下面几组资源一起加入工作库。它们能帮你更快把文章里的原则转成页面结果。

免费设备类型样机：精选 38 种让你惊艳的设计利器！样机

800+ 精选着陆页设计灵感-生产力工具网页 UI

80+ 款真实手机样机，让你的设计更有实感，专业呈现产品样机

样机的作用，是帮作品建立可信的使用情境，而不是替作品本身解决问题。什么时候该收、什么时候该放，是展示能力的一部分。