网站地图 | RSS订阅 老铁博客 - 上海SEO优化|上海网站建设|蜘蛛池出租|站群代搭建
你的位置:首页 » 站群搭建 » 正文

小程序设计规范及经验分享(附最新样式库)

2019-5-18 15:58:29 | 作者:老铁SEO | 0个评论 | 人浏览

  最近设计群里经常有人问起小程序设计规范的问题,虽然官方有提供样式库的下载,但是停留在16年版,不是最新的,而设计经验这部分网络上也没有比较全面的分享,这促使我停下手上计划,加快输出本篇文章,正好近期刚结束几个小程序项目,总结下经验,并结合微信小程序的官方设计指南,一起分享给大家,希望帮助大家更快速的上手。

  随着2018年小程序的迅猛发展,小程序现已为各大企业广泛采用,“触手可及、用完即走”的用户体验备受青睐,随之小程序设计也成为设计师的必备技能,那在进行小程序界面设计时,应该如何快速做设计?过程中又要注意哪些问题呢?

  对于已经开发了App的产品,在进行小程序设计时需遵守小程序的规范,同时要保持小程序界面设计与App的风格统一性。

  小程序的“所有页面”右上角位置,都固定放置了小程序的菜单,在设计界面时需预留出该区域空间。

  微信提供了深浅两种配色样式,以便更好的融合到各种风格的页面中,需注意保持小程序菜单清晰的辨识度。

  如果要在小程序菜单附近放置交互元素,要考虑是否有交互冲突,应尽量避免误触的可能。

  建议开发者设计的自有导航样式与微信官方小程序菜单样式保持一定差异,以便区分。

  微信读书既有微信线条外框的DNA, 又区别于官方样式,是不错的综合。以上仅限个人观点,还需用户数据来客观验证。

  顶部标签分页栏颜色可自定义,一般会沿用App的设计风格,以保证两个平台的视觉统一性。

  启动页除品牌Logo外,其他元素都由微信统一提供,且不能更改,设计师需要提供2倍和3倍尺寸的Logo即可。

  全局加载是小程序名称左侧的加载图标。模态的加载样式将覆盖整个页面的,由于无法明确告知具体加载的位置或内容将可能引起用户的焦虑感,建议谨慎使用。

  对于没有开发App来说,可依据官方推出的《微信小程序设计指南》来设计,以确保快速设计出符合规范的小程序。

  小程序设计应遵循友好、高效、一致的设计原则,每个页面都应有明确的重点,清晰明确地告知用户身在何处、又可以往何处去,确保用户在页面中游刃有余地穿梭而不迷路。

  附件文件为sketch版本,后台回复关键词“小程序”即可获取下载链接。返回搜狐,查看更多

  • 本文来自: 老铁博客,转载请保留出处!欢迎发表您的评论
  • 相关标签:小程序控件  
  • 已有0位网友发表了一针见血的评论,你还等什么?

    必填

    选填

    记住我,下次回复时不用重新输入个人信息

    必填,不填不让过哦,嘻嘻。

    ◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。