• <tbody id="9brb1"><pre id="9brb1"></pre></tbody>

    <em id="9brb1"></em>

  • <th id="9brb1"></th>

  • <tbody id="9brb1"><pre id="9brb1"></pre></tbody>
  • <button id="9brb1"><acronym id="9brb1"><input id="9brb1"></input></acronym></button>
      <tbody id="9brb1"><pre id="9brb1"></pre></tbody>
        更多課程 選擇中心


        UI培訓

        400-111-8989

        UI教程之如何構建Web端設計規范

        • 發布:UI培訓
        • 來源:UI教程
        • 時間:2019-02-19 18:13

        這篇文章是之后Web端系列設計規范的前言部分,目的是起到拋磚引玉的作用,簡述如何制作屬于“自己”的Web端設計規范。之后的Web端設計規范系列也是我個人梳理學習總結構建的過程產物,并分享出來給大家做參考學習。

        Web端設計規范的價值

        1.可復用性:有了完整的設計規范和對應的組件控件。方便視覺和交互設計師反復復用,不需要重復制作,減少工作量提高工作效率。

        2.統一性:有了統一的設計規范,設計師之間使用時,可避免自我創造組件控件,保持團隊產品的統一性體驗。

        3.提升能力:由于組件控件的可復用,這直接使設計師的工作效率得到極大提高節省了大量時間,可以有大量時間思考設計和業務背后的邏輯從而提高設計思維能力。同時完整的設計規范是系統的,設計師閱讀之后可以構建自我的設計體系,對于設計的提高有極大的好處。

        4.團隊文化沉淀:團隊有了設計規范之后,便于團隊以后做設計的依據和參考,不論是新員工的到來還是老員工的離去,都可以很好的對接工作提升團隊的協同效率。

        Web端設計規范包含哪些

        目前網上大部分設計規范都是之針對組件控件的規范,缺少完整的設計思想和體系化的內容。

        在制定設計規范過程中會形成設計理念、設計原則、組件控件、界面交互和輸出文檔等。設計者可以依據自我的設計理念和原則按照功能需求直接調用規范中的標準控件,按照信息結構調用元素尺寸進行設計,很輕易便能輸出中高保真原型圖,減輕了設計過程中對交互控件選擇和信息排版思考的負擔。

        Web端設計規范包含哪些

        Web端設計規范之設計理念篇

        不同的使用對象(B端、C端),不同的終端設備,設計的區別是完全不一樣的。所以設計理念也有所區別。

        B端產品一般較定制化,以業務為導向。可能有很多高級功能,突出高效易用,導致易學性打折扣。

        C端產品一般考慮絕大部分用戶使用場景和訴求,高級功能會相對少點。突出易學性。

        所以在制定設計理念時,可根據團隊實際情況來設計制定。

        Web端設計規范之設計原則篇

        設計原則目前已經有很多,例如尼爾森的十大可用性原則、格式塔原則、剃刀法則、費茨定律、以及設計中常見的對比、對齊等,那么對于這么多原則如何變成一套自己的設計規范的設計原則篇呢?這個需要設計師們根據自身情況或者自身團隊實際情況去把控梳理。

        Web端設計規范之組件控件篇

        組件控件是整個設計規范的最重要的內容之一,組件控件分類可以根據組件控件屬性進行分類,也可以根據組件控件的功能進行劃分。

        按照設計師做設計的使用場景,還是按照組件控件的功能性進行劃分比較切合。例如表單類就可以劃分為:單文本輸入,多文本輸入、日歷時間選擇器、下拉選擇列表、單選框復選框等等

        Web端設計規范之界面交互篇

        移動端的觸發手勢有單擊、長按、左右滑動、拖拽、旋轉、夾捏等。相對于移動端,Web端的界面交互就很簡單了,基本就是懸浮和點擊。

        界面交互的本質用一個公式可表述即:觸發對象+操作行為+交互結果=界面交互

        Web端設計規范之團隊輸出物篇

        作為一名交互設計師,我們的重點工作職責是起到承上啟下的作用。

        比如對接上游的產品經理和項目經理,跟他們討論過產品規劃及需求后,他們會根據交互設計師輸出的交互文檔來評審設計方案是否滿足用戶需求,以及在開發實施過程中的可行性;

        其次要對接下游的視覺設計師和開發工程師,他們會根據交互文檔中的線框圖、交互細節說明等來輸出視覺設計稿、用代碼實現交互設計方案,并以此為依據完成落地實現等工作。所以交互設計師最重要的輸出物就是交互文檔,它是對接上下游的重要紐帶。

        專業的交互文檔應該包含以下7點內容:完整的項目簡介、需求分析、新增修改紀錄、信息架構、交互設計的方案闡述、頁面交互流程圖(包含界面布局,操作手勢,反饋效果,元素的規則定義)、異常頁面和異常情況的說明。

        作為視覺設計師而言,輸出物的是視覺稿、標注和切圖,這里不做贅述。

        預約申請免費試聽課

        填寫下面表單即可預約申請免費試聽!怕錢不夠?可就業掙錢后再付學費! 怕學不會?助教全程陪讀,隨時解惑!擔心就業?一地學習,可全國推薦就業!

        上一篇:UI設計師該如何把握網頁設計風格?
        下一篇:UI教程之UI設計規范流程

        達內UI設計7月免費訓練營報名啦

        UI培訓教程之系統圖標如何設計

        月薪過萬的UI設計師都是怎么設計界面的

        達內設計學院九周年慶典回首來時路,共赴新征程

        • 掃碼領取資料

          回復關鍵字:視頻資料

          免費領取 達內課程視頻學習資料

        • 視頻學習QQ群

          添加QQ群:1143617948

          免費領取達內課程視頻學習資料

        Copyright ? 2021 Tedu.cn All Rights Reserved 京ICP備08000853號-56 京公網安備 11010802029508號 達內時代科技集團有限公司 版權所有

        選擇城市和中心
        貴州省

        廣西省

        海南省

        2019最新在线国产自拍,2019最新国产在线观看_久久爱久久高清视频 百度 好搜 搜狗
        <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <文本链> <文本链> <文本链> <文本链> <文本链> <文本链>