微信小程序页面设计指南——个人笔记

底部标签分页设计规范：

页面加载等待以局部加载反馈为主

局部加载反馈即只在触发加载的页面局部进行反馈，这样的反馈机制更加有针对性，页面跳动小，是微信推荐的反馈方式。例如：

全局加载反馈以这种方式更友好

开发者可以参考图中样式，使用标题栏提示加载小程序页面内容的过程。例如：

页面全局操作结果——图标型弹出提示

图标型弹出提示适用于轻量级的成功提示，1.5秒后自动消失，并不打断流程，对用户影响较小，适用于不需要强调的操作提醒，例如成功提示。特别注意该形式不适用于错误提示，因为错误提示需明确告知用户，因而不适合使用一闪而过的弹出式提示。

页面全局操作结果——文字型弹出提示

文字型弹出提示适用于需要轻量化地用文字解释当前状态或提醒不严重的错误。1.5秒后自动消失，不打断流程，对用户影响较小。

页面全局操作结果——模态对话框

对于需要用户明确知晓的操作结果状态可通过模态对话框来提示，并可附带下一步操作指引。

页面全局操作结果—结果页
对于操作结果已经是当前流程的终结的情况，可使用操作结果页来反馈。这种方式最为强烈和明确的告知用户操作已经完成，并可根据实际情况给出下一步操作的指引。

异常状态——表单出错
表单报错，在表单顶部告知错误原因，并标识出错误字段提示用户修改。

视觉规范

字体
微信内字体的使用与所运行的系统字体保持一致，常用字号为22, 17, 15, 14, 12(pt)，使用场景具体如下：

字体颜色

色板

列表





按钮



参考地址：https://developers.weixin.qq.com/miniprogram/design/