ui網頁設計規范

1、PC客戶端UI設計有哪些規范

1、簡易性

界面的簡潔是要讓用戶便於使用、便於了解產品，並能減少用戶發生錯誤選擇的可能性。

2、用戶語言

界面中要使用能反映用戶本身的語言，而不是游戲設計者的語言。

3、記憶負擔最小化

人腦不是電腦，在設計界面時必須要考慮人類大腦處理信息的限度。人類的短期記憶有限且極不穩定，24小時內存在約25%的遺忘率。所以對用戶來說，瀏覽信息要比記憶更容易。

4、一致性

它是每一個優秀界面都具備的特點。界面的結構必須清晰且一致，風格必須與產品內容相一致。軟體中往往存在多個組成部分（組件、元素）。不同組成部分之間的交互設計目標需要一致。交互元素的外觀往往影響用戶的交互效果。同一個（類）軟體採用一致風格的外觀，對於保持用戶焦點，改進交互效果有很大幫助。

5、清楚

在視覺效果上便於理解和使用。軟體要為用戶使用，用戶必須可以理解軟體各元素對應的功能。如果不能為用戶理解，那麼需要提供一種非破壞性的途徑，使得用戶可以通過對該元素的操作，理解其對應的功能。

6、用戶的熟悉程度

用戶可通過已掌握的知識來使用界面，但不應超出一般常識。

7、從用戶習慣考慮

想用戶所想，做用戶所做。用戶總是按照他們自己的方法理解和使用。

通過比較兩個不同世界(真實與虛擬)的事物，完成更好的設計。如：書籍對比竹簡。

8、排列

一個有序的界面能讓用戶輕松的使用。軟體的交互流程，用戶可以控制。功能的執行流程，用戶可以控制。

9、安全性

用戶能自由的作出選擇，且所有選擇都是可逆的。在用戶作出危險的選擇時有信息介入系統的提示。

10、靈活性

簡單來說就是要讓用戶方便的使用，但不同於上述。即互動多重性，不局限於單一的工具(包括滑鼠、鍵盤或手柄、界面)。

11、人性化

高效率和用戶滿意度是人性化的體現。應具備專家級和初級玩家系統，即用戶可依據自己的習慣定製界面，並能保存設置。

2、UI設計的規范

快速標注尺寸和PS切圖

快速換算單位

快速繪制不同需求參考線

多個矢量圖形圓角轉換

水平、垂直或按指定間隔復制圖層

可以使用藍湖

3、UI界面設計規范有哪些？

用戶界面設計包含為機器和軟體創建的所有界面設計，例如網站和移動應用程序的外觀，以及它們的方向和易用性。GUI設計在用戶與應用程序或網站的交互方式中起著至關重要的作用，這意味著唯一良好的UI設計是實現簡化和無縫體驗的設計。

用戶界面設計要遵循哪些原則？
1、明確。
對任何界面而言，「明確」是首要的也是最重要的一點。設計師們在設計的時候，要去關心人們為何會使用這個應用，去了解什麼樣的界面是能幫助他們與之互動的，去預測人們在使用時的行為並能夠成功地反饋給他們。

2、交互。
界面的存在是為了讓人和我們的世界產生互動。它的功用和效果是可以被測量的。但是它們不是功利性的。優秀的界面不但能夠讓我們做事有效率，還能夠激發、喚起和加強我們與這個世界的聯系。

3、直觀操作。
要抓住直觀操作這個最初的目標，界面設計要盡可能的簡潔，更多的可識別的慣用自然手勢。理想情況下，界面會變得非常細微，用戶在會有直觀操作的感覺。

4、讓用戶掌控一切。
人們會在自己能掌控的環境中感覺最舒心、最放鬆。通過定期的梳理系統狀態，描述因果關系，並且在每一步操作都給出提示，讓用戶感覺每一步操作都在他的掌控中。

5、遵循用戶行為。
人總是對符合期望的行為最感舒適。因此，設計出來的元素，看起來應該像它們本身特徵一樣。在具體操作中，這意味著用戶只要看到這個界面元素，就應該能猜測出這個元素是做什麼的。

6、前後一致。
為了保持一致性，新手設計師通常在會把相同的視覺處理(重用代碼)方式用在，應該用不同的視覺處理方式的元素上。

7、視覺層次。
強烈的視覺層次會讓畫面有清晰的瀏覽次序。如果要在畫面中添加一個視覺強烈的元素時，設計者應該要重新調整頁面上所有元素的重量分配，來達到強烈視覺層次的效果。
了解用戶界面設計原則是你做出優秀作品的必要條件，而掌握UI設計師必備的技能才是你決勝高薪的關鍵。

