常州开发APP_常州APP制作公司_常州开发安卓手机APP_常州开发苹果手机APP公司_常州开发软件_常州物联网硬件开发公司_常州点个赞信息科技

常州做小程序界面设计和APP UI设计有什么区别?

2020-08-12 20:04


小程序设计和APP设计到底有什么区别呢?你知道几点呢?
相同点是app和微信,在UI设计的理念上是相通的,就是追求交互设计简单易用、导航路径清晰和操作反馈及时等。
APP和微信小程序都有自己的设计规范和开发文档,我们都需要遵循设计规范和开发规则。总的来说,两者在一些大的UI设计原则处理上可以说是一致的。
很多人都知道小程序是用完既走,是去中心化得产品。同时小程序也只是微信内部的一个连接工具。
而APP可以培养忠实的用户,也可以是忠实用户最喜欢那几款APP。可以和微信独立安装在手机上来快速操作的。
APP的设计规范分为ios设计规范和安卓设计规范,而且不同的操作系统,设计风格略有不同。APP可以是千人千面,设计出很多不同的风格,比如MBE风格、今年流行的迷彩渐变风格等等。
小程序只能维持微信的设计风格来,设计形式比较单一。想要做到不同的设计风格,需要兼容微信设计风格的地方太多,不划算。比如不同风格的按钮、个性化导航、消息提醒等等,都是小程序很难做到的。
下面是常州制作APP开发和微信小程序开发公司点个赞科技分享:APP设计和小程序设计具体模块的不同体现:
 
顶部导航栏
 
App:可以保留导航栏,也可以去掉,可拓展性强,灵活性高。设计师和产品经理都可以在上面创造合适的功能。交互方式也有很多。
小程序:导航栏右侧有个无法去除和编辑的胶囊(titlebar),设计时也不能在导航上增加其他功能。App上是可以的增加其他交互功能,但是小程序不可以,导航栏的功能要换位置或者在放在导航栏下。
另外小程序提供原生和自定义的两种导航栏:
(1)原生的导航栏支持更改颜色,但字体颜色仅支持黑/白两种;
(2)虽然自定义的导航栏可以去除原生导航栏,支持图片通到导航栏上,但是所有页面都需要重新调整(原先导航栏的高度没有了,界面元素会跟着上移),而小程序不支持单个页面修改。自定义导航体验不佳,特别是页面返回逻辑和返回事件有BUG。为什么说小程序只适合做轻量的应用和工具。
开发工程师需要注意的一点:自定义导航容易带来标题无法对齐、页面机型不同安全区域不同、全局刷新时页面会被整个下拉等等问题。
建议页面多、复杂的情况,尽量减少使用自定义导航,能不用尽量不用。以原生的为主。
 
标签栏
 
App:可支持多样的tab,图标大小以及底部标签栏高度可自定义。而且支持红点提醒、数字提醒等。其他节日元素的装饰。
小程序:也可支持最少2个,最多5个的tab切换,使用原生tab控件时,要遵从 图标icon 尺寸3倍尺寸:81*81px。2倍尺寸:54px*54px,设计师不能多的发挥
小程序使用自定义标签栏时,可支持加入交互效果,例如提示数量气泡等,但是体验相比原生差一点,如果标签页是首次进入的页面,那么标签栏切换会造成跳动,需要开发做规避。
观点:建议不带有交互的情况,尽量使用原生控件。
 
组件
 
App:可以自定义组件库,对开发设计限制低。设计师的发挥也可以多样,比如卡片层叠效果。立体旋转效果等等。这些小程序都不无法做到。
小程序:部分组件是由微信创建的原生组件,有系统相机、输入框、地图、文本输入...等等,原生控件使用有一定的限制,不能在滚动、轮播、选择器、拖动区域中使用,层级最高无法被覆盖,可供修改的参数由微信提供。建议在设计时以原生控件为基础修改,不要自造控件。同时注意使用场景,以免无法实现。
 
动画
 
App:动画流畅、无卡顿,想要的动画效果基本都能实现。比如下拉动画可以是多种多样的。APP代码包大小无限制。
小程序:动画能力低于 H5 和 App ,动画对性能消耗大,尤其是在 Android 机型上,卡顿有稍显明显。小程序的下拉刷新只能用一种交互方式,也不能修改。
当加载代码包时,当微信认为这个小程序占用过多的内存,会把此小程序强行退出,以保证微信的正常使用。微信小程序的单个代码包不能超过2M。
而且动画尽量通过css3来实现。不能做复杂的动画效果。
从设计和产品的角度考虑,如果是把app产品转移到小程序上来,必须做减法。
小程序都相较于app化繁为简,突出主要功能。还可以将并联功能改为串联/触发功能来实现页面的简化。
小程序的色彩、图标、风格应和app内一致,但是要考虑目标受众的不同做适量更改。减少banner、实物图标的使用,要实现页面简化和色彩统一。
小程序内容的轻量也有一个重要原因——减少打开时间,用户对于小程序的等待时间要比app少很多。此时加载动效设计好的话,就能够作为一个留住用户的加分项。
 

开发流程

通过对开发需求、开发流程的精准把握及熟练操作,我们实现了一站式定制开发服务。

产品从0-1,必须严格遵循流程才能确保质量与工期!