face+ 关于 服务 案例
首页 案例 服务 关于 face+

好看的微信小程序UI界面,让人爱不释手!

Time: 2019-09-26

众所周知,每一个人都有颜控潜质,只要产品好看,就很容易让人产生购买欲。而手机应用程序界面设计如何做到好看又好用,给予用户极致的体验呢?在微信官方的设计文档对微信小程序UI界面做了详细的说明,并提供了大量的用户界面实例作为参考。如果开发者能够理解其中微信小程序UI设计基本理念,严格依据设计文档创建和优化小程序,一种美观且使用的手机人机交互模式即可完成。


1.1.png


与传统的网页设计不同,小程序UI设计最大挑战在于将桌面重心转移为移动使用,在屏幕尺寸和比例、输入设备以及网络特性等方便有所区别。因此,微信小程序UI设计需要考虑以下几点:

一是排版设计上。在移动设备上使用小程序,由于屏幕受限,并没有电脑界面那样具有充裕的空间可发挥,这就要求UI设计师在对元素和文字排版的时候,考虑用户浏览时眼睛的适应能力,需要适当放大,或者加大间距,让整个页面更加舒适。另外,微信原声能够提供的控件有限,比如Toast、提示 icon、开关、多选框、复选框等等,其他空间可根据小程序风格去开发,但注意千万不要出现刺眼或者突兀的按钮和文字。

二是以简洁为主。在小程序开发过程中,尽量避免选择过于花哨或者繁杂的元素,看起整个页面都是重点,但又没有突出重点,使得用户的注意力分散,同时也会增加用户流量和载入时间,这当然也会影响小程序交互的流畅。


4 (2).png


三是留心导航系统设计。小程序没有导航指示器,给UI设计带来一定的难度,UI设计师要做的是确保用户的每一步符合预期,不能让用户在界面中“迷路”了。这里也建议页面内导航中顶部 Tab 样式和底部标签样式,每一种样式在2个到5个之间。当然,后期多测试也是非常有必要的。为了保证微信小程序界面显示效果,尽量将设计原型稿放到真机进行测试和评估。

四是站在用户的角度开发。很多微信小程序是基于网页网站而打造,如果能够统一风格最好,保持一种熟悉感,给用户一种“故人重逢”的感觉。在设计中,UI设计应该明晰用户当前状态,减少用户操作上的限制和等待时间,避免用户因等待产生焦灼感。

在如今各种各样的微信小程序横行时代,一个好看的微信小程序UI界面,必定有利于用户的拉新、留存和激活,以提高市场竞争力。







合作咨询

上海(总部)

上海市浦东新区郭守敬路498号22号楼205
021-61057328
service@faceui.com

办公地址地图

北京

北京市东城区后永康胡同17号A座三层
010-64015620
service@faceui.com

办公地址地图

深圳

深圳市福田区金田路4018号安联大厦2601
0755-33955611
service@faceui.com

办公地址地图
首页 | 案例 | 服务 | 关于 | face+ | 智见

Copyright © 2009-2015 FaceUI design. All rights reserved


沪ICP备13044459号-5

上海办公地点地图
北京办公地点地图
深圳办公地点地图
在微信中搜索faceui
或保存二维码在微信中打开