移動界面交互設(shè)計(jì)

1、移動互聯(lián)網(wǎng)終端操作界面與交互設(shè)計(jì)研究梅雪目錄1移動設(shè)備界面尺寸移動設(shè)備界面尺寸和基本組成元素和基本組成元素2移動設(shè)備小屏幕移動設(shè)備小屏幕與終端特與終端特殊性殊性對界面與交互設(shè)計(jì)的對界面與交互設(shè)計(jì)的影響影響3移動互聯(lián)網(wǎng)終端文移動互聯(lián)網(wǎng)終端文字的字體與編排字的字體與編排4移動互聯(lián)網(wǎng)終端界移動互聯(lián)網(wǎng)終端界面與交互設(shè)計(jì)模式面與交互設(shè)計(jì)模式概括概括與創(chuàng)新與創(chuàng)新1.移動設(shè)備界面尺寸和基本組成元素移動設(shè)備界面尺寸 VS.移動設(shè)備基本組成元素1.移動設(shè)備界面尺寸和基本組成元素移動設(shè)備界面尺寸iPhone的APP界面一般由四個元素組成，分別是：狀態(tài)欄、導(dǎo)航欄、主菜單欄、內(nèi)容區(qū)域狀態(tài)欄：就是我們經(jīng)常說的信號、運(yùn)營

2、商、電量等顯示手機(jī)狀態(tài)的區(qū)域?qū)Ш綑冢猴@示當(dāng)前界面的名稱，包含相應(yīng)的功能或者頁面間跳轉(zhuǎn)的按鈕主菜單欄：類似于頁面的主菜單，提供整個應(yīng)用的分類內(nèi)容的快速跳轉(zhuǎn)內(nèi)容區(qū)域：展示應(yīng)用提供的相應(yīng)內(nèi)容，整個應(yīng)用中布局變更最為頻繁的P.S. 在最新的 iOS7 的風(fēng)格中，蘋果已經(jīng)開始慢慢弱化狀態(tài)欄的存在，將狀態(tài)欄和導(dǎo)航欄合在了一起1.移動設(shè)備界面尺寸和基本組成元素移動設(shè)備界面尺寸iphone6 plus UI物理版是iphone6 plus實(shí)際的屏幕像素。iphone6 plus UI設(shè)計(jì)版是我們截屏iphone6 plus的界面在ps中去量，發(fā)現(xiàn)的尺寸。iphone6 plus UI放大版是iphone6 p

3、lus的尺寸等比放大1.5倍得出的分辨率。1.移動設(shè)備界面尺寸和基本組成元素移動設(shè)備界面尺寸1.移動設(shè)備界面尺寸和基本組成元素1.移動設(shè)備界面尺寸和基本組成元素Iphone圖標(biāo)尺寸1.移動設(shè)備界面尺寸和基本組成元素Android手機(jī)尺寸1.移動設(shè)備界面尺寸和基本組成元素Android手機(jī)尺寸1.移動設(shè)備界面尺寸和基本組成元素Android手機(jī)圖標(biāo)尺寸1.移動設(shè)備界面尺寸和基本組成元素Android手機(jī)系統(tǒng)分辨率占有率1.移動設(shè)備界面尺寸和基本組成元素Android1、尺寸及分辨率Android 界面尺寸：480 x800、720 x1280、1080 x1920. Android 比 iPho

4、ne 的尺寸多了很多套，建議取用720 x1280 這個尺寸，這個尺寸 720 x1280中顯示完美，在 1080 x1920 中看起來也比較清晰；切圖后的圖片文件大小也適中，應(yīng)用的內(nèi)存消耗也不會過高。 這樣的手機(jī)屏幕尺寸是：5寸 即屏幕對角線是5英寸。2、界面基本組成元素Android 的 APP 界面和 iPhone 的基本相同：狀態(tài)欄，導(dǎo)航欄、主菜單欄以及中間的內(nèi)容區(qū)域.1.移動設(shè)備界面尺寸和基本組成元素AndroidHOLO風(fēng)格將下方的主菜單移動到了導(dǎo)航欄下面，這樣的方式解決了現(xiàn)在很多手機(jī)去除實(shí)體按鍵后在屏幕中顯示而出現(xiàn)的雙底欄的尷尬情景。1.移動設(shè)備界面尺寸和基本組成元素移動設(shè)備界面

