正文

UI設(shè)計(jì)的基本原則（ui設(shè)計(jì)的基本原則有哪些）_1

發(fā)布時(shí)間：2023-04-28 02:53:35 稿源：創(chuàng)意嶺閱讀： 864

大家好！今天讓創(chuàng)意嶺的小編來(lái)大家介紹下關(guān)于UI設(shè)計(jì)的基本原則的問(wèn)題，以下是小編對(duì)此問(wèn)題的歸納整理，讓我們一起來(lái)看看吧。

創(chuàng)意嶺作為行業(yè)內(nèi)優(yōu)秀企業(yè)，服務(wù)客戶遍布全國(guó)，設(shè)計(jì)相關(guān)業(yè)務(wù)請(qǐng)撥打175-8598-2043，或微信：1454722008

本文目錄:

1、UI設(shè)計(jì)中的5大金手指原則
2、什么是ui，網(wǎng)站ui設(shè)計(jì)應(yīng)該注意些什么，有哪些基本原則
3、「UI設(shè)計(jì)」如何做好按鈕設(shè)計(jì)的9個(gè)基本原則
4、優(yōu)秀的UI設(shè)計(jì)的10條原則？

UI設(shè)計(jì)的基本原則（ui設(shè)計(jì)的基本原則有哪些）_1

一、UI設(shè)計(jì)中的5大金手指原則

一、先搞清楚：給誰(shuí)用?在什么時(shí)候用?

首先，你必須要分析做的這個(gè)設(shè)計(jì)解決的是什么人(用戶)、在什么時(shí)候(場(chǎng)景)下的問(wèn)題?而青藤小編在他們前面都加了一個(gè)詞“不同”，一般情況下，即使是同一個(gè)界面，在不同用戶的不同場(chǎng)景下設(shè)計(jì)也要細(xì)分，有所區(qū)分的進(jìn)行設(shè)計(jì)。

二、搞清楚：用戶在這個(gè)頁(yè)面要做且必做的一件重要的事是什么

做事情不能三心二意，做頁(yè)面設(shè)計(jì)亦是如此。界面設(shè)計(jì)要簡(jiǎn)潔，一個(gè)頁(yè)面只承載一個(gè)最為重要的功能，完成最重要的一個(gè)指標(biāo)，如果一個(gè)頁(yè)面要表達(dá)的東西太多，那將會(huì)給用戶帶來(lái)選擇恐懼，想要說(shuō)都是重點(diǎn)那也將都不是重點(diǎn)。

三、重點(diǎn)優(yōu)先級(jí)：功能+交互操作+視覺(jué)

做設(shè)計(jì)要讓頁(yè)面的元素具有清晰的層次，一個(gè)頁(yè)面的重點(diǎn)是什么?次之是什么?最弱化的是什么?而這個(gè)層次從三個(gè)方面都要有設(shè)計(jì)體現(xiàn)：功能+交互操作+視覺(jué)。一般情況下，這三個(gè)的優(yōu)先級(jí)基本是一致的，功能的優(yōu)先級(jí)決定了交互操作和視覺(jué)的優(yōu)先級(jí)，視覺(jué)優(yōu)先級(jí)引導(dǎo)用戶的操作路徑的優(yōu)先級(jí)，他們互相制約互相影響。

四、可識(shí)別性是第一視覺(jué)原則

清晰明了的識(shí)別是界面設(shè)計(jì)的第一原則。產(chǎn)品最好不要搞朦朧派、抽象派，要想你設(shè)計(jì)的界面立意準(zhǔn)確、有效有用，首先就得保證用戶能夠準(zhǔn)確的認(rèn)出它，然后準(zhǔn)確的操作使用它。

五、取舍：功能性能大于視覺(jué)

對(duì)大多數(shù)設(shè)計(jì)師來(lái)說(shuō)，都把自己定位為視覺(jué)型設(shè)計(jì)師，把顏值看得比生命還重要，殊不知我們應(yīng)該晉級(jí)成為產(chǎn)品型設(shè)計(jì)師、運(yùn)營(yíng)型設(shè)計(jì)師甚至是還要懂一點(diǎn)技術(shù)的設(shè)計(jì)師，要帶著用戶的思維從源頭來(lái)看這件事，那就是設(shè)計(jì)這個(gè)界面的目的是什么?答案：為了解決用戶的問(wèn)題。

以上就是青藤小編關(guān)于UI設(shè)計(jì)中的5大金手指原則的分享，總之，界面設(shè)計(jì)不僅僅只是設(shè)計(jì)一個(gè)美麗的外表，它必須在保證有用好用的前提下再是好看!

