众所周知,每一个人都有颜控潜质,只要产品好看,就很容易让人产生购买欲。而手机应用程序界面设计如何做到好看又好用,给予用户极致的体验呢?在微信官方的设计文档对微信小程序UI界面做了详细的说明,并提供了大量的用户界面实例作为参考。如果开发者能够理解其中微信小程序UI设计基本理念,严格依据设计文档创建和优化小程序,一种美观且使用的手机人机交互模式即可完成。
与传统的网页设计不同,小程序UI设计最大挑战在于将桌面重心转移为移动使用,在屏幕尺寸和比例、输入设备以及网络特性等方便有所区别。因此,微信小程序UI设计需要考虑以下几点:
一是排版设计上。在移动设备上使用小程序,由于屏幕受限,并没有电脑界面那样具有充裕的空间可发挥,这就要求UI设计师在对元素和文字排版的时候,考虑用户浏览时眼睛的适应能力,需要适当放大,或者加大间距,让整个页面更加舒适。另外,微信原声能够提供的控件有限,比如Toast、提示 icon、开关、多选框、复选框等等,其他空间可根据小程序风格去开发,但注意千万不要出现刺眼或者突兀的按钮和文字。
二是以简洁为主。在小程序开发过程中,尽量避免选择过于花哨或者繁杂的元素,看起整个页面都是重点,但又没有突出重点,使得用户的注意力分散,同时也会增加用户流量和载入时间,这当然也会影响小程序交互的流畅。
三是留心导航系统设计。小程序没有导航指示器,给UI设计带来一定的难度,UI设计师要做的是确保用户的每一步符合预期,不能让用户在界面中“迷路”了。这里也建议页面内导航中顶部 Tab 样式和底部标签样式,每一种样式在2个到5个之间。当然,后期多测试也是非常有必要的。为了保证微信小程序界面显示效果,尽量将设计原型稿放到真机进行测试和评估。
四是站在用户的角度开发。很多微信小程序是基于网页网站而打造,如果能够统一风格最好,保持一种熟悉感,给用户一种“故人重逢”的感觉。在设计中,UI设计应该明晰用户当前状态,减少用户操作上的限制和等待时间,避免用户因等待产生焦灼感。
在如今各种各样的微信小程序横行时代,一个好看的微信小程序UI界面,必定有利于用户的拉新、留存和激活,以提高市场竞争力。