听说你准备做小程序？这套设计规范送给你
设计尺寸
微信小程序的设计其实很简单，你只需要以6屏幕尺寸7501334为视觉稿进行设计就行。因为微信小程序是以rpx为尺寸单位的，它会根据屏幕宽度自动调整。规定屏幕宽度为750，所以在6设计稿上1px=1rpx，尺寸换算非常方便。
设计区域
小程序的所有页面，包括内嵌网页和插件，微信都会在右上角放置官方小程序菜单。这个菜单的样式和尺寸是固定的，你不能自定义内容，但可以选择深浅两种配色来适应你的页面风格。
在设计界面时，记得预留出官方菜单的区域。如果你在附近放置了可交互元素，一定要特别注意交互事件是否会冲突，确保用户操作顺畅。
字体规范
小程序的字体遵循微信原生的视觉规范，字体大小和系统保持一致。常用的字体大小有20、18、17、16、14、13、11px，具体使用场景可以参考上图。
字体颜色规范
字体颜色主要分为无彩色和有彩色。无彩色中，主内容用黑色，次要内容用灰色；时间戳和表单缺省值也用灰色。大段说明内容如果属于主要内容，建议用黑色。
有彩色中，蓝色用于链接，绿色表示完成，红色表示出错。不同状态的颜色透明度可以调整为20%或10%。
顶部导航栏
顶部导航栏的标准高度是128px，一般只做底色修改。标题区和导航区可以自定义，但要注意和微信官方小程序菜单的样式保持一定差异，避免混淆。
标签分页导航
标签分页导航栏的标准高度是98px，可以固定在页面顶部或底部，方便用户在不同分页间切换。标签数量建议在2-5个之间，确保点击区域足够。一个页面最好不要出现一组以上的标签栏，具体可以根据产品需求调整。
底部标签栏
小程序首页可以选择微信提供的原生底部标签分页样式，这个样式仅供首页使用。你可以自定义图标样式、标签文案和颜色等。需要注意的是，图标控件尺寸是5454，但小程序需要的是8181，正好是1.5倍，设计时要一次给到位。
顶部标签栏
顶部标签分页栏的颜色可以自定义，但要注意保持标签的可用性、可视性和可操作性。
弹窗
无论是网页还是小程序，弹窗总是出现在页面的最上层。但在小程序里，导航栏和标签栏的层级是最高的，所以弹窗的设计要特别注意，避免和这些元素冲突。
启动页
小程序启动页是展示品牌特征的重要页面之一。除了品牌标志外，页面上的其他元素如加载进度指示，都是由微信统一提供的，不能更改，所以无需者额外设计。
加载样式
加载是不可避免的，但长时间的等待会让用户感到不耐烦。因此，在加载过程中给予及时的反馈非常重要。小程序除了可以自定义加载样式，还依赖微信提供了一系列标准加载样式。
页面下拉刷新加载
微信小程序提供了标准的页面下拉刷新加载能力和样式，者无需自行设计。
页面内加载反馈
者可以在小程序里自定义页面内容的加载样式。建议不管是局部还是全局加载，样式都应该尽可能简洁，并使用简单动画告知用户加载过程。
模态加载
模态加载样式会覆盖整个页面，由于无法明确告知具体加载的位置或内容，可能会引起用户焦虑，因此应谨慎使用。除非是某些全局性操作，否则不建议使用模态加载。
局部加载反馈
局部加载反馈只在触发加载的页面局部进行反馈，这种方式更有针对性，页面跳动小，是微信推荐的反馈方式。
全局加载反馈
全局加载将加载图标放到导航标题左侧，使用标题栏提示加载小程序页面内容的过程。
