<cite id="69pgq"></cite>
  • <rt id="69pgq"><table id="69pgq"></table></rt>

  • <rt id="69pgq"><meter id="69pgq"><p id="69pgq"></p></meter></rt>
    <source id="69pgq"><meter id="69pgq"><button id="69pgq"></button></meter></source>
  • <s id="69pgq"><div id="69pgq"><thead id="69pgq"></thead></div></s>
  • <source id="69pgq"><nav id="69pgq"><strike id="69pgq"></strike></nav></source>
    <rt id="69pgq"><meter id="69pgq"></meter></rt>
  • 當前位置: 移動互聯網學院 > UI培訓 > UI設計 > 17個提升用戶體驗的 UI 設計小技巧
    17個提升用戶體驗的 UI 設計小技巧 時間:2017-07-21     來源:移動互聯網學院

    下面由設計師應晝雨成總結了17個提升用戶體驗的 UI 設計小技巧,也是我們日常用到的很基本的技巧,對于新手UI設計師建議一看,注意案例中「對」與「錯」不是絕對的,僅用于參考作用。

    01、圖標保持統一性

    圖標是UI設計里非常重要的模塊之一,重要的一點是要保持風格統一。

    如果是填充型的圖標,那么一套設計里不要出現線性的圖標設計。

    其次就是描邊大小的統一,定下了3px就要全套保持即可。

    后圖標要做到識別度和差異性。

    02、字體運用保持統一

    字體合理運用是UI設計很重要的一點,要么字體很不相同,要么就用一款字體。

    像第一個案例,字體字形比較接近,但是又不是一款字體,看久了會非常突兀。

    其次就是要突出主視覺文案的時候,要盡量把輔助字體縮小,形成對比。

    03、風格保持統一性

    目前流行的兩種設計方式,第一:扁平化 第二:卡片式。

    卡片式有意思的就是運用投影來模擬現實的距離感和層級。

    如果選用卡片式的設計方式,那么全局盡量都要運用上投影效果,不要一塊卡片,一塊扁平,風格保持統一很關鍵。

    04、投影的合理運用

    投影選用的顏色正確和錯誤,直接拉低作品的質量。

    在工作中,按鈕等控件使用投影盡量用吸取工具,把主色調提取出來,把明度壓低一些,總這要保持同色系的投影,這樣才會符合視覺邏輯。

    其次,如果按鈕上有文字,文字盡量不要純白,記得帶一些同色系的淡淡顏色。

    05、圖片類APP排版突破

    規則是死的,人是活的。

    很多時候,如果需求是比較寬且走文藝氣息的時候,要嘗試突破原則,用一些另類的排版方式,其實也是做好設計的本質。

    在圖片類app中,錯落一些的排版會使你的作品更有魅力。

    06、適當留白

    好的設計,是在少的元素下還能第一時間突出重點信息。

    極簡是一種趨勢,你要減少不必要的元素,或者簡化元素。

    不要想著把畫面撐滿就是好的設計,有時候,適當的留白,會給用戶呼吸的空間更重要。

    07、正確使用文案

    如果經常用第一種方式給客戶看稿件,那么你很難通過。

    做方案時,文案符合標題或者產品主旨才行,其次就是上下間距一般是20-28,一般用24就夠。

    千萬不要全部放無關的文案,很拉低你的設計水準。

    08、輔助文字的運用

    輔助文字的合理運用,也是提升質感和視覺的關鍵點。

    如果有一個或者多個主要的視覺要素,那么輔助的文字大小盡量比主視覺要小,顏色要比主視覺淺。

    比如主文字字號 24px,輔助視覺就要14-18左右即可。

    09、輔助線段的作用

    線段的作用,主要是區分信息層級。

    所以輔助線段一般采取淺色調處理,千萬不要過重會顯得很臟,拉低整體質感。

    10、引導頁風格統一

    引導頁的作用,是引導用戶如何使用產品或者提醒更新內容。

    不能為了設計而設計,要把握住主題,針對主題進行圖標等元素設計;

    比如新增查閱文件夾功能,那么就要根據文件夾,放大鏡等元素進行設計。

    如果用一個掃描儀的元素肯定是錯誤的了。

    其次就是風格的統一,如果都是圖標,或者都是圖片,那么全套都要統一。

    11、間距的統一性

    間距的統一性,是排版中時刻要注意的。

    等距等比是保證界面干凈整齊的一個關鍵要素。

    切記,要么處處一致,要么全都不一致。

    12、顏色的合理性

    顏色的合理運用,是至關重要的。

    一個app或者一個界面盡量要保證一個主色調,一個輔色調即可。

    不要出現干擾或者與主色調無關的顏色,這樣會導致用戶質疑你到底是不是一款產品。

    其次就是,想讓用戶點擊什么按鈕,那么取消按鈕好弱化視覺。

    13、輔助指引的運用

    這一點是很多人忽視的,一款好的設計或者好的產品,一定要做好輔助指引工作。

    比如上面的兩個登陸界面,如果再輸入過程中有相應的指引,那么會減少用戶出錯的幾率,也會減少來回點擊查看這個框是干什么的次數,總之,指引很關鍵。

    14、該突出就大膽突出

    很多時候,對比突出做到位了,才能讓用戶第一跟進來把注意力集中在一個點上。

    比如上面第一個案例:沒有形成鮮明的對比,用戶進來就會不知道先把注意力集中在哪個點上,第二個是正確的作法。

    15、讓用戶知道在什么位置

    用戶位置,是交互邏輯上很重要的一點。

    你要讓當前位置足夠清晰,要一眼看到現在什么位置才是正確的,不要害怕對比過程,你要做的就是告訴用戶,我在這里。

    16、根據閱讀順序做設計

    人的正常習慣閱讀順序是,從上而下,從左到右,所以在做某些需求的時候,需要考慮閱讀順序這個概念,要讓用戶快的時間獲取到文字信息。

    17、恰當跟隨漸變色趨勢

     

    總結

    2017年自從淘寶ui改版后,漸變色又逐漸流行起來,但是也不能盲目跟隨,還是看產品主要氣質。

    其次就是運用漸變色彩不要跨色系,盡量同色系,根據明度的變化來調節,太浮夸太夸張就是不適合的了。

    這17個 UI 設計指南,都是設計界面的基本技巧,還有更多的細節要在項目時自己體會,這樣就會慢慢進步、提升了。

    26uuu久久天堂在线