微信小程序在设计的时候需要遵循哪些规则?

正所谓无规矩不成方圆，凡是都有一定的规则，微信小程序也不例外，今天小编就来与大家分享一下“微信小程序在设计的时候需要遵循哪些规则?”的有关内容，希望对大家有所帮助。

1、页面设计需要考虑除微信导航以外其它导航页面的设计，遵循“导航明确，来去自如”，也就是能让客户知道，当前在哪，可以去哪，如何回去等问题。

2、页面设计需要遵循重点突出，并且不能出现与业务无关的业务入口，正反举例：

错误示例

以上页面主题是查询，但查询按钮下面却出现“今日热点|头条新闻”的无关内容

正确示例

以上页面查询按钮下面显示的是最新搜索过的关键词，与页面主题匹配

3、页面设计无需考虑微信一级菜单的导航，微信系统内的所有小程序均会自带有微信提供的导航栏

标准导航图

4、微信导航栏自定义颜色规则，开发者如果需要自设导航需要与官方定义的颜色和谐搭配

官方定义导航颜色

5、小程序首页可选择微信提供的原生底部标签分页样式，该样式仅供小程序首页使用。初期的页面内导航设计尽可能利用微信自带导航Tab，添加自有导航可以添加标签分页(Tab)导航，标签数量不得少于2个，最多不得超过5个，为确保点击区域，建议标签数量不超过4项。

小程序标准导航样式

6、小程序已经明确定义了标准的启动页面和页面下拉刷新加载样式，无需开发者设计，启动页面只能上传品牌LOGO且不能更改。

小程序启动页标准样式

下拉加载页标准样式

7、小程序页面的加载反馈和结果反馈应提供载入进度和结果提示，并且每个页面都要有明确的指引操作和退出提示。

加载页必须有加载提示如右边图

结果反馈必须有明确提示如：已发送

8、小程序页面设计需要遵循“减少输入，巧用接口，多用选择”的原则，最大限度的优化用户体验，减少或避免不必要的键盘输入。

搜索内容建议设计成按钮选择而不是让用户手工输入

持卡人和卡号不建议让用户直接输入而是调用接口让用户选择

9、小程序页面的字体尽量与用户所运行的系统字体保持一致，常用字号为20, 18, 17, 16,14 13, 10(pt)，字体颜色主内容 Black 黑色，次要内容 Grey 灰色;时间戳与表单缺省值 Light 灰色;大段的说明内容而且属于主要内容用 Semi 黑;蓝色为链接用色，绿色为完成字样色，红色为出错用色 Press与 Disable状态分别降低透明度为20%与10%

字体规范

字体颜色

主内容 Black 黑色，次内容 Grey 灰色;时间戳与表单缺省值 Light 灰色;大段说明内容用 Semi 黑;

蓝色为链接用色，绿色为完成字样色，红色为出错用色

10、小程序页面同样明确定义了列表视觉规范、表单输入视觉规范、按钮使用原则、图标使用原则等详细的规范。

以上仅为笔者为大家整理出来的小程序设计最值得重视的诸多要点，如果您对小程序设计比较关注，请持续关注呆盟说后续推出的对《小程序设计指南》更专业的解读文章。

以上就是关于“微信小程序在设计的时候需要遵循哪些规则?”的有关内容，希望对大家有所帮助，如果您还想了解更多的内容，可以关注本站，以便您获取相关的资讯。