WireFrame.cc、在线框图绘制工具是非常简单主义的框图绘制应用，不仅容易使用，而且界面也很漂亮。操作简单直观，输出物也很有魅力。

　　WireFrame.cc与Mockflow等在线原型工具相似，但Wireframe.cc更简洁，控制也基本简单，支持网页和手机纵横版三种模板。

　　1.线框图的定义。

　　线框图是WEB页面的素描，显示了导航系统的框架，或者每个页面内容的基本信息。线框图可以作为项目成员，

　　客户分析讨论的视觉工具可以从页面设计的需求、概念到框架图的过程中使用。

　　线框图的主要功能之一是定义页面模板的布局。

　　2、什么是线框图?

　　线框图是矩形、菱形、线条等一系列基本图形，设计页面基本框架、定义页面包含的内容、各内容的布局

　　这些内容可以是标志、导航、目录菜单、统一的顶部、底部、品牌、内容等。

　　3、线框图为什么有效?

　　只需要最小的技能就可以创建页面原型。允许快速反复测试设计。着重于网站是如何工作和展示的，而不是视觉美感，避免在开发初期落入细节的误区。项目初期可交给客户审查，减少艺术设计阶段的重复工作量。

　　4、线框图处理什么?

　　当项目组提交站设计原型时，用户、客户和设计者倾向于可视化原型的具体要素，忽视原型页面。

　　结构和布局等。线框图试图分离网站的视觉感觉、工作和阅读形式，避免干扰美丽要素的页框分析。

　　线框图应包含哪些元素：

　　a、关键页面元素及其位置：头部、底部、导航、内容对象、品牌元素、产品列表等。

　　b、分组：边栏、导航栏、内容区域等。

　　c、标签：页面标题、导航链接、内容对象头部等。

　　d、标签和伪文字：在线框图中放置示范性标签和文字。

　　5.那些页面必须制作线框图

　　简单来说：首页和模板。

　　详细的说法是，需要客户认可的页面和主页完全不同的布局和内容。

　　以下页面应设置线框图(包括但不限于此列):

　　首页、各子网站或者栏目展示页、内容页模板、讨论页、搜索结果页、产品列表页、产品详情页、结账流程及其他流程页、我的账号首页和模板页、404错误页。

　　6、线框图的设计细节。

　　线框图的设计细节取决于项目处于那个阶段。

　　线框图有抽象视图、低保真度、高保真度三个等级

　　抽象视图：只展示基本的页面元素和功能名称，不涉及内容和功能细节，不涉及页面排版。

　　低保真度：只列出每个页面所需的头部、底部、导航类型、内容对象等，涉及到基本的排版布局。

　　高保真度：与最终设计非常接近，包括导航要素的尺寸和位置、标签、标题、清晰明确的布局。

　　7、标签和文字展示。

　　目前有两种观点。一个是建议使用伪文字。因为读者不会受到内容的干扰。另一个是在线框图中反映代表性的内容，捕捉长标签和动态文字引起的问题，更接近实际使用。

　　8.你需要颜色吗?

　　在线框图中，颜色应保守使用，原因简单，视线容易被有颜色的要素吸引，影响整体布局逻辑的理解。

　　一般来说，不使用颜色，读者不是页面的设计美感，而是重点考虑页面的设计逻辑。因此，一般线框图最好是黑色、灰色和白色。