本文主要是介绍补上折叠屏的最后一块拼图 — Mate X 折叠屏 UX 讨论会后记，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
Mate X 在年初发布时以独特的外折设计给我们留下了很深的印象，它避免了多余的屏幕以及刘海，相对内折大幅减少了机身厚度，为我们带来了折叠屏手机的一种新形态。
至此 Mate X 硬件的工业设计已经确定，但光是制造出优秀的硬件还不算产品的结束，因为优秀的硬件需要同等级的软件来与之匹配，毕竟我们最本质的需求，是一个能完美呈现软件内容的硬件。
举个例子：硬件像是一辆车，它的目的是将我们带到应用（App）或者服务这个目的地。硬件的好坏决定的，可能是我们在前往目的地过程中是否舒心，速度是不是够快，这也是传统形态智能手机这么多年一直努力的方向 —— 我们之前不断地造着更快的车。
而 Mate X 作为首批上市的折叠屏产品，与传统形态的手机有了很大的差别，如果还要沿用过去的规范，就像给自动挡的车装个离合器，给纯电动的车加上一个假的前脸进气一样不伦不类，所以 Mate X 也是类似的，如果软硬件的配合不和谐，某种意义上也相当于是对折叠屏硬件的一种浪费。
作为首批折叠屏形态的产品，对于 Mate X 和华为来说，其实既是挑战也是机遇。
因为折叠屏产品的 UX（用户体验）设计是前无古人的，Mate X 需要完完全全开辟一条新的道路，而机遇则是如果 Mate X 抓住了这一次机会，建立了一套完善、直观、高效的设计语言，那么就像 5G 一样，华为就能成为折叠屏 UX 规范和标准的制订者，掌控最高的话语权。
对于期待着能第一时间购买 Mate X普通消费者来说，这意味着大家是否能在收到产品的第一时间得到完善的折叠屏体验，以及后期诸多的 App 是否能很快跟进适配，最大化利用手中独特的硬件去提供全新的软件体验。如果只是单纯的等比例放大，那么折叠也就失去了它的意义。
因此，如何制定出一套优秀的折叠屏 UX 设计规范，就成了 Mate X 上市之前需要补齐的最后一块拼图。
从硬件上来看，Mate X 这样折叠屏手机最常用的有两个状态，折叠状态和展开状态，两种状态下有着不同的显示面积，显示比例，以及不同的握持姿势。
这其中有一个典型的思维误区，有的人会想，既然折叠在展开之后是大屏，那么直接简单地套用平板上的设计就好，但究其根本，折叠设计之所以吸引人，最大的原因就在于可自由变化形态。
- Mate X 展开后的大屏幕为 8 英寸，2480*2200 分辨率，长宽比为 8:7.1
- 折叠时的主屏幕为 6.6 英寸，2480*1148 分辨率，长宽比为 19.5:9
- 折叠时的背面屏为 6.38 英寸，2480*892 分辨率，长宽比为 25:9
不论是软件或者硬件意义上，折叠屏手机的折叠态和展开态都是可以随时切换的，在切换前后的体验需要有连贯性，所以展开之后的 UX 若直接照搬为平板的设计，显然太过生硬。折叠屏 UX 设计主要面临的应该是以下两大问题：
- 从折叠时的细长屏幕切换到展开之后接近正方形的大屏幕，该怎么让两种屏幕显示的内容恰到好处，看起来统一和谐。
- 在展开屏幕之后，我们很难用单手操作，如何选择交互按钮的位置和操作方式，保证用起来顺手且符合直觉。
而 UX 的设计，需要多方的共同努力：
- 华为作为终端设备制造商，提供底层的设计规范和解决方案
- App 开发者与设计师根据底层规范，参考自身用户需求来进行具体设计
因此在 7月 11 日，也是华为开发者大会的前一个月，华为发起了一次《折叠屏 UX 设计规范征求意见 & 绿盟折叠屏创新工作筹备》预沟通会的讨论，
有了华为的组织，绿盟成员的响应，可以说是为折叠屏 UX 设计规范的建立打下了牢固的基础。为什么这么说呢？
绿盟的全称是软件绿色联盟。由华为、阿里巴巴、百度、腾讯、网易五家企业联合发起，同时集结了软件与硬件行业的龙头，在2016年建立，旨在打造安全、可靠、健康的安卓应用生态体系，到 2019 年绿盟已拥有1000多家会员企业，覆盖了几乎所有我们日常使用的 App 与服务。
因此，在华为的带头和绿盟的参与之下，这可能就是国内，甚至整个 Android生态之中，制定折叠屏 UX 标准和规范的最佳阵容。
针对折叠屏 UX, 我们可以怎么做？
在讨论的过程中，华为与来自 BAT, 携程、微博等头部互联网公司的设计师们提出了几种可能适合的布局方式，以及很多有意思的观点：
首先，由折叠屏硬件带来的优势，就是显示区域的增加，这也就意味着我们能在同样的时间内展现出更多的信息。由此，折叠屏 UX 的布局设计可以被分为两个方向：单一层级显示展示更多内容 & 多层级同时显示减少点击路径。几个月之后，你买到 Mate X 上运行的 App, 几乎都在这几类之中，让我们从这两个大类来具体看看。
一、缩放布局：
最基础的布局之一，简单易懂、轻松易用，主要适用于展现固定内容的界面，因为它保证了打开折叠屏之后最佳视觉效果，例如对于图片或者视频进行等比放大，就能充分利用更大的显示区域。
二、拉伸（延伸）布局
拉伸布局不会改变界面的元素和基本结构，元素组合根据元素间区域进行动态等距拉伸，或者根据屏幕宽度增加的量，在横向增加单行显示元素，这样的布局很可能不需要额外适配，因为有很多 App 为了适应不同的手机宽度，已经采用了这种设计。
三、响应式布局：
很适合呈现扁平架构的入口界面，比如 App 的最顶层分类导航界面，通过给额外的显示区域填充之前无法显示的内容，就能很好的起到扩展显示更多信息的作用。
在这也可以说句题外话，因为前三种布局并非专为折叠屏而生，所以早就大量应用在目前的 App 之中，其实就算没有专门适配，我们也不需要担心第一批买到 Mate X 时，App 会出现大量的不兼容，显示错乱现象。
接下来我们还有多层级同时显示减少点击路径的方式。
四、分栏布局：
现代 App 的交互都离不开层级，但层级多了就会带来一个很严重的，那就是层级过多无法快速进入目标层，以及切换时需要前后跳转多次。
利用分栏布局，可以同时展示两层内容，左右两侧为父子关系，两边可以同时滚动浏览，也可以通过点击父级来快速切换。这样就解决了快速跳转切换、还有持续显示形内容的需求，比如左边持续浏览商品详情，右边点开客服聊天界面，一边看一边问，省去了大量的跳转时间。
除了典型的分栏布局之外，其实分栏布局还有更多异曲同工的扩展。
比如在看视频的时候，除了叠加显示弹幕和评论之外，折叠屏展开之后就能在不影响画面的前提下同时查看弹幕和评论，并且也能一边看画面一边打字发送信息，得到完全流畅的体验。
尾声：
相对于往常国内厂商仅仅注重硬件而忽视软件的常态，这次华为在 Mate X 身上不仅投入了相当的人力物力，在硬件上首批让折叠屏手机概念变为现实，同时也在软件上作为终端厂商的代表牵头，与 BAT 等其他软件和服务提供商一同探讨各自的理解并且建立折叠屏 UX 的标准。
并且这些讨论，并非形式化地走过场或者纸上谈兵，而是非常具体地针对不同类型的 App 逐一进行实际地分析。不仅总结出了如何利用折叠屏硬件这样整体方向性地思路，而且还具体提出了几种布局方式，以及安卓的栅格布局系统如何应用在折叠屏环境中。
- 对于华为，这是又一次在全新领域主导标准的最佳机遇。
- 对于开发者，这能避免纷乱的交互逻辑和重复造轮子的资源浪费。
- 对于用户，这意味着买到的不仅仅是超前的硬件，还有能与之完美搭配的软件体验。
下个月的华为开发者大会里，折叠屏 UX 规范的更多信息将会第一次公布，我们到时候见。
这篇关于补上折叠屏的最后一块拼图 — Mate X 折叠屏 UX 讨论会后记的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
