說起按鈕,不得不先提一下鏈接,因為在大部分人看來,似乎按鈕與鏈接差不多,都是完成一個頁面的跳轉(zhuǎn)。其實不然,按鈕與鏈接還是有一定的區(qū)別。 福州網(wǎng)絡(luò)公司, 福州網(wǎng)站建設(shè), 福州網(wǎng)站設(shè)計, 福州網(wǎng)站制作, 福州做網(wǎng)站 先簡單說說他們的區(qū)別吧。 按鈕:按鈕代表著“做某件事”,即點擊了按鈕代表著操作了一個功能,做的這件事是有后果的,不易挽回的。例如典型的google,QQ郵箱。像信息搜索、回復(fù)、注冊,他們的共同點是:都是在“做”一件事,并且絕大多數(shù)都是對表單的提交。從技術(shù)上講,這類按鈕的作用是向后臺提交了數(shù)據(jù),“命令”服務(wù)器去做了一件事。 鏈接:鏈接的作用是:“帶你去另一個頁面”,你無論點幾次鏈接,都是在“看”,而并沒有“做”任何事。典型的鏈接是文字標題,點擊了去看詳情。 假如這樣嚴格來區(qū)分按鈕與鏈接的區(qū)別,好處是在邏輯上會非常清晰。然而,現(xiàn)實的問題是,按這種思路設(shè)計出來的網(wǎng)站,在一些需要被強化的地方,一些需要引導(dǎo)用戶點擊的地方,僅用鏈接很難在視覺上突出表現(xiàn)。再回到我們游戲頁面設(shè)計的現(xiàn)狀來看,其實按鈕與鏈接也并沒有嚴格區(qū)分,而且,假如嚴格區(qū)分,跟我們要表達視覺上的優(yōu)先級別會有沖突。典型案例:各游戲引導(dǎo)頁里的“進入官網(wǎng)”,嚴格來講,它的作用也只是讓觀者順利跳轉(zhuǎn)到另一個頁面,是屬于鏈接,但這個往往是我們特別強調(diào)的“按鈕”。所以在游戲頁面的設(shè)計過程中,是否需要嚴格區(qū)分兩者的區(qū)別,還有待討論…… 小結(jié)一下當前大部分人理解的按鈕:有一個外框(這個框可以是任何幾何形體,比如方、圓、橢圓等等),再上面有一些文字(比如:下載、注冊、充值、搜索、登錄,抽獎等等),滿足了這兩個基本條件的,大家就認為是按鈕,按鈕的本質(zhì)特點就是可以點擊。 一、下面是針對沒有嚴格區(qū)分兩者關(guān)系的按鈕視覺表現(xiàn)探討 當前在頁面里要強調(diào)的鏈接自然會以按鈕的形式表現(xiàn),尤其所謂重量級按鈕是促成觀者完成頁面功能的一個很重要的部分,所以對于其本身來講,應(yīng)該具有“勾引眼球”的效果。對于一個可以起到“勾引”作用的按鈕,建議從下面幾個方面來思考。 1.按鈕本身的用色 本身的顏色應(yīng)該區(qū)別于它周邊的環(huán)境色,因此它要更亮而且有高對比度的顏色。 |
[[nextpage_tab]
發(fā)表時間:2010-8-26 21:06:00 來源:中國藝術(shù)吧 作者: ]
2.按鈕的位置 按鈕的位置也需要仔細考究,基本原則是要容易找到,特別重要的按鈕應(yīng)該處在畫面的中心位置。 3.按鈕上面的文字表述 在按鈕上使用什么文字傳遞給用戶非常重要。需要言簡意賅,直接明了,如:注冊、下載、創(chuàng)建、免費試玩等,甚至有時候用“點擊進入”,這一點上就是千萬不要讓觀者去思考,越簡單、越直接越好。 4.按鈕的尺寸 通常來講,一個頁面當中按鈕的大小也決定了其本身的重要級別,但也不是越大越好,尺寸應(yīng)該適中,因為按鈕大到一定程度,會讓人覺得那不像按鈕,潛意識的認為那是一塊區(qū)域,導(dǎo)致沒有點擊欲望。 5.讓其充分通透 你的按鈕不能和網(wǎng)頁中的其他元素擠在一起。它需要充足的margin(外邊距)才能更加突出,也需要更多的padding(內(nèi)邊距)才能讓文字更容易閱讀。 6.注意鼠標滑過的效果 給予較為重要的按鈕適當加一些鼠標滑過的效果,會有力的增強按鈕的點擊感,給用戶帶來良好的用戶體驗,起到畫龍點睛的作用。這里要注意的是,不太適合按鈕集中的地方,每個都增加高亮的鼠標滑過的效果,這樣會造成視覺過于雜亂,影響用戶瀏覽的舒適度,所以要強調(diào)的是“恰當”地添加鼠標滑過的效果。 設(shè)計師在平常的工作當中,經(jīng)常會遇到一些按鈕修改的意見,時不時聽到產(chǎn)品人員提到“讓這個按鈕更像個按鈕”,面對這樣的問題,不防從上面的6個方向去思考與改進。 |
[nextpage_tab]
[ 發(fā)表時間:2010-8-26 21:06:00 來源:中國藝術(shù)吧 作者: ] |
其實在我們平常的設(shè)計當中有很多重量級不那么高的按鈕,需要“低調(diào)”處理,也就是說在一個頁面當中,眾多的按鈕,是有功能優(yōu)先級別的,這樣就務(wù)必讓一堆按鈕也呈現(xiàn)出視覺的優(yōu)先級別。如下面的圖片,右邊的按鈕群除了大小、位置區(qū)分了優(yōu)先級之外,很重要的一點是色塊的區(qū)分,高飽和色塊的按鈕群是不建議存在的。高飽和色調(diào)的應(yīng)用往往是為了突出重點,而非強調(diào)整體,所以這種局面的處理方式建議用眾多的低飽和色調(diào)來襯托小部分高飽和的重點信息。 二、游戲按鈕視覺表現(xiàn) 在眾多的游戲官網(wǎng)中,可以看到各式各樣的游戲按鈕,相對于一般商務(wù)型按鈕來講,游戲性按鈕更加在意的是質(zhì)感上面的表現(xiàn),比如金屬、石頭、玻璃、木頭、塑膠等等,通過質(zhì)感的選擇表現(xiàn)來表達游戲本身的特質(zhì)。 上圖是韓版C9預(yù)告站的畫面,其中的按鈕是屬于金屬質(zhì)感的表現(xiàn),瀏覽完這個預(yù)告站,這些按鈕給我留下了非常深刻的印象,認真究其原因,你會發(fā)現(xiàn)設(shè)計師同樣是從金屬質(zhì)感出發(fā),結(jié)合游戲本身的某些特點,努力找到一些不同于常規(guī)金屬按鈕的特點,比如圓角處的凸起、下面中間部分的延展圖紋,然后進行細膩刻畫,最后在整個網(wǎng)站里進行統(tǒng)一的應(yīng)用,讓人印象深刻。雖然只是頁面里的一些功能按鈕,卻讓我記住了這個網(wǎng)站,記住了C9。小結(jié)是,建議在對游戲按鈕進行設(shè)計的時候,能夠盡可能結(jié)合游戲的特質(zhì),究其獨特性,細膩的刻畫,然后做到系統(tǒng)的應(yīng)用,達到視覺的統(tǒng)一性(這種在游戲官網(wǎng)上的應(yīng)用尤為重要)。 上面三個按鈕分別截取于韓版CF、AVA、特種部隊的網(wǎng)頁畫面,同樣是FPS游戲,在按鈕的刻畫上卻相差甚遠,當然,仔細再去瀏覽更多的頁面,也會發(fā)現(xiàn),就算是都屬于CF的頁面,不同頁面的按鈕表現(xiàn)也各有不同,但我們可以找到他們的共性,這些別樣的按鈕基本都是整個畫面的重點視覺訴求,也是功能的重要點,他們的特點是考慮游戲的定位,然后再根據(jù)每次要表達的主題,變化性的設(shè)計按鈕,也許有游戲特點,也許比較中性,但最終的效果是以求達到整體畫面的協(xié)調(diào)與重點的突出。(這種按鈕的變化就比較適合各種專題的設(shè)計表現(xiàn)上) 結(jié)束語:請重視按鈕的表現(xiàn)。 |