二、什么是ui，網(wǎng)站ui設(shè)計(jì)應(yīng)該注意些什么，有哪些基本原則

UI即User Interface(用戶界面)的簡(jiǎn)稱。UI設(shè)計(jì)是指對(duì)軟件的人機(jī)交互、操作邏輯、界面美觀的整體設(shè)計(jì)。好的UI設(shè)計(jì)不僅是讓軟件變得有個(gè)性有品位，還要讓軟件的操作變得舒適簡(jiǎn)單、自由，充分體現(xiàn)軟件的定位和特點(diǎn)。

好的網(wǎng)站UI設(shè)計(jì)，不僅具備清晰的界面，還要給用戶以簡(jiǎn)潔的感覺(jué)。用戶的第一印象是非常重要的，簡(jiǎn)潔的UI設(shè)計(jì)原則會(huì)讓用戶在最短的時(shí)間內(nèi)找到自己想要的內(nèi)容，提高了效率，很多建站公司都明白其中的道理，進(jìn)行網(wǎng)站改版就是為了簡(jiǎn)潔化。扁平化設(shè)計(jì)就是一個(gè)好的思路。

三、「UI設(shè)計(jì)」如何做好按鈕設(shè)計(jì)的9個(gè)基本原則

按鈕是任何用戶界面當(dāng)中（無(wú)論是桌面還是移動(dòng)用戶界面）必備的交互元素：甚至可以說(shuō)，如果頁(yè)面中沒(méi)有一個(gè)按鈕，整個(gè)頁(yè)面設(shè)計(jì)將是不完整的。

接下來(lái)我們就來(lái)聊聊制定按鈕規(guī)范時(shí)會(huì)遇到的一些問(wèn)題，雖然只有普通按鈕，但還是有很多細(xì)節(jié)值得我們思考學(xué)習(xí)。

大綱如下

1、按鈕的類型

2、按鈕的狀態(tài)

3、按鈕的主次關(guān)系

4、按鈕的設(shè)計(jì)尺寸

5、按鈕的圓角

6、按鈕的文字

7、按鈕的樣式一致

8、按鈕的色彩

9、按鈕的擺放位置

1、按鈕的類型

按鈕包括很多種，本文主要分享的是我們?cè)谠O(shè)計(jì)中經(jīng)常運(yùn)用到的一些按鈕類型。比如普通按鈕、圖標(biāo)按鈕、文字按鈕、下拉按鈕等等

2、按鈕的狀態(tài)

按鈕的狀態(tài)一般分為三種：正常態(tài)、不可點(diǎn)擊狀態(tài)、點(diǎn)擊狀態(tài)。

正常狀態(tài)就不必多講了。按壓狀態(tài)：我常用的一種方式是將按鈕的不透明度改為80%- 85%:

不可點(diǎn)擊狀態(tài)，也推薦兩種實(shí)現(xiàn)方式，一種是降低為30%的透明度，另一種是直接置灰:

3、按鈕的主次關(guān)系

頁(yè)面的內(nèi)容信息可以通過(guò)文字的大小、顏色形成層級(jí)關(guān)系。同樣按鈕設(shè)計(jì)，我們可以在風(fēng)格上進(jìn)行區(qū)分，讓主要按鈕與次要按鈕形成差異，達(dá)到層級(jí)結(jié)構(gòu)的視覺(jué)提升，更好引導(dǎo)用戶根據(jù)設(shè)定的軌跡進(jìn)行操作。

4、按鈕的設(shè)計(jì)尺寸

4.1 合適的大小

按鈕需要方便用戶進(jìn)行點(diǎn)擊操作，如果用戶點(diǎn)擊失敗或者誤點(diǎn)到周邊元素，就會(huì)帶給用戶不友好的體驗(yàn)。若是帶有文本的按鈕，只要文字大小不要小于極限值即移動(dòng)設(shè)備上 44 * 44 ，通常實(shí)現(xiàn)出來(lái)的按鈕交互熱區(qū)都會(huì)滿足點(diǎn)擊需求。

4.2 按鈕的高度

每個(gè)平臺(tái)都會(huì)有多種型號(hào)的按鈕，我見(jiàn)過(guò)最多的可以分為5種：超大按鈕、大按鈕、中按鈕、小按鈕，超小按鈕，這個(gè)可以根據(jù)自己平臺(tái)的需要來(lái)制定多少種。每一種按鈕都需要有一個(gè)特定高度，那么這個(gè)高度如何制定才比較科學(xué)呢？這里可以推薦一種方式，就是按鈕的高度是文字的三倍左右，這樣看起來(lái)會(huì)比較舒服：

