腾讯QQ酒店返现 APP设计回顾

标签: 腾讯ecd Apple App UI 元素 QQ酒店 Metro | 发表时间:2013-03-07 16:59 | 作者:kingtent
出处:http://www.uisdc.com
QQ酒店返现2.0设计回顾
项目背景

当你使用弹性社交网络认识了怦然心动的某人,立即需要一个“做案现场”的时 候 ;当你临时出差到一座陌生的城市,一下飞机就为订酒店而烦恼的时候,你可能就要感谢那些“开房 App”了,它们可以根据地理位置显示出离你最近的酒店的实时房源,然后轻松点几下手机屏幕,问题就得到了解决—–这是《创业家》杂志给酒店预定应用描绘 的使用场景。我们的“开房 App”已经在Android平台跑了一段时间,相信已经是不少用户的“做案帮凶”了,产品经理又找上我们,谋划着怎么让这个做案工具帮到更多的人这次, 我们从ios开始……

前期准备
分析

2011年开始,“开房 App”就如雨后春笋,争着冒尖了,OTA、酒店集团、单体酒店、一些专注APP的创业型公司都有这类应用产出,我们想要做个好帮凶,面临的挑战还是很 大,如何让我们的产品在众多同类应用中脱颖而出?如何让我们的应用更具粘性?在做足功能的同时,还有哪些创新的点子?

提炼

通过对V1.x系列版本的总结及对竞品、用户使用场景的分析,我们提炼出本次改版的几个关键点:

情感化设计

记得有人用“被唤醒的记忆”来概括拟物的设计理念,这个概括用在对真实事物 的外观和特性模仿都很强的APP上很贴切,比如便应用,外观的操作都可以做的很逼真,酒店预定不像这类应用有那么直观的特性可以模仿,也许做不到“唤醒的 记忆”,至少可以用一些拟物的设计拉近和用户的距离吧,也可让APP更有特色。

视觉推导

色彩搭配,直奔主题,寻找与酒店相关的配色:

确定配色之后,继续寻找一些酒店的元素,看怎么让我们的app有更强的酒店属性

视觉输出

经过一段痛苦的设计稿pk过程(此处略去xx字),我们确定了改版的风格, 打开APP,跳过启动画面后就是查找酒店的表单,表单的边框模拟了酒店房价牌子的样式,默认定位了当前位置,可以不用其它操作直接按搜索查找附近的酒店, 返现账户、个人中心、设置这些不是预定流程上主要的操作,被隐藏在页面下方,需要时再向上拉起。

进入搜索后,如果没有联网,自动启用离线模式,为了让搜索结果首屏就有更大的展示空间,筛选及模式切换类操作都被收纳在页面上方,结果列表有无图模式可选,户外使用时更快更省流量;为了方便定位酒店位置,地图模式也是不可少的。

其它细节
Icon设计

ICON设计开始,找元素啊找元素,找了一些酒店相关的素材:

一些飞机稿:

这里要回顾下QQ酒店返现的几个特点:1.酒店资源丰富,全国超过 30000家酒店,覆盖700多个城市;2.返现高达房费的50%,可以直接支付、提现、充话费;3.无房、差价赔付,7×24小时客服;4.离线模式、 便捷的当前位置查找。 icon摆上app store后,就是一个大招牌,最好的设计方式是从特点里面去提炼,做到icon能体现出app的主要特色。几番周折,还是拟物,最后定稿的icon是一 个大枕头,上面放一个返现的标签,很直白的表达方式,酒店、返现都体现了,枕头还有个舒适可靠的寓意,不多说,看图:

结语

关于简洁的metro风格和拟物化风格孰优孰劣讨论不少,酒店返现的前一版 本是简洁风格的,我们的改版初期也在这个问题上纠结了一下,回头想想,两个风格并没有绝对的好与坏,从产品本身出发做够了分析推导后,适用什么风格自然就 清晰了,合适的才是最好的。对设计师来说,多偿试不同风格更不是什么坏事。

腾讯ecd原文: http://ecd.tencent.com/qq-hotel.html

优设哥向您推荐:

用PS设计APP过程中改进IOS设计流程的30个密诀

腾讯CDC:活动专题页设计心得

腾讯ecd招聘

经典推荐:Apple文案的学问

创意生活节!小清新的方块设计
无觅

相关 [腾讯 qq 酒店] 推荐:

腾讯QQ酒店返现 APP设计回顾

- - 优设(UISDC)
当你使用弹性社交网络认识了怦然心动的某人,立即需要一个“做案现场”的时 候 ;当你临时出差到一座陌生的城市,一下飞机就为订酒店而烦恼的时候,你可能就要感谢那些“开房 App”了,它们可以根据地理位置显示出离你最近的酒店的实时房源,然后轻松点几下手机屏幕,问题就得到了解决—–这是《创业家》杂志给酒店预定应用描绘 的使用场景.