5、尺寸iPhone的APP界面一般由四個元素組成，分別是：狀態(tài)欄、導(dǎo)航欄、主菜單欄、內(nèi)容區(qū)域狀態(tài)欄：就是我們經(jīng)常說的信號、運(yùn)營商、電量等顯示手機(jī)狀態(tài)的區(qū)域?qū)Ш綑冢猴@示當(dāng)前界面的名稱，包含相應(yīng)的功能或者頁面間跳轉(zhuǎn)的按鈕主菜單欄：類似于頁面的主菜單，提供整個應(yīng)用的分類內(nèi)容的快速跳轉(zhuǎn)內(nèi)容區(qū)域：展示應(yīng)用提供的相應(yīng)內(nèi)容，整個應(yīng)用中布局變更最為頻繁的P.S. 在最新的 iOS7 的風(fēng)格中，蘋果已經(jīng)開始慢慢弱化狀態(tài)欄的存在，將狀態(tài)欄和導(dǎo)航欄合在了一起2.移動設(shè)備小屏幕與終端特殊性對界面與交互設(shè)計(jì)的影響移動設(shè)備小屏幕的準(zhǔn)確率問題、熱區(qū)和死角與界面元素的布局手機(jī)的移動特征對設(shè)計(jì)的影響F式布局式布局用戶瀏覽網(wǎng)頁的一

6、般模式：先看看頁面的左上角，了解一下這是什么網(wǎng)站（因此此處適合放置Logo)“知道是什么”然后掃描一下頁面的頂部（導(dǎo)航欄，搜索欄）“了解用法”下一步，用戶的視線下移，開始閱讀下一行的內(nèi)容。用戶進(jìn)入“掃描模式”，一旦找到感興趣的內(nèi)容便會打開。2.移動設(shè)備小屏幕與終端特殊性對界面與交互設(shè)計(jì)的影響WEB端界面元素的布局F式布局式布局2.移動設(shè)備小屏幕與終端特殊性對界面與交互設(shè)計(jì)的影響WEB端界面元素的布局F式布局式布局-眼動熱點(diǎn)圖眼動熱點(diǎn)圖熱區(qū)（途中紅色、黃色、橙色部分）代表用戶注意力最集中的地方。2.移動設(shè)備小屏幕與終端特殊性對界面與交互設(shè)計(jì)的影響WEB端界面元素的布局F式布局式布局- 從上到下從

7、左到右按照邏輯，我們得出以下結(jié)論：品牌標(biāo)志和導(dǎo)航應(yīng)該放在頁面的頂部，這是用戶對網(wǎng)站的第一印象。在內(nèi)容結(jié)構(gòu)中，圖片更容易獲得關(guān)注。用戶瀏覽完圖片后，下一個關(guān)注點(diǎn)便是標(biāo)題。用戶會大致的瀏覽文本，但是往往不會通讀。2.移動設(shè)備小屏幕與終端特殊性對界面與交互設(shè)計(jì)的影響WEB端界面元素的布局2.移動設(shè)備小屏幕與終端特殊性對界面與交互設(shè)計(jì)的影響手機(jī)本身的物理特征受限對設(shè)計(jì)的影響用戶體驗(yàn)。UX指用戶體驗(yàn)，UX設(shè)計(jì)指以用戶體驗(yàn)為中心的設(shè)計(jì)。人與系統(tǒng)交互時的感覺就是用戶體驗(yàn)。UX設(shè)計(jì)師研究和評估一個系統(tǒng)的用戶體驗(yàn)，關(guān)注與該系統(tǒng)的易用性，價值體現(xiàn)，實(shí)用性，高效性等。例如，研究一個電子商務(wù)站點(diǎn)的結(jié)賬（checkou

