UI設計的五大原則

Annie Lin
AAPD — As A Product Designer
4 min readApr 20, 2017

UI設計師針對於使用者介面的視覺,以及互動上進行設計。當然每一次的設計經驗累積,慢慢會形成一些準則讓下次的新設計能夠有所依循。以下跟大家分享我在設計中整理出的五個UI設計原則(以下為個人經驗,僅供參考)

原則一、讓使用者在點擊區域更容易點選

我們在做一些輸入框、按鈕等點選區域的時候,假設你設計元件特別小的情況下,使用者點擊會更加費時。在使用外部裝置點選則更加費時(例如用滑鼠點選東西),所以在設計時可將點擊反應熱區做大一些,使用者在點選時就會更加容易、方便。

原則二、適當地將文字描述轉換圖形展示

文字與圖形的排列會使設計更具層次,將介面上的內容做優先順序的區分。文字與圖形之間的對齊、間距、顏色明暗、尺寸大小等,都是需要很精準的設置才能使畫面更加俐落簡潔(俗話說的好:魔鬼藏在細節中)。也能提高使用者在瀏覽的可讀性。與所有內容全部放在同一層次的設計相較,清楚分級分類也能讓介面別具特色。

by Airbnb APP

原則三、將相關的功能分類而非毫無章法

在產品當中會有許多系列相關的功能,例如編輯相關就會有更改、刪除、新增之類的按鈕,而將類似這樣的系列功能分組為類,可以加快使用的流暢性(刪除放在畫面最左邊、新增放畫面最下方這種事大概不會發生吧)。將這些類似功能的元件放在一起符合邏輯認知,別再讓使用者多想多做多錯是優化設計時的原則之一。

by Medium APP

原則四、系統化的色彩配置勝過五顏六色

我們需要進行色彩設計時,常常在運用時發現很難做出恰到好處的和諧感。也許是對於色彩認識不足,容易因主觀的去過度使用,整體看起來就會覺得沒有系統,像是七彩霓虹燈灌入我們的設計中(笑)。在色彩的設定上,我們儘可能設定一種顏色作為此設計的基底,另外再選擇最多兩種顏色作為輔助色就好,避免在介面上的顏色太多太複雜。當然也可以選擇無彩度色(近黑/灰/白)的搭配,在需要使用者關注的元件上使用色彩即可。

原則五、仍遵循約定準則不要再重新設計

回到原本的主題,在每次的經驗累積,逐漸會形成設計的準則。遵從介面設計的某些約定俗成的原則,使用者用起來就會很順暢、方便。如果我們要打破常規,就可能要提高一些學習成本。所以除非我們有明確目標,才進下一步去思考如何創新,否則參考一些設計Guideline,仍有避免不必要錯誤的好處。

如果喜歡我們的文章,請給我們一個❤,同時也歡迎分享給你的朋友,最後別忘了Follow我們的Facebook粉絲頁Publication,我們將持續為你分享設計知識與靈感,有任何建議或合作需求也歡迎來信: aapdgo@gmail.com 😊

— —

AAPD是 As A Product Designer 的簡寫我們希望提供產品設計師所需要的各種資訊,並且致力在平台上創造更多的交流與互動。我們關注於UI設計、UX設計、設計師的個人成長、設計趨勢與產業動態等並分享這些資訊,期望降低每位設計師成長的過程中所遇到的阻礙。我們期待這裡成為一個設計知識的媒介,讓每一位來到這裡的人都可以得到滿滿的收穫,並且讓每一位身為產品設計師的人都能為自己正在創造的事物感到驕傲。

--

--