成都小程序UI设计规范：微信官方设计要求详解

在成都做小程序，UI设计不能随便来。微信有自己的设计规范，不符合规范用户用着会别扭，严重的还会被审核驳回。本文讲小程序UI设计的核心规范要点。

一、导航栏规范

小程序顶部有系统自带的导航栏，显示小程序名称和关闭按钮。一般不建议自定义导航栏，因为不同手机的状态栏高度不一样，自定义容易出问题。页面内容从导航栏下方开始排布，不要和导航栏重叠。

二、按钮设计规范

1. 主要按钮

页面最核心的操作按钮（如"立即下单""确认预约"）用品牌色填充，放在页面底部安全区域，宽度撑满或接近撑满。让用户一眼就知道点哪里。

2. 次要按钮

次要操作（如"取消""返回"）用灰色背景或描边样式，不要和主要按钮抢视觉焦点。

3. 按钮尺寸

按钮高度建议至少88rpx（约44px），太小了用户点不到。左右边距保持一致，不要忽宽忽窄。

三、文字规范

正文字号建议28rpx以上，在手机上能清晰阅读。标题用32-36rpx，加粗。辅助说明文字可以用24rpx，颜色浅灰。不要用太小的字，中老年用户看不清。

四、间距和布局

页面左右边距统一，一般留20-30rpx的安全边距。模块之间留够间距，不要挤在一起。列表项之间用分割线区分，不要全靠留白。

五、色彩规范

一个小程序不要用太多颜色，主色一个、辅助色一两个就够了。主色用来强调按钮和重点信息，背景色用浅灰或白色。不要用太刺眼的颜色搭配。

六、图标规范

导航栏图标、功能入口图标风格要统一，都是线性或者都是面性。图标尺寸建议80rpx左右，不要忽大忽小。

在成都做小程序设计，建议多看看微信官方的设计指南和优秀小程序案例，比自己瞎想要靠谱得多。