【Y星共读会】手机银行UI设计建议（一）手机设计「【Y星共读会】手机银行UI设计建议（一）」

根据近年来流行的设计风格和案例分析，可以看出金融服务类App的UI设计整体风格和趋势。

以视觉元素应用来分类，UI设计主要风格类型包括光感、几何、分形艺术、点线面和手绘风格。根据不同的视觉表现分类，光感类型下的流行风格还可分为液态、玻璃拟态、微渐变和柔光等类型；几何类型则可分为包豪斯、抽象几何两类；分形艺术类型是通过某一种或几种几何图形的重复或运动来构成画面的设计风格。金融服务类App产品UI设计主要风格如图1所示。

图1  金融服务类App产品UI设计主要风格一览

近年来，随着互联网技术与服务的发展，金融机构逐步探索简化复杂操作流程，降低使用门槛，为用户提供丰富多元的个性化服务与定制化产品。金融服务类App不仅在可用性上逐步提升，还在设计上更关注页面流程的简明高效，摒弃视觉元素和图形的无效堆砌。由此形成了线上金融产品服务UI设计的两大趋势：一是视觉轻量化——减轻用户认知负担；二是整体流畅性——提升用户体验流畅度，减少和删除干扰用户操作的不和谐流程页面元素（如图2所示）。

图2 金融服务类App UI设计整体趋势

结合图1的设计风格总结，从视觉表现层四大组成要素来看，设计师需在架构方面注重整体页面的有序感、松弛感与节奏感；在页面配色选择上合理应用品牌色，注重页面中配值与比例，不干扰用户整体阅读；在图标设计上关注面与线的合理配比；通过提升画面的通透感、磨砂感、空间感和纵深感来增强页面质感。

设计风格快速迭代，在以页面强视觉图形增强产品吸引力方面，本文总结了以下三种值得关注的设计风格。

与孟菲斯颜色鲜亮的风格形成对比的是极简风格的平静和纯粹（如图3所示），这种风格可以让用户抛去“视觉噪音”，专注于产品和功能本身。

图3 简洁风格（图片来源：网络）

简化3D风格是平面设计中的流行趋势之一，在简洁的内容上创造立体效果，可以稍微打破界面中的安静和平衡感（如图4所示）。

图4 简化3D风格（图片来源：网络）

上世纪70年代复古平面设计以明亮的、饱和的颜色为基础，大胆、浮夸地使用图形和元素（如图5所示），达到令人愉悦的效果。

图5 70年代复古平面设计 

（图片来源：网络）

从提升用户操作流畅度和产品可用性方面考虑，设计者加强用户操作与实用技术的联结可以更好提升App的流畅度。

一是继续强调App的可用性。关注用户体验中的细节问题，如2.5秒是用户等待的最大有效时间，首次输入延迟的交互时间最好小于等于100毫秒等。

二是简化用户旅程和信息架构。应用程序和页面需要持续不断地精简（至少在前端）。

三是语音用户界面正在兴起。值得关注的UI和UX趋势是语音搜索。Siri、Amazon Alexa和Google Nest设备使用户界面设计超越了视觉屏幕，开始融入其他感官体验，语音用户界面 (VUI) 成为主流。人们无需触摸设备，通过语音即可操作设备。

四是具备包容性设计思维。华丽（但最终不可读）的字体、小号字体和难以点击的按钮都是疏远用户的设计，设计者要带着“包容性思维”不断寻找设计中需要改进之处，最终使用户操作无障碍。