圣鉴科技博客

昆山圣鉴网络科技有限公司

微信小程序设计原理

在小程序的设计中,不止腾讯视频,很多产品都做了减法,以产品的角度来思考,小程序本身就是为了实现功能而诞生,如果在设计中加入太多元素,就会让它变的很沉重,如果它是一个独立的APP,这份沉重是可以接受的,但是它生存在微信之中,这份沉重就会显得有些画蛇添足。昆山网站建设




小程序的UI设计该怎么做?



 产品定义 


首先,设计师要准确定义小程序的产品核心功能,通过围绕核心功能,来定制所有的交互与设计。昆山网站建设


 交互设计 


在交互设计中,小程序的设计和APP设计最大的区别在于顶栏的操作,微信小程序是没有顶栏操作内容的,它只有两个个按钮,有点像是我们在浏览web网页时的关闭按钮,小程序的开关有两个功能,切换和关闭



在一般的APP中,顶栏一般会设计栏目或列表,但是在小程序中,由于顶栏的设计属于微信端内,所以在交互上,要考虑界面空间的重新分配。


示例:


摩拜单车

二级页面对比


APP中设计:

个人中心的二级页面是以侧边栏弹窗的形式出现,这个功能也只有在APP中才能独立实现。

小程序设计:

进入了二级页面,右上角添加了返回按钮,这也目前小程序最依赖的交互方式,进入页面和返回。


 视觉设计 


小程序的视觉设计是基于APP产品的主风格来有所简化,那么独立的小程序,视觉该如何设计呢?

和APP一样,整洁的排版,规范有层次的界面设计,再加上有趣的情感化设计(Icon/loading),风格不要偏离产品,与小程序的功能相匹配。



画画猜猜是一款独立的小程序设计,它重新设计了每个图标定制了情感化设计,由于它是一个绘画类游戏产品,所以在设计风格上也有所延伸,不同产品的相对应风格扩展路径也不同,所以在视觉风格上,还是要根据功能来判断。的把握风格,如果看完这篇文章还有什么问题,或不理解的地方,可以在后台或留言板回复,老冰看到会一一解答。

- END -


 欢迎将文章分享到朋友圈 

 内容源自于网络 

 获取素材请回复:笔刷/模板/设计手册/赐我英文字体/赐我好图/RM笔刷/中文字体 


 ▽           上周精选           ▽ 



  昆山优化排名软件         昆山有专业做网站的吗           昆山如何制作小程序










上一篇文章 : 微信小程序如何运作 下一篇文章 : 小程序裂变的优势
cache
Processed in 0.023220 Second.