子页效果图设计

我们本着一致性的原则来设计各个子页面,并注意应用有破有立的原则,力求在统一中求变化。使用Photoshop设计效果图。在网站建设的页面设计上将首页的空白变化为每页的栏目主题诉求,通过时尚的模特、前卫的造型、活力十足的文字来突出网页的主题。

框架体系超越常规

除了能有效地加快迭代,产生易用的设计之外,在网站建设过程中,框架体系还能帮助我们更深刻地理解现有标准背后的逻辑依据。通过这种“解剖镜”,设计师可以反向追溯影响当今各种设计决定的最初逻辑原理,然后将自己的理解转化为准则,应用到更加新颖的设计上。

分解工作量

需要提到的是,重用带来的好处并不是无偿的。识别可重用的元素需要花费时间和精力,为它们备案、存档也颇为耗时,而且保持资源库的更新也是一项长期而且劳心费力的任务。

但如果把它们分为模式、组件和框架体系三位一体的形式,事情就好办多了。因为这样一来,我们就能让设计师和开发人员对工作进行分配。

什么是模式资源库

在准备使用模式时,许多开发团队都会偏向这些现成的、公用的模式资源库。然而,尽管这些资源库的资料通常都很齐全,而且免费,但它们却无法说明项目中特定的技术限制和业务需求。因此对于具体的项目来说,公用模式库的用处可能并不大。最有用的模式库应该重点关注项目特定的规范和需求。
模式资源库就是模式文档经过整理、分类后的集合,通常在网上或者企业内部进行公开。

以下是一些公用的模式资源库。

*雅虎设计模式库:http://developer.yahoo.com/ypattems;

交互设计框架体系

在互联网上可能存在着数百万个设计模式,它们每天都在被人使用其中一些模式很流行。就此而言,它们似乎就是所谓的界面模块的理想“后备”,但其实模式仍然存在着一些无法摆脱的局限。

设计模式能够解决那些范围较小的具体问题(这也正是我们期待的结果),但是我们无法从中得知这些问题之间是否有联系、是否会顾此失彼。尽管在一般的模式描述文档中有一个上下文情境项,但它也只是讨论了模式能在何处适用,其中既没有提到该模式会如何影响整个应用程序,也没有提到它和系统其余部分的联系。而在必备条件项中,也只是列出了与该模式密切相关的其他模 式,并没有揭示其表面下的深层原因。

交互设计之框架体系的特质

著名的信息架构师 Liz Danzico(Happy Cog Studios, Bobulate.com)曾经做过一次题为“The Framework Age”(框架时代)的演讲。演讲的主题是Web设计师们已经抛弃了严格支持剧本化的用户行为的设计,转而开始为之设计一种弹性的平台。Liz的演讲重点关注于一种不断变化的网页范型,但在演讲的过程中,她提到了用户定义框架的3个特质。

为了说明这些特质,Liz谈到了古典音乐和莫达尔爵士乐之间的区别。

她解释到,在古典音乐中,每一个音符都是既定的。作曲家煞费苦心地为 每一件乐器谱写乐曲的每一个小节中的每一个音符。要想成为大师级的乐手,技巧、风度和个人特色当然都很重要,但从根本上来说,任何乐手都得有能力和自制力来演奏出那些音符。每一次都必须完美、准确。在古典音乐中,只要有一个音符出现错误,那就是失败。

交互设计框架之自然环境下的框架

一个单独的框架体系本身并没有太多价值。即使是G00gle的搜索框架也不例外,它是该公司核心任务流程的主导框架,但仍然需要与其他元素协同合作,例如为访问其网站的用户提供导向,鼓励他们使用更多的Google服务,以及登录并获得之前储存的信息。只有把各个框架体系编织在一起,才能构成一个完整的网站或应用——形成一次完整的体验。
Robert曾在Jared的UIE Web App Summit 举办过一次有关框架体系的讲座,有人提出了一个有趣的问题:框架体系是否会让交互设计产生同一化, 最后让交互设计师们丢掉饭碗?

目录框架

当我们在目录中进行挑选的时候,通常都会遵循同样的3个步骤。首先,筛选出所有的顶级选择;然后,挑选出其中之一;最后,查看该目标以验证它 就是我们想要的那一个。
当走进一家陌生的零售店时,每个人都会四处张望,判断自己想购买的商品的大概位置。乳酪酱?可能在零食区,炸薯条的旁边。牛排?应该在肉制品柜台后面。芦笋?蔬菜水果区。

那么在你寻找自己最喜欢的牌子的乳酪酱时,沿途是否有其他商品吸引了你的注意?当然了,很多东西都会在你预料之中,例如薯条、曲奇、梳打饼干, 但是货架最远处那些花花绿绿的零食,你是否也能够发现呢?比如,你的小孩一定会爱上那种新出品的巧克力包裹的全麦动物饼干。

简短的条目描述

在图片无法胜任时,简短的描述可以为该条目提供概括性的文字信息。比如,在电子商务网站中,如果某个产品的图片不能帮助用户判断商品之间的差异时,就会加上一段简短的条目描述。如果你要买帽子,不同帽子的图片会很有帮助;但如果是买数码相机,看上去都差不多,图片就没什么帮助了,因此 需要一段简短的条目描述来帮助用户进行区分。

如果陈列页中缺少用户需要的信息,他们将不得不像踩着弹簧高跷那样。“弹簧高跷”是一种小孩们玩的弹力玩具,这个词形容的是用户在网站各层级之间跳来跳去,希望自己最终能遇见想要的内容。

设计框架的引导链接

在2001年进行的另一项研究中,UIE思考的是如何让用户发现第一次访问网站时还不知道的有价值的内容。应对大型网站时这个问题显得尤其重要,因为这些网站会不时地添加新内容。电子商务网站会添加新产品,产品支持网站会添加产品的使用贴士,内部网会添加新信息来提高雇员工作的效率。用户如何才能发现这些新的内容呢?

UIE的研究显示,如果用户使用首页中的分类链接,找到新增内容的可能性要比直接在网站中搜索高出两倍。为了更深刻地理解出现这种现象的原因,UIE的研究员们对数据进行了深人的挖掘。

设计标准

回到UIE在2002年进行的那次调查(从中得到的经验在今天也非常适用, 而且最近多次研究也证明了这一点),被调査各网站间最主要的不同就在于分类页面。在13个被调査的网站中,UIE的研究员发现了5种不同的分类页设计。其中大多数网站都把分类列在屏幕左边的导航面板中,同时在页面的主要内容区域列出该分类下的所有条目。不过一些网站则表现得更为明智。

Gap 和 Victoria’s Secret 都使用了菜单而不是页面来表现顶级分类。

Old Navy 把商店各部门和陈列的产品混合到一起, 其导航有时包含陈列页,有时则包含具体产品。