小程序设计规范.docx

? ? 小程序设计规范 ? ? 小程序设计规范 标签；相比APP而言，开发一款小程序的开发成本更低、周期更短，同时开发难度和维护成本也相对降低，因此越来越多的开发者开始入坑小程序。正好最近我也要开发小程序，所以今天我就从设计方面聊一聊微信小程序设计规范，埋上设计中可能会出现的坑，让你能更好的完成你的小程序～ 设计尺寸 微信小程序的设计只需要以iPhone6屏幕尺寸750x1334px为视觉稿进行设计即可，因为微信小程序以rpx为css尺寸单位，rpx可以根据屏幕宽度进行自适应，规定屏幕宽度为750rpx，因此在iPhone6设计稿上1px=1rpx，在尺寸换算上就会很简单。 小程序的所有页面，包括小程序内嵌网页和插件，微信都会在其右上角放置官方小程序菜单，样式尺寸及布局如上图。开发者不可对其内容自定义，但可选择深浅两种基本配色以适应页面设计风格，如下图。 字体规范 小程序的字体依然遵循微信原生视觉规范：微信内字体的使用与所运行的系统字体保持一致，常用字号为20, 18, 17, 16,14 13, 11(pt)，使用场景具体如上图。 无彩色——主内容Black黑色，次要内容Grey灰色；时间戳与表单缺省值Light灰色；大段的说明内容而且属于主要内容用Semi黑； 有彩色——蓝色为链接用色，绿色为完成字样颜色，红色为出错用色，Press与Disable状态分别降低透明度为2