小程序界面设计规范的几种表现形式Bar设计

菏泽炫佑科技 菏泽炫佑小程序开发 菏泽炫佑app制作 炫佑科技

小程序界面设计规范的几种表现形式Bar设计

随着2018年小程序的快速发展，小程序现已被各大企业广泛采用，“触手可及、随用即走”的用户体验备受青睐，小程序设计成为设计小程序必备技能。在这个过程中我们应该注意哪些问题？

对于已经开发应用的产品，小程序设计必须符合小程序规范，并保持小程序 UI 设计和应用风格的一致性。

小程序设计领域

在小程序的“所有页面”的右上角，有固定的小程序菜单，在设计界面时需要预留该区域的空间。

导航栏设计

1.小程序菜单固定样式

微信提供了深浅色和深浅两种配色样式，以便更好地融入各种风格的页面，并注意保持小程序菜单清晰可辨。

在线案例：

2. 交互注意事项

如果要在小程序菜单附近放置交互元素，请考虑是否存在交互冲突，尽量避免意外触摸的可能性。

建议开发用户设计的自有导航风格与微信官方小程序菜单风格不同，以区别于他们。

如上图所示，小红书本人的导航风格不被个人推荐，原因如下：微信

阅读有微信线框的DNA小程序界面设计规范的几种表现形式Bar设计，有别于官方的风格，是一个很好的综合。以上仅为个人意见，需用户数据客观核实。

3.搜索框的几种常见表现形式

工具栏设计

1. 小程序设计规范

顶部标签分页栏颜色可以自定义，一般遵循应用的设计风格，保证两个平台的视觉统一。

2.几种常见表现

标签栏设计

1. 小程序设计规范

微信底部标签样式为小程序，建议标签数量为2-4个。

您也可以根据产品的需要选择或删除底部标签栏功能。

2.几种常见表现

启动页图标

除品牌logo外，启动页的其他元素均由微信提供，无法更改，设计师只需提供logo尺寸的2倍和3倍。

加载样式

1. 小程序设计规范

全局加载是小程序名称左侧的加载图标。模态加载样式将覆盖整个页面，建议谨慎使用，因为无法清楚地分辨加载的位置或内容，这可能会引起用户的焦虑。

2. 常见加载样式

需要告知用户具体的装载位置和形状，以减少用户的焦虑。

对于没有开发的应用怎么样制作网页小程序，可以按照官方的微信小程序设计指南进行设计，确保能够快速设计出符合规范的小程序。

小程序设计应遵循友好、高效、一致的设计原则，每个页面都应有明确的重点，清晰明确地告知用户他们在哪里，可以去哪里，以便用户可以在页面中移动而不会迷路。

平台设计网站推荐

*后，推荐一些常用的平台来设计网站。

1.BAT各平台小程序设计标准网站

微信小程序设计指南：

支付宝小程序设计规格：

百度智能小程序设计规范：

2. 其他常用设计规范网站

Apple-HMI 指南：

详细介绍了 iOS 设计规范，以及可供下载的 UI 设计资源。

-MD 设计指南：

蚂蚁设计：#ds

适用于移动设备和 Web 的设计组件，以及包含设计示例和学习技巧的文章。

微信风格库：

在微信内提供网页和小程序设计规范。

炫佑科技专注互联网开发小程序开发-app开发-软件开发-网站制作等