首页 > 网页教程 > 设计分享 > 民宿APP UI设计分享 在线旅游APP设计分享

民宿APP UI设计分享 在线旅游APP设计分享

时间:2016-11-02    来源:设计达人

随着非标住宿的兴起,近年来民宿越来越受到中国旅游出行用户的青睐,各类专注民宿预订的平台也雨后春笋般的涌现。今年以来携程在民宿的产品和UI设计上投入了大量资源,并取得了一定的成效。借此机会我们来分享一下携程民宿频道在设计与迭代过程中的一些心得体会。

在着手民宿频道的改版之前,我们先分析了旧版设计所存在的问题。

总体来讲,旧版设计与传统酒店频道的差异化还不够大,从首页到列表页详情页基本在复用酒店原有的设计框架。并且由于原先较为专注于国内客栈的资源,设计风格也不够国际化。

那么在确立新的设计风格之前,我们需要先提炼一些民宿独有的“特质”,从中挖掘出具有民宿特色的设计。

通过这些关键词,我们可以感觉到民宿的用户和传统酒店用户相比,应该更年轻、随性,具有一定的出行经验,并且希望获得更具个性化的旅行及住宿体验,用一个词概括的话可能是“小清新”~

应此我们决定在新版设计中,抛弃酒店频道原有的格式化的、更注重功能性的设计,通过视觉手段先为用户营造出一种休闲、生活化、当地的“民宿氛围”,让用户先逛起来!

如何打造这样的氛围呢?首先当然是图片!

可以看到,新版首页基本以图片作为基本元素,弱化原先的搜索模块。首图挑选孩子的背影图片突出人文情怀。但是图片多了,色彩容易杂乱,需要对色调进行调和。因为暖色调更能使用户联想到温暖的住宿感觉,所以通过滤镜处理,将所有图片色调统一成黄,绿,棕等暖色系的方向,同时也增加了文艺清新感。

城市及单品内容做了精简,只放名称,价格,评分这些用户最关注的信息。

在颜色上,携程的VI色是蓝橙色搭配,为了使整个频道色彩更年轻一些,但又不与携程app整体色彩偏离太远,我们采用蓝绿色和橙红色这个更小清新一些的色彩组合。

列表页改版也继承了突出情境化和当地的概念。头部增加城市大图模式,同时也是营销区域,可以根据营销需求替换头部图片。将特色标签变为图片形式,更加直观和美观。产品列表根据用户需求可进行大小图模式的切换,并加入卖家秀概念。

经过近一年的不断优化,民宿频道日均订单总量从以前的每日200单上升至2000余单,首页-列表CR从46%提升至53%,列表-详情CR从56%提升至70%。整体CR也有极大的提升。

相关推荐
APP浏览体验设计的思考:如何理解用户的眼?
20个创意漂亮的手机应用程序登陆页面设计欣赏
iOS7用户界面设计的10个准则分享
交互设计上常见的界面切换动画如何优化
Windows Phone 8 UI设计指南分享
APP设计经典:Pinterest的交互细节
对症下药!如何设计受欢迎的应用引导页?
搞定APP着陆页优化的超实用原则(附工具)
APP界面设计:移动缺省页如何设计才会内容“丰富友好”?
产品设计:FEEDLY创始人再聊改版实战经验
写给初学者:移动站点app开发尺寸基础知识
扁平化设计与Material Design区别在哪里?
APP界面设计教程:让人眼前一亮的渐变设计手法
APP导航设计:不要在移动端菜单设计犯这些错误
交互设计基础!四个移动界面常见的动效类型
国外UI设计师:UI界面设计作品精选
APP设计!6个方法助你设计出优秀的APP
APP设计零基础教程:5步让你设计出漂亮的APP界面
15个值得学习的APP交互体验设计细节
手机APP设计规范:图标和按钮视觉设计规范
APP界面设计之页面布局的22条基本原则
APP设计!教你怎样才能把APP引导页设计的高大上
经典案例分析:10个戳中痛点的APP更新欢迎页文案
2015最流行的APP设计是啥?比如 Facebook那样的
前方高能!别让这10个设计误区毁了你的APP
20款创意设计的移动动画界面案例欣赏
内容化设计项目总结:如何从0到1做出淘宝头条架构
想搞定移动端APP/网页设计?你起码得做好这几点
移动开发教程:移动页面适配小知识分享 设计师必备
20个精致漂亮的视频播放器界面设计欣赏及点评
视觉设计:页面构建的审图与细节
15个超棒的无线移动终端UI设计案例赏析
响应式网页设计正成为移动互联网大势所趋
浅谈界面设计中的结构设计
分享:5招助你打造更加简洁的用户界面
浅谈界面UI设计中的包容性设计

分类导航

教程推荐

热门特效

热门教程