目前小程序開發(fā)與APP開發(fā)都屬于熱門需求，由于這兩個(gè)產(chǎn)品差別比較大，因而在設(shè)計(jì)方面是有差異的。主題邦科技分享一下小程序開發(fā)設(shè)計(jì)與APP開發(fā)設(shè)計(jì)的差異。

小程序開發(fā)設(shè)計(jì)與APP開發(fā)設(shè)計(jì)為什么會(huì)有差異？其中原因包括功能支持、內(nèi)存體積、體驗(yàn)及流暢3大方面。功能支持方面，由于小程序是基于微信的應(yīng)用程序，因而開發(fā)必須依靠微信給的接口，能實(shí)現(xiàn)的功能被大大的限制了。而且小程序上線也就2年的時(shí)候，還有一些功能不完善。但APP依靠于手機(jī)系統(tǒng)，可以實(shí)現(xiàn)復(fù)雜且多的功能，App 開發(fā)已經(jīng)有近10年的積累，各類控件比較完善，換句話說就是開發(fā)者能力越大，展示效果越豐富。

那么小程序開發(fā)設(shè)計(jì)與APP開發(fā)設(shè)計(jì)的差異主要有哪些呢？

1、頂部導(dǎo)航欄

APP：可以保留導(dǎo)航欄，也可以去掉，可拓展性強(qiáng)，靈活性高。

小程序：導(dǎo)航欄右側(cè)有個(gè)無法去除和編輯的膠囊（titlebar），設(shè)計(jì)時(shí)也不能在導(dǎo)航上增加其他功能。所以在 App  轉(zhuǎn)小程序時(shí)，導(dǎo)航欄的功能要換位置或者在放在導(dǎo)航欄下。

實(shí)現(xiàn)效果也略欠缺一些，例如微信提供原生和自定義的兩種導(dǎo)航欄：

（一）原生的導(dǎo)航欄支持更改顏色，但字體顏色僅支持黑/白兩種；

（二）雖然自定義的導(dǎo)航欄可以去除原生導(dǎo)航欄，支持圖片通到導(dǎo)航欄上，但是所有頁面都需要重新調(diào)整（原先導(dǎo)航欄的高度沒有了，界面元素會(huì)跟著上移），而小程序不支持單個(gè)頁面修改。這是目前最麻煩的地方，量級(jí)小的應(yīng)用還可以，量級(jí)大的導(dǎo)致工作量大大增加。同時(shí)，自定義導(dǎo)航容易帶來標(biāo)題無法對齊、頁面機(jī)型不同安全區(qū)域不同、全局刷新時(shí)頁面會(huì)被整個(gè)下拉等等問題。

2、標(biāo)簽欄

APP：可支持最少2個(gè)，最多5個(gè)的tab切換，圖標(biāo)大小以及底部標(biāo)簽欄高度可自定義。

小程序：也可支持最少2個(gè)，最多5個(gè)的tab切換，使用原生控件時(shí)，要遵從 icon 尺寸81*81px。

3、拖動(dòng)排序

APP：流暢、體驗(yàn)佳，例如發(fā)朋友圈時(shí)拖動(dòng)照片排序。

小程序：除非必要，否則不建議使用拖動(dòng)排序。圖片和列表拖動(dòng)在 Android機(jī)型上體驗(yàn)不夠，會(huì)有卡頓的情況。

4、文本省略

APP：可實(shí)現(xiàn)日常所需的所有文字、段落效果。

小程序：文本限制行數(shù)，加省略號(hào)，并且增加全文展開方案實(shí)現(xiàn)有問題。無法預(yù)估到行尾位置省略。

5、原生組件

APP：可以自定義組件庫，對開發(fā)設(shè)計(jì)限制低。

小程序：部分組件是由微信創(chuàng)建的原生組件，有系統(tǒng)相機(jī)、輸入框、地圖、文本輸入...等等，原生控件使用有一定的限制，不能在滾動(dòng)、輪播、選擇器、拖動(dòng)區(qū)域中使用，層級(jí)最高無法被覆蓋，可供修改的參數(shù)由微信提供。

6、動(dòng)畫實(shí)現(xiàn)

APP：動(dòng)畫流暢、無卡頓，想要的基本都能實(shí)現(xiàn)。

小程序：動(dòng)畫能力低于 H5 和 APP ，動(dòng)畫對性能消耗大，尤其是在 Android 機(jī)型上，卡頓有稍顯明顯。當(dāng)加載代碼包時(shí)，當(dāng)微信認(rèn)為這個(gè)小程序占用過多的內(nèi)存，會(huì)把此小程序強(qiáng)行退出，以保證微信的正常使用。

主題邦科技——靠譜的技術(shù)伙伴，為企業(yè)提供一站式技術(shù)服務(wù)。主要業(yè)務(wù)范圍有：APP開發(fā)、小程序開發(fā)、微信開發(fā)、電商系統(tǒng)開發(fā)、物聯(lián)網(wǎng)（IOT）開發(fā)等互聯(lián)網(wǎng)+領(lǐng)域。

小程序開發(fā)：www.hbshxjd.com

app開發(fā)報(bào)價(jià)：www.hbshxjd.com/tag_141

app開發(fā)要多少錢：www.hbshxjd.com/tag_94

廣州app開發(fā)：www.hbshxjd.com/application