HTML5技術(shù)仍在發(fā)展中且發(fā)展尚不完善， web APP應(yīng)用作為該技術(shù)的產(chǎn)物自然也是在不斷試驗中進步；此外，web APP應(yīng)用還要依賴兼容性瀏覽器更強大的渲染能力，俗話說“皮之不存毛將焉附”，在大家都期待的強大瀏覽器出現(xiàn)之前誰也難以預(yù)言web APP應(yīng)用需要做成什么樣才算是一個合格的產(chǎn)品。在這種行業(yè)背景下，web APP應(yīng)用還難以有一個所謂的界面設(shè)計原則，起碼現(xiàn)在還不構(gòu)成總結(jié)一個合理界面設(shè)計原則的條件。
其實，所謂的界面設(shè)計原則本就是從已有的、典型的界面設(shè)計作品中倒推得出的。比如，解構(gòu)主義界面設(shè)計風(fēng)格的提出不是之前就有的，是理論家在分析總結(jié)了建筑界面設(shè)計師蓋里、埃森曼、特斯楚米等大師的典型界面設(shè)計作品，結(jié)合這幾位大師的界面設(shè)計理念后定義的一個流派名稱。所謂的解構(gòu)主義界面設(shè)計原則也是從權(quán)威大師典型作品中歸納總結(jié)的； 界面設(shè)計原則出現(xiàn)后繼而可以對之后的界面設(shè)計起一定的指導(dǎo)作用。
web APP應(yīng)用界面設(shè)計原則，現(xiàn)從已經(jīng)上線的優(yōu)秀產(chǎn)品中選擇典型界面設(shè)計元素與大家討論分享，尋找可以借鑒的地方，并借此增進對web APP應(yīng)用產(chǎn)品界面設(shè)計的認識。
Web APP應(yīng)用界面設(shè)計的實用技巧
Web APP應(yīng)用用戶界面界面設(shè)計，核心是web界面設(shè)計；不過與一般意義上的web界面設(shè)計相比較，web APP應(yīng)用更加注重功能。為了在與桌面應(yīng)用程序的競爭中展現(xiàn)其優(yōu)勢，web APP應(yīng)用需要提供簡潔、直觀、快速響應(yīng)的用戶界面，以便于用戶在任務(wù)操作中節(jié)省精力和時間。
Web APP應(yīng)用的優(yōu)點
◆通過兼容性瀏覽器實現(xiàn)配置而不需要任何復(fù)雜的“轉(zhuǎn)出”步驟；
◆瀏覽器應(yīng)用程序幾乎不需要客戶端上的磁盤空間；
◆新功能從服務(wù)器自動傳遞給用戶，用戶自己不必升級程序；
◆可以輕松整合進入其他服務(wù)類web程序；
◆跨平臺的兼容性
1.界面元素隨需而變
力求簡潔明了是用戶界面界面設(shè)計的重要原則。在同一時間給用戶展示的功能越多，用戶需要尋找和思考的時間也就越多。同樣，界面中存在的選項越少，可用功能就越明顯、越容易瀏覽。不過簡化界面并非輕而易舉，尤其是你不想減少應(yīng)用程序功能的情況下。
2.為模態(tài)窗口增加邊緣陰影
彈出式菜單和窗口周邊的陰影不僅僅是為了視覺美觀。陰影一方面增大了菜單或窗口的尺寸，有助于將菜單或窗口從背景中區(qū)別開來；另一方面通過灰度化的邊緣陰影可以屏蔽背景內(nèi)容的噪音干擾。
這個技巧根植于傳統(tǒng)桌面程序，幫助用戶將注意力集中在彈出的窗口。由于很多模態(tài)窗口不容易從桌面程序內(nèi)容頁面中凸顯出來，陰影可以使它們看起來具有立體效果、仿佛懸浮于其他內(nèi)容之上，于是拉近了模態(tài)窗口與用戶的距離。
界面光源的一致性：一致性是個很大的課題，應(yīng)該能寫一篇論文那么長，細節(jié)方面的一致性應(yīng)該包括界面元素、文字陰影、圖標(biāo)等的光源。假設(shè)深色的標(biāo)題文字用了向下的淡色投影表現(xiàn)內(nèi)凹效果，那正文就應(yīng)該避免用深色的文字向上投深色的陰影
圖標(biāo)面積的一致性：“這也是一個一直難以避免的問題，而且有很多主觀成分，最好的方法是設(shè)計的時候放到實際屏幕上以較遠的距離查看，是不是有哪些會特別輕或特別重，然后再去調(diào)整尺寸
文案：雖然這不是直接的界面設(shè)計元素，但是嚴(yán)謹(jǐn)、完整的文案也是給所有設(shè)計加分的。常見的問題有中文錯別字、英文該大寫的沒大寫、拼寫錯誤等等。
那么，什么樣的圖標(biāo)才能在第一時間吸引用戶的目光，有效增加點擊率呢？
突出的色彩搭配
手機的屏幕很小，界面設(shè)計者必須要讓用戶在打開手機面對幾百個圖標(biāo)時，記住你而不是記住別人，因此圖標(biāo)本身要足夠搶眼。
圖標(biāo)是否醒目、簡潔、明快是最主要的，因此，蘋果為開發(fā)者提供了一個圖標(biāo)高光效果的選項，有了半透明的高光，圖標(biāo)就能適應(yīng)很多背景。
我們可以回想下在配色方面比較顯眼的應(yīng)用圖標(biāo)，唱吧可以算一個。唱吧CEO陳華(微博) 在接受媒體采訪時也曾經(jīng)表示過，紅底白字配色的圖標(biāo)很有效。
例如百度新聞客戶端的圖標(biāo)顏色原來是藍色，后來他們發(fā)現(xiàn)藍色的圖標(biāo)在手機屏幕里基本就被忽略掉了，最后它把自己整個色系都改掉了，換成紅底白字，就是希望用戶打開手機時一眼就能找到這個圖標(biāo)。
簡化再簡化 讓圖標(biāo)更直觀
除了顏色，簡化也是APP應(yīng)用圖標(biāo)界面設(shè)計的法寶。
蘋果界面設(shè)計宣傳師麥克·史登（Mike Stern）曾經(jīng)表示，一款應(yīng)用圖標(biāo)不僅能誘使消費者去購買應(yīng)用，它更能提高用戶與應(yīng)用互動的積極性。如果每次用戶看著一款圖標(biāo)都會有眼前一亮的感覺，那么他們持續(xù)使用這款應(yīng)用的頻率就會更高。
他認為，如果能在界面設(shè)計中避免使用文本就再好不過了。與一長串文字或字母相比，單字或單字母的圖標(biāo)界面設(shè)計更深得人心。
對于使用圖形元素的圖標(biāo)來說，簡化方法可以是找到一個最主要的元素，然后強化它。圖標(biāo)本事就是個抽象的東西，做得太具象、太復(fù)雜反而可能不會吸引人。
構(gòu)建族群效應(yīng)
APP應(yīng)用圖標(biāo)最重要的界面設(shè)計目標(biāo)之一就是讓用戶在下載時第一眼就認出它的功能是什么，在下載后能夠迅速從茫茫的APP應(yīng)用海中選中它。于是一種約定俗稱的圖標(biāo)界面設(shè)計方式出現(xiàn)了，這就相當(dāng)于同一類APP應(yīng)用類屬一個族群，因此在界面設(shè)計上具有共同點。
