網易云課堂-IOS 與Android設計規范

引入:?紅燈停,綠燈行

設計規范是為了培養/適應用戶的使用習慣.

1.平臺頁面布局規范

IOS??經典的延續

文字標識更直接,但是占用更多空間

但空間足夠時,推薦使用文字,而非ICON

底部標簽最多放5個(目前的屏幕)

ANDROID??變化與統一

4.0?是標志性的,平板和手機統一規范

下拉菜單的缺點:?顯得非常重,在狹小的空間內放置過多操作元素

標簽式導航:?把下拉菜單橫排在下邊

右上角操作按鈕過多時,?移動到頁面下端:?容易引起誤操作,但是頁面會更加簡潔

5.0 Material Design

扁平化(IOS7 -2013)意味著所有的事物都只有x軸和Y軸

Material Design?在頁面上加了一個z軸,?提升層次感

與之前的擬物化設計是存在區別的

Z軸意味著,?頁面之間有一個上下的相對位置

如 一個看似懸空的按鈕/?抽屜式導航

2. 平臺常用控件

控件庫是規定好的??樣式

做控件設計的時候,要先看看這個控件是不是平臺自身所帶的,

平臺所帶的是可以直接調用的

IOS:?頁面內搜索框

Android:?搜索圖標

不符合平臺規范的設計會增加開發的工作量

EX:?鬧鐘——時間選擇器

音量調節——滑塊控件

開關控件

雖然操作控件不同,但是基本的交互動作是一樣的.

進度讀取:?無限循環指示器(短時間等待)?vs.?進度條(等待時間比較長)

退出控件—— 無限循環控件

H5頁面加載——進度條

3. 平臺常用手勢

直覺化

快捷高效

隨著大屏的普及,未來的頁面會變得越來越大

通過手勢的滑動和捏合,會帶來很多便利

一切的設計目的都是以用戶的使用場景為中心