Please enable JavaScript.
Coggle requires JavaScript to display documents.
06IOS - Coggle Diagram
06IOS
延伸學習
拇指法則
頁面狀態
理想狀態
空值狀態
用戶還沒資料的畫面
局部資料狀態
錯誤狀態
載入狀態
極限狀態
注意
一致姓
文字大小注意
觸控最小限制 44pt x 44pt
規範
Why要讀
降低用戶對產品的學習門檻
了解未來趨勢>>每年的開發者大會
符合官方期待,降低跟工程師的溝通障礙
不一定要100%遵守
工程師不一定操作
規範有沒有註明>有沒有跟規範衝突>有沒有比規範更能解決問題
What
各系統為了使用者體驗或軟體限制給建議跟限制
解析度
單位
PX(Pixel) 像素
任何電子螢幕的最小單位
PT(Point)
一個點包含多個像素
ios字體大小單位
系統
Android-dpi(dots per inch)
一寸擠進多少點
ios-ppi(pixels per inch)
英吋擠進多少像素
數字約高,畫面越細膩
要記每個設備的PPI跟寬高
製作建議用1X
元件導覽
Bars
Navigation bars(導覽列)
標準的返回按鈕
狀態列下方
Search bars
要放清除鍵
可放建議搜尋內容
Tab bar
在APP底端
鍵盤出來後要收起來
最多五個
Tool bar
閱讀頁面時會收起來
Status bar
幾乎不客製化
Button&Controller
Button
狀態
Hover
Pressed
Default
Disabled
啟動特定操作
盡量使用動作
非必要不加框跟背景
Controller
Steppers
小數字時
Switches
Pickers
可以預測或有邏輯
下往上彈出
5行列表的高度
Slider
Text Fields
加清除鍵
Views
Alerts
頻率不要太高
破壞性操作
直向跟橫向都要測試
有選擇時,文字要明確
比較常按右邊的按鈕,所以刪除要放左邊
Tables
乾淨顯示
大量資訊
Action sheets
可以快速執行任務
潛在破壞性操作的確認
小螢幕>>下往上 大螢幕>>彈出
要放Cancel
內容排版
格式塔定理(完形心理學)
封閉性
將獨立元素是為完整的
連續性
解釋構圖方向跟運動模式
接近性
位子相近歸類
對稱性
和諧but比較無聊
相似性
將相似形狀、大小、顏色自動歸類
共同命運
一起運動的物體>>視為一體
More
主體與背景的關係
均衡原理
Safe Area
不把重要按鈕放到下端>>跟滑動主頁有衝突
放在下方旁邊會不像按鈕
規範導讀
字體
英文
預設- San Francisco
Display >=20pt
text<20pt
New york
Large 36~53pt
Medium 20~35pt
small <20pt
Extra Large >=54pt
中文
PingFang
頁面結構
Bars
Controls
Views