国外亚洲成av人片在线观看,热99re久久精品这里都是精品,天堂网在线最新版www,国产成人av区一区二区三,51久久成人国产精品麻豆

第一部分：導(dǎo)航

在移動(dòng)端，導(dǎo)航是APP最重要的區(qū)別。根據(jù)不同的內(nèi)容，選擇不同的導(dǎo)航方式。

按照使用頻率的排序，有以下幾類(lèi)！

Tab導(dǎo)航

Tab 導(dǎo)航分上下兩種。是最常用的導(dǎo)航形式。

很多iOS應(yīng)用，采用這種導(dǎo)航。比如：istegrame（安卓和IOS都是Tab，舉例用安卓）,微博，微信，iOS很多原生應(yīng)用也采用這種方式，比如撥號(hào)，時(shí)鐘，APP store，一般的瀏覽器等。

在iOS上，Tab點(diǎn)擊切換，不能滑動(dòng)切換。因?yàn)閕OS系統(tǒng)把頁(yè)面滑動(dòng)留給了單條item的滑動(dòng)操作，或者頁(yè)面返回。但是有些導(dǎo)航本身可以滑動(dòng)，比如新聞?lì)惪蛻?hù)端的導(dǎo)航。

在android,Tab可以點(diǎn)擊切換，也可以滑動(dòng)切換，有些導(dǎo)航本身可以滑動(dòng)。在頁(yè)面頂部的Tab，有可以活動(dòng)的樣式，就是有部分Tab隱藏在頁(yè)面外面，滑動(dòng)后出現(xiàn)。比如豌豆莢的界面。

關(guān)于數(shù)目，頁(yè)面底部的Tab一般位置固定，最多五個(gè)。再多就不好操作了。Tab本身可以滑動(dòng)的界面，Tab數(shù)量可以多一些。

優(yōu)勢(shì)：所有的入口都可以看見(jiàn)，容易尋找。

劣勢(shì)：總會(huì)占據(jù)屏幕下方的一條欄目，在瀏覽信息的時(shí)候，會(huì)阻擋內(nèi)容。Tab的數(shù)目有限，5個(gè)已經(jīng)是極限。

適用的場(chǎng)景：導(dǎo)航條目不多，使用頻率相差不太大的應(yīng)用。

抽屜導(dǎo)航（漢堡導(dǎo)航）Navigation Drawer

這種導(dǎo)航在社交的應(yīng)用中最常見(jiàn)，比如Facebook，path，之前的Google+，購(gòu)物類(lèi)的應(yīng)用入亞馬遜，知乎客戶(hù)端等，在iOS和Android平臺(tái)上都 比較常見(jiàn)?，F(xiàn)在漢堡菜單里， 抽屜導(dǎo)航在其二級(jí)頁(yè)面可隱藏也可以不隱藏，一直出現(xiàn)。

適用的場(chǎng)景：

• 分支類(lèi)目超過(guò)3個(gè)，這種導(dǎo)航多少都能裝的下
• 某一類(lèi)目的層級(jí)較深， 比如Facebook的news feed ，
• 用戶(hù)使用時(shí)，某一類(lèi)要頻繁訪問(wèn)，使用頻率明顯超過(guò)其他

優(yōu)勢(shì)：可以容納多個(gè)分支類(lèi)目，隱藏多余的類(lèi)目，使當(dāng)前頁(yè)面簡(jiǎn)潔

劣勢(shì):

• 有部分類(lèi)目，當(dāng)前頁(yè)面不可見(jiàn)，需要用戶(hù)尋找，增加了認(rèn)知成本。
• 類(lèi)目之間的切換成本較高。

九宮格導(dǎo)航

最典型的就是美圖類(lèi)應(yīng)用，如美圖秀秀，百度魔拍，在二級(jí)目錄用九宮格，如旅游類(lèi)應(yīng)用，如攜程，去哪兒，支付寶等。這種導(dǎo)航模式現(xiàn)在用越來(lái)越少了，在首頁(yè)只有導(dǎo)航而沒(méi)有實(shí)際的內(nèi)容，和以?xún)?nèi)容為主的趨勢(shì)相悖。

