小程序的ui框架尺寸

小程序的ui框架尺寸,第1张

程序的 UI 设计指南在小程序官方文档中均有介绍,以微信官方设计文档为参照:

1、 小程序布局:小程序的布局主要采用块察大状结构进行布局,优先采用卡片、列表或网格等布局方式;

2、 小程序 UI 调色:小程序的 UI 调色使用典型的灰色调子,较亮的颜色基调使用明度较浅的颜色余巧;

3、小程序 UI 尺寸:败毁竖采用 1080px 宽,720px 高的界面设计尺寸,控件尺寸以 8px 为基准单位,即每个控件的间距需以 8px 设计;

4、 小程序 UI 字号:字体最大尺寸 36px,最小尺寸 24px,中等字体尺寸使用 30px。

一般情况下,一场小程序营销活动,我们会设计相应的专题页,如果是当月的大型促销搏扰活动,首页也会同步更新调整架构内容。

如一场品牌专场,我们需要设计的内容

以一场专题活动为例,说明设计的图片内容和常规尺寸要求如下:

专题页头图(即首页焦点图/轮播图):尺寸视行业特性而定,如百货类、生鲜类690*230,

如服装类530*650。

其他小程序推广页分别为:基旁旦d窗图530*650,浮窗海报750*259,会场转发图500*400

如服装类,我们会在架构表备注的要求

商品详情页:750或800的宽度皆可,适应手机阅读,高度则根据商品本身实际情况而定,建议单张图片150-200KB之间比较好,方便用户下拉图片时快速加载图片内容,提升体验感。

商品活动标:500*500,其实只要是1:1的方图即可。

===启帆==============

以上就是我的分享

如果对你有用,就点个赞吧!予人玫瑰,手有余香~

小程序开发尺寸是rpx(responsive pixel),可以实现一稿适配所有屏幕尺寸,小程序编岩颤译后,rpx会做一次px换算。换算是以375个物理像素为基准,也就是在一个宽度为375物理像素的屏幕下,1rpx = 1px。这里了解就行灶物,设计稿尺寸375px或750px都没问题。隐枣液


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/yw/12431455.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-25
下一篇 2023-05-25

发表评论

登录后才能评论

评论列表(0条)

保存