4.2 按鈕的寬度

在不同的頁(yè)面中按鈕的寬度是隨機(jī)的，所以按鈕的具體寬度我們需要具體的功能來(lái)設(shè)置。

比如在閑魚(yú) APP的登錄頁(yè)、購(gòu)買頁(yè)中，按鈕的寬度都不是相同的。

5、按鈕的圓角

對(duì)于按鈕邊框來(lái)說(shuō)，我們通常采用全圓角和小圓角居多，這樣顯得穩(wěn)重大氣。一般我采用全圓角的圓角值等于按鈕高度值的一半，而小圓角的圓角值通常控制在 1/4H（高度值的四分之一）以內(nèi)。

同時(shí)要注意的一點(diǎn)是，在同一款產(chǎn)品中要保證所有按鈕的圓角比例是一致的，而不是圓角一致。如果不同大小按鈕的圓角都是一致的，那會(huì)顯得非常別扭。

6、按鈕的文字

按鈕文字和邊框的設(shè)計(jì)要預(yù)留一定的留白，不要做“舍不得”的設(shè)計(jì)，使得按鈕給人感覺(jué)很擁擠。如果你把控不好可以分析一些按鈕的負(fù)空間獲取經(jīng)驗(yàn)，看看文字大小和負(fù)空間之間是否存在某種比例關(guān)系。找到這個(gè)比例關(guān)系運(yùn)用到按鈕設(shè)計(jì)中，也許會(huì)讓你的設(shè)計(jì)顯得更加成熟穩(wěn)重。

建議按鈕的文字一般不要超過(guò)6個(gè)漢字。

7、按鈕的樣式一致

在同一頁(yè)面中按鈕的樣式要形成一致，不要給用戶造成理解上的成本。

8、按鈕的色彩

顏色部分比較簡(jiǎn)單，一般會(huì)選用規(guī)范體系的顏色即可。但像紅色或者橙色多為行動(dòng)刺激作用，不適合在非品牌色的時(shí)候?yàn)E用。淺灰色或者低飽和度的色系會(huì)帶有不可用、禁用、失效等屬性，需要酌情選擇。

9、按鈕的擺放位置

按鈕的擺放位置通常要結(jié)合用戶的視覺(jué)感受、與用戶操作習(xí)慣進(jìn)行擺放。

好了，以上就是關(guān)于按鈕規(guī)范的分享，希望能幫助大家提供一些思路和靈感，歡迎交流！

四、優(yōu)秀的UI設(shè)計(jì)的10條原則？

1.創(chuàng)新

絕不窮盡創(chuàng)新的可能性。技術(shù)發(fā)展總是為創(chuàng)新設(shè)計(jì)提供新的機(jī)會(huì)。但是，創(chuàng)新設(shè)計(jì)總是與創(chuàng)新技術(shù)一起發(fā)展，而永遠(yuǎn)不會(huì)成為終點(diǎn)。

與用戶界面有關(guān)

a、“我”一詞：用戶界面設(shè)計(jì)中涉及很多創(chuàng)新。目標(biāo)是考慮對(duì)您的用戶而言新穎的新穎界面和交互，這可能意味著“缺少UI”或根本沒(méi)有“ UI”。

b、杯子手柄因其承受能力而創(chuàng)新，類似地，UI應(yīng)該看起來(lái)在后臺(tái)“消失”，而不是引起人們的注意。

C、閱讀Mark Wieser的論文：面向21世紀(jì)的計(jì)算機(jī)。

2.制作有用的產(chǎn)品

購(gòu)買了要使用的產(chǎn)品。它必須滿足某些標(biāo)準(zhǔn)，不僅是功能上的，而且還必須滿足心理和美學(xué)上的要求。良好的設(shè)計(jì)強(qiáng)調(diào)產(chǎn)品的實(shí)用性，而忽略任何可能損害產(chǎn)品的特性。

與用戶界面有關(guān)

a、通過(guò)使用通用約定和UI模式，可以使觀眾的先前經(jīng)驗(yàn)和期望達(dá)到匹配。

b、不要為相同產(chǎn)品之間類似的一致的用戶交互而重新發(fā)明輪子。例如，用戶登錄

3.是美學(xué)的

產(chǎn)品的美學(xué)質(zhì)量是其實(shí)用性不可或缺的一部分，因?yàn)槲覀兠刻焓褂玫漠a(chǎn)品會(huì)影響我們的人和我們的福祉。但是只有執(zhí)行得當(dāng)?shù)膶?duì)象才是美麗的。