8、t）流程，看看流程是否對用戶友好易用；研究子系統(tǒng)的組件，比如研究用戶在填寫Web表單的時候如何更加高效和舒服。2.移動設(shè)備小屏幕與終端特殊性對界面與交互設(shè)計(jì)的影響移動設(shè)備小屏幕的準(zhǔn)確率問題、熱區(qū)和死角熱區(qū)：點(diǎn)擊區(qū)域的成功率比較高的區(qū)域。死角：點(diǎn)擊區(qū)域的成功率很低的區(qū)域。所以在設(shè)計(jì)當(dāng)中，要盡量將最重要的界面交互元素放置在熱區(qū)范圍當(dāng)中。2.移動設(shè)備小屏幕與終端特殊性對界面與交互設(shè)計(jì)的影響移動設(shè)備小屏幕的準(zhǔn)確率問題、熱區(qū)和死角淘寶UED針對中國人的實(shí)驗(yàn)2.移動設(shè)備小屏幕與終端特殊性對界面與交互設(shè)計(jì)的影響移動設(shè)備小屏幕的準(zhǔn)確率問題、熱區(qū)和死角淘寶UED針對中國人的實(shí)驗(yàn)2.移動設(shè)備小屏幕與終端特殊性對界

9、面與交互設(shè)計(jì)的影響移動設(shè)備小屏幕的準(zhǔn)確率問題、熱區(qū)和死角在右手持機(jī)的狀況下，有效觸控區(qū)域位于屏幕的左下方。2.移動設(shè)備小屏幕與終端特殊性對界面與交互設(shè)計(jì)的影響移動設(shè)備小屏幕的準(zhǔn)確率問題、熱區(qū)和死角底部原則：移動系統(tǒng)或應(yīng)用中一些重要的工具欄或?qū)Ш浇Y(jié)構(gòu)通常被放置在界面底部.底部原則不僅與拇指的作用范圍有關(guān)。當(dāng)我們使用拇指在屏幕上進(jìn)行操作的時候，手指下方的內(nèi)容部分將會被遮擋?。恢挥袑⒔换タ刂圃胤旁趦?nèi)容區(qū)域的下方，才能讓這種負(fù)面效應(yīng)降至最低。其實(shí)這是一條具有廣泛適用性的設(shè)計(jì)原則，我們可以在很多其他類型的設(shè)備中看到這種原理的體現(xiàn)，例如iPod、計(jì)算器、帶有實(shí)體鍵盤的普通手機(jī)、電子秤等，無不是內(nèi)容在上，

10、控制在下。2.移動設(shè)備小屏幕與終端特殊性對界面與交互設(shè)計(jì)的影響移動設(shè)備小屏幕的準(zhǔn)確率問題、熱區(qū)和死角淘寶UED針對中國人的實(shí)驗(yàn)2.移動設(shè)備小屏幕與終端特殊性對界面與交互設(shè)計(jì)的影響移動設(shè)備小屏幕的準(zhǔn)確率問題、熱區(qū)和死角對于iPhone中的客戶端應(yīng)用，盡量將重要的交互對象及導(dǎo)航結(jié)構(gòu)放在界面底部。對于Android中的客戶端應(yīng)用，盡量將重要的交互對象及導(dǎo)航結(jié)構(gòu)放在界面頂部2.移動設(shè)備小屏幕與終端特殊性對界面與交互設(shè)計(jì)的影響移動設(shè)備小屏幕的準(zhǔn)確率問題、熱區(qū)和死角平板電腦的熱區(qū)和死角 由于平板電腦持機(jī)方式不同，熱區(qū)的位置也有所變化。iPad的拿法在很大程度上取決于整個人的姿態(tài)。我們在站著的時候，需要一手

