1. 你有三種握手機(jī)的方法：1、單手握住手機(jī)，用一個(gè)拇指操作;2、雙手握住手機(jī)，用一個(gè)拇指或其他手指操作;3、雙手握住手機(jī)，用兩個(gè)拇指操作。據(jù)調(diào)查，49%的人在戶外使用手機(jī)時(shí)，用單手，一個(gè)拇指操作;當(dāng)你算上使用兩個(gè)拇指操作的人，這個(gè)比例到達(dá)了75%。

2. 拇指觸控區(qū)域：即用單手，一個(gè)拇指操作時(shí)最舒服的操作區(qū)域。當(dāng)使用Web端時(shí)，標(biāo)準(zhǔn)的導(dǎo)航操作在頁面頂部，而現(xiàn)在，手機(jī)的底部成了放置重要操作更好的位置。

3. 內(nèi)容在上，操作在下，這是當(dāng)下設(shè)計(jì)軟件時(shí)的交互設(shè)計(jì)慣例。我們不希望我們的手指在操作的時(shí)候擋住內(nèi)容。

4. 不要太擔(dān)心“左還是右?”的問題，重要的決定都是圍繞著上和下來決定的。

5. 內(nèi)容在上，操作在下已經(jīng)是一個(gè)古老的交互模型了，你可以確保用戶在進(jìn)行任何操作時(shí)都不會遮擋內(nèi)容。

6. 但是在Android上，系統(tǒng)的控制按鈕在設(shè)備的底部，為了不和這些按鈕沖突，Android會建議你將APP內(nèi)的操作放在界面頂部，這意味著我們的手指會頻繁遮擋住內(nèi)容。

7. Web端所擁有的固定位置和高度限制，在手機(jī)瀏覽器的底部會更難定位。有的瀏覽器還在底部使用了自己的工具欄，再次壓縮了空間。因此，在頁面頂部添加錨鏈接，可以提供更快速的導(dǎo)航功能，取代頁腳導(dǎo)航模式。

8. iOS apps：控制鍵在屏幕底部。Android apps：控制鍵在屏幕頂部。Web(手機(jī)瀏覽器)：控制鍵在頁面底部。

　　平板指南

1. 同手機(jī)一樣，握平板的姿勢也是千奇百怪，但通常你握住的是它的兩側(cè)。

2. 在平板電腦上，同樣存在著關(guān)于拇指操作的人體工程學(xué)。考慮使用屏幕頂部區(qū)域放置導(dǎo)航控制鍵，多多利用屏幕兩側(cè)和角落，將中心部分空出來。

3. 相對與頂部與底部來說，夠到屏幕的兩側(cè)是成本最小的。

4. 如果你想通過底部放置的Scrubber控件平移來預(yù)覽內(nèi)容，也是可以有例外的。

5. 為大尺寸平板而設(shè)計(jì)：多多利用屏幕兩側(cè)和角落，將上中部空出來，用底部來查看畫布中的效果。

　　觸控本指南

1. 運(yùn)行Windows8系統(tǒng)的可觸控式筆記本，也開始進(jìn)入市場了，這類設(shè)備要求能夠在傳統(tǒng)筆記本電腦上進(jìn)行觸控操作。

2. 在此類設(shè)備上，當(dāng)同時(shí)支持觸控與鼠標(biāo)鍵盤操作的時(shí)候，觸控是首選交互方式。

3. 為了避免“大猩猩手臂”問題(譯者注：提起大猩猩手臂這個(gè)詞，主要針對傳統(tǒng)的臺式電腦和筆記本終端，這些附帶觸屏功能的終端設(shè)備讓我們使用者長時(shí)間抬著手臂在屏幕上劃來劃去，真的很累人。)，人們通常會將屏幕拉到面前，然后在設(shè)備的邊緣使用拇指進(jìn)行操作。

4. 為了使拇指操作體驗(yàn)最優(yōu)化，你也許會考慮將主要功能放置在屏幕的左側(cè)。這里說的主要功能不是指主導(dǎo)航選項(xiàng)，而是使用頻繁的操作。

