<em id="09ttv"></em>
    <sup id="09ttv"><pre id="09ttv"></pre></sup>
    <dd id="09ttv"></dd>

        • 做設計有一道及格線,標準肯定是“它”

          2021-6-30    seo達人



          很多設計師容易犯一個錯:設計不明確

          設計一旦不明確,就容易讓用戶產生疑惑,甚至認為出現了bug!

          我的原則就是,要么不做變化,要做咱就做的徹底一點,明確一點!

          我從以下方面舉幾個例子:

          1.間距

          2.大小

          3.樣式

          4.顏色

           

          1.間距

          當信息內容需要區隔的時候,最常用的兩種方式:

          一種是加一條細細的分割線;

          另一種是加一條粗粗的分割塊:

          我們有一次在加分割塊的時候就出現了一個小失誤,把分割塊設定為4pt:

          這樣會存在什么問題?

          會讓用戶懷疑,這是粗一點的線條?還是細一點的色塊?

          所以為了避免這樣情況的發生,線條就細點0.5pt,色塊就粗點10pt(反正稍微大一點就行),明確一點:

          再比如之前有一個小案例,大概的信息是這樣排版的:

          不細看也沒啥大問題,但是仔細觀察就會發現,在間距方面有一定的優化空間。圖上有六條信息,實際是三組,如果間距不做徹底,就會讓人感覺是獨立的六組,但如果把間距做的徹底一點:

          這樣就可以很明確看出,這是三組信息,而不僅僅只是六條信息。

          所以要么就不分組,既然分了,就分的徹底一點!

           

          2.大小

          界面內信息有很多,這么多信息,有些需要強調,有些可以弱化。

          很簡答一個例子,有時候大字后面需要跟一個小字,如果你沒區分開就是這樣的效果:

          這樣就很不明確,到底是做了大小變化?還是出現了bug?

          所以盡量把二者區分開,比如大小對比、顏色區分、粗細變化:

          這樣就可以很明確!

           

          3.樣式

          前短時間有位讀者朋友發我一組圖標,圖標源自追波,我覺得整體做的還可以,但是有一個樣式上的小細節可以優化下。

          整體圖標樣式都是有厚度的,但是郵件這個圖標看起來就有些猶豫,想表達厚度,但是又沒表達清楚:

          圖標源自追波

          所以可以讓厚度的寬度加大,并且把側面的顏色和正面區分開,這樣就可以把厚度更明確的表達出來。

          再比如之前做過一個引導頁,需要做一個影帶,最開始做的是這樣的:

          不知道的還以為是個手表帶,所以必須要仔細觀察影帶的特征,并將其明確的表達出來,比如兩邊的孔是方形的,整體材質要軟一下等等:

          這樣表達才明確,用戶才不會困惑!

           

          4.顏色

          下面兩組顏色:

          左面這組可以很好的突出一個顏色,而右面這組就很難突出某一個顏色。

          在界面設計中,有很多場景下,會有多個按鈕,我們需要強調其中一個,就需要采用這種徹底的對比方式:

          而不是讓人模凌兩可,分不清主次的方式:

          明確一點,用戶就不困惑了。

          我們再來一個例子!

          其實工作上有很多優化需求都是基于“明確”這個點展開的,前一陣子做的一個排行榜獎牌標識的優化,我們看看原來的樣式,就是因為顏色對比度不夠,產生數字看不清的情況:

          在這樣的背景下,我們就可以拉大顏色對比度,讓數字更清晰、更明確:

          這就是基于“明確“這個點,進行的需求優化。

           

          總結

          今天講的都是做設計不夠明確的小案例,也是很多朋友容易忽略的問題。

          ios有一條設計原則就是清晰,清晰的本質就是做的足夠徹底,該強調的強調,該弱化的弱化,比如他們超級醒目的大標題:

          當我們能把設計做的足夠明確、足夠有節奏感的時候,就可以減少一定的稚嫩,使設計更穩更成熟!

           

          原文地址:菜心設計鋪(公眾號)

          作者:菜心設計鋪


          轉載請注明:學UI網》做設計有一道及格線,標準肯定是“它”

          藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請掃碼藍小助,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系。

          截屏2021-05-13 上午11.41.03.png


          文章來源:站酷   作者:陳皮Celia 

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.
          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

          藍藍設計www.sdgs6788.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 平面設計服務

          日歷

          鏈接

          個人資料

          藍藍設計的小編 http://www.sdgs6788.com

          存檔

          国产福利电影一区二区三区久久久久成人精品综合 | 丰满少妇人妻久久久久久| 久久久精品人妻一区二区三区四| 99久久99久久精品免费看蜜桃 | 亚洲AV无码久久精品狠狠爱浪潮| 99久久精品国产高清一区二区 | 国产一区二区精品久久岳| 一级做a爰片久久毛片免费陪| 久久w5ww成w人免费| 久久久久一级精品亚洲国产成人综合AV区| 人妻无码久久精品| 国产成人久久久精品二区三区| 亚洲伊人久久精品影院| 久久国产精品一区| 国产∨亚洲V天堂无码久久久| 久久这里有精品| 久久亚洲高清综合| 99久久www免费人成精品| 精品久久久久久中文字幕人妻最新| 日日狠狠久久偷偷色综合免费| 94久久国产乱子伦精品免费 | 亚洲AV无码1区2区久久| 一本久久综合亚洲鲁鲁五月天| 国产精品伊人久久伊人电影| 99国产欧美久久久精品蜜芽| 无码国产69精品久久久久网站| 伊人热热久久原色播放www| 久久久久国产一级毛片高清板| 久久精品国产只有精品2020| 2020久久精品国产免费| 国产成人久久精品激情| 99国产欧美久久久精品蜜芽| 精品久久8x国产免费观看| 久久精品国产清高在天天线| 久久亚洲精品成人AV| 久久水蜜桃亚洲av无码精品麻豆| 久久久一本精品99久久精品88| 久久久久久久精品妇女99| 97精品依人久久久大香线蕉97| 亚洲午夜久久久久妓女影院| 中文字幕无码免费久久|