11、持機(jī)一手操作；坐在桌前的時，我們往往會用一只手像支架一樣從側(cè)面架住iPad，而另外一只手用來戳戳點(diǎn)點(diǎn) 持機(jī)的那只手通常會握住機(jī)身的上半部分，因?yàn)檫@樣最符合杠桿原理；相應(yīng)的，拇指熱區(qū)基本會位于屏幕的前三分之一部分，偏向左上角或右上角。其次，iPad的屏幕相對較大，用戶很難像使用iPhone那樣瞄上一眼就能看到界面當(dāng)中的幾乎全部內(nèi)容。用戶通常會首先將目光聚焦于iPad界面的頂部區(qū)域，所以我們的設(shè)計(jì)方案也要相應(yīng)的在這一點(diǎn)上符合用戶習(xí)慣。2.移動設(shè)備小屏幕與終端特殊性對界面與交互設(shè)計(jì)的影響移動設(shè)備小屏幕的準(zhǔn)確率問題、熱區(qū)和死角平板電腦的熱區(qū)和死角在iPad及同類平板設(shè)備的應(yīng)用當(dāng)中，主要的交互控制對象應(yīng)

12、該被放置在界面的左上角或右上角，以便拇指可以很容易的觸摸到。2.移動設(shè)備小屏幕與終端特殊性對界面與交互設(shè)計(jì)的影響移動設(shè)備小屏幕的準(zhǔn)確率問題、熱區(qū)和死角平板電腦的熱區(qū)和死角 盡量避免將交互元素放在屏幕頂端正中間的位置，否則用戶在進(jìn)行操作的時候，手掌會將很大一部分內(nèi)容遮住。 實(shí)際上，任何會對下方內(nèi)容產(chǎn)生直接控制作用的交互元素都不應(yīng)該被放在這個位置。2.移動設(shè)備小屏幕與終端特殊性對界面與交互設(shè)計(jì)的影響移動設(shè)備小屏幕的準(zhǔn)確率問題、熱區(qū)和死角平板電腦的熱區(qū)和死角 盡對于那些起到界面導(dǎo)航作用的交互元素(例如“菜單”、“返回”、“關(guān)閉”等)，以及用來完成分享、收藏、編輯、刪除等功能的按鈕，通?？梢詫⑺鼈兎胖?/p>

13、在界面頂部。對于那些用于瀏覽或預(yù)覽內(nèi)容的控制元素來說，界面底部是最佳位置。2.移動設(shè)備小屏幕與終端特殊性對界面與交互設(shè)計(jì)的影響移動互聯(lián)網(wǎng)終端界面元素的布局（1）由于手機(jī)用戶大多數(shù)情景下是單手操作手機(jī)，所以要考慮到產(chǎn)品的重要功有是否能單手完成，并且要注意在同一個產(chǎn)品中，手勢操作種類不要太多，不要用同一個手勢實(shí)現(xiàn)不同操作。例如現(xiàn)在流行的側(cè)邊滑出欄導(dǎo)航。如果設(shè)計(jì)了左滑可呼出側(cè)邊欄導(dǎo)航那么左側(cè)滑動就不能返回上一級，否則會引引起用戶的混亂。2.移動設(shè)備小屏幕與終端特殊性對界面與交互設(shè)計(jì)的影響移動互聯(lián)網(wǎng)終端界面元素的布局（2）由于移動終端用戶使用場景復(fù)雜，往往有很多干擾，要盡量減輕用戶的記憶負(fù)荷和學(xué)習(xí)成本

