我們都知道小程序是基於微信的應用,開發必須依賴於微信給的接口(微信給什麽都行),能實現的功能受到很大限制。而且小程序兩年前才上線的時候,功能還有些不完善。
App依托手機系統,可以實現復雜、多功能。App開發積累近10年,各種控件比較完善。換句話說,開發者的能力越大,展示效果越豐富。
2)內存容量
小程序代碼的提交不能超過2M的指定大小,這在壹定程度上限制了開發的可能性。
App就不壹樣了,沒有這部分的限制,我們在更新軟件的時候,經常會看到幾十兆,幾百兆,甚至幾個G的遊戲下載量。
3)體驗和流暢性
小程序的體驗略遜於App。小程序在使用時不那麽穩定,容易出現錯誤閃回,尤其是在壹些功能復雜的應用中。小程序雖然優化了很多,但有時候還是會有停滯感。
2.有什麽區別?包含
1)頂部導航欄
App:可以保留導航條,也可以去掉,可擴展,靈活。
小程序:導航欄右側有壹個膠囊,不能移除和編輯,設計時不能在導航中添加其他功能。所以App轉換成小程序的時候,導航欄的功能要改變,或者放在導航欄下面。
實施效果也略顯欠缺。例如,微信提供原生和自定義導航欄:
(1)原生導航欄支持變色,但字體顏色只支持黑/白;
(2)自定義導航條雖然可以去掉原生導航條,支持圖片傳到導航條,但是所有頁面都需要重新調整(原來導航條的高度沒了,界面元素會上移),小程序不支持單個頁面的修改。
這是目前最麻煩的地方,小規模應用還可以,大規模應用導致工作量大增。
同時,自定義導航容易造成標題無法對齊、不同頁面模型的安全區域不同、全局刷新時頁面會被完全下拉等問題。
建議在頁面較多且復雜的情況下,盡量少用自定義導航。還可以用導航欄背景和圖片背景像馬蜂窩壹樣連接起來,效果不錯。
2)標簽欄
App:可支持最少2個標簽,最多5個標簽,圖標大小和底部標簽欄高度可自定義。
Applet:也可以支持最少2個選項卡,最多5個選項卡。使用原生控件時,應遵循81*81px的圖標大小。
使用自定義標簽欄時,可以支持添加交互效果,比如提示氣泡數量,但體驗幾乎比原生的差。如果標簽頁是進入的第壹頁,標簽欄切換會造成跳轉,需要養成避免。
建議盡量使用無交互的原生控件,就像壹個很酷的小程序。
3)拖動以排序
App:流暢好體驗,比如發好友時拖著照片排序。
Applet:除非必要,否則不建議拖動排序。Android機型上拖動圖片和列表的體驗不夠,會有卡頓的情況。
建議使用上下按鈕而不是上下拖動,或者使用標記對圖片進行排序。
4)文本省略
App:可以實現日常生活中需要的所有文字和段落效果。
小程序:text限制行數,增加省略號,增加全文擴展方案。無法預測行尾位置省略號。
建議通過斷行的方式增加全文展開按鈕,或者控制字數,在文末增加全文展開。
5)本地組件
App:可以自定義組件庫,開發設計限制低。
小程序:部分組件是微信創建的原生組件,包括系統攝像頭、輸入框、地圖、文字輸入等。本機控件的使用受到限制,它們不能用於滾動、旋轉、選擇器和拖動區域。最高級不能覆蓋,可以修改的參數由微信提供。
建議在設計時使用原生控件作為修改的基礎,而不是自制控件。同時註意使用場景,不至於做不到。
6)動畫實現
App:動畫流暢,沒有卡頓,想要的基本都能實現。
小程序:動畫能力低於H5和App,動畫消耗大量性能,尤其是在安卓機型上,略顯明顯。在加載代碼包時,當微信認為這個小程序占用內存過多時,會強制退出這個小程序,以保證微信的正常使用。
建議動畫盡量簡化,盡量做減法設計。
總結
由於小程序本身開發的特殊性,小程序和App設計會有壹些不同,比如:
1.如果有很多復雜的頁面,盡量減少自定義導航的使用。
2.沒有交互,盡量使用原生控件。
3.使用向上和向下按鈕,而不是上下拖動,或者通過標記對圖片進行排序。
4.通過換行符添加全文展開按鈕,或者控制字數,在文末添加全文展開。
5.設計時在原生控件的基礎上修改,不要自己做控件。同時註意使用場景,不至於做不到。
6.精簡動畫,嘗試做減法設計。