設(shè)計(jì)指南是一個(gè)非常寶貴的工具，可以最大限度地提高設(shè)計(jì)團(tuán)隊(duì)的成品產(chǎn)出，并確保成品的合格滿意度。我們來看看成功的設(shè)計(jì)指南六個(gè)要素。

設(shè)計(jì)指南不僅僅是一個(gè)帶有新網(wǎng)站或品牌標(biāo)識(shí)的前期文檔，好的設(shè)計(jì)指南更是一件藝術(shù)品，在日常的設(shè)計(jì)工作得到實(shí)際的應(yīng)用。它概括了你的項(xiàng)目是什么，以及達(dá)到目標(biāo)的效果是什么。它以一種易于管理、易于理解的方式將設(shè)計(jì)、語音甚至代碼元素結(jié)合在一起。

1. 品牌標(biāo)識(shí)的例子

你的網(wǎng)站設(shè)計(jì)指南應(yīng)該以一種視覺形式展示你的品牌標(biāo)識(shí)，這種視覺形式代表了你想要品牌設(shè)計(jì)展示的樣子。最好的例子就是真實(shí)案例的使用，它們準(zhǔn)確地說明了設(shè)計(jì)標(biāo)準(zhǔn)所要描述的內(nèi)容。當(dāng)設(shè)計(jì)處于最佳狀態(tài)時(shí)，可以使用網(wǎng)站主頁、手機(jī)主頁、應(yīng)用程序或其他任何地方的截圖。

《設(shè)計(jì)指南》的好處在于創(chuàng)造了品牌一致性。將設(shè)計(jì)的小元素納入重點(diǎn)，比如正確顯示應(yīng)用程序圖標(biāo)的樣式。

在設(shè)計(jì)指南中使用真實(shí)例子最好的部分是，你不需要?jiǎng)?chuàng)建額外的工作來展示視覺元素。你已經(jīng)擁有相關(guān)素材。此外，團(tuán)隊(duì)成員將知道指南在實(shí)際操作中是有效的，因?yàn)橛锌梢暬淖C明。

2. 設(shè)計(jì)指導(dǎo)方針

從色塊到排版調(diào)色板，再到形狀和設(shè)計(jì)元素的使用，每件事都應(yīng)該清晰地勾勒出來。為什么設(shè)計(jì)在某種程度上具備一定功能性？因?yàn)榭梢詭椭脩舾鼫?zhǔn)確、更一致地跨媒體應(yīng)用設(shè)計(jì)風(fēng)格。當(dāng)涉及到網(wǎng)站設(shè)計(jì)時(shí)，包含可能不同于印刷品牌的元素以及它們之間的關(guān)系運(yùn)用。比如，許多設(shè)計(jì)師選擇了一個(gè)不同的在線印刷調(diào)色板，模仿印刷品牌，以最大限度地使用谷歌字體到Typekit的易用性。如果這是您的設(shè)計(jì)策略的一部分，請務(wù)必注意哪些字體是替換的。

當(dāng)概述設(shè)計(jì)指南時(shí)，不要過度傳達(dá)不必要的細(xì)節(jié)。您需要做到的是讓團(tuán)隊(duì)成員能夠一眼看到信息并使用它，而不是試圖在規(guī)范的海洋中尋找某些東西。

3.聲音和個(gè)性

編寫風(fēng)格指南并不像設(shè)計(jì)指南中的其他視覺元素那樣有趣，但是同樣重要。一種用于復(fù)制的描述性寫作風(fēng)格也會(huì)影響視覺效果。它有助于您選擇所需要使用的圖像類型，甚至包括顏色和類型等元素。所有這些操作一起為品牌創(chuàng)造了一個(gè)整體的個(gè)性。更重要的是，一個(gè)強(qiáng)有力的聲音和個(gè)性也成為視覺識(shí)別的一部分。良好的效果體現(xiàn)在設(shè)計(jì)元素上，因?yàn)榧词乖谄放频钠渌麅?nèi)容之外，用戶也幾乎可以識(shí)別出設(shè)計(jì)元素。

4. SEO關(guān)鍵字

搜索引擎優(yōu)化是網(wǎng)站設(shè)計(jì)中討論最多的部分之一。盡早考慮關(guān)鍵詞很重要。關(guān)鍵詞包括范圍在談?wù)撈放频姆绞街?，在設(shè)計(jì)的描述性語言中，并在設(shè)計(jì)指南中列出最重要的關(guān)鍵詞。關(guān)鍵詞列表會(huì)讓你在每次看到它們的時(shí)候都能把它們記在腦海中。這正是SEO關(guān)鍵字列表需要達(dá)到的效果。設(shè)計(jì)元素應(yīng)該始終與這些關(guān)鍵字相關(guān)，與整個(gè)網(wǎng)站設(shè)計(jì)中相關(guān)的內(nèi)容相關(guān)。

5. 模式和元素樣式

如果你想讓團(tuán)隊(duì)真正喜歡設(shè)計(jì)指南，通過在線位置創(chuàng)建一個(gè)模式和元素風(fēng)格指南，這樣用戶就可以快速復(fù)制和粘貼元素。這適用于標(biāo)識(shí)、調(diào)色板、模式甚至表單字段和導(dǎo)航等設(shè)計(jì)元素的靜態(tài)和動(dòng)畫版本。

6. 代碼片段

每個(gè)網(wǎng)站設(shè)計(jì)指南都需要包含大量常用的代碼片段。從按鈕到小動(dòng)畫再到滑塊效果，這些代碼的運(yùn)用也為網(wǎng)站增添了閱讀的豐富性、悅目性。這適用于囊括博客文章以及更精細(xì)的UI效果等。為圖片添加一個(gè)代碼塊，這樣博客就可以復(fù)制粘貼到合適的大小。即使您沒有提供完整的代碼片段庫，也要記住包含的一些基本信息，比如在網(wǎng)站設(shè)計(jì)的頁面上從H1到H4在哪里使用，以及如何設(shè)置按鈕和圖像的樣式。

結(jié)論

設(shè)計(jì)指南最好的部分是它不單是一個(gè)靜態(tài)文檔。更是一個(gè)隨著品牌和相應(yīng)身份而成長和改變。

大多數(shù)網(wǎng)站設(shè)計(jì)師都選擇在線版本的設(shè)計(jì)指南，這樣修改代碼和抓取代碼和顏色片段就會(huì)變得又快又容易。不妨你也考慮在網(wǎng)站上添加一個(gè)風(fēng)格指南頁面，并經(jīng)常引用、更新它。