14、。在設(shè)計(jì)客戶端的過程中，要求邏輯簡單統(tǒng)一，達(dá)成目標(biāo)的操作步驟要盡量少。2.移動設(shè)備小屏幕與終端特殊性對界面與交互設(shè)計(jì)的影響移動互聯(lián)網(wǎng)終端界面元素的布局（3） 移動應(yīng)用客戶端的界面層次最好不要超過3級，否則網(wǎng)站信息架構(gòu)容易混亂。2.移動設(shè)備小屏幕與終端特殊性對界面與交互設(shè)計(jì)的影響移動互聯(lián)網(wǎng)終端界面元素的布局（4）要善于利用移動終端除了視覺以外的的其他感覺通道信息，例如聽覺、觸覺，用戶也許會一邊使用手機(jī)，一邊做其它事，并非一直盯著屏幕看，所以要使用聲音和振動等方式提示用戶。2.移動設(shè)備小屏幕與終端特殊性對界面與交互設(shè)計(jì)的影響移動互聯(lián)網(wǎng)終端界面元素的布局（5）由于移動設(shè)備常常處于不同的網(wǎng)速中，所以要

15、對交互速度和緩慢的下載速度做出有針對性的設(shè)計(jì)解決方案。特別要注意不要在移動應(yīng)用中濫用圖片，圖片下載速度比文字要慢的多，而且很費(fèi)流量。 另一方面，要給用戶提供反饋。需要讓用戶知道下載進(jìn)行到一個什么樣的階段，還需要多長時間等，在等待時間里展示些小動畫等有趣的東西，這樣做雖然不能加快他們的瀏覽速度，但可以使用戶不至于在無聊中等待。3.移動互聯(lián)網(wǎng)終端文字的字體與編排字體的選擇文字的編排文字的層級關(guān)系設(shè)計(jì)3.移動互聯(lián)網(wǎng)終端文字的字體與編排字體的選擇與大小iPhone 上的字體英文為： HelveticaNeue 至于中文，Mac下用的是黑體-簡，Win下則為華文黑體。下圖是百度用戶體驗(yàn)做過的一個小調(diào)查，

16、可以看出用戶可接受的文字大小，像素為單位，也就是大家在PS里的文字像素大小。3.移動互聯(lián)網(wǎng)終端文字的字體與編排字體的選擇與大小Android 上的字體為： Droid sans fallback ，是谷歌自己的字體，與微軟雅黑很像。同樣，百度用戶體驗(yàn)的調(diào)查中，可以看出用戶可接受的文字相應(yīng)問題。3.移動互聯(lián)網(wǎng)終端文字的字體與編排文字的編排（1） 留足空間字體之間的空間對字體的影響是非常巨大的，甚至超過了字母本身對字體的影響。如果字母間距過窄，將會導(dǎo)致文本閱讀困難。（2）行寬行寬是指一行文字的長度。在上文我們已經(jīng)討論過，一行顯示14個左右的中文字符比較恰當(dāng)。3.移動互聯(lián)網(wǎng)終端文字的字體與編排文字的

17、編排（3）寬松行距、緊密行距行距是行與之間的空隙，如果行距太緊密，會讓視線難以從上一行的行尾過渡到下一行行首。但行距要是太寬松，字間距又會開始形成隊(duì)列。行距通常以1.4em為標(biāo)準(zhǔn)，但在電腦屏上顯示，這樣的距離顯得過于緊密。不過，在移動端行寬變短相應(yīng)也該縮小行距，1.4em是一個恰當(dāng)?shù)倪x擇。3.移動互聯(lián)網(wǎng)終端文字的字體與編排文字的編排（4）不要忽視起伏邊起伏邊是指一段文字的邊緣。現(xiàn)在大多數(shù)中文網(wǎng)站都是居左對齊，所以會導(dǎo)至每行右邊沿參差不齊。當(dāng)視線從上一行行尾掃視到下一行行首時，最好要讓大腦可以估計(jì)下一次跳躍的距離和角度，假如文字左側(cè)邊緣是平的，那么間距保持一致，就能加快閱讀速度。由此有一條很重要

