线框和实体模型都是整个设计过程的基本元素，为网站或应用程序的外观和感觉奠定了基础，代表了网站或应用程序的项目目标和愿景。模型是产品的视觉表现，而线框是产品的蓝图，它勾勒出产品的结构，而没有真实产品的所有细节。下面是两个如何融入网页设计过程，以及它们之间的区别。

什么是线框(wireframe)？

线框只不过是你的网站或移动应用的框架，它为你的项目指明了方向。它是最终用户界面的示意图，概述了产品的功能、特性和内容。线框是非常重要的，如果不是必要的。有时需要为客户开发线框，有时不需要。线框基本上是一个低保真度的网页设计原型，关注总体布局、内容层次结构和功能。线框可以由线、框和纯文本组成，也可以使用特定软件（如Microsoft Visio）进行电子绘制。线框是一个真正的结构文件没有所有的视觉混乱意味着没有颜色，纹理，图像或动画。线框的一大优点是，可以快速创建和修改线框，而无需额外的**和口哨声，最终形成最终的设计。

什么是实体模型(mockup)？

模型是视觉设计的静态呈现，将用于产品展示和其他目的。基于线框的结构，实体模型是从基本布局向上的一个步骤，旨在开发具有非交互视觉元素的初步设计。因此，实体模型是一种中等逼真度的设计表现，包括字体、文本、颜色、图像、徽标和其他视觉元素，这些元素将进一步塑造线框。模型最能代表网站或应用程序的项目目标和愿景。使用站点地图作为基础，线框作为指南，您可以创建一个独特的、引人注目的、包含站点所有元素的模型。实体模型是为了在您实际开始构建网页之前，为您的客户机提供最终产品的外观和功能的可视化表示。然后，模型成为最终的蓝图，设计师和客户在交流项目细节时都可以参考。

实体模型和线框的区别

实体模型和线框的含义

–线框和实体模型都是最终产品以及其外观和功能的静态表示。这里的Static意味着它们都是以一种不允许用户像最终产品那样与元素交互的格式呈现的。线框是一个低保真度的网页设计原型，主要关注总体布局、内容层次结构和功能，为您的项目提供方向。另一方面，实体模型是线框阶段的一个进步，是设计的一个中等逼真度的表现，它给出了网站或应用程序完成后的基本外观。

结构

–线框是网站的树形图或流程图，概述了网站的功能、特点和内容。这是一个真正的结构文件没有所有的视觉混乱意味着没有颜色，纹理，图像或动画。线框可以是由线条、方框和纯文本组成的手绘，也可以是使用特定软件（如Microsoft Visio）创建的电子图形。另一方面，实体模型是实际设计的静态呈现，包括字体、文本、颜色、图像、徽标和其他视觉元素，这些元素将进一步塑造线框。

目标

–简单地说，线框是设计界面的二维图形，主要关注总体布局、内容层次结构和功能。它用于定义和规划页面或屏幕上的信息层次结构，或者换句话说，页面中的项目应该如何组织，哪些内容放在哪里，以及有哪些功能可用。模型是用于产品展示或其他目的的全尺寸设计模型。它是一种展示你的设计在现实世界中的样子的方法。实物模型用于各种视觉设计。

工具

–线框通常被称为网页设计布局的框架蓝图或轮廓，它表示没有所有完成元素的每个页面的基本布局。MicrosoftVisio和OmniGraffle是专门用于线框的最通用的工具，而一些非设计师使用PowerPoint或Keynote来准备线框。然而，最常用的线框工具是Bala**iq、Axure、UXPin、异想天开等等。专门用于移动线框的工具包括惊奇漫画和弗林托。实体模型也有同样的用途，所以大多数线框工具也可以用来创建实体模型，但是还有其他工具，如Bala**iq、Mockplus、Mockflow、Mockingbird等。

实体模型与线框：比较图

总结 - 实体模型(of mockup) vs. 线框(wireframe)

简而言之，线框是最容易创建的实体模型形式，它只不过是纯文本、线、框和简单的对象，用于显示设计的基本布局。线框最好的部分是，它们很容易用铅笔和纸等基本工具来创建，而且不需要任何艺术技巧。实体模型可以有许多不同的形式，它们的基本目的是相同的——展示设计完成后的样子。模型是最终产品的复制品，包括从艺术品到屏幕设计的一切，而线框缺乏基本的视觉元素。