昆仑山枣业-和田玉枣> 和田玉枣> 《牛壹周》设计过程揭秘>

《牛壹周》设计过程揭秘

江小白 和田玉枣 2020年08月01日 02:39 175 来源:昆仑山枣业

2010年7月30号,《牛壹周》在App Store上架,截止到我写这篇blog,下载量破千,排名位列中国地区免费程序TOP榜第11位,新闻类第2位。

几天前,Shawn写了篇超有爱的blog――《牛壹周》顺产记,从开发的角度跟大家分享了《牛壹周》的生产过程,比较适合程序员和开发者阅读;在这里我想写一写《牛壹周》设计过程,也许设计师和产品经理们看了会更有共鸣。

一、学习

iPad出来不久,我们便觉得这样的神器简直就是为用户体验设计而生——精致的显示,优秀的交互,简单的操作,让使用没有门槛,充满无限可能——于是我们决定进军这个陌生的领域。

学习是第一步,于是有人开始看Stanford的视频教程,有人开始安装xCode,有人开始研究HTML5,而我,则开始学习苹果4月3号出的那份官方指南《iPad Human Interface Guidelines》。
6月27号的成都UCD书友会,官方主题正好是《移动设备的交互和设计》,于是我把前一阵子的学习的心得和领悟做了份演示文稿,跟参会的书友们进行了分享和交流。

iPad用户体验设计指导性原则

iPad用户体验设计指导性原则

在这份文档里,苹果提出了几个重要的设计原则。

首先,在iPad上侧重的是内容和交互,而不是UI。

作为设计师,几乎我们本能的就会醉心于一些华丽的UI界面而忘了用户本身是来干什么的。为了让用户关注内容本身并在交互的过程中尽量受到干扰,所以 我们需要淡化程序UI,弱化界面控件、让信息更扁平化(让上下层级可以在同一界面中自如切换),限制一个视图内的任务复杂度、淡化文件管理、使用最少的模 态对话框、只有在需要时才提醒用户⋯⋯

然后,是内容形式上富有真实感。

iPad上自带的iBooks、Note以及Google Map都是很好的例子。苹果给出的解释是:程序显示和现实生活越相似,用户就越容易理解、操作并喜欢。可以使用动画进一步增强真实感觉,东纵的真实感比外观更为重要,要符合物理规律。

最后,是充分利用设备性能和特性。

iPad是今年1月27号才发布的全新设备,除了具有普通数码设备的硬件指标和性能参数之外,还具有很多诸如重力和加速度感应、多点触控、手势识别等人机交互新特性。如何把这些交互手段通过设计结合到你的作品中,会是个有趣的挑战。

总之,上帝的归上帝,凯撒的归凯撒。

二、设计

牛博网阅读器的想法,6月初就提出来了,但要做成什么样子,大家脑子里还是一片混沌。

6月12号,竞总出了份iPad牛博网阅读器低保真模型,有横板和竖版两种模式。它看起来有些象网页,又有些象RSS阅读器,还有些象iPad上的 Mail程序——大家都是菜鸟,看到这样的设计,也无法判断这样的设计到底是好,还是坏。后来因为其他项目上的事情一忙,这份原型也就沉没了。

《牛壹周》设计过程揭秘

竞总的设计原型概览

6月底的时候,我开始着手设计。因为本身就是设计师,视效上没有障碍,涉及的页面也不是很多,所以一开始就在PS下面画图了。

网站设计多了,一上来还是传统思路在作祟,结果才设计了个开头就茫然了:心想如果设计成这个样子,还不如人家直接在iPad上用Safari浏览器打开牛博网来看呢⋯⋯

《牛壹周》设计过程揭秘

用做网站的思路来设计iPad应用完全是死路一条

好吧,摒弃网站思路,做减法后我设计了目录页和内文页,设想应该有按文章索引、按人物索引、RSS订阅和设置这些功能⋯⋯显然,这是个平庸的设计,但其实没关系,很多东西都是这样,刚开始的时候很糗,但至少有了讨论的基础。

目录页

第一版目录页

内文页

第一版内文页

团队的Daily Meeting上,大家给了很多好的建议。S拿出一本《南方人物周刊》,说其实应该做成这个样子——首先,它应该是一本杂志,阅读习惯上应该象在阅读一本 书而不是浏览一个网站;然后,它应该是一本期刊,时效性比书本高,但比网站和blog低;内容质量和阅读体验和书相当,比网站有更多的个性,更少的噪音。


上一篇:新疆多地县级干部直播带货为当地产品推销(图)



下一篇:没有了