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

扫一扫
官方手机版

扫一扫
AI创作程序

扫一扫
木子公众号

扫一扫
AI公众号

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

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

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

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

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

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

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

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

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