微信小程序ui设计规范

微信小程序界面设计规范主要包括以下几点：

1. 用户体验 ：设计应尊重并提升用户体验，避免改变微信的外观和功能，保持界面简洁，不遮挡图片，且不得诱导用户点击。

2. 视觉规范 ：设计时应注意UI界面的风格与配色，遵循微信小程序官方提供的标准尺寸和字体风格，保持品牌形象与小程序整体风格的统一性。

3. 交互规范 ：小程序应具有清晰和简洁的导航，注重用户体验，在用户可预知的位置展示功能模块，避免使用过于复杂的菜单或操作方式。

4. 内容规范 ：商品信息应进行分类和排版，关注商品图片的质量，以呈现生动和真实的效果。

5. 设计尺寸 ：使用rpx作为尺寸单位，以适应不同屏幕尺寸，官方推荐在750px宽度的基础上，使用24列栅格系统。

6. 图标规范 ：图标文件应为PNG或SVG格式，规格为81rpx，数量限制在2至5个。

7. 导航栏与底部栏 ：导航栏高度为128rpx，标签栏高度为98rpx，标签数量建议为2至5个。

8. 启动页 ：启动页是展示品牌特征的页面，除品牌标志（Logo）外，其他元素如加载进度指示由微信统一提供。

9. 视觉设计 ：字号和视距应根据用户与屏幕的距离调整，确保内容可读且符合版式美感。色彩搭配应简洁，主色调根据小程序类型选择，避免过多颜色混搭。

10. 布局设计 ：遵循CRAP原则，包括对比（Contrast）、重复（Repetition）、对齐（Alignment）。

11. 字体规范 ：常用字号为20,18,17,16,14,13,11（pt），使用场景具体如下，导航（iOS和Android）字体颜色为主内容Black，次要内容Grey，时间戳与表单缺省值Light Grey，大段的说明内容而且属于主要内容用Semi黑，蓝色为链接用色，绿色为完成字样颜色，红色为出错用色Press与Disable状态分别降低透明度为20%与10%。

12. 列表视觉规范 、 表单输入视觉规范 、 按钮使用原则 、 图标使用原则 ：这些规范详细说明了列表、表单、按钮和图标的设计要求，包括高度、颜色、透明度等。

13. 导航明确 ：开发者需自行设计首页和次级页面导航，建议所有次级页面左上角提供返回上一级页面操作，iOS用户可通过界面边缘向右滑动返回，安卓用户可通过物理返回键返回。

这些规范旨在确保微信小程序的设计既美观又实用，同时提供一致的用户体验。遵循这些规范可以帮助开发者创建出符合微信生态要求的高质量小程序。

其他小伙伴的相似问题：

微信小程序启动页设计规范有哪些？

微信小程序颜色搭配有哪些禁忌？

微信小程序界面设计权威指南在哪里？