創建網站變得越來越復雜，通常不是一個人的工作。重要的是要確保設計是一致和優化的，以滿足業務目標和為用戶創造愉快的體驗。

在設計網站的不同部分或從開發人員那里節省設計時，確保團隊在同一頁面上的方法之一是創建設計文檔或web設計風格指南。

為了在不同的頁面之間創建一個連貫的體驗，有一個風格指南是有益的。此外，它還有助于確保未來的開發或第三方生產將遵循品牌指導方針，并將被視為整體品牌的一部分。

Luke Clum已經觸及了使用風格指南的表面，這是您去年web設計的*步，我想更深入地了解一下如何為您的項目創建一個可用的web設計風格指南。

什么是風格指南?

風格指南是預先設計的元素的集合，圖形和規則設計者或開發人員應該遵循，以確保獨立的網站片段將是一致的，并將在*后創造一個連貫的體驗。

airbnb風格指南

Airbnb UI工具包- Web by Derek Bradley。

它為什么重要?

當多個設計師在一個大的網站或網頁應用程序上工作時，確保他們不會過多的解釋，也不會根據個人喜好改變或調整風格，這是非常重要的。在開發中，定義了網站的元素使得開發人員可以很容易地重用這些元素。而且，它可以使它變得更容易，因為他們將獲得他們必須編碼的元素，并將從一開始就看到他們需要什么樣子。



為了使開發人員的生活更輕松，設計者的職責是包括所有可能的交互，如鼠標懸停、點擊、訪問等，以及按鈕、標題、鏈接等。

創建Web設計風格指南。

1。研究品牌

首先，你需要研究這個品牌，讓你明白它代表什么。了解品牌背后的故事，觀察團隊，了解公司的愿景、使命和價值觀。深入挖掘品牌是很重要的，這樣你的風格導向就會在視覺上和情感上代表公司。

如果你是一個不能編程的設計師，只需打開Photoshop，給你的文檔一個標題和一個簡短的說明文檔的內容和內容。

如果您可以編寫代碼，那么更好使用預編碼的資產創建一個html文檔，這樣就可以方便地重用它們。

2。定義字體

根據Oliver Reichenstein的說法，印刷術是95%的網頁設計。

因為它是訪問者和網站之間*重要的溝通工具之一，所以你必須正確地進行排版。

設置層次結構并識別它。標題類型有:h1、h2、h3、h4、h5和h6。然后是正文，粗體和斜體。考慮自定義復制，它將被用于更小的鏈接，內含子文本等等。提供字體系列，重量和顏色。

風格指南

Zech Nelson的風格指南。



3所示。調色板

令人難以置信的是，人類是如何感知顏色和與已知品牌聯系在一起的。想想可口可樂，我敢打賭你現在看到了紅色。

首先為你的風格指南設置主色調，這將主導你的網站，主導色彩應該包括不超過三種顏色。但是，在某些情況下，您需要使用次要的甚至是第三種顏色來說明您的用戶界面，確保您也定義了它們。也包括中性的顏色，如白色，灰色和黑色的主要品牌顏色突出。

調色板

客人中心調色板由科洛伊帕克。

4所示。的聲音

我所指的聲音是真實的。你在開始時尚指南之前就已經研究過這個品牌，并且發現這個品牌是年輕和流行的。如果沒有語音的方向，你就必須定義它。它可以是一個簡單的例子，說明聲音必須是*的，但有趣和歡迎。而不是說“你有404錯誤”，你可以說“噢，孩子，你破壞了網絡。”404錯誤。如果聲音更大一些，你就不會那么做了。智慧隱藏在小事情中。

5。圖解

圖標已經存在了數千年，比文字和文字還要古老。利用在你的項目中使用圖標，因為他們會給訪問者一個即時的想法，告訴他們接下來會發生什么，以及接下來會發生什么。選擇正確的圖標將提供比顏色調色板、復制或圖形更多的內容上下文。使用圖標時，一定要考慮目標受眾、宗教、歷史，避免誤解和誤解。還有一件事要提，想想這個品牌和它的價值，這樣你就不用在大型銀行網站上使用手繪的圖標了。

iconfinder

Iconfinder是一個很好的工具，可以為你的項目找到很棒的圖標。

圖標

“名詞項目”正在構建一種任何人都能理解的圖標的視覺語言。

6。圖像

圖片能講幾千個單詞。 本文來源：智通澤軟件，轉載請注明出處！如果需要泊頭網站建設 泊頭小程序開發 泊頭微信開發 泊頭APP開發請聯系封經理，我們將提供上門服務！
聯系方式：手機：13393374114  座機：0317-8280288 QQ：958361464  或掃一掃下面二維碼加我微信：