第五节网页线框图设计及页面效果图制作.doc

第五节 网页线框图设计及页面效果图制作一、线框图的概念及作用 线框图——又叫原型、框架图。它是网站设计方案中的重要组成部分，可确定一个建立在基本概念结构上的架构。是网站策划师、网络产品经理的最后交付文档，虽然有时它很粗糙，但可以呈现出最直观有效的设计效果。指出了视觉设计应该前进的方向。线框图通过安排和选择界面元素来整合界面设计；通过识别和定义核心导航系统来整合导航设计；通过放置和排列信息组成部分的优先级来整合信息设计。 一个页面的信息架构代表的是内容的层次结构，而线框图则是承载页面内容的立体框架。根据需要，线框图可能是一个独立页面或一整套页面序列：当针对中小型项目时，可能只需要首页以及关键页面的设计；针对复杂项目和大规模的团队协作，则需要一系列相互关联的线框图，并且包含交互设计部分，比如我们正在做的事情。 线框图的细节要逼真到何种程度，要根据执行团队的实际情况来决定。一般来说，线框图的细节越逼真，执行越流畅，但是给视觉设计师的发挥空间越小；相反，线框图越是粗略，对团队配合的要求越高，视觉设计师发挥的空间越大。就我们来说，我觉得还是尽量做细的好，这样一来将更多问题解决在设计前期，二来也可以减少设计师自主发挥时引起的又一轮论证，延长工期。 图0305-1 依照与最终产品的接近程度，线框图分为低保真和高保真两类。如上图0305-1所示（左：低保真，右：高保真） 低保真原型（线框图）通