18、的規(guī)則就是不應(yīng)當(dāng)將兩三行以上的文字居中對齊。兩端對齊的意思是把文字設(shè)置成每行文字所占空間是相等的，采用這種方式，兩側(cè)都不會產(chǎn)生起伏邊。但是兩端對齊也有缺點(diǎn)，那就是文字間產(chǎn)生的間隙不一樣寬。甚至有時一行中只有幾個字，而在下一行則填滿了，非常不協(xié)調(diào)。更窄的行寬會加重兩端對齊的問題，因此兩端對齊的文字在移動端是難以閱讀的，所以絕對不能在移動端使用兩端對齊。3.移動互聯(lián)網(wǎng)終端文字的字體與編排文字的層級關(guān)系設(shè)計(jì) 文字間的層能夠告訴用戶哪些是主要信息，哪些是次要信息，引導(dǎo)用戶的閱讀次序和主次。如果網(wǎng)頁中的文字層次不分明會讓用戶感到混亂厭煩、不知所措，沒有主次關(guān)系，使用戶沒有讀下云的欲望，用戶體驗(yàn)差。談到層

19、級關(guān)系時，在HTML代碼語言中我們通常是指的H1到H6這六個層級。另外還有一種特殊的層次也會影響我們的閱讀，即字母間距應(yīng)當(dāng)小于字間距，字間距又得小于行間距，行間距要小于段落間距。要注意這些特殊層次才能在移動端創(chuàng)造最佳閱讀體驗(yàn)。4.移動互聯(lián)網(wǎng)終端界面與交互設(shè)計(jì)模式概括與創(chuàng)新移動互聯(lián)網(wǎng)終端界面與交互設(shè)計(jì)模式概括移動互聯(lián)網(wǎng)終端界面與交互設(shè)計(jì)的創(chuàng)新4.移動互聯(lián)網(wǎng)終端界面與交互設(shè)計(jì)模式概括與創(chuàng)新移動互聯(lián)網(wǎng)終端界面與交互設(shè)計(jì)模式概括內(nèi)容優(yōu)先：界面布局應(yīng)以內(nèi)容為核心，提供符合用戶期望的內(nèi)容。為觸摸而設(shè)計(jì)：界面的交互系統(tǒng)以自然手勢為基礎(chǔ)建構(gòu)，符合人體工學(xué)并保持一致性。轉(zhuǎn)換輸入方式：使用各種手機(jī)的設(shè)備特性和設(shè)計(jì)

20、手段，減少在應(yīng)用內(nèi)的文字輸入。流暢性：保持應(yīng)用交互的手指及手勢的操作流、用戶的注意流和界面反饋轉(zhuǎn)場的流暢性。4.移動互聯(lián)網(wǎng)終端界面與交互設(shè)計(jì)模式概括與創(chuàng)新移動互聯(lián)網(wǎng)終端界面與交互設(shè)計(jì)模式概括多通道設(shè)計(jì)：發(fā)揮設(shè)備的多通道特性、協(xié)同的多通道界面和交互，讓用戶更有真實(shí)感和沉浸感。（多通道設(shè)計(jì)是指系統(tǒng)的輸入和輸出都可以由視覺、聽覺、觸覺等來協(xié)作完成）易學(xué)性：保持界面架構(gòu)簡單、明了，導(dǎo)航設(shè)計(jì)清晰易理解，操作簡單可見，通過界面元素的表意的和界面提供的線索就能讓用戶清楚地知道其操作方式。為中斷而設(shè)計(jì)：考慮應(yīng)用的使用情境，確保在各個產(chǎn)出中斷的情境下，讓用戶恢復(fù)之前的操作，保持用戶的勞動付出。智能有愛：給用戶提

