小程序页面设计规范和案例大全

更新时间：2023-02-17 16:07:21

小程序是中国独有的一种互联网产品类型，它的发展历程从最初的被忽视到后来的火爆流行。起初，小程序仅限于微信平台使用，但是随着它的普及，许多其他的互联网平台也开始支持小程序的开发，并制定了自己的小程序设计规范。因此，在设计小程序页面时，应当遵循平台的小程序规范。本文将会提供两方面的内容：首先，我们将分享和整理微信小程序规范；其次，我们将推荐一些优质的免费小程序设计资源。一起来看看吧！

1.微信官方文档：小程序页面设计技巧都在这

小程序是由微信发布的，因此从微信官方获取信息是最有效的方法。微信官方文档中提供了详细的小程序页面设计规范，按照这些规范参考，基本上可以制作出一个合格或者优秀的小程序页面设计。优秀的小程序页面设计通常应该满足以下4点：友好礼貌、清晰明确、便捷优雅、统一稳定。其中，友好礼貌包括设计重点要突出，流程要明确，避免让用户被其他内容打断。

如果遵循清晰明确的原则，导航设计就会变得十分清晰明了。用户可以轻松地进入和退出系统，不会感到困惑或迷失。在出现异常情况时，系统也会立即反馈，让用户感到异常情况可以被有效控制，并有路可退。这些原则旨在为用户提供感觉清晰明了、操作流畅的体验。

在遵循便捷优雅的原则的情况下，我们需要考虑减少用户的输入和避免误操作。在移动端设计中，用户主要使用手指进行操作，但手指的精确度有限。因此，我们应该在界面设计中尽量减少用户的输入，同时避免在界面上堆砌过多功能，以免用户在不小心时操作误触。

2.学习和引用：优质免费小程序页面设计资源

小程序的视觉设计，微信出了一个系统性的视觉规范，从字体、列表、表单输入、按钮、图标等几方面做了明确的设计规范可供参考。

WeUI 设计规范库（浅色）

来源：wechat

看这篇文章，我整理了好几款不同类型的小程序设计资源，重点是：免费可商用！

出行旅游类小程序设计

来源：即时设计团队

电商购物类小程序

来源：即时设计团队

生活社区类小程序界面设计

来源：即时设计团队

电商家居类小程序设计

来源：即时设计团队

最后

在这篇文章中，我通过以微信小程序的页面设计规范为例，来提取出小程序页面设计的一些技巧。除了这些理论知识之外，使用优质的免费小程序设计资源也是一种非常有效的学习和制作小程序的方法。希望这篇文章能够对你有所帮助。