適用的場(chǎng)景：

• 這種導(dǎo)航適用于幾個(gè)功能沒(méi)有交叉的應(yīng)用。
• 功能較多，較分散。

優(yōu)勢(shì)：類(lèi)目清晰，容納很多類(lèi)目無(wú)壓力。

劣勢(shì): 首屏沒(méi)有內(nèi)容，只有入口。

list模式

首頁(yè)是一條條的item，item有單文字的，也有圖文結(jié)合的。比如說(shuō)：一般的設(shè)置頁(yè)面。

適用的場(chǎng)景：

• 以很多內(nèi)容為主的應(yīng)用，比如設(shè)置。
• 以一條條內(nèi)容為主的，通常和其他導(dǎo)航一起使用，比如知乎日?qǐng)?bào)，新聞APP。

優(yōu)勢(shì)：內(nèi)容突出

劣勢(shì): 不適合層級(jí)較深的應(yīng)用

復(fù)合導(dǎo)航

現(xiàn)在，應(yīng)用大多有復(fù)雜的多項(xiàng)功能，導(dǎo)航也適應(yīng)這種情況，復(fù)合使用。

典型的就是新版QQ的導(dǎo)航，底部Tab和抽屜導(dǎo)航共用，抽屜部分放置不常用的個(gè)人各項(xiàng)信息，主體的應(yīng)用采用底部Tab導(dǎo)航模式。

支付包的客戶(hù)端，大框架采用底部Tab的模式，Tab支付寶項(xiàng)，采用九宮格式的模塊設(shè)計(jì)，放置了很多功能模塊，入口非常清晰。

和支付寶類(lèi)似的，還有一些旅游類(lèi)應(yīng)用，去哪兒，攜程等。

三種導(dǎo)航共存，比如美團(tuán)的客戶(hù)端，底部Tab做大框架導(dǎo)航，團(tuán)購(gòu)的類(lèi)目中，有九宮格式的入口，也有l(wèi)ist模式展示比較詳細(xì)的信息。

最后，每一種導(dǎo)航都有自己使用的范圍，看了很多應(yīng)用的設(shè)計(jì)，沒(méi)必要只局限于一種導(dǎo)航模式。根據(jù)每一種應(yīng)用要呈現(xiàn)和表達(dá)的內(nèi)容選擇。

在每一個(gè)模塊選用合適的呈現(xiàn)方式。

第二部分：安卓和ios的區(qū)別

iOS和Android的區(qū)別，想了很久，也沒(méi)想出特別多，這兩個(gè)系統(tǒng)有些東西越來(lái)越通用（設(shè)計(jì)上來(lái)說(shuō)），尤其是Android上，可以實(shí)現(xiàn)所有的效果，當(dāng)然有些看上去iOS很像。長(zhǎng)得和iOS很像的Android應(yīng)用很多，好多大牌也這么做，比如說(shuō)現(xiàn)在的QQAndroid5.1.1。這樣只需要一套設(shè)計(jì)，出一套資源就OK了，比較高效節(jié)約。兩個(gè)平臺(tái)的使用體驗(yàn)比較統(tǒng)一，但我還是喜歡有各系統(tǒng)設(shè)計(jì)本來(lái)特色的設(shè)計(jì)，安卓感覺(jué)的應(yīng)用，wp感覺(jué)的應(yīng)用。

做一款純粹的Android應(yīng)用，真是讓人興奮的一件事情。

區(qū)別，在這兩種系統(tǒng)的原生應(yīng)用里就能發(fā)現(xiàn)。Android 一直在尋找合適的設(shè)計(jì)語(yǔ)言，最新的material design，和以前相比，又是一個(gè)大轉(zhuǎn)變。iOS相對(duì)比較穩(wěn)定。

這里的區(qū)別，聚焦在界面設(shè)計(jì)中，不涉及底層的內(nèi)容（是你不懂寫(xiě)不出來(lái)吧）區(qū)別，這些的區(qū)別也不絕對(duì)。

