线框图是网站设计方案中的重要组成部分,可确定一个建立在基本概念结构上的架构。在网站设计过程中完成线框图后,为了得到客户的认可,我们最后还需要对提交的页面模型进行整体的润色。高保真的页面模型,往往会更具说服力。本节我们将具体教您如何在页面模型中应用自定义的配色方案;设计导航栏和hover效果;在输入框的位置添加提示性文字,以便于前端开发者进行具体功能的设计,最终实现我们预期的设计效果;替换掉之前粗糙线框图中的文本;在图片占位符处添加客户提供的图片,并在最后再进行整体的检查与优化,使线框图更加逼真。通过在Photoshop中进行这一系列操作后,高保真的页面模型效果就出来了,自然让前端开发者心领神会,让客户称赞不已。快来一起学习吧!
- 目录
- 组建一个Web页面模型
- 01 应用自定义配色方案 | 02 设计导航栏 | 03 设计输入框 | 04 替换文本内容 | 05 添加图片 | 06 页面模型的最后优化