5. 拇指在左側(cè)控制關(guān)鍵內(nèi)容的操作，比如分享。

6. 這種舒適的點(diǎn)擊區(qū)域與傳統(tǒng)的桌面系統(tǒng)相比有很大差異。

7. 通過屏幕大小來檢測觸摸屏是一個(gè)糟糕的方法，沒有靠譜的方式來檢測所有的設(shè)備。

8. CSS4 Media Queries提供了一個(gè)屬性為coarse的指針，它允許人們基于觸控交互而改變頁面風(fēng)格(譯者注：eg：http://stuffandnonsense.co.uk/)

9. 由于我們不能可靠地知道所有設(shè)備上觸屏的情況，因此所有的桌面主題設(shè)計(jì)不得不支持觸屏移動。

10. 在你的界面里將懸停狀態(tài)看做一個(gè)優(yōu)化，而非決定性的元素(唯一可以將事情做好的方法)。

　　點(diǎn)擊目標(biāo)尺寸

1. 基于人類普遍的手指指尖點(diǎn)擊面積，最理想的點(diǎn)擊目標(biāo)尺寸為7*7mm，CSS2.1定義了一個(gè)像素的大小為1/96英寸，因此7mm差不多就是30px。但是，由于動態(tài)的視圖變換，事情遠(yuǎn)不止這么簡單。

2. 像素點(diǎn)在動態(tài)的視圖變換中也是變化的。算上這種變化，我們需要將30這個(gè)數(shù)值擴(kuò)大至44，差不多是2.75em。

3. 蘋果公司基本上運(yùn)用44px規(guī)則來設(shè)計(jì)iOS設(shè)備上的原生應(yīng)用。只要你在某一處用到44px的尺寸大小，那么在其他地方你可以用29px。這樣就從生理上，呈現(xiàn)出一種視覺的和諧感。

4. 是的，你得考慮生理維度。不僅要為了手部去設(shè)計(jì)界面，還得使他們?nèi)诤掀饋怼?/p>

5. 當(dāng)你遵循點(diǎn)擊目標(biāo)尺寸相關(guān)的指南時(shí)，你需要權(quán)衡它在設(shè)計(jì)中的比重。也就是說，你越少用到屏幕上的空間完成操作越好。在所有的設(shè)備上，特別是手機(jī)，邏輯清晰勝過一切。

6. 簡單是好的，但別太過分，不要失去重要的復(fù)雜性。復(fù)雜性給了我們生命，給了我們界面的結(jié)構(gòu)。人們不想要愚蠢的界面，他們只要簡單的體驗(yàn)。

7. 在更大的屏幕上，人們都認(rèn)為需要將空白部分填滿，因此導(dǎo)致了界面出現(xiàn)不必要的混亂。

8. 在小屏幕上，次要的信息可以隱藏，使用漸進(jìn)公開的原則揭示信息，因?yàn)樗潜匾?。漸進(jìn)公開：通過逐步地顯示來管理復(fù)雜的信息。

9. 當(dāng)你能控制性能問題的時(shí)候，多余的點(diǎn)擊并沒有什么壞處。在手機(jī)上，我們應(yīng)該更多的考慮多余的操作步驟所帶來的厭惡感。只要一次點(diǎn)擊是高質(zhì)量的，能夠保證信息傳遞的完整，那就不是多余的。

10. 需要留意的是，冗長的內(nèi)容可能會在屏幕中晦澀地來回滾動，畫布外的元素，能幫你解決這個(gè)問題。

　　觸控之外

1. 最好的觸控界面有時(shí)根本不需要你來“觸控”，利用傳感器和語音控制進(jìn)行操作，是交互設(shè)計(jì)的發(fā)展趨勢，這已經(jīng)不再是技術(shù)上的問題，而是如何實(shí)現(xiàn)的問題了。

2. 未來幾年針對設(shè)計(jì)的挑戰(zhàn)，將是如何從單一輸入方式擴(kuò)展至多種輸入并用的方式。

3. 數(shù)碼已經(jīng)越來越接近自然，而自然也變得越來越數(shù)字化。我們要如何讓我們的界面更好的融入真實(shí)世界呢?

via:百度MUX