21、供讓他感到驚喜有趣的、智能高效的、貼心的設(shè)計(jì)。4.移動互聯(lián)網(wǎng)終端界面與交互設(shè)計(jì)模式概括與創(chuàng)新為觸摸而設(shè)計(jì)建立手勢交互規(guī)范建立手勢交互規(guī)范在一個移動應(yīng)用中，手勢的統(tǒng)一性非常重要。同一頁面內(nèi)，盡量不要多用幾個手勢操作。讓用戶在應(yīng)用的任何界面中都知道怎么使用手勢，并達(dá)到預(yù)期的結(jié)果。這需要設(shè)計(jì)師提供一套基于應(yīng)用信息架構(gòu)的手勢規(guī)范，它將是導(dǎo)航與交互的基礎(chǔ)。4.移動互聯(lián)網(wǎng)終端界面與交互設(shè)計(jì)模式概括與創(chuàng)新為觸摸而設(shè)計(jì)觸控目標(biāo)的尺寸大小觸控目標(biāo)的尺寸大小最小可用的UI目標(biāo)大小的手指元素是：食指常用操作應(yīng)有7 7毫米1毫米的間距拇指常用操作應(yīng)有8 8毫米2毫米的間距各類型的表單組件應(yīng)該有5毫米的最小間距可觸區(qū)域

22、必須大于可觸區(qū)域必須大于77 mm盡量大于盡量大于 99mm4.移動互聯(lián)網(wǎng)終端界面與交互設(shè)計(jì)模式概括與創(chuàng)新轉(zhuǎn)換輸入方式減少文本輸入，轉(zhuǎn)化輸入形式在數(shù)字輸入過程中，常常會把文字的輸入轉(zhuǎn)化為基本的手勢輸入。手勢操作會以更快的形式進(jìn)行輸入，提升了輸入的效率。如天貓客戶端的價格輸入轉(zhuǎn)化為手勢拔動。簡化輸入選項(xiàng)，變填空為選擇在設(shè)置輸入或者對于一些已知項(xiàng)目的輸入中，盡量把用戶要輸入的內(nèi)容變成選擇。日期、地址等本身可以轉(zhuǎn)化為選擇項(xiàng)的內(nèi)容，盡量使用選擇輸入。使用手機(jī)已有的傳感器輸入使用語音、掃描識別（二維碼、條碼、文字等）減少用戶的輸入，給用戶提供便利。4.移動互聯(lián)網(wǎng)終端界面與交互設(shè)計(jì)模式概括與創(chuàng)新移動互聯(lián)網(wǎng)

23、終端界面與交互設(shè)計(jì)的創(chuàng)新多通道更輕量的設(shè)計(jì)利用留白和卡片式設(shè)計(jì)只用一種字體使用更簡潔的配色方案手勢分層的界面動態(tài)效果4.移動互聯(lián)網(wǎng)終端界面與交互設(shè)計(jì)模式概括與創(chuàng)新多通道更輕量的設(shè)計(jì)“扁平化設(shè)計(jì)” 去除了多余的傾斜和陰影，在 app 中采用一種更加輕量化的美學(xué)，界面更簡單，只關(guān)注獲取核心信息，拋開所有無用的設(shè)計(jì)元素。4.移動互聯(lián)網(wǎng)終端界面與交互設(shè)計(jì)模式概括與創(chuàng)新利用留白和卡片式設(shè)計(jì) 以前，人們會使用線條和各種分隔符號來區(qū)分界面上的不同區(qū)域，但實(shí)際上這種方式現(xiàn)在看來會顯得過于擁擠。在設(shè)計(jì)中去掉線條通過留白和卡片的方式呈現(xiàn)內(nèi)容，可以創(chuàng)造出更干凈的界面。4.移動互聯(lián)網(wǎng)終端界面與交互設(shè)計(jì)模式概括與創(chuàng)新只用一種字體 減少屏幕上字體的數(shù)量才能真正發(fā)現(xiàn)排版的力量。設(shè)計(jì)師不需要使用多種字體，只用一種