• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >微信小程序 > 干货:小程序开发文档和设计指南要点详解

干货:小程序开发文档和设计指南要点详解

作者:匿名 字体:[增加 减小] 来源:互联网 时间:2018-11-30

匿名通过本文主要向大家介绍了小程序开发等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com
本文主要对微信官方发布的开发文档和设计指南进行详解:

小程序开发文档

小程序开发方式的整体介绍,并提供了一个官方范例。如果是受邀体验的开发者,可以扫码进行小程序体验。

小程序设计指南

小程序设计规范方面的规定,从用户体验、元素样式到排版,颇为全面。这里很能体现微信对于小程序的重视以及它的巨大能力,担心若贸然开放而不做限定会导致产品碎片化严重。

接下来,我们开始介绍两个文档的具体内容。

一、小程序开发文档

文档中开头即提到:

支持调用微信原生 API,可以方便的调起微信提供的能力,如获取用户信息,本地存储,支付功能等。

其实这里举例的几个功能,在之前的公众号开发都能够实现。对我们来说这句话的重点是“原生”——基本可以判断例如导航条、按钮之类的组件其实都是经过微信的中间层进行了原生组件转化,将有效提高页面的渲染速度和运行效率,提供更加接近于原生App的体验。

演示程序里面显示了几种新的组件,例如下拉,导航条等。由于小程序还提供了基本类似HTML+CSS这样的组合语言工具,我们对新的组件并不惊讶。只要你能够想到,开发者通过微信提供的开发工具应该还能实现更多的组件。

二、小程序设计指南

微信这次的设计规范更加具体深刻,目前尚不清楚官方是否会规定需要按照微信规范去设计、否则不予上架,但我个人觉得随着生态逐渐成熟,按照微信的强硬管理风格也并非没有可能。

不过从另外一个方面来看,微信提供了一种称作WXSS(CSS是它的子集)的样式定义语言,为用户提供了非常强的样式定制能力,即使限制设计规范也应该不会过于死板。

1、WeUI更新

伴随新的设计样式和组件,微信官方的前端UI框架WeUI也迎来了重大更新,并拥有了独立io域名:https://weui.io。

这次更新还同时提供了包括:

Sketch设计控件库:https://github.com/weui/weui-...

Photoshop设计控件库:https://wximg.gtimg.com/shake...

通过提供设计源文件,设计师可以更加方便地参与到微信小程序设计过程。

为了更好地进行一致性设计,最新的设计源文件里面还提供了相应的字体文件。中文字体使用了苹方(iOS)和思源黑体(Android),英文则是SF UI Display(iOS)与Robot(Android)。

2、用户体验规范

文档里面对用户体验的规范也做了部分定义,什么是好、什么是不好都有说明,文档的阅读体验尚可。

从设计规范中可以瞥到小程序的一些重要视觉特性:

3、层级规范

虽然微信的层级简单也没有酷炫的原生动画,但是这次的页面层级规范依旧让我想起Google Material Design当初推出时的惊艳感。

与微信自身类似,微信小程序4个层级很容易理解:

更多干货:小程序开发文档和设计指南要点详解相关文章请关注微课江湖!

分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

相关文章

  • 2018-11-30微信小程序rpx尺寸单位以及样式用法详解
  • 2018-11-30微信小程序实现流程进度功能实例分享
  • 2018-11-30微信小程序实例:如何通过代码来获取头像的昵称
  • 2018-11-30微信小程序商城开发之商城首页福利场不限下拉刷新动态API数据的代码实现
  • 2018-11-30微信小程序开发基础篇之app.js(3)
  • 2018-11-30如何通过http请求添加自定义菜单?
  • 2018-11-23微信小程序云开发API 更新指令
  • 2018-11-30微信小程序学习用demo:简易图片动画红包代码
  • 2018-11-30 微信小程序实现【回到顶部】的按钮效果
  • 2018-11-30小程序开发基础篇之数据绑定下(8)

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • 详解小程序开发登陆、支付和模板消息的实例
    • 微信小程序云开发API 服务端
    • 关于微信小程序中欢迎页面的制作
    • 微信小程序使用audio组件播放音乐功能示例
    • 小程序如何使用swiper组件实现图片切换
    • 微信小程序之跳转传递数据的代码详解
    • 微信小程序实现登录功能的逻辑整理
    • 微信小程序 本地存储及登录页面处理实例详解
    • 微信小程序之绑定点击事件的解析
    • 微信小程序模拟cookie的实现

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有