腾讯克隆Facebook Connect推出QQ Login

- openboy - 36氪
近日,科技博客Thenextweb撰文指出腾讯对Facebook Connect进行克隆推出了自己的QQ Login(QQ 登陆). 据悉该服务和Facebook Connect一样,允许用户通过其QQ账号就登入许多其他的第三方网站,从而避免用户需要再次注册账户的繁琐过程,而用户在第3方网站上分享的评论等也可以显示在腾讯自己的社交网络Qzone上.

腾讯推出QQ开放平台Q+

- Wuvist - Solidot
慕容鱼吐的新闻泡 写道 "腾讯推出QQ开放平台Q+,宣称促进开放互联网. 网站的视频显示,Qplus提供的功能是将腾讯制作的一些Widget直接在桌面运行,腾讯很可能将该功能捆绑进QQ客户端.

老公去世沈阳女子想找回QQ 腾讯:QQ不能继承

- 自乐 - cnBeta.COM
不久前,市民王女士的老公徐先生在一场车祸中丧生. 徐先生的QQ邮箱里保存了大量有关两人从恋爱到结婚期间的信件、照片. 悲恸欲绝之余,王女士想要整理这些信件和照片,以留作纪念;不仅如此,她也想保留这个QQ号码. 但王女士不知道老公的QQ密码,只好向腾讯公司求助,可交涉后没能拿到密码.

HTC携手腾讯推QQ手机:内置腾讯多项服务应用

- fz - GeekPark 捕风捉影
前不久HTC曾为Facebook量身定制一款手机chacha,为了迎合国人的习惯,HTC将这款手机经了改动,并携手腾讯推出了chacha的行货版. chacha的行货版与海外版本的差异在于手机全键盘下方的Facebook专属键改成了我们熟悉的“小企鹅”. 该机采用直板全键盘造型,并配备了一块2.6英寸HVGA分辨率触控屏,运行Android 2.3.3系统与HTC Sense 2.1 Messenger界面,同时搭载主频800MHz处理器,内置512MB RAM内存和512MB ROM容量空间,并提供500万像素摄像头.

腾讯屏蔽MSN导入QQ好友功能

- GAO Ming - Solidot
微软推出了MSN导入QQ好友功能,这一直是笔者想要的. 这个功能通过Qzone好友功能来邀请你的QQ好友摆脱QQ这个流氓软件,投身到MSN这个全球最流行的IM工具上来. 但腾讯为了封锁MSN将“公开好友”设为仅主人可查看,并谎称“为了安全起见”. 腾讯不止一次以“为了安全起见”这种看似为了网民着想的方法来欺骗亿万用户.

腾讯QQ和360安全卫士之战升级

- Pangolin - 月光博客
  腾讯和360的弹窗大战愈演愈烈,两家公司之间的口水仗引来众多网民关注,两大网络客户端则不停向数亿网民强势推送“最新战况”,使得这场腾讯和360的大战让数亿网民“被围观”.   根据CNNIC近期的统计数据,中国国内网民为4亿多,据腾讯的数据,目前QQ注册用户已经突破了10亿,同时在线用户人数也突破了1亿.

腾讯新电商平台首页曝光:名为“QQ网购”

- diaoxsh - cnBeta.COM
9月20日,来自腾讯内部的消息称,腾讯电商超级平台被命名为“QQ网购”,域名不是此前业内猜测的taotao.com,目前,腾讯选择了二级域名buy.qq.com. 与此同时,腾讯这一新电商平台的首页也流出.

中国电信和腾讯正式推出天翼QQ业务

- 洞箫 - cnBeta.COM
中国电信和腾讯正式推出天翼QQ业务,目前已经开放注册. 电信180/189/133/153手机号码均可注册为QQ号.

定价2680元 HTC携手腾讯推QQ手机

- 2楼水饺 - cnBeta.COM
前不久HTC曾为Facebook量身定制一款手机chacha,为了迎合国人的习惯,HTC将这款手机经了改动,并携手腾讯推出了chacha的行货版. chacha的行货版与海外版本的差异在于手机全键盘下方的Facebook专属键改成了我们熟悉的“小企鹅”. 该机采用直板全键盘造型,并配备了一块2.6英寸HVGA分辨率触控屏,运行Android 2.3.3系统与HTC Sense 2.1 Messenger界面,同时搭载主频800MHz处理器,内置512MB RAM内存和512MB ROM容量空间,并提供500万像素摄像头.