與用戶界面有關(guān)

A、用戶界面應(yīng)具有吸引力并經(jīng)過(guò)風(fēng)格化，以響應(yīng)用戶對(duì)硬件期望的質(zhì)量。

B、用戶界面具有je sais quoi。所有單獨(dú)的元素加在一起產(chǎn)生的東西比任何一個(gè)部分都要大。像烹飪一樣，所有食材都必須正確混合。就像廚師在上菜前先品嘗食物一樣，UI設(shè)計(jì)師也應(yīng)如此。

4.使產(chǎn)品易于理解

它闡明了產(chǎn)品的結(jié)構(gòu)，組織和目的。更妙的是，它可以使產(chǎn)品脫穎而出。充其量是不言自明的。

與用戶界面有關(guān)

A、UI是我們通過(guò)玻璃在其上創(chuàng)建含義的畫(huà)布。它對(duì)用戶具有個(gè)性，聲音和價(jià)值。如果您不了解界面在用戶生活或使用環(huán)境中所具有的價(jià)值，則可能會(huì)導(dǎo)致錯(cuò)誤。

B、充分了解您的用戶，并不斷測(cè)試解決方案是否可以理解。

5. 坦率的

達(dá)到目的的產(chǎn)品就像工具。它們既不是裝飾物也不是藝術(shù)品。因此，他們的設(shè)計(jì)應(yīng)該既中立又受約束，為用戶的自我表達(dá)留出空間。

與用戶界面有關(guān)

A、最好的接口是我們?cè)诓徽J(rèn)識(shí)它們的情況下使用的接口。它們消失在我們的自然任務(wù)中

B、就用戶而言，界面就是產(chǎn)品。

6. 誠(chéng)實(shí)

它并沒(méi)有使產(chǎn)品具有比實(shí)際更多的創(chuàng)新，功能或價(jià)值。它不會(huì)試圖以無(wú)法兌現(xiàn)的承諾來(lái)操縱消費(fèi)者。

與用戶界面有關(guān)

A、UI并未嘗試向其用戶隱藏相關(guān)數(shù)據(jù)。它應(yīng)該嘗試提供有關(guān)用戶注意而不是UI的重要信息。

B、UI清晰，有意義且易于理解，有望使它變得可用。

7.持久耐用

它避免過(guò)時(shí)，因此永遠(yuǎn)不會(huì)顯得過(guò)時(shí)。與時(shí)尚設(shè)計(jì)不同，它可以持續(xù)多年-即使在當(dāng)今的一次性社會(huì)中。

與用戶界面有關(guān)

a、用戶界面是一個(gè)可以在不破壞和重建的基礎(chǔ)上每6個(gè)月進(jìn)行一次改進(jìn)的系統(tǒng)。(我在看著你UBER)

b、UI功能應(yīng)經(jīng)過(guò)測(cè)試，以確保它們與用戶相關(guān)。已使用的UI功能是可以保留超時(shí)但僅在可用時(shí)可用的UI功能。

8.是最后細(xì)節(jié)嗎?

任何事情都不能是任意的或偶然的。設(shè)計(jì)過(guò)程中的謹(jǐn)慎和準(zhǔn)確性表明了對(duì)用戶，產(chǎn)品和設(shè)計(jì)的尊重。

與用戶界面有關(guān)

a、我們的用戶在屏幕上花費(fèi)的時(shí)間越來(lái)越多。我們需要通過(guò)考慮我們的工藝來(lái)使這些經(jīng)歷有意義，并坦率地說(shuō)該死。

b、實(shí)際上，好的設(shè)計(jì)要比差的設(shè)計(jì)要難得多，部分原因是好的設(shè)計(jì)能夠很好地滿足我們的需求，從而看不到設(shè)計(jì)。

9.環(huán)保嗎

設(shè)計(jì)為保護(hù)環(huán)境做出了重要貢獻(xiàn)。在產(chǎn)品的整個(gè)生命周期中，它可以節(jié)省資源并最大程度地減少物理和視覺(jué)污染。

與用戶界面有關(guān)

a、UI可以將其連接傳達(dá)給更大的設(shè)計(jì)精神。它可以促進(jìn)不增加廢物流的敘述和原因。

b、UI可以講述一個(gè)故事，而故事可以改變用戶的心靈。

10.盡可能小的設(shè)計(jì)

更少，但是更好-因?yàn)樗鼘Ｗ⒂诨痉矫?，并且產(chǎn)品不包含不必要的負(fù)擔(dān)?；氐郊兇猓氐胶?jiǎn)單。

