“所謂設計，指的是把一種計劃、規(guī)劃、設想、問題解決的方法，通過視覺的方式傳到出來的活動過程?！?br />設計是一個有意識的計劃、規(guī)劃信息的活動。從這個角度來說，制定并執(zhí)行規(guī)范過程本身就是設計。

迷你屋商城視覺規(guī)范在之前大量的視覺設計基礎上加以整理、提煉出6類，共13項基本界面元素。商城中的所有頁面都嚴格的依據視覺規(guī)范進行設計。下面簡要介紹一下迷你屋商城視覺規(guī)范的具體內容：

文字顏色
文字顏色定義了三種，分別是：突出色，正文顏色和輔助色。
突出色是頁面上的最搶眼的顏色；正文顏色，無需多解釋；注釋、說明之類不需要太讓用戶留意的文字使用輔助色。

一個網站的文字顏色總體上可以按上面這三種劃分，當然不一定只有三個文字顏色。單純的來看文字顏色，并沒有太多的問題。但文字顏色與鏈接樣式；文字顏色與頁面背景顏色這兩個問題就比較復雜了。這些問題將在下面分別討論。

鏈接
鏈接最傳統(tǒng)的表現手段是：藍色+下劃線。但是由于這兩個表現手段明顯的缺陷，多數時候難于應用。
從上面這個最傳統(tǒng)的表現還可以演化出很多種鏈接的表現手段：
1. 鏈接文字只用藍色。鏈接文字默認狀態(tài)時，只顯示為藍色，鼠標經過時再出現下劃線或者反色。Yahoo.com flickr都使用的是這樣的方式。這種表現的缺陷：網頁上多數文字是有鏈接的，于是頁面上多數文字都是藍色的了，視覺表現可發(fā)揮的空間比較小。
2. 鏈接文字只加下劃線。有下劃線的文字是可以點擊的，這是足夠清楚的表現了。這種表現的缺陷：很多鏈接的時候，就會是滿頁都是下劃線了。同樣是讓視覺表現比較痛苦。
3. 列表文字默認不加下劃線；分散出現的鏈接有下劃線。Qzone就是應用的這種。缺陷：在一個頁面中同時出現這兩種情況，和列表中的鏈接相比，分散出現的鏈接加了下劃線，顯得更為強眼，更明確的傳達出“可點擊”的信息。而分散的鏈接并不總是要強調的。所以需要再用其他方式補救，必要的時候讓列表突出。Gmail中有比較不錯的方式。

鏈接的表現方式也許還有更多，但無論是什么樣的表現，都需要確保一個基本原則：操作前操作可識別，即，直接瀏覽頁面就可以知道哪些文字是可以點擊的。

迷你屋商城頁面中主要是圖片的展示，文字相對較少，很少在一頁中大量出現鏈接，因此采用了第二種方式：鏈接文字只加下劃線。

第二種表現方式鏈接的表現并不涉及顏色，任何顏色的文字都可以加鏈接。之前我們也規(guī)定好了不同類型的文字使用的顏色。這樣的組合規(guī)范自由度較大。文字的顏色取決于它的重要程度。非常重要的用紫紅色，非常次要的用灰色(輔助色)。有鏈接則加下劃線。不存在“鏈接文字需要強調，但又不得不用鏈接文字的固定顏色”的問題。

背景色
背景色也是一個應該與文字顏色一起考慮的元素。迷你屋商城視覺規(guī)范中定義的背景色，除了白色背景，另外主要還有兩種：輔助的淺灰色和主色彩-橙色。

淺灰色是用于區(qū)隔內容，內容表達上并不總是能用邊線來區(qū)隔的，那么可以使用這個淺灰色作為背景加以區(qū)隔。

主色調的背景下會出現各種文字，強調色的文字、正文文字、鏈接，甚至是輔助文字。因此需要背景色能適應上面所說的種種文字。

主色彩上的文字有可能會出現強調色文字，所以，主色彩和強調色文字不能是同一個顏色。主色彩上會顯示鏈接，如果鏈接選用了藍色文字顏色的方案，主色彩最好不選用藍色，在藍色背景下顯示藍色的鏈接，效果不好，如上圖。

迷你屋選用了橙色。選用橙色是出于產品內涵的考慮，因為迷你屋是一個結合Qzone與QQ秀的產品，在黃與紅之前。但是，作為主色彩，橙色并不是最好的選擇，橙色比較搶眼、亮，頁面上需要突出的是強調色的文字和突出的按鈕，而不是主色彩。主色彩并不宜過亮。在橙色的基礎上再選擇更亮的顏色作為突出的文字顏色，我們選擇了紫紅。

新聞標題：大量的視覺設計基礎設計出迷你屋商城視覺規(guī)范
網站鏈接：http://www.aaarwkj.com/news/166784.html

成都網站建設公司_創(chuàng)新互聯，為您提供響應式網站、小程序開發(fā)、手機網站建設、營銷型網站建設、網站收錄、關鍵詞優(yōu)化

廣告

聲明：本網站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