小程序设计稿能用828吗

微信小程序的设计只需要以iPhone6屏幕尺寸750x1334px为视觉稿进行设计即可，因为微信小程序以rpx为css尺寸单位，rpx可以根据屏幕宽度进行自适应，规定屏幕宽度为750rpx，因此在iPhone6设计稿上1px=1rpx，在尺寸换算上就会很简单。

在这里插入描述

小程序的所有页面，包括小程序内嵌网页和插件，微信都会在其右上角放置官方小程序菜单，样式尺寸及布局如上图。开发者不可对其内容自定义，但可选择深浅两种基本配色以适应页面设计风格，如下图。

在这里插入描述

字体规范

在这里插入描述

小程序的字体依然遵循微信原生视觉规范：微信内字体的使用与所运行的系统字体保持一致，常用字号为20, 18, 17, 16,14 13, 11(pt)，使用场景具体如上图。

在这里插入描述

无彩色——主内容Black黑色，次要内容Grey灰色；时间戳与表单缺省值Light灰色；大段的说明内容而且属于主要内容用Semi黑；

在这里插入描述

有彩色——蓝色为链接用色，绿色为完成字样颜色，红色为出错用色，Press与Disable状态分别降低透明度为20%与10%；

顶部导航栏navigationBar

在这里插入描述

顶部导航栏一般简称导航栏，标准高度：128rpx，一般只做底色修改，标题区与导航区要进行自定义开发也是可以的，不过要注意设计的自有导航样式与微信官方小程序菜单样式要保持一定差异，以便区分。

标签分页导航tabBar

标签分页导航栏一般简称标签栏，标准高度：98rpx，可固定在页面的顶部或底部，便于用户在不同分页间做切换。标签数量在2-5个，为确保点击区域，建议标签数量不超过4项。一个页面也不应出现一组以上的标签栏，可根据产品需求选择或去掉标签栏。

1底部标签栏

在这里插入描述

顶部标签分页栏颜色可自定义。在自定义颜色选择中，务必注意保持分页栏标签的可用性、可视性和可 *** 作性。

d窗

在这里插入描述

无论是APP还是Web网页，d窗总是出现在页面的最上层，但是在小程序里导航栏跟标签栏的层级是最高的，以至于优先级较高的d窗在这里也要有所收敛，因此在设计和开发时，都需要注意避免踩坑。

启动页

在这里插入描述

小程序启动页是小程序在微信内一定程度上展现品牌特征的页面之一。本页面将突出展示小程序品牌特征和加载状态。启动页除品牌标志（ Logo ）展示外，页面上的其他所有元素如加载进度指示，均由微信统一提供且不能更改，无需开发者开发。

加载样式

无论是APP还是小程序，加载都不可避免，同样长时间的加载等待会引起用户的不良情绪，因此，在不可避免的加载和等待时，给予及时的反馈以舒缓用户等待的不良情绪都是必需的。小程序里除了自定义加载样式，更是依赖微信提供了一系列加载样式：

1页面下拉刷新加载

在这里插入描述

在微信小程序内，微信提供标准的页面下拉刷新加载能力和样式，开发者无需自行开发。

2页面内加载反馈

在这里插入描述

开发者可在小程序里自定义页面内容的加载样式。建议不管是使用在局部还是全局加载，自定义加载样式都应该尽可能简洁，并使用简单动画告知用户加载过程。

3模态加载

在这里插入描述

模态的加载样式将覆盖整个页面，由于无法明确告知具体加载的位置或内容可能引起用户的焦虑感，因此应谨慎使用。除了在某些全局性 *** 作下不要使用模态的加载。

4局部加载反馈

在这里插入描述

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

5全局加载反馈

以“获取文章评论列表”功能为例子，分以下几个步骤完成：

1、根据文章id获取评论列表（评论需要分页，所以还需page，limit参数）；

2、评论有上下级关系（回复评论），循环获取子评论；

3、获取评论的用户信息；

4、时间格式化（小程序云服务器提供的系统时间需要进行格式化，如不需要可）

小程序具有良好的用户体验可以通过以下几点进行考虑：

1、重点突出

每个页面都应该有明确的重点，便于用户每进入一个新页面都能快速理解页面内容，尽量避免无关的干扰。

2、流程明确

在用户进行某一 *** 作流程时，应避免出现用户目标流程之外的内容而打断用户。

3、导航明确

开发者需要不同导航方式进行配合，选择的颜色满足可用性的前提下，和谐搭配微信提供的两套主导航栏图标；

页面内的导航尽量简洁明了；

标签分页导航，可固定在页面顶部或者底部，便于用户在不同的分页间做切换。

4、加载反馈

当不可避免地出现了加载和等待的时候，需要予以及时的反馈以舒缓用户等待的不良情绪；

若加载时间较长，应提供取消 *** 作，并使用进度条现实载入的进度；