導(dǎo)航方式

iOS的Tab放在頁(yè)面底部，不能通過(guò)滑動(dòng)來(lái)切換，只能點(diǎn)擊。也有放在上面的，也不能滑動(dòng)，但有些Tab本身可以滑動(dòng)，比如天貓的。還有新聞?lì)惖膽?yīng)用。

Android一般放在頁(yè)面頂端，可以通過(guò)滑動(dòng)頁(yè)面來(lái)切換Tab，當(dāng)然Tab可以點(diǎn)擊切換，Tab多的話，Tab本身也可以滑動(dòng)。比如豌豆莢，百度貼吧 ，QQ?？傊?，Android啥都可以有。（其他導(dǎo)航方式，見(jiàn)上一篇）

單條item的操作

iOS單條item的操作有兩種，點(diǎn)擊和滑動(dòng)，點(diǎn)擊一般進(jìn)入一個(gè)新的頁(yè)面，滑動(dòng)會(huì)出現(xiàn)對(duì)這條item的一些常用操作，如微信里滑動(dòng)一條對(duì)話， 會(huì)出現(xiàn)標(biāo)記未讀和刪除。

Android中，單條item的操作也有兩種，點(diǎn)擊和長(zhǎng)按，點(diǎn)擊一般進(jìn)入一個(gè)新的頁(yè)面。長(zhǎng)按進(jìn)入一個(gè)編輯模式，可以在里面進(jìn)行批量和其他一個(gè) 操作，比如刪除，頂置等等。比如小米的短信頁(yè)面；長(zhǎng)按也可以彈出情境操作欄dialog，進(jìn)行操作，比如Android版的微信。

例外的是，Android里面也可以有單條item的滑動(dòng)，如新版QQ，這種比較少見(jiàn)。安卓L的短信，可以滑動(dòng)進(jìn)行歸檔。大Android啥都可以有。

關(guān)于排版

iOS喜歡在居中排布。

Android喜歡左對(duì)齊，感覺(jué)左對(duì)齊更安卓。

實(shí)體鍵

iOS只有一個(gè)實(shí)體鍵（音量，電源不算哈），home鍵，這個(gè)鍵有這么幾個(gè)功能：

• 按一次，回到桌面。
• 雙擊，出現(xiàn)多任務(wù)界面
• iOS8里面，輕觸兩下Home鍵，調(diào)出單手模式
• 指紋解鎖

Android有四個(gè)實(shí)體鍵（現(xiàn)在很多被屏幕上的虛擬鍵代替，但功效是一樣的）4.4一下的分別是back鍵，home鍵，menu鍵，和搜索鍵。4.4及以上，是back鍵，home鍵，多任務(wù)鍵。安卓原生是這樣，經(jīng)過(guò)優(yōu)化的Android就不一定了，比如魅族的smart bar，根據(jù)當(dāng)前頁(yè)面情景變化，不過(guò)蠻好用。

Android的back鍵，在大部分情況下，和頁(yè)面上的返回功效一樣。不過(guò)，Android的back鍵可以在應(yīng)用件切換，還可以返回主屏幕。這個(gè)iOS里面的鍵不能在應(yīng)用間直接切換。

動(dòng)效

兩者的動(dòng)效似乎差別不大，iOS有的，安卓都有。iOS實(shí)現(xiàn)的通常更加流暢，卡頓較少。

兩者都強(qiáng)調(diào)模擬現(xiàn)實(shí)世界的動(dòng)畫(huà)效果，比如物體運(yùn)動(dòng)有一定的加速度，動(dòng)畫(huà)的結(jié)束和開(kāi)始速度小，中間速度大。

