一个项目的诞生,一般要经历脑海构思绘制设计最终再落地在这个过程中,往往会在落地实践之前进行样机制作。俗话说:“样机用的好,过稿过的早”,样机设计是一个产品或网站最终设计的生动、静态和视觉表现,它为用户提供了一个模拟现实的方式,让他们知道最终产品在投放市场之前是什么样的。本篇文章,我们将为大家展开介绍什么是样机,并探索与设计过程相关的其他类似的设计形式。

1.  样机是什么?

样机是最终产品的中等保真度的视觉表现。它们能帮助利益相关者提前预知最终产品设计的美观。产品的排版、内容和配色方案是否可行,都能在样机设计中得到一定反馈。由于样机是一个中等保真度的模型设计,所以不支持点击等交互动作来引导操作。样机通常是将设计画面以模拟现实的方式展示于平面或3D设计中,然后设计师借用样机设计,向客户解释各项功能,以获得项目落地批准。客户可以更直观的看到产品外观的最终模拟效果,并在批准之前提出修改建议。

苹果设备样机模板 - 免费下载

苹果设备样机模板 - 免费下载

2.  线框、样机和原型的区别

线框、原型和样机,是一个产品设计不同阶段的设计呈现形式,我们将对这三种术语进行比较,以便更好地理解样机设计的含义。

2.1 线框图

线框图就像一个建筑的蓝图,它是一个大概的方案和方向。线框有助于设计师设计出低保真度的实体模型,它没有具体的内容,但有产品的映射。它不具备原型的可点击功能,也没有样机模型的视觉内容,但线框是实体模型设计的指导结构。Pixso资源色回去内置了大量线框图设计模板素材,涵盖网站、移动APP等,注册Pixso账号,即可免费在线编辑下载线框图

线框图资源专区 - 免费下载

线框图资源专区 - 免费下载

1.2 样机

样机是静态的中保真阶段,是设计落地的中间阶段。样机像是建筑中的沙盘模型,是产品外观的模拟呈现。由于它们的视觉特性,样机模型比原型图创建起来要快得多,所以是很好的反馈收集渠道。你可以借助数字化设计工具Pixso完成样机制作,也可以直接一键复制Pixso资源社区的样机模板,在线编辑创作。Pixso资源社区样机模板丰富,包含手机、笔记本电脑、手表等,注册Pixso账号,即可一键免费享用。

样机图资源专区-免费下载

样机图资源专区-免费下载

1.3 原型

原型是产品的高保真、交互式可视化图像内容,主要用在用户测试阶段。原型图相当于建筑中的样板房,模拟了用户与界面的交互,为客户提供最终的数字化展现。原型图允许用户与按钮进行交互,并在页面中导航。原型图一旦最终确定下来,就可以进入了开发阶段。Pixso是一款在线协作原型设计工具,具备一站式原型、设计、交付能力,设计师无需在工具之间切换,需求梳理、UI设计、原型设计、收集反馈、原型交付一个工具全搞定。

 原型

3.  如何制作样机?

3.1 填充完整的内容

将设计好的UI界面填充上合适图片、文本内容。你可以放置虚拟图像和占位符文本,以向客户提供视觉概念。一旦他们认可了视觉布局,你就可以在原型阶段开始填充具体图像和文本了推荐使用Pixso中的智能填充插件,快速填充文本、随机姓名、地址、日期等信,省去大量编辑文本的时间在Pixso工作台调用安装好的“智能填充”插件,即可进行高效的文本填充。

填充完整的内容

3.2 选择高品种样机模型

样机是设计的一部分,你选择的样机模型必须细节丰富,优质的样机才能更好的将你的产品设计质感发挥极致。主要表现为:对比实体机模型,光感要强,反射细节要多等等。尽量选择带有不同角度的呈现,其中较为正面的角度呈现是不可缺少的。

3.3 干净的背景

带有场景的样机素材,能带来更为加分的视觉效果。要注意的是,背景一定要干净,这样才能更突出你的设计内容。例如这组iPhone 12样机模型,自带干净清爽的背景,搭配精致的样机,突出了画面重点的同时,也营造出了舒适干净的空间感注册Pixso账号,即可一键获取通过iPhone样机模板,快速更替手机画面。

干净的背景

还可以选用下图这种暗色主题的页面展示效果。采用暗色主题,搭配简单的文字排版,给人时尚个性的观感,高级感十足。

暗色主题的页面展示效果

iPhone 14 pro样机-免费UI设计素材

3.4 多场景展示

许多产品设计并不只是针对手机端,还需要适配各种不同的设备。这时候,你需要充分考虑利益相关者的需求,呈现多种不同场景的视觉效果。Pixso资源社区的这组样机素材,提供了5个苹果样机模板,可以帮助你以美观、现代的方式全场景展示你的设计项目。内附样机素材使用说明,只需在Pixso中一键复用,将样机画面替换为你需要展示的设计内容,即可直观展示你的设计。

苹果样机模板-免费UI设计素材

苹果样机模板-免费UI设计素材

APP Store也是常用到的场景,Pixso为你准备了App Store 屏幕截图样机模板。包含多种设备的App Store 屏幕截图样机模板,点击链接,即可在Pixso一键复用App Store 屏幕截图样机模板。

App Store 屏幕截图样机模板

以上就是关于样机的全部介绍啦!样机是UI设计的点睛之笔,让设计画面更加实体化,以更有质感的方式对外进行展示。Pixso资源社区拥有丰富多样的样机模型,不论是样式还是画面,都紧跟当下流行趋势。除了文章中展示的这些样机等模板,Pixso资源社区还有网页浏览器样机、谷歌样机等不同形式的样机模型。Pixso除了可以用作日常素材资源库,还可以用于制作优质精美的UI界面设计,助力团队制作出优质的样机设计,一站式完成原型、设计、交互与交付,为数字化团队协作提效!现在前往 Pixso 官网注册账号,可以享受到Pixso会员的所有权益:无限文件数量、无协作者人数限制、无限云存储空间等等,快来尝试一下吧~

Pixso