4、web界面設計規范有哪些

一、網頁尺寸
製作網頁時，我們選用的解析度是72像素/英寸，使用的畫布尺寸1920px*1080px。
但是並不代表我們可以在整個畫布上作圖。
網頁的布局主要有兩種，左右型布局和居中型布局。布局的不一致，使得可設計的空間也不相同。
二、網頁字體
字體設計的總原則是：可辨識性和易讀性。
網頁的文字設計是系統默認的字體：宋體、微軟黑體、蘋果系統黑體，英文則建議使用arial無襯線字體
常用的字型大小大小有以下幾種：
12px是應用於網頁的最小字體，適用於非突出性的日期，版權等注釋性內容。
14px 則適用於非突出性的普通正文內容。
16px、18px或者20px 適用於突出性的標題內容。

5、UI設計規范都有哪些

UI 設計規范包含顏色、文本樣式、圖層樣式、圖標、組件、品牌等規范，團隊沒有設計規范的話，建議在藍湖搭建。

6、到底什麼是UI設計規范

UI設計不僅是讓某個APP或軟體有個性有品位，吸引用戶，還有一個是操作舒適、簡單、突出軟體的定位和特點，藍湖的設計規范雲可以嘗試一下。

7、UI設計的規范標准有哪些

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

在飛速發展的電子產品中，界面設計工作一點點的被重視起來，做界面設計的「美工」也隨之被稱之為「UI設計師」或「UI工程師」，其實軟體界面設計就像工業產品中的工業造型設計一樣，是產品的重要賣點，一個產品擁有美觀的界面會給人帶來舒適的視覺享受，拉近人與商品的距離，是建立在科學性之上的藝術設計，那麼，UI設計的規范標准有哪些呢？

一、軸

軸在UI設計中是最基本、最常見的概念，也是用來組織界面結構的重要核心。

簡單說來，軸是在設計的時候組織一系列元素的假象線，在下面的設計圖中，軸以虛線的方式被標注出來。

1、對齊

軸最常見於對稱元素的使用，當元素被布置成軸對稱的布局的時候，會給人有序感。就像生活中絕大多數的事情一樣，我們更傾向於享受有序的的東西，它們令人感覺平穩、舒適、平易近人。

最簡單的一個例子就是iTunes程序中的專輯列表的設計，所有的專輯列表在界面的左側保持對齊，圍繞虛線軸軸對稱。

2、強化

雖然軸是一條假想的線，但是如果周圍的元素的邊緣控製得足夠整齊，這跳線會在視覺中變得更加「明顯」的。

最好的例子是城市中的路燈構成了道路兩旁建築物之間的軸，如果一邊有建築一邊沒有，那麼這種軸線的感覺不會那麼強烈。

從產品設計的角度上來看，Twitter的時間線設計就是一個很好的案例，左側的頭像和右側的推文共同塑造出縫隙中軸線的感覺。

3、運動

當我們碰到某先線條的時候，視覺會很自然地沿著這些方向運動，就如同我們站在街上，會自覺地沿著街道的兩頭走動。兩個端點決定了線，界定了開始和結束的地方，線或者說軸線的存在會引導和提示運動的方向。

SoundCloud中，音軌沿著一條既定的水平軸線運動，隨著音樂的播放，音軌自然地自左向右勻速運動（具體可查看馬海祥博客《如何利用動效設計吸引訪客的注意力》的相關介紹）。

4、連續性

如果終點是不確定的，那麼你通常會沿著軸線的方向瀏覽/運動，直到你找到感興趣的東西，或者感到厭倦並關閉應用。

在建築學中，未清楚界定的終點非常少見，因為建築的修建通常沒法永遠持續下去，但是UI設計則不一樣，無限地滾動下去是無比受歡迎的設計手法。

Pinterest的APP中就是這樣做的，持續不斷的圖片沿著中軸線的方向持續不斷地滾動下去，只要你有興趣一直觀看下去。

二、對稱

當元素被均勻地放置在軸線的兩側之時，他們構成了對稱的關系。當元素被精準地在軸線兩側一一對應之時，它們就形成了完美對稱。

1、平衡

對稱令整個設計更加平衡，當元素與控制項在軸線兩側處於相同位置之時，會給人以協調和諧的設計感。

當我們在規劃街道兩側的房屋建設的時候，如果左右兩側都是5間大小一致的房子，當你走在街上的時候這種平衡的設計會令人非常舒適，這是平衡給人的感受。

