視覺的作用   

        當(dāng)用戶下載PHPWind程序安裝使用時(shí)，其實(shí)需要更改的圖標(biāo)并不多，但一些比較重要的圖標(biāo)icon卻起著極其關(guān)鍵的作用。    而我們發(fā)現(xiàn)，大多數(shù)站長朋友們并不能正確的使用圖標(biāo)，使得論壇看上去總覺得有些地方特別的礙眼。    現(xiàn)在的圖標(biāo)設(shè)計(jì)并不是單單讓眼睛可以享受到視覺盛宴，我們所希望帶給大家的是一種依附在視覺基礎(chǔ)上的情感設(shè)計(jì)。而對于情感設(shè)計(jì)，大多數(shù)人可能聽上去很神秘，而其實(shí)就是大家可能經(jīng)常聽到的什么紅色表示快樂、熱情。這就是情感設(shè)計(jì)，因?yàn)樗�能給人情緒熱烈、飽滿，激發(fā)愛的這么一種情感。我想現(xiàn)在大家都不難理解為什么PHPWind一直使用以藍(lán)色為基準(zhǔn)的色彩搭配，因?yàn)樗{(lán)色能給人安靜、涼爽、舒適之感，使人的心胸開朗。 

 
圖標(biāo)的使用 

        在PHPWind程序中，你不必使用多么華麗的圖片圖標(biāo)去裝飾你的論壇，而相對精準(zhǔn)的圖標(biāo)細(xì)膩的搭配才是目前的站點(diǎn)們所欠缺的。何以“精準(zhǔn)”？其實(shí)就是控制圖標(biāo)的大小尺寸，顏色純度飽和，透明或者不透明...這些都是至關(guān)重要的。眾所周知，PHPWind做為通用型軟件，且為了保證其運(yùn)行效率帶給大家飛一般的速度，不得不在圖標(biāo)的尺寸和顏色上下功夫，且存在的圖標(biāo)，大多時(shí)候都不止用于一個(gè)地方，控制大小的一個(gè)原因是考慮運(yùn)行效率，另外一個(gè)就是為了在其它你不熟知的地方突然出現(xiàn)這個(gè)圖標(biāo)的時(shí)候不至于過大或者過小而尷尬，而對于這些，我們PHPWind在制作圖標(biāo)的時(shí)候，都是精確到像素級的。

圖標(biāo)文件夾分類說明

本圖采用Google Doc制作

像素圖標(biāo)說明

常用圖標(biāo)說明

提示圖標(biāo)

1.1 基礎(chǔ)信息 
      3種尺寸的圖標(biāo)(32x32,24x24,16x16)以適應(yīng)各種環(huán)境

 
1.2 設(shè)計(jì)理念 

       以三種鮮亮的色彩來詮釋圖標(biāo)的含義，取自生活中紅綠燈的想法，沿用它的設(shè)計(jì)理想的好處是不需

         去習(xí)慣它而可以直接從潛意識里貫徹用戶對這三種顏色的理解。

1.3 樣式規(guī)范           

       分別以藍(lán)，紅，黃作為色彩基準(zhǔn)           

       光源位于icon的左上角，同時(shí)有環(huán)繞光照亮icon的其它部分。           

       使用一定的漸變效果，使icon的外觀更加豐滿。
 
2 帖子閱讀頁圖標(biāo)

 
2.1 尺寸
     16x16

2.2 設(shè)計(jì)理念
      延續(xù)傳統(tǒng)設(shè)計(jì)理念進(jìn)行加工。

2.3 樣式規(guī)范
      以橙黃作為主要色彩
      使用不同的角度和透視增加圖標(biāo)活力
      光源位于icon的左上角，同時(shí)有環(huán)繞光照亮icon的其它部分。
      添加輪廓是圖像清晰
      使用一定的漸變效果，使icon的外觀更加豐滿。

2.4 交互設(shè)計(jì)
    鼠標(biāo)做觸碰動(dòng)作時(shí)完成圖形切換的交互過程。
 
3 帖子類型圖標(biāo)規(guī)范

3.2 設(shè)計(jì)理念

      參考現(xiàn)實(shí)生活中的物件進(jìn)行創(chuàng)作 

3.3 樣式規(guī)范    

      分別以藍(lán)，黃，綠作為色彩基準(zhǔn)    

      光源位于icon的左上角，同時(shí)有環(huán)繞光照亮icon的其它部分。  

      添加輪廓是圖像清晰    

      參考日常對象創(chuàng)作圖標(biāo)。    

      使用一定的漸變效果，使icon的外觀更加豐滿。

4.圈子圖標(biāo)

    圈子里的圖標(biāo)數(shù)量不多,主要分為側(cè)欄的24x24的應(yīng)用圖標(biāo)和16x16的像素級圖標(biāo)。

 
    24x24的圖標(biāo)的應(yīng)用范圍只有側(cè)欄導(dǎo)航和頁頭標(biāo)題旁,一般如果要更換只要控制其大小在這個(gè)范圍即可,文字的行距為36px。

    而16x16的應(yīng)用圖標(biāo)和其他一些例如加好友發(fā)郵件的小圖標(biāo)的應(yīng)用范圍卻是跨系統(tǒng)的,所以這些圖標(biāo)的尺寸一定得嚴(yán)格控制好,比如名片系統(tǒng)(論壇,圈子).

3.1 尺寸    16x16

查看更多 PhpWind教程  PhpWind模板風(fēng)格