界面設(shè)計(jì)之圖標(biāo)設(shè)計(jì)規(guī)范
日期:2011/8/20 / 人氣:
圖標(biāo)樣式特性
(1) 色彩豐富,是對(duì)WindowsXP外觀的補(bǔ)充。
(2) 不同的角度和透視特性為圖像增添了動(dòng)態(tài)活力。
(3) 元素的邊角十分柔和,并略微有些圓滑。
(4) 光源位于圖標(biāo)的左上角,同時(shí)有環(huán)繞光照亮圖標(biāo)的其它部分。
(5) 漸變效果使圖標(biāo)具有立體感,進(jìn)而使圖標(biāo)的外觀更加豐滿。
(6) 投影使圖標(biāo)更具對(duì)比度和立體感。
(7) 添加輪廓可使圖像更清晰。
(8) 日常對(duì)象(如計(jì)算機(jī)和設(shè)備)具有更現(xiàn)代化的個(gè)人外觀。
佛山網(wǎng)站建設(shè)_佛山網(wǎng)站制作_佛山網(wǎng)站設(shè)計(jì)_佛山網(wǎng)站_佛山網(wǎng)頁設(shè)計(jì)_佛山網(wǎng)頁建設(shè)_佛山網(wǎng)頁制作
圖標(biāo)尺寸
Windows XP圖標(biāo)有四種尺寸,建議使用以下四種尺寸:
(1) 48×48像素
(2) 32×32像素
(3) 24×24像素
(4) 16×16像素
圖標(biāo)色彩深度支持
WindowsXP支持32位圖標(biāo)。32位圖標(biāo)為24位圖像加上8位alpha通道。使圖標(biāo)邊緣非常平滑,且與背景相融合。
每個(gè)WindowsXP圖標(biāo)應(yīng)包含以下三種色彩深度,以支持不同的顯示器顯示設(shè)置:
24位圖像加上8位alpha通道(32位)
8位圖像(256色),加上1位透明色
4位圖像(16色),加上1位透明色
調(diào)色板
圖標(biāo)中使用的主要顏色。
對(duì)象的角度和分組
WindowsXP樣式圖標(biāo)使用的透視網(wǎng)格:并非所有對(duì)象使用16×16的復(fù)雜圖像都能獲得較好效果。某些對(duì)象通常以直觀圖像顯示:文檔圖標(biāo)、符號(hào)圖標(biāo)(如警告或信息圖標(biāo))、單一對(duì)象圖標(biāo)(如放大鏡)
除非創(chuàng)建重疊輔助對(duì)象可以更清楚地表達(dá)圖標(biāo)的含義,否則就可讀性和完整性而言,還是應(yīng)使用直觀圖像。還應(yīng)考慮如何按組查看圖標(biāo),以便確定如何將對(duì)象分組。
投影
使用投影后,WindowsXP圖標(biāo)將更清晰且更具立體感。可在Photoshop中實(shí)現(xiàn)這種效果,本指南的后面部分將對(duì)此進(jìn)行描述。若要為圖像添加投影,請(qǐng)?jiān)?Photoshop中雙擊圖像的圖層,并選擇Drop Shadow。然后將Angle更改為135,Distance更改為 2,Size更改為2。此時(shí)投影為75%不透明黑色。
輪廓
繪制XP樣式圖標(biāo)時(shí),為圖像添加輪廓可使之更清晰,并可保證圖像在不同背景色上都具有較好效果。
概念
設(shè)計(jì)圖標(biāo)時(shí),請(qǐng)考慮以下因素:
使用已有概念以確保真實(shí)表達(dá)了用戶的想法。考慮圖標(biāo)在用戶界面環(huán)境中以何種形式出現(xiàn),以及如何作為圖標(biāo)集的一部分使用。考慮圖形的文化背景。避免在圖標(biāo)中使用字母、單詞、手或臉。必須用圖標(biāo)表示人或用戶時(shí),請(qǐng)盡可能使其大眾化。如果圖標(biāo)中的圖像由多個(gè)對(duì)象組成,應(yīng)考慮如何使圖像尺寸更小。建議在圖標(biāo)中使用的對(duì)象不超過三個(gè)。對(duì)于 16×16的尺寸大小,還可考慮刪除某些對(duì)象或簡化圖像使之更容易辨認(rèn)。
透明工具
將Gif Movie Gear(GMG)打開一個(gè)對(duì)話框,其中顯示您的圖標(biāo)。使用吸管工具單擊圖標(biāo)的背景色。此顏色將更改為暗黃綠色(或在 GMG中選作透明背景色的顏色)。重復(fù)所有4位和8位幀。若要保存圖標(biāo),請(qǐng)選擇 File->Save Icon As...。
創(chuàng)建工具欄
Windows工具欄圖標(biāo)除不使用投影之外,使用的樣式與其它圖標(biāo)相同。由于工具欄圖標(biāo)非常小,建議您使用簡單的圖像。如果以直觀方式顯示圖像即可清晰地表達(dá)圖標(biāo)的含義,則不必使用其它復(fù)雜方式。
創(chuàng)建AVI
WindowsXP使用8位AVI。創(chuàng)建.avi文件的過程與創(chuàng)建圖標(biāo)的過程相同-在Photoshop中準(zhǔn)備圖像,然后將其拖動(dòng)到GMG 中。請(qǐng)按以下指導(dǎo)創(chuàng)建8位圖標(biāo)。若要使用GMG保存AVI,請(qǐng)轉(zhuǎn)至File->Export As->AVI file。
創(chuàng)建.avi文件時(shí),請(qǐng)考慮以下因素:使用品紅(R255 G0 B255)作為背景透明色。在Photoshop中,重要的一點(diǎn)是不要出現(xiàn)雜散像素。請(qǐng)將填充能力設(shè)置為0,并確認(rèn)未選中取消鋸齒。
作者:朋友圈科技
相關(guān)內(nèi)容 Related
- 為什么響應(yīng)式設(shè)計(jì)需要媒體查詢2016/8/5
- 虛擬主機(jī)被搜索引擎爬蟲訪問耗費(fèi)大量流量解決方法2016/8/3
- 網(wǎng)站建設(shè)中如何創(chuàng)建完美的顏色組合2016/8/1
- 什么是長尾關(guān)鍵詞?2016/8/1
- 建設(shè)企業(yè)或個(gè)人網(wǎng)站的好處2016/7/8
- 前端開發(fā)者需要知道的常識(shí)2016/7/6
- 12種方法為您拓展業(yè)務(wù)通道2016/7/27
- SEO優(yōu)化的三大技巧2016/7/24
- 10的方法來提高你的網(wǎng)站設(shè)計(jì)2016/7/24
- 網(wǎng)站統(tǒng)計(jì)用哪個(gè)比較好,百度?cnzz?2016/7/21