国产欧美三级日韩_可以免费看日韩无码黄色电影_91九色成人在线_亚洲伊人精品久久久久_国产精选视频一区二区三区不卡播放无码_影音先锋在线资源观看男士天堂影院网站_黄色软件免费网站_人妻中文字幕无码久久αV_欧美亚洲国产成人一区二区_欧美日韩一级特黄大片免色

對(duì)于如何設(shè)計(jì)一款學(xué)習(xí)成本低、辨識(shí)度高、有個(gè)性的APP，iOS和Android均給出了對(duì)應(yīng)的建議，就是《iOS設(shè)計(jì)規(guī)范》和《Material Design設(shè)計(jì)規(guī)范》。

規(guī)范中對(duì)導(dǎo)航、手勢(shì)、通知、控件等方面都做了描述，并給出了相應(yīng)的建議和檢查清單。實(shí)際工作中，當(dāng)然并不是一定要按照規(guī)范中描述進(jìn)行APP設(shè)計(jì)，然而依然可以使用上述規(guī)范作為我們?cè)O(shè)計(jì)的參照，盡量避免一些明顯的問(wèn)題。

基于兩個(gè)平臺(tái)的用戶(hù)一致性的體驗(yàn)、以及節(jié)省UI設(shè)計(jì)和研發(fā)成本的考量，整理了兩個(gè)平臺(tái)設(shè)計(jì)規(guī)范差異和共融之處。

設(shè)計(jì)語(yǔ)言不一樣

—

iOS/Flat Design視覺(jué)效果

iOS/Flat Design是手機(jī)界面設(shè)計(jì)的里程碑

化繁為簡(jiǎn)，其核心思想就是讓“信息”本身凸顯出來(lái)，在設(shè)計(jì)元素上則強(qiáng)調(diào)了抽象、極簡(jiǎn)和符號(hào)化。

Andorid/Material Design視覺(jué)效果

核心思想是“數(shù)字紙墨”的空間，層級(jí)層次分明。

離用戶(hù)最近的材料，投影最大，色彩越鮮明，越推薦用戶(hù)使用

Meterial Design（材料設(shè)計(jì)）賦予UI設(shè)計(jì)新的方向

“Z軸概念”陰影大小直接體現(xiàn)了材料之間的距離

動(dòng)畫(huà)原理

—

動(dòng)畫(huà)設(shè)計(jì)原理不同（1）

動(dòng)效不僅僅是為了視覺(jué)效果上的酷炫，更是幫助用戶(hù)，

更好的理解層級(jí)、轉(zhuǎn)場(chǎng)關(guān)系和關(guān)注到終點(diǎn)信息的利器

動(dòng)畫(huà)設(shè)計(jì)原理不同（2）

近實(shí)遠(yuǎn)虛，對(duì)焦物體清晰，背景模糊—?斯模糊

近大遠(yuǎn)小，全景&特寫(xiě)，長(zhǎng)焦&短焦

Android還原機(jī)械物理運(yùn)動(dòng)

Meterial Design的隱喻是紙張，用戶(hù)的手指就像磁鐵一樣把電子紙墨吸引過(guò)來(lái)；點(diǎn)擊后就會(huì)泛起“漣漪”作為一個(gè)交互相應(yīng)，離用戶(hù)手指越近的元素越亮，陰影越深。

動(dòng)畫(huà)接近真實(shí)

物理世界中的運(yùn)動(dòng)和變化都是有加速和減速過(guò)程的，忽然開(kāi)始、忽然停止的勻速動(dòng)畫(huà)顯得機(jī)械而不真實(shí)

完整規(guī)范

Android Material Design

iOS Design

單位尺寸

—

單位尺寸不一樣

PPI是什么？

PPI（pixels per inch），即像素密度

這項(xiàng)指標(biāo)是連接數(shù)字世界與物理世界的橋梁

pixels per inch，準(zhǔn)確的說(shuō)是每英寸的長(zhǎng)度上 排列的像素點(diǎn)的數(shù)量。

iPhone 3gs的屏幕像素是320x480 iPhone 4s的屏幕像素是640x960 剛好兩倍，然而兩款手機(jī)都是3.5英寸的。

Pt、dp、sp是什么？

iOS的開(kāi)發(fā)單位

Pt（“points”的縮寫(xiě)，點(diǎn)）1pt=1/72英寸

Android的開(kāi)發(fā)單位

dp（density-independent pixel） 即“密度無(wú)關(guān)像素”

Android的字體單位

sp（scale-independent pixel） 即“獨(dú)立比例像素”，主要用作字體的單位

設(shè)計(jì)稿尺寸

使用設(shè)計(jì)工具Sketch

完整的設(shè)備尺寸，以pt、dp為單位的矢量工具

矢量圖形，輸出方便，一鍵輸出切圖資源

強(qiáng)大的sketch插件—藍(lán)湖

切圖和標(biāo)注統(tǒng)一在sketch上解決完后，在藍(lán)湖直接獲取資源

https://lanhuapp.com/

字體規(guī)范

—

關(guān)于字號(hào)/字高的知識(shí)點(diǎn)

段落

布局原理

觸摸點(diǎn)擊區(qū)域

Android

最小觸摸區(qū)域 48x48 dp

最小點(diǎn)擊區(qū)域 24x24 dp

iOS

最小觸摸區(qū)域 44x44 pt

頁(yè)面基礎(chǔ)布局

iOS（pt）

size：375x667

status：20

Android（dp）

size：360x640

status：24

Android的8dp網(wǎng)格基線(xiàn)

組件等獨(dú)立容器使用8dp網(wǎng)格基線(xiàn)，組件容器內(nèi)小元素可使用4dp網(wǎng)格基線(xiàn)

Android尺寸的增量值

以 8dp/pt 為參數(shù)增量值，間距可使用4dp/pt為增量值

常用值：8/16/24/32/48/56/64/72/80/88/96…

感謝您耐心的讀完，規(guī)范知識(shí)內(nèi)容比較多，分為兩部分講，敬請(qǐng)期待～

-  END  -

如果覺(jué)得有幫助，請(qǐng)關(guān)注我的公眾號(hào)【 UX設(shè)計(jì)筆記 】，每天推送小知識(shí)