與用戶界面有關(guān)

a、出于UI的考慮，不再有UI。真正了解用戶的需求應(yīng)該消除不必要的用戶界面元素，并減少對(duì)所需任務(wù)的分心。

b、UI對(duì)用戶是有禮貌的，因此，我們的作用不是創(chuàng)建UI，而是為人們創(chuàng)建。

相關(guān)推薦

優(yōu)秀的UI設(shè)計(jì)的10條原則

成為一名出色的UI/UX設(shè)計(jì)師必備技能有哪些

UI設(shè)計(jì)先培訓(xùn)后交學(xué)費(fèi)騙局

現(xiàn)在學(xué)ui設(shè)計(jì)都是傻子

ui設(shè)計(jì)培訓(xùn)后失業(yè)

零基礎(chǔ)學(xué)ui設(shè)計(jì)真他媽?xiě)K

ui設(shè)計(jì)培訓(xùn)四個(gè)月騙局

以上就是關(guān)于UI設(shè)計(jì)的基本原則相關(guān)問(wèn)題的回答。希望能幫到你，如有更多相關(guān)問(wèn)題，您也可以聯(lián)系我們的客服進(jìn)行咨詢，客服也會(huì)為您講解更多精彩的知識(shí)和內(nèi)容。

ui設(shè)計(jì)的基本內(nèi)涵是什么（ui設(shè)計(jì)的基本內(nèi)涵是什么）

ui設(shè)計(jì)的圖片素材（ui設(shè)計(jì)的圖片素材大全）

ui設(shè)計(jì)的圖片作品集（ui設(shè)計(jì)圖片欣賞）

ui設(shè)計(jì)的四大原則（ui設(shè)計(jì)的四大原則包括）

UI設(shè)計(jì)的含義（什么是ui設(shè)計(jì)-包括哪些方面）

UI設(shè)計(jì)的含義及特點(diǎn)（UI設(shè)計(jì)的含義及特點(diǎn)是什么）

ui設(shè)計(jì)的含義及特點(diǎn)是什么（ui設(shè)計(jì)的含義及特點(diǎn)是什么呢）

ui設(shè)計(jì)的發(fā)展趨勢(shì)2023（ui設(shè)計(jì)的發(fā)展趨勢(shì)）

ui設(shè)計(jì)的原理（ui設(shè)計(jì)的原理和解決方法）

問(wèn)大家

一個(gè)UI設(shè)計(jì)師，什么樣的作品集內(nèi)容會(huì)贏得bss以及hr的青睞？

平面設(shè)計(jì)師怎么快速進(jìn)入互聯(lián)網(wǎng)公司做ui設(shè)計(jì)？

UI行業(yè)適合男生嗎？

歲開(kāi)始學(xué)UI設(shè)計(jì)，還有出路嗎？

一個(gè)技能全面的UI/UE設(shè)計(jì)師需要必備技能是什么？

怎樣才算一名優(yōu)秀的UI設(shè)計(jì)師？

UI設(shè)計(jì)需要學(xué)習(xí)幾個(gè)月能找工作？

工作三年的UI設(shè)計(jì)師，未來(lái)該如何發(fā)展？你怎么看？

ui設(shè)計(jì)真的很缺人嗎，為什么那么多公司搞ui設(shè)計(jì)收費(fèi)培訓(xùn)？

UI設(shè)計(jì)新手入門(mén)，有哪些推薦的書(shū)籍或者教程嗎？

真正的濟(jì)南婚介哪家比較好？現(xiàn)在的婚戀平臺(tái)有多少是靠譜的？

山東省會(huì)濟(jì)南000后同城交友哪家平臺(tái)比較好？高端靠譜的

濟(jì)南婚戀交友網(wǎng)站哪個(gè)比較好？相親征婚交友哪個(gè)網(wǎng)站靠譜？

讓品牌有溫度、有情感
專注品牌策劃15年

UI設(shè)計(jì)的基本原則（ui設(shè)計(jì)的基本原則有哪些）_1

猜你喜歡

問(wèn)大家

推薦專題

相關(guān)主題

創(chuàng)意嶺品牌策劃

提交需求1對(duì)1免費(fèi)咨詢

讓品牌有溫度、有情感 專注品牌策劃15年

UI設(shè)計(jì)的基本原則（ui設(shè)計(jì)的基本原則有哪些）_1

猜你喜歡

問(wèn)大家

推薦專題

相關(guān)主題

創(chuàng)意嶺品牌策劃

提交需求1對(duì)1免費(fèi)咨詢

讓品牌有溫度、有情感
專注品牌策劃15年