用戶UI界面設(shè)計(jì)里的陰影如何應(yīng)用？

有不少UI界面上的許多元素傾向于模仿真實(shí)世界表現(xiàn)效果，其中最為常用的就是陰影的設(shè)計(jì)應(yīng)用。當(dāng)用戶移動(dòng)到目標(biāo)元素上，元素的高度會(huì)發(fā)生變化，從而導(dǎo)致產(chǎn)生陰影，下面隨我們一起看看用戶UI界面設(shè)計(jì)里的陰影如何應(yīng)用的吧。

不同的陰影，會(huì)直接影響用戶對(duì)UI設(shè)計(jì)界面的看法。其實(shí)當(dāng)光線投射到現(xiàn)實(shí)世界的物體上時(shí)，會(huì)產(chǎn)生兩種不同的陰影。第一個(gè)是主核心陰影，通常是最靠近物體的薄而暗的環(huán)。第二種是投射陰影，屬于物體后面的陰影較淺和較厚的。

大多數(shù)設(shè)計(jì)師未能正確顯示這兩個(gè)陰影。他們傾向于只使用一個(gè)具有大模糊度和高不透明度的投影。這樣做會(huì)使表面邊緣過(guò)于模糊和粗糙。
主核心陰影的應(yīng)用：
是顯示陰影的正確方法是使核心陰影變暗并緊貼表面。如，具有 10% 不透明度的 1 像素 Y 軸和 3 像素模糊效果很好。

投射陰影的應(yīng)用：
再用更大的模糊和更深的 Y 軸使投射陰影更亮。一個(gè)好的默認(rèn)值是 6 像素 Y 軸和 12 像素模糊，不透明度為 8%。結(jié)果是一個(gè)表面有兩個(gè)不同的陰影，從而模仿真實(shí)世界的陰影。

您可以將此投影應(yīng)用到產(chǎn)品的UI界面或者某一組件上，并劃入設(shè)計(jì)規(guī)范。合理科學(xué)的使用陰影的變化，會(huì)讓UI界面看起來(lái)更為專業(yè)，在視覺(jué)上也更吸引人，記住，細(xì)節(jié)決定成敗。