谷歌最新推出的material design，變化比較大，但這種設(shè)計(jì)風(fēng)格還沒(méi)有大面積使用。這種設(shè)計(jì)風(fēng)格，最突出的特點(diǎn)就是有一個(gè)懸浮按鈕。這個(gè)懸浮按鈕，代表了這個(gè)頁(yè)面的主要操作，位置可以在頁(yè)面上部，也可以在下部分。這次的動(dòng)效也是亮點(diǎn)，動(dòng)畫(huà)實(shí)時(shí)實(shí)地的反饋用戶(hù)的操作，動(dòng)畫(huà)在用戶(hù)的點(diǎn)擊出開(kāi)始觸發(fā)。又很多類(lèi)似漣漪的效果。

這種按鈕的動(dòng)效變化，概念稿多，好像還沒(méi)有實(shí)際的案例。（馬上就有啦…正在做）

浮窗

安卓里可以看到各種浮窗，流量，清理內(nèi)存等等。iOS暫時(shí)還不支持這樣的浮窗。越獄的貌似可以。

這兩個(gè)平臺(tái)，只有想不到，幾乎沒(méi)有不可以實(shí)現(xiàn)。

安卓更加開(kāi)放，可自定義的東西也更多，做花樣的話，安卓的限制更少。

第三部分:移動(dòng)端的搜索

幾乎每個(gè)移動(dòng)端的應(yīng)用都有搜索按鈕，小小總結(jié)一下。

移動(dòng)端的應(yīng)用，幾乎每個(gè)都有搜索，就想著歸納下各種移動(dòng)端的搜索。

用白板歸納一下是這樣子的~

從上面的歸納可以看出：

搜索有三個(gè)狀態(tài)

1 搜索按鈕，出現(xiàn)的搜索條

2 點(diǎn)擊搜索后，跳頁(yè)直接彈出鍵盤(pán)

• 返回/取消
• 搜索歷史
• 搜索熱詞
• 搜索分類(lèi)

3 輸入內(nèi)容后

• 實(shí)時(shí)搜索/搜索按鈕
• 全刪按鈕
• 返回/取消

實(shí)時(shí)搜索現(xiàn)在用的越來(lái)越多，很少有需要點(diǎn)擊搜索的了。就像改版了的百度一樣。

第四部分:交互文檔的三個(gè)階段

寫(xiě)交互文檔的一些心得體會(huì)：

1 自己完稿——重要的功能 和其表達(dá)方式！

• 功能架構(gòu)——用思維導(dǎo)圖畫(huà)出來(lái)
• 頁(yè)面布局——把所有頁(yè)面都列出來(lái)
• 順細(xì)節(jié)——所有的步驟都要有，越詳細(xì)越好

2 小組討論，過(guò)了幾輪后，然后又確定了一輪。

• 新問(wèn)題，新需求，方向跑偏了的需求理解
• 細(xì)節(jié)加強(qiáng)，更好的表現(xiàn)方式
• 從開(kāi)始第一次打開(kāi)用的時(shí)候，易用性的一系列設(shè)計(jì)
• 開(kāi)始考慮文案，特別是首次使用為空的引導(dǎo)

3 當(dāng)3的時(shí)候，文檔告一段落，設(shè)計(jì)開(kāi)發(fā)已經(jīng)開(kāi)始。但是此時(shí)，在后期仍有問(wèn)題出現(xiàn)，比如一個(gè)功能修改，要有一些細(xì)節(jié)再加強(qiáng)！

• 及時(shí)跟進(jìn)開(kāi)發(fā)結(jié)果（這次跟進(jìn)不夠及時(shí)）
• 這時(shí)候還會(huì)遇到很多問(wèn)題。在以上環(huán)節(jié)頁(yè)面都是靜態(tài)的，有很大部分靠想象。這時(shí)候會(huì)遇到實(shí)際操作中更多的問(wèn)題。及時(shí)修改，始終堅(jiān)持有用的功能，易用的操作，及時(shí)的反饋，看得懂的流程。
• 總結(jié)

寫(xiě)文檔的目的：

1 梳理功能，交互細(xì)節(jié)給相關(guān)開(kāi)發(fā)人員查看，清楚簡(jiǎn)潔，便于查看。

2 專(zhuān)業(yè)性，交互的輸出文檔

作者：王帆

本文來(lái)源：UI中國(guó)