Rdio的APP設計就遵循著這樣的設計規則，屏幕兩側的控制項是相同的規格，這類布局很適宜閱讀，用戶會自覺地自上到下，從左向右查看。

2、不對稱

如果軸線兩側的控制項布置不再是一一對應尺寸相近，那就是不對稱的設計，不對稱的設計會給人明顯的失衡感，可能會令人不舒服，但是也能造就殘缺美，當然這要看你具體怎麼做。

雖然Pinteret的APP設計在整體上是沿著中軸線對稱的(寬度一致)，但是兩邊的界面控制項並非是對稱的，它們的高度並不一致，位置也是錯落的，稍微一點的落差都會被眼睛捕捉到，而這樣的差異讓用戶無法准確地左右順序閱讀，不對稱設計打破了設計的平衡性和舒適性，但是也可以緩解了規律性設計帶來的視覺疲勞。

三、層級

當某個元素出現在比其他元素更重要的位置的時候，層級就出現了。

1、尺寸

如果一個設計元素在尺寸上比其他的控制項更大，就會區分出層級。毫無疑問，我們查看某個設計的時候，通常會被最大的元素吸引到。如果一個建築物有5個出窗戶，其中一個是其他四個的兩倍大，我們的注意力自然而然會被吸引過去。

通過尺寸來區分文章列表層級的典型就是稍後讀應用Pocket，頂部的輪播文章擁有更大的圖片，它的位置和尺寸會令我們一眼注意到（具體可查看馬海祥博客《詳解移動端設備頁面尺寸設計原理》的相關介紹）。

2、形狀

如果一個控制項在形狀和形態上同其他的不一樣，也可以讓它獨立出一個層級，不規則的設計同樣會令人側目，建築物的正面擁有五個相同的窗戶和一閃大門，你會立刻注意到門的獨特之處。

在Instagram的個人信息頁中，圓形的個人頭像在方形的圖片中別具一格，非常抓人眼球。它會讓人意識到，這個獨特的東西，更為重要。

3、位置

位置的存在同樣能彰顯層級的不一樣，在圓圈之內，中心位置的東西比邊緣部分的看起來更重要，位於軸線頂端的控制項會顯得比其他部分的優先順序更高。

以設計應用Path的設計為例，時間軸頂點處的用戶頭像就明顯比時間軸上的其他部分更重要，而這個地方正好展示的也是用戶頭像。

四、韻律

UI設計和建築設計同樣有著韻律之美，重復的模式會營造出獨特的節奏之美。

1、模式

理解韻律最直接的方式就是聽歌，音樂擁有節奏感，絕大多數的音樂遵循著相同的節拍，節拍就是音樂模式的一部分。

這方面最典型的APP是Airbnb，APP列表中每一間房子都占據一個模塊，模塊中有著大小相同的圖片，價格、位置和房東信息和圖片的相對位置一定，且排版勻稱舒服，兩個模塊之間的間距也相同，當你瀏覽的時候，熟悉的節奏會讓你清楚地知道上哪看關鍵信息。

2、間斷

當節奏被間隔打斷的時候，會形成不同的層級，聽歌的時候，均勻的節奏被其他的音樂元素打斷的時候，你會意識到這是比較特別的部分。

在Twitter的APP中，推文和推文保持著相同的樣式，均勻的節奏，但是其中的「推薦用戶」一項有著不同的樣式，它插入到推文列表中，打破了整個信息流的節奏，凸顯出不同的層級，會很快抓住你的注意力。

8、UI設計網頁設計字體規范應該要注意什麼

可以參考常規字體的使用規范：

1、在每個項目設計中只使用1-2個字體樣式，而在品牌字有明確的規范的情況下，只需要一種字體貫穿全文，通過對字體放大來強調重點文案。字體用的太多，越顯得不夠專業。

2、不同的樣式的字體，形狀或系列最好相同，保證字體風格的一致性。

3、字體與背景的層次要分明,確保字體樣式與色調氣氛相匹配，等。

(8)ui網頁設計規范擴展資料：

網頁設計

1、需要根據消費者的需求、市場的狀況、企業自身的情況等進行綜合分析，從而建立起營銷模型。

2、以業務目標為中心進行功能策劃，製作出欄目結構關系圖。

3、以滿足用戶體驗設計為目標，使用axure rp或同類軟體進行頁面策劃，製作出交互用例。

4、以頁面精美化設計為目標，使用PS、AI等軟體，調整，使用更合理的顏色、字體、圖片、樣式進行頁面設計美化。

5、根據用戶反饋，進行頁面設計調整，以達到最優效果。