手机
当前位置:查字典教程网 >网页设计 >交互设计教程 >移动设计中应用场景的转换
移动设计中应用场景的转换
摘要:本文由@一淘UX团队所撰。作者首先叙述了一个简单的场景——“美女在家玩自拍”,一句简单的话,但对设计师来说却有深在的内涵。这句话浓缩了设计最...

本文由@一淘UX 团队所撰。作者首先叙述了一个简单的场景——“美女在家玩自拍”,一句简单的话,但对设计师来说却有深在的内涵。这句话浓缩了设计最讲究的三大策略点:谁、在哪里、干什么,也就是用户、环境和任务。

无论web、软件还是移动产品的设计,我们都逃不开这三个策略点的考虑。而我们也可以从一些案例中寻找一些考量的思路。

移动设计中应用场景的转换1

走近移动设计,你会发现这三个设计策略点的不同之处,其中区别最大的便是环境。移动的环境包括两方面:应用场景和硬件设备。到底环境有什么样的区别,会影响到最终的设计呢?本篇章主要详说其应用场景的不同,通过与web产品的对比,发现在设计上的启示点。

从下方两张图表的走势对比,开始我们走近移动设计之旅的应用场景篇。一个好的Web产品,他的点击数和点击UV是随着时间的发展,走势是慢慢上扬,如下图所示。

而移动产品却有一个很有意思的现象,每个月初点击数和点击UV走势突然上扬,峰值在月中左右,然后到月底就跌到底谷。如下方两个图的对比,猜猜这是为什么?

移动设计中应用场景的转换2

移动设计中应用场景的转换3

这个现象的答案是:流量包月。是不是遇到过这样的场景,月底的时候,收到移动发来的流量提醒信息,自己主动关闭了2G,默默等待新的一个月的开始。。。

流量

Web场景:网络稳定,使用网线或则wifi,速度快。

移动场景:网络不稳定,主要有wifi,3G,2G;随着场景的变化,各个网络之间频繁切换;2G网络用户多,速度慢,很在意流量。

设计启示:流量思考,流量心理,反馈时间,响应机制… (通过最基础的内容对比,设计师可以思考更多的启示)

流量是中国手机用户最关心问题之一,因为它是需要花钱的,特别是2G用户,对流量的看重程度极其高。移动的2G套餐:5元 30M,10元 80M,20元 200M,30元300M,50元 500M,100元 2G。其中5元和10元,20元是大部分普通用户的选择,超过包月限额1M=10.24元。

官方宣称2G的网络速度在30K/S。2G网络仍为移动互联网的主流接入方式,但占比持续下降。Andriod和ios移动产品倾向于选择高速网络接入,超过73%的用户选择3G或wifi。

移动设计中应用场景的转换4

设计启示:流量思考——估算产品占用流量

流量在移动应用场景中如此重要,那么我们在进行产品设计的时候,就需要进行流量思考,估算我们的产品会占用用户多少流量。可以说电子商务产品80%的流量来自于图片。针对图片和用户访问路径,我们就可以容易的估算出产品到底消耗了用户多少流量。

以普通电子商务搜索结果页为例(以下数据为假设,设计师请根据自己的产品估算流量):

移动设计中应用场景的转换5

搜索结果页90×90大小的图片,平均6k左右,1页20个宝贝,那就是120k,假设产品访问深度为10左右,差不多一个关键字是1M多,平均每个uv关键字2-3个,平均下来一个搜索结果页占用流量2.5M左右。

再算算从搜索结果页进入详情页,每个宝贝详情在500K,假设平均每个搜索uv打开3-4个详情页,差不多1.5M。关搜索和详情每uv每次使用一般就占用了4M。按这样的逻辑,研究用户的使用路径页面,然后全部算起来,就可以了解到移动产品到低占用了用户多少流量。

所以电子商务的移动产品,再算上用户查看首页,购物车,收藏夹……活动页面,一次算下来估计也有6M。

这相当与什么?一个5元30M包月的用户在纯2G的网络下只能访问5次,10元80M的用户可以访问15次。所以估算好用户的总流量使用情况,可以让我们的产品考虑的更成熟些,无论从技术还是从页面的表现形式方面。比如大小图模式,懒加载,预览模式,用户触动才加载。

设计启示:流量思考——对产品的影响

我们在进行聚划算H5产品设计的时候,针对搜索结果页的宝贝展示,最终采用了右边的方式。这里不仅仅是看的宝贝数量的多少和图的质量问题,最重要好包括流量的影响力。

移动设计中应用场景的转换6

还有一个特别为用户考虑流量的产品是微博客户端。你刷的不是微博,你刷的是流量。无论新浪还是腾讯微博客户端,对图片都做了分阶段处理,小图预览,点击查看大图,再点击查看原图。点击步骤多了,但相对于省流量,相信用户更愿意接受这样的方式。

移动设计中应用场景的转换7

设计启示:流量心理——图太多,费流量

事实是图太多是真的费流量,流量最大的消耗点就是图片,视频。可以感受一下,我们日常生活中,用户可以在2G网络底下看小说,但绝对会很小心谨慎开一些需要浏览多图的页面。

所以,别让产品的一个页面堆积太多的图片,特别是产品的首页,会影响用户流量的恐慌心理。让用户以后在2G网络底下,不敢于打开这样的页面。

【移动设计中应用场景的转换】相关文章:

简洁网页设计你需知的6点技巧

台湾美女聊聊设计师的鄙视链

网页设计中纹理的运用技巧

交互设计师每天是怎么工作的?

网页设计中的GRUNGE

扁平交互设计更加符合用户体验

五种移动应用导航设计总结

14个网页设计师和前端工程师服务的教学网站

设计网页页脚的15个超实用技巧

APP动效设计分为哪几种?

精品推荐
分类导航