百度文库 - 让每个人平等地提升自我
有些时候排序会遇到困难,需要借助界面语言才能准确反应表达顺序。这正是界面设计的价值,它可以胜任一些单纯适用文字表达表达不好的情况。下面的黄钻续费案例中也许你就会遇到类似的问题。遇到这种问题时,记录下排序遇到的问题即可。在翻译过程中问题可能就解决掉了。 第三步. 翻译:
与之前界面对比:
● 开头几句信息顺序需要整理,使上下文关系更清晰。 ● 对过程的描述可简化。 ● “说明”应更结构化。
这里所说的“与对比界面之前”只是因为之前的需求文档中有相对具象的页面原型,而这并不意味着这里的工作是“优化页面原型”。需求的传达总会有一定的形式,也许是简单的页面原型,也许是一份需求文档。甚至可以更简单。有时相对具象化的信息记录或之前的页面反而会是干扰设计者以明确的思路来设计,尤其需要小心。
18
百度文库 - 让每个人平等地提升自我
我们有了一种成型的方法,但这并不意味着我们设计出的页面就只有一个样子了。实际上不同的设计者使用这个方法会设计出不同的页面。下面这是另外一位设计师给出的思路,或许这是更好的方案:
1. 您选择了回邮方式办卡,概括解释这个办卡方式。 2. 第一步. 下载、填写申请表并回邮给中信 3. 第二步…………………….. 4. 第四步……………………..
这样的信息概括和排序页面表现将是什么样子?你可以自己试着画画~~ 练习:QQ空间黄钻催费页面
说明:
黄钻贵族是QQ空间中的VIP用户,黄钻贵族用户可以免费适用空间中的装扮,另外还可以享受到日志信纸、超大容量相册等诸多特权。
当用户的黄钻贵族身份即将到期的时候,从QQ聊天主面板上的“我的钱包”提示:“钱包”闪动,点击后用一个490*300px的小窗口告知用户续费的详情。 左侧图片在实际页面中是一个flash动画,若干张图片切换,显示黄钻用户可以装扮出的更好的空间效果。
18
百度文库 - 让每个人平等地提升自我
右侧的续费方式希望在所有的续费方式中选择出两、三种比较常用的方式,直接显示出来(就是现在页面上的“家庭、网吧”两种方式),方便用户。同时提供“支付中心”链接(),让用户可以在全部续费方式中选择。
请使用上面介绍的自然语言法重新设计这个界面,让信息表达的更高效、清晰、明确。 参考方案 需要表达的信息:
● 某某某,您的黄钻要过期了。 ● 黄钻贵族很棒滴~~
● 现在续费黄钻还有额外的优惠。 ● 续费方式… 更好的信息:
● 某某某,您的黄钻要过期了。
● 您要是不再是黄钻了,就有XXXXX损失啦~~ ● 现在续费黄钻还有额外的优惠。 ● 续费方式… 总结“自然语言法”
自然语言法的基本思路是把界面表达转化为自然的人与人交流。人与人的交流是我们每天都会发生的,相对更容易,这个技能也更容易提高。
这里涉及到的两个例子都是比较偏向于信息表达的,对于操作较多的界面,这个方法仍旧适用。
方法二. 结构图法
这个方法的思路:抛开页面细节只考虑信息的组织形式。抛开页面细节,是的,就是上面讨论的那些具体的页面细节,只考虑信息的整体构架,而页面的细节留在确定了信息构架之后,用自然语言法来解决。 信息构架的原则:
18
百度文库 - 让每个人平等地提升自我
1. 一个页面一个主要内容。 2. 个人信息&公共信息。
3. 网页基本内容有两种:列表和文档 4. 更少的信息更好
5. 一个用户自己生成内容的document页,有两个状态:浏览状态&编辑状态。 6. 信息树应该尽量窄而浅,并且尽量保持平衡。 7. 与现实生活经验相符
● 页面在网站中需要有一个固定的位置。 ● 同等级的内容应表现成并列的样子。 …… 信息构架的常见模型: 1. 列表+详情页+列表聚合页
2. Wizard模式。第一步->第二步->第三步… 3. 主页+若干个“临时”页面。例如:google帐户
18
百度文库 - 让每个人平等地提升自我
具体操作
第一步. 明确描述全部内容。总结归纳产品所需要表达的所有信息。 第二步. 画树状图。
第三步. 用纸画各页草图。草图中需要包含的关键元素:页面标题、导航、重要的链接和按钮。
第四步. 模拟演示网页操作行为。 实例:黄钻等级
18