本文是WEB端系列設(shè)計(jì)規(guī)范的前言。目的是在激發(fā)玉石方面發(fā)揮作用，并簡(jiǎn)要描述如何制作屬于“自我”的Web端設(shè)計(jì)規(guī)范。

Web端設(shè)計(jì)規(guī)范的價(jià)值1.可重用性提供完整的設(shè)計(jì)規(guī)范和相應(yīng)的組件控件。方便可視化和交互式設(shè)計(jì)人員重復(fù)使用，無需重復(fù)生產(chǎn)，減少工作量并提高工作效率。 2. Unity具有統(tǒng)一的設(shè)計(jì)規(guī)范，在設(shè)計(jì)人員之間使用時(shí)，可以避免自行創(chuàng)建組件控件并保持團(tuán)隊(duì)產(chǎn)品的統(tǒng)一體驗(yàn)。 3.增強(qiáng)能力由于組件控件的可重用性，這直接使設(shè)計(jì)人員的工作效率大大提高，節(jié)省了大量時(shí)間，并且可以有很多時(shí)間去思考設(shè)計(jì)和業(yè)務(wù)背后的邏輯，以提高設(shè)計(jì)思維能力。同時(shí)，完整的設(shè)計(jì)規(guī)范是系統(tǒng)化的，設(shè)計(jì)人員可以在閱讀后建立自己的設(shè)計(jì)系統(tǒng)，這對(duì)設(shè)計(jì)的改進(jìn)有很大的好處。 4.團(tuán)隊(duì)文化沉淀團(tuán)隊(duì)具有設(shè)計(jì)規(guī)范后，方便團(tuán)隊(duì)為將來的設(shè)計(jì)奠定基礎(chǔ)和參考。無論是新員工的到來還是舊員工的離職，團(tuán)隊(duì)都能很好地提高團(tuán)隊(duì)的協(xié)同效率。Web端設(shè)計(jì)規(guī)范包含哪些目前，互聯(lián)網(wǎng)上的大多數(shù)設(shè)計(jì)規(guī)范都是組件控制的規(guī)范，缺乏完整的設(shè)計(jì)思想和系統(tǒng)內(nèi)容。在設(shè)計(jì)規(guī)范的開發(fā)過程中形成了設(shè)計(jì)概念，設(shè)計(jì)原則，組件控制，界面交互和輸出文檔。根據(jù)自身的設(shè)計(jì)理念和原理，設(shè)計(jì)人員可以根據(jù)功能要求直接調(diào)用規(guī)范中的標(biāo)準(zhǔn)控件，并根據(jù)信息結(jié)構(gòu)設(shè)計(jì)元件尺寸。輸出高保真原型圖很容易，這減少了設(shè)計(jì)過程中交互式控制的選擇。和信息排版思維的負(fù)擔(dān)。

Web端設(shè)計(jì)規(guī)范之設(shè)計(jì)理念篇不同的使用對(duì)象（B端，C端），不同的終端設(shè)備，設(shè)計(jì)差異完全不同。所以設(shè)計(jì)理念也不同。 B端產(chǎn)品通常更加個(gè)性化，面向商業(yè)。可能有許多高級(jí)功能非常出色且高效，因此可以輕松學(xué)習(xí)折扣。 C端產(chǎn)品通常考慮大多數(shù)用戶使用場(chǎng)景和吸引力，而高級(jí)功能將相對(duì)較小。突出簡(jiǎn)單易學(xué)。因此，在設(shè)計(jì)設(shè)計(jì)概念時(shí)，可以根據(jù)團(tuán)隊(duì)的實(shí)際情況進(jìn)行設(shè)計(jì)。Web端設(shè)計(jì)規(guī)范之設(shè)計(jì)原則篇已經(jīng)有很多設(shè)計(jì)原則，例如尼爾森的十大可用性原則，格式塔原則，剃刀法，菲茨定律，以及設(shè)計(jì)中常見的對(duì)比，對(duì)齊等，那么你如何成為一套你有這么多原則嗎？設(shè)計(jì)規(guī)范的設(shè)計(jì)原則是什么？這要求設(shè)計(jì)師根據(jù)自己的情況或自己團(tuán)隊(duì)的實(shí)際情況來整理控件。Web端設(shè)計(jì)規(guī)范之組件控件篇組件控件是整體設(shè)計(jì)規(guī)范的重要組成部分。組件控件分類可以根據(jù)組件控件屬性進(jìn)行分類，也可以根據(jù)組件控件的功能進(jìn)行劃分。根據(jù)設(shè)計(jì)師設(shè)計(jì)的設(shè)計(jì)場(chǎng)景，根據(jù)組件控制的功能更加合適。根據(jù)功能劃分，例如，表單類可以分為：?jiǎn)挝谋据斎?，多文本輸入，日歷時(shí)間選擇器，下拉選擇列表，單選多選等。Web端設(shè)計(jì)規(guī)范之界面交互篇觸發(fā)手勢(shì)移動(dòng)終端有點(diǎn)擊，長(zhǎng)按，左右滑動(dòng)，拖動(dòng)，旋轉(zhuǎn)，捏合等。與移動(dòng)終端相比，網(wǎng)側(cè)的界面交互非常簡(jiǎn)單，基本上是懸停和點(diǎn)擊。界面交互的本質(zhì)可以用公式表示：觸發(fā)對(duì)象+操作行為+交互結(jié)果=界面交互Web端設(shè)計(jì)規(guī)范之團(tuán)隊(duì)輸出物篇作為交互設(shè)計(jì)師，我們的主要工作職責(zé)是發(fā)揮作用。 例如，在與上游產(chǎn)品經(jīng)理和項(xiàng)目經(jīng)理對(duì)接之后，在與他們討論產(chǎn)品規(guī)劃和要求之后，他們將根據(jù)交互設(shè)計(jì)者輸出的交互文檔來審查設(shè)計(jì)是否滿足用戶的需求和開發(fā)過程中的可行性。為了與下游視覺設(shè)計(jì)師和開發(fā)工程師建立聯(lián)系，他們將在交互式文檔中輸出基于線框和交互式詳細(xì)描述的視覺設(shè)計(jì)草圖，使用代碼實(shí)現(xiàn)交互式設(shè)計(jì)方案，并將其作為完成實(shí)現(xiàn)的基礎(chǔ)。因此，交互設(shè)計(jì)者的重要輸出是交互式文檔，它是上游和下游之間的重要聯(lián)系。交互式文檔應(yīng)包含以下7點(diǎn)：完整的項(xiàng)目介紹，需求分析，新的修改記錄，信息架構(gòu)，交互設(shè)計(jì)和頁面交互流程圖（包括界面布局，操作手勢(shì)，反饋效果，元素規(guī)則）。定義），異常頁面和異常的描述。作為視覺設(shè)計(jì)師，輸出是視覺草稿，注釋和剪切，這里不再描述。