大家總是把小程序和App放在一起比，因此我也花時間看了一下小程序的開發指南，尤其是UI部分的設計和原則，今天就拿它和蘋果的HIG(Human Interface Guidelines)做個比較，其實兩者在一些大的原則處理上可以說是一致的。
關鍵詞一：友好禮貌
對應於蘋果：Less is more
蘋果在iOS7時做了一個非常大的界面調整，以突出內容為主，去除掉了所有會干擾用戶的界面元素，這個風格一致延續至今(以蘋果自家的App，比如指南針，天氣為例就可以看出)。
微信在指南一開始也強調了這個原則，並用兩個正反示例加以說明。一是不要在搜索頁面上放置不相關因素，最好放上最近搜索詞，常用搜索詞等，二是不要給用戶太多選擇項(現在選擇恐懼症患者越來越多)。
關鍵詞二：清晰明確
對應於蘋果：Clarity
蘋果的HIG中三大原則之首就是清晰，這里面有幾層含義，其中之一就是開發者有義務通過導航欄設置解答用戶的三大疑問：
當前在哪?
可以往何處去?
去的地方能做什么?
微信也再次強調了導航設置清晰的重要性，並且直接在微信層面就把當前在哪和如何回去的問題解決了，開發者只要定義好可以往何處去就OK了，至於導航欄，除了顏色能更改之外，開發者沒什么可以做的了。如iOS的狀態欄提供深淺兩種樣式，小程序導航欄也相應有這兩種樣式，和狀態欄融為一體。
至於選色方案，微信也給出了示例，原則就是要配色和諧，不影響文字的可讀性，這一點其實也是蘋果特別在意的，建議文本和背景色的對比度要在4.5:1 – 7:1之間。
此外，開發者可以在微信導航頁面內再嵌一個自有導航欄，但不建議這么做，如有需要盡量使用標簽分頁(Tab)，有頂部和底部兩種樣式，蘋果對Tab欄的建議是3-5個，微信建議是2-4個，放太多選項不僅讓頁面顯得復雜，且不易於用戶操作。
關鍵詞三：反饋及時
對應於蘋果：Responsiveness
微信花費了大量的篇幅強調加載頁面時必須要及時、有反饋，這一定是跟小程序本身的定位有關系，因此基本上能做的都幫開發者做了，比方說啟動頁除了能加個自有logo外，其余元素都不能改動，很多程序內動畫都是微信標准定義的，這一點和iOS原生App的靈活性差別比較大。
然而，兩者在大的原則上卻如出一轍，要確保界面對用戶的操作做出及時的相應，哪怕是在加載過程當中。由於小程序要突出輕快的特點，微信重點渲染這一部分就不奇怪了，且詳細通過示例講解了不同情況下的處理建議。
關鍵詞四：便捷優雅
對應於蘋果：User Friendly
微信主要提到了減少輸入和避免誤操作的問題，這和蘋果是高度一致的，不過蘋果提供了更多的控件供選擇。
在減少誤操作方面，蘋果要求所有可觸控的范圍要在44pt以上，而微信更精確，把這個換算成了物理尺寸7mm-9mm之間。
關鍵詞五：視覺規范
對應於蘋果：Legibility
蘋果可以說對於文本的可讀性要求極高，並於2015年推出了其自有字體SF(San Fransisco)，一套專門對此進行了優化的字體，此外，還定義了一套動態字體標准，保證任何人都可以愉悅的在iPhone和iPad上閱讀。
而微信在字體上肯定和系統保持一致，其它的考慮和蘋果也是大同小異。不過，為了保證文本清晰可讀，微信更進一步，直接把各種文本的顏色也定義死了，考慮到和自身的協調性，就連鏈接字體，出錯字體，完成字體的顏色也都定死了，沒有任何發揮空間。
最后，我也對比了一下兩者的控件，微信提供的控件非常“微信”，連尺寸，顏色，字號等都規定好了，沒有什么可操作的空間，比方說下圖的Button控件，開發者就在這10幾種樣式里選擇就好了，而相比之下iOS的控件給開發者提供了廣闊的定制空間，這也反映出兩個平台的不同定位。
總體來說，蘋果和微信在UI設計的理念上是相通的，就是簡單、清晰和反饋及時，不過微信在具體的解釋上更加細致，力圖避免誤解。此外，蘋果三大設計原則中除了Clarity，還有Deference(遵從)和Depth(深度)，后兩者是微信談的比較少的，這也是兩者定位不同所致。
總體來說，蘋果和微信在UI設計的理念上是相通的，就是簡單、清晰和反饋及時，不過微信在具體的解釋上更加細致，力圖避免誤解。此外，蘋果三大設計原則中除了Clarity，還有Deference(遵從)和Depth(深度)，后兩者是微信談的比較少的，這也是兩者定位不同所致。
轉載請注明：本文來自常州開發APP公司http://www.66dianzan.com點個贊科技！
