前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >折叠屏 | 又双叒叕成功适配!折叠屏+携程,旅行体验提高不止一个Level!

折叠屏 | 又双叒叕成功适配!折叠屏+携程,旅行体验提高不止一个Level!

作者头像
软件绿色联盟
发布2022-03-31 13:51:57
1.1K0
发布2022-03-31 13:51:57
举报
文章被收录于专栏:软件绿色联盟动态

自折叠屏手机发布以来,大屏幕新形态下的用户体验就成了业内关注的重点,也被提上了日程。如何让万千用户对App“一见钟情”,用户体验设计师就肩负着这样的任务。携程App作为一款在线旅行服务性软件,已成功适配折叠屏手机,快来和我一起看看有哪些创新体验吧。

相较于平板设备,折叠屏设备有多尺寸、多比例的屏幕优势,其问世促进了智能手机外观形态上的发展。一部设备两个状态,这是传统手机做不到的,面对与传统手机的天然差异,因此折叠屏手机在设计变化上,会针对大屏需重新调整布局结构,在设计重点上也优先对华为折叠屏手机进行设计升级。

作为国内旅游OTA的领头羊,携程拥有上亿用户,其业务线也很广,涉及机票、酒店、旅游、火车票等等。众所周知,旅游产业的服务链条非常长,也很复杂。单以酒店为例,商务用户会更关注酒店的品质、位置、交通等;旅游用户则会关注周边的娱乐、交通、环境等。如何利用新技术优势,给用户提供更好的产品和旅行体验,成为携程需要考虑的问题之一。

适配场景演示

携程App采用观察+访谈的形式,邀请用户使用折叠屏手机,观察使用情况和操作方式,测试他们对首页方案的反馈。结果显示,用户操作折叠屏方式趋于平板,所有人都使用双手,一手持机一手操作。在单屏与双屏之间,大多数用户最终都选择双屏的方案,因为双屏给用户惊喜,发挥了折叠屏手机的优势,显示更多信息,体验感更舒适。下面一起来看携程App在折叠屏设备里的适配场景演示。

1.首页页面

设计方式:挪移布局

首页采用九宫格导航形式,将酒店、机票、旅游分别以行的形式展现。这一版的设计较以前更适合用户在打开页面时快速定位自己要选择的类别。左侧一条街、宫格、次入口位置固定,右侧特价、各类卡片、信息流滑动。针对折叠屏手机,UX设计师将可视化元素进行重新分组,各组块位置挪移,最终形成均衡的排版。

优点:利用折叠屏大屏幕优势,为用户显示更多信息。

2.旅游页面

设计方式:挪移布局

在旅游页面用户可根据自己的需求选择旅游形式。将主功能查询操作区、宫格区置于左屏,位置固定,各导流模块、信息浏览区放在右侧,方便用户滑动浏览。

优点:同时展现更多信息,提供多维度旅游导流方式,增强用户粘性,实现内容营销。

3.门票页面

设计方式:分栏布局

将列表页置于左侧,详情页置于右侧,左侧景点卡片与右侧详情强关联,点击列表第一个景点详情,右侧会切换出左侧景点对应的景点详情。

优点:门票场景地图对用户作用较小,左列表右详情的模式是希望用户在列表页的时候就可预览相关门票的资源信息,为用户提供了一种更自然便捷的交互方式。

4.查询页面

对于查询页面,用户的重点在购买,浏览作为辅助,UX设计师将主功能查询操作区置于左屏,信息浏览区放在右侧。

优点:无形中将第二屏不易外露的特色信息展示给用户,提供更多选择,这样做能够给用户节省时间和提升效率,充分享受丰富的内容体验,从而提升用户的使用粘度。

5.列表页面

对于列表页面,携程酒店的UX设计师强化了地理属性,灵活利用多余空间将列表页地图外置右屏。酒店卡片与地图定位点强相关,右侧地图会默认标记左屏第一家酒店的位置;点选地图上其它标记点,列表也会快速滑动到对应酒店的卡片,真正实现双屏互动。

优点:便于用户通过地标或是商圈预订酒店,将酒店信息和地理位置强关联,辅助决策。打破规范,探索折叠屏更多交互可能性。

6.详情页面

对于详情页面而言,缩短了信息获取路径,将详情页UV非常高的三个二级页面(相册、点评列表、卖点页)放在右屏。

优点:减少了用户进入再退出的操作步骤,降低了信息获取成本。

携程App在适配折叠屏设备的过程中,也有诸多畅想,比如灵活利用大屏大空间的特点,结合VR看房技术,给用户提供更加沉浸式的浏览体验。利用分屏模式,横向比较两家甚至多家酒店的信息,便于用户快速筛选。最后,携程在布局结构上提出了很多有针对性、有价值的建议。

目前携程App成功适配折叠屏手机,随着用户体验的进一步优化,访问量和用户黏性优势会得到巩固和加强,逐层构建企业的核心竞争力。软件绿色联盟一直致力于折叠屏UX设计规范的标准化,通过搭建一个开放、共同进步的平台,实现效率提升和体验升级,完善行业发展环境,进一步推动折叠屏UX设计生态规范健康发展。

End

本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2020-01-02,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 软件绿色联盟 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档