载入过程中，应保持动画效果，无动画效果的加载很统一让人饿产生该戒面已经卡死的错觉；

不要在同一个页面同时使用超过一个加载动画。

5、结果反馈

根据实际情况， *** 作的结果也应给予明确的反馈，可以选择不同的结果反馈样式。

6、明确使用过程中的错误 *** 作

在出现异常时予以用户必要的状态提示，并告知解决方案，在表单页面中尤其是表单项较多的页面中，应明确指出错误项，以便用户修改。

7、减少输入

采用摄像头识别接口帮助用户输入或者是利用组件让用户做选择而不是键盘输入。

8、统一稳定性

接入微信的小程序还应该时刻注意不同页面间的统一性和延续性，在不同的页面尽量使用一致的控件和交互方式。

免费申请小程序的方法：

1、注册制作小程序的第一步，都是先到微信公众平台里注册。在公众平台点击“立即注册”，选择账号注册类型。（“小程序”认证过的公众号可以免费申请小程序）在微信公众平台上点击右上角：“立即注册”。

选择微信小程序，使用一个没有注册过公众平台的邮箱来注册小程序，填写小程序账号信息后，系统会发送一个邮件，你登录相应邮箱激活账号完成注册流程即可。

2、完善信息接下来比较关键，激活后，选择“主体类型”：个人、企业、政府、媒体或者其他组织。按照你的用途选择。注册完成后即可使用小程序账号密码登录小程序后台。

在设置里填写完善小程序信息的名称、头像和账号等信息，提交后等待微信审核。比如如果在选择主体的时候如果你是需要商业用途的小程序，在选择主体类型的时候选择：“企业”，企业类型选择：“个体工商户”，然后填写企业名称和营业执照。

注册方式选择：“微信认证”。进入小程序后台根据自己需要设置一下小程序就可以了。完成注册后，回到小程序第三方工具的编辑器，点击授权微信小程序账号即可。tips：如果你是已认证的企业类型公众号，直接登录自己的公众账号，进入小程序管理的“快速注册并认证小程序”就行了。

3、生成小程序如果你想快速上线发布一个自己的小程序，那么使用第三方开发工具来做比较方便。还是以商用的“xx线了”电商模板为例，先选择模板，进入到“xx线了”后台，选择创建小程序里的电商，然后再选中一个你喜欢的模板直接导入就行了。

选择好模板后，就可以添加商品、装修店面了。最后一个程序就是分页设置，添加各种板块的快捷方式，就完成了一个成熟小程序的大体了。最后，点击左下角立即发布，然后按要求授权就好了。

这种方法制作的小程序都是比较简单的，如果想要更多的功能，建议源码开发。

小程序怎么做？是很多朋友都关心的问题，不知道完整的制作流程是什么样？一起来看看吧。

第一步：申请小程序账号

第一步就是在微信公众平台申请小程序账号并认证。因为是制作支持在线交易的购物商城小程序，所以在小程序认证时，选择的主体类型必须是有营业执照的企业或个体工商户，个人是无法申请的。

另外需要注意的是，认证小程序是要按年收取300元认证费用的。如果你有已经认证过的企业主体微信公众号，是可以通过快速注册并认证小程序，则不用再缴纳300元认证费了。按照小程序注册流程申请、认证好账号，再完善小程序相关信息。这样，第一步完成。

第二步：选择靠谱的小程序服务商

如果有自己的专业技术团队的企业制作小程序，这里就不说了，直接开发即可。对于个体商家来说，第二步要做的就是选择一家靠谱一点的小程序服务商，这些服务商提供的小程序商城模板价格不贵，功能也比较丰富，而且店铺装修难度不大。

第三步：小程序商城装修

选择好服务商，在对选择的小程序商城模板进行店铺装修，不同的服务商提供的商城模板不一样，但基本都是可视化 *** 作，根据教程 *** 作都是比较简单的，一般店铺装修的内容包括模板风格、分页导航、各种模块(轮播图、商品列表、商品展示样式、广告图等)，同时在后台可以设置商品分类并且上传商品了。

第四步：小程序商城测试

购物小程序商城装修完成后，可以先预览下，同时可以内部测试各项配置的功能是否有问题，也就是先内部测试体验下，确保小程序上线后功能都正常。

第五步：小程序商城发布

内测确定没问题了再授权，然后提交给微信官方审核，审核通过后就可以完成发布上线了。具体的发布流程根据不同服务商的要求来 *** 作就行。

首先看看官方提供的模态d窗

api如下：

示例：

这样的模态d窗，充其量只能做个alert，提示一下信息。

但是并不能使用它来处理复杂性的d窗业务，因此写了Michael从新自定义了一个，采用了仿原生的样式写法

wxml：

wxss：

js:

相关连接： >

以上就是关于小程序设计稿能用828吗全部的内容，包括:小程序设计稿能用828吗、小程序云函数多个函数的同步使用、怎样改善小程序的用户体验等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！