不容錯過的IOS7 UI設(shè)計10大準(zhǔn)則

2014-5-19    藍(lán)藍(lán)設(shè)計的小編

轉(zhuǎn)載藍(lán)藍(lán)設(shè)計(   www.bouu.cn  )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供有效的   BS界面設(shè)計 、 cs界面設(shè)計 、  ipad界面設(shè)計   、  包裝設(shè)計 、  圖標(biāo)定制 、  用戶體驗 、交互設(shè)計、   網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)

來源:http://www.chinaz.com/design/2014/0430/349790.shtml

如果您想訂閱本博客內(nèi)容,每天自動發(fā)到您的郵箱中,   請點這里

iOS7的10大設(shè)計準(zhǔn)則涵蓋了UI設(shè)計的交互性、界面信息可讀性、圖形設(shè)計規(guī)范以及信息的組織性等四個方面。讀下去,看看你設(shè)計的UI都做到了么?

iOS7 UI設(shè)計 用戶界面設(shè)計

iOS7 的用戶界面設(shè)計比以往更卓越,并為用戶提供了更具吸引力的獨特體驗,帶來更大的機(jī)遇。在正式寫代碼之前,認(rèn)真考慮UI設(shè)計是否符合這十條設(shè)計準(zhǔn)則,可以提高App的可用性與吸引力。如果要更深入了解iOS7的設(shè)計,你可以閱讀蘋果官方的iOS人機(jī)界面指南(英文版),或者下載知乎用戶翻譯的中文版iOS7 人機(jī)界面設(shè)計指南。

iOS7的10大設(shè)計準(zhǔn)則涵蓋了UI設(shè)計的交互性、界面信息可讀性、圖形設(shè)計規(guī)范以及信息的組織性等四個方面。讀下去,看看你設(shè)計的UI都做到了么?

1、格式化內(nèi)容

iOS7 UI設(shè)計 用戶界面設(shè)計

iOS7 UI設(shè)計 用戶界面設(shè)計

創(chuàng)建屏幕布局的時候,應(yīng)該適適配iOS設(shè)備屏幕。用戶應(yīng)該一次看清主要內(nèi)容,而無需縮放或水平滾動。

2、觸摸控制

iOS7 UI設(shè)計 用戶界面設(shè)計

iOS7 UI設(shè)計 用戶界面設(shè)計

盡量采用專門為觸摸和手勢設(shè)計的界面元素,這樣可以使應(yīng)用程序的交互更加輕松自然。

3、命中目標(biāo)

iOS7 UI設(shè)計 用戶界面設(shè)計

iOS7 UI設(shè)計 用戶界面設(shè)計

設(shè)計可觸控的控件的時候,尺寸不得小于44x44px,只有這樣才能確保觸摸的精度和命中率。

4、字體尺寸

文本中的文字尺寸不得小于11點,這樣才能確保在常規(guī)距離下,無需縮放就可以清晰地閱讀。

5、對比度控制

盡量確保文字色彩對比更明顯,并且調(diào)整文字與背景的對比提高可讀性。

6、間距調(diào)整

不要讓文字出現(xiàn)重疊的狀況。適當(dāng)?shù)卦黾有懈吆托虚g距,提高文字的易讀性。

7、高分辨率

為所有圖片資源提供高分辨率的版本(@2x)。那些未曾@2x的圖像在Retina屏幕上會出現(xiàn)模糊的狀況。

8、防止拉伸

始終控制好圖片的高寬比,可以縮放,但是一定要避免拉伸,這樣可以避免失真。

9、信息架構(gòu)

創(chuàng)建易于閱讀易于調(diào)整的布局,確保界面內(nèi)容的可調(diào)整性。

10、保持對齊

讓文本、圖片、按鈕在界面上保持對齊,相似相關(guān)內(nèi)容合理靠近,讓用戶更容易理解界面信息。

分享本文至:

日歷

鏈接

個人資料

存檔