<ol id="rxb5d"><pre id="rxb5d"></pre></ol>

    <meter id="rxb5d"><strike id="rxb5d"><track id="rxb5d"></track></strike></meter>

    <form id="rxb5d"></form>
    <th id="rxb5d"><rp id="rxb5d"><pre id="rxb5d"></pre></rp></th>

        <nobr id="rxb5d"></nobr>
          <big id="rxb5d"></big>
          旗下產業: A產業/?A實習/?A計劃
          全國統一咨詢熱線:010-5367 2995
          首頁 > 行業資訊 > UI設計的基礎知識
          UI設計的基礎知識
          時間:2021-04-28來源:www.nepaflames.com點擊量:作者:馬晨皓
          時間:2021-04-28點擊量:作者:馬晨皓

          什么是圖標?

          圖標就是電腦,手機或其它設備中為各種文件,應用程序或快捷方式設置的一種圖形標志。

          圖標的分類

          按功能分類圖標分為:1啟動類圖標,2應用類圖標,

          1啟動類圖標

          比如像微信,QQ等代表并啟動此應用的一類圖標(如下圖所示)

            

           Image title

          Image title

          Image title

           

          2,應用類圖標

          比如像返回,刪除,保存等代表當前功能,或操作的一類圖標。(如下圖所示)

            Image title

           

          按設計形式分類分為扁平化圖標和擬物化圖標

          1扁平化圖標,

           

          Image title

           

          扁平化設計特點:簡潔,清新,設計感強,沒有更多的細節與特效修飾。直接明了的表達出出圖標的本意。缺點是識別性差。

          2擬物化圖標

             Image title

          特點,精致,細膩,識別性強,比較接近真實物品

          圖標設計設計原則

          1可識別性原則

          可識別性原則即清晰明了的表達清楚相應的功能和和操作。通俗的將就是用戶一眼看過去就知道它是做什么的。比如撥打電話圖標,用戶不需要看文字只需要看圖標就知道是撥打電話用的

           

          Image title

           

          2差異性原則

          即每個圖標之間要有一定的差異性,這樣比較容易辨別與區分

          如下圖所示如果每個圖標彼此之間很相似的化就會很難分辨

           

          Image title

           

          3統一性原則

          統一性原則表現在形狀,樣式等風格層面。如下圖圖標都用了線條,并且圖標都比較圓滑。

           

          Image title

           

          4尺寸大小尺寸與格式。

          圖標一般有以下幾種尺寸

          256x256 256x256 128x128 64x64 32x32 16x16

          圖標有以下幾種格式

          png , jpg ,svg

          圖標設計設計步驟

          1 必須明確設計需求

          即從開始到結束必須牢記并且明確說設計的圖標說代表的功能需求。

          比如在設計電話圖標時不能偏離打電話這一需求。這樣設計出來的圖標才會實用,好用,易用

          Image title

           

          2明確設計風格

          即必須定一個設計風格,是擬物化,扁平化,還是卡通圖標。在定了風格后要嚴格按所定的風格去設計其它圖標。保持統一性。

          3草圖設計

          在定了設計風格后,開始草圖設計,用草圖繪出你要設計的圖標形態。繪制草圖是一個很重要的步驟,可以用手繪或一些軟件。個人建議用手繪,如下圖所示。

           Image title

          4低保真設計

          根據草圖用自己所熟悉的設計軟件設計出整個圖標的形狀,等所有元素。如下圖的梅花圖標,先設計出此圖標的所有元素。

           Image title

          5高保真設計(視覺稿)

          在低保真的基礎上添加顏色,高光與陰影等細節,最終完成視覺稿如右上圖的梅花圖標所示。

          6輸出圖標的格式

          一般是png,jpg等

          對于UI設計是否還是處于一知半解,沒有頭緒,處于迷茫的境界呢?


           

          預約申請免費試聽課

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

          ?2007-2021/北京漫動者教育科技有限公司版權所有
          備案號:京ICP備12034770號

          老師想和你聊一聊

          ?2007-2021/ www.nepaflames.com 北京漫動者教育科技有限公司 備案號: 京ICP備12034770號 監督電話:010-53672995 郵箱:bjaaa@aaaedu.cc

          京公網安備 11010802035704號

          網站地圖

          日本色色
          <ol id="rxb5d"><pre id="rxb5d"></pre></ol>

            <meter id="rxb5d"><strike id="rxb5d"><track id="rxb5d"></track></strike></meter>

            <form id="rxb5d"></form>
            <th id="rxb5d"><rp id="rxb5d"><pre id="rxb5d"></pre></rp></th>

                <nobr id="rxb5d"></nobr>
                  <big id="rxb5d"></big>