歡迎來(lái)到合肥浪訊網(wǎng)絡(luò)科技有限公司官網(wǎng)
  咨詢服務(wù)熱線:400-099-8848

網(wǎng)頁(yè)規(guī)劃的按鈕評(píng)論

發(fā)布時(shí)間:2019-12-28 文章來(lái)源:本站  瀏覽次數(shù):2794

網(wǎng)頁(yè)規(guī)劃的按鈕評(píng)論(圖一)

說(shuō)起按鈕,不得不先提一下鏈接,因?yàn)樵诖蟛糠秩丝磥?lái),好像按鈕與鏈接差不多,都是完結(jié)一個(gè)頁(yè)面的跳轉(zhuǎn)。其實(shí)不然,按鈕與鏈接還是有必定的差異。

先簡(jiǎn)略說(shuō)說(shuō)他們的差異吧。

按鈕:按鈕代表著“做某件事”,即點(diǎn)擊了按鈕代表著操作了一個(gè)功用,做的這件事是有結(jié)果的,不易拯救的。例如典型的google,QQ郵箱。像信息查找、回復(fù)、注冊(cè),他們的共同點(diǎn)是:都是在“做”一件事,并且絕大多數(shù)都是對(duì)表單的提交。從技能上講,這類按鈕的作用是向后臺(tái)提交了數(shù)據(jù),“指令”服務(wù)器去做了一件事。

鏈接:鏈接的作用是:“帶你去另一個(gè)頁(yè)面”,你無(wú)觀點(diǎn)幾次鏈接,都是在“看”,而并沒有“做”任何事。典型的鏈接是文字標(biāo)題,點(diǎn)擊了去看概況。

網(wǎng)頁(yè)規(guī)劃的按鈕評(píng)論(圖二)

假設(shè)這樣嚴(yán)厲來(lái)差異按鈕與鏈接的差異,好處是在邏輯上會(huì)十分清晰。然而,實(shí)際的問題是,按這種思路規(guī)劃出來(lái)的網(wǎng)站,在一些需求被強(qiáng)化的當(dāng)?shù)兀恍┬枨笠龑?dǎo)用戶點(diǎn)擊的當(dāng)?shù),僅用鏈接很難在視覺上杰出體現(xiàn)。再回到我們游戲頁(yè)面規(guī)劃的現(xiàn)狀來(lái)看,其實(shí)按鈕與鏈接也并沒有嚴(yán)厲差異,而且,假設(shè)嚴(yán)厲差異,跟我們要表達(dá)視覺上的優(yōu)先等級(jí)會(huì)有抵觸。典型案例:各游戲引導(dǎo)頁(yè)里的“進(jìn)入官網(wǎng)”,嚴(yán)厲來(lái)講,它的作用也僅僅讓觀者順暢跳轉(zhuǎn)到另一個(gè)頁(yè)面,是歸于鏈接,但這個(gè)往往是我們特別著重的“按鈕”。所以在游戲頁(yè)面的規(guī)劃過程中,是否需求嚴(yán)厲差異兩者的差異,還有待評(píng)論……

小結(jié)一下當(dāng)時(shí)大部分人理解的按鈕:有一個(gè)外框(這個(gè)框能夠是任何幾何形體,比方方、圓、橢圓等等),再上面有一些文字(比方:下載、注冊(cè)、充值、查找、登錄,抽獎(jiǎng)等等),滿意了這兩個(gè)根本條件的,大家就認(rèn)為是按鈕,按鈕的本質(zhì)特色便是能夠點(diǎn)擊。

一、下面是針對(duì)沒有嚴(yán)厲差異兩者聯(lián)系的按鈕視覺體現(xiàn)評(píng)論

當(dāng)時(shí)在頁(yè)面里要著重的鏈接自然會(huì)以按鈕的形式體現(xiàn),尤其所謂重量級(jí)按鈕是促成觀者完結(jié)頁(yè)面功用的一個(gè)很重要的部分,所以對(duì)于其自身來(lái)講,應(yīng)該具有“蠱惑眼球”的作用。對(duì)于一個(gè)能夠起到“蠱惑”作用的按鈕,主張從下面幾個(gè)方面來(lái)考慮。

1.按鈕自身的用色

自身的色彩應(yīng)該差異于它周邊的環(huán)境色,因而它要更亮而且有高對(duì)比度的色彩。

網(wǎng)頁(yè)規(guī)劃的按鈕評(píng)論(圖三)

2.按鈕的方位

按鈕的方位也需求細(xì)心講究,根本原則是要容易找到,特別重要的按鈕應(yīng)該處在畫面的中心方位。

網(wǎng)頁(yè)規(guī)劃的按鈕評(píng)論(圖四)

3.按鈕上面的文字表述

在按鈕上運(yùn)用什么文字傳遞給用戶十分重要。需求言簡(jiǎn)意賅,直接明晰,如:注冊(cè)、下載、創(chuàng)建、免費(fèi)試玩等,乃至有時(shí)候用“點(diǎn)擊進(jìn)入”,這一點(diǎn)上便是千萬(wàn)不要讓觀者去考慮,越簡(jiǎn)略、越直接越好。

網(wǎng)頁(yè)規(guī)劃的按鈕評(píng)論(圖五)

4.按鈕的尺度

通常來(lái)講,一個(gè)頁(yè)面當(dāng)中按鈕的巨細(xì)也決定了其自身的重要等級(jí),但也不是越大越好,尺度應(yīng)該適中,因?yàn)榘粹o大到必定程度,會(huì)讓人覺得那不像按鈕,潛意識(shí)的認(rèn)為那是一塊區(qū)域,導(dǎo)致沒有點(diǎn)擊欲望。

5.讓其充分通透

你的按鈕不能和網(wǎng)頁(yè)中的其他元素?cái)D在一同。它需求充足的margin(外邊距)才能愈加杰出,也需求更多的padding(內(nèi)邊距)才能讓文字更容易閱覽。

6.注意鼠標(biāo)滑過的作用

給予較為重要的按鈕適當(dāng)加一些鼠標(biāo)滑過的作用,會(huì)有力的增強(qiáng)按鈕的點(diǎn)擊感,給用戶帶來(lái)杰出的用戶體會(huì),起到畫龍點(diǎn)睛的作用。這兒要注意的是,不太合適按鈕會(huì)集的當(dāng)?shù)兀總(gè)都添加高亮的鼠標(biāo)滑過的作用,這樣會(huì)造成視覺過于凌亂,影響用戶閱讀的舒適度,所以要著重的是“恰當(dāng)”地添加鼠標(biāo)滑過的作用。

網(wǎng)頁(yè)規(guī)劃的按鈕評(píng)論(圖六)

規(guī)劃師在平常的工作當(dāng)中,經(jīng)常會(huì)遇到一些按鈕修改的意見,時(shí)不時(shí)聽到產(chǎn)品人員提到“讓這個(gè)按鈕更像個(gè)按鈕”,面對(duì)這樣的問題,不防從上面的6個(gè)方向去考慮與改善。

其實(shí)在我們平常的規(guī)劃當(dāng)中有很多重量級(jí)不那么高的按鈕,需求“低沉”處理,也便是說(shuō)在一個(gè)頁(yè)面當(dāng)中,很多的按鈕,是有功用優(yōu)先等級(jí)的,這樣就務(wù)必讓一堆按鈕也呈現(xiàn)出視覺的優(yōu)先等級(jí)。如下面的圖片,右邊的按鈕群除了巨細(xì)、方位差異了優(yōu)先級(jí)之外,很重要的一點(diǎn)是色塊的差異,高飽和色塊的按鈕群是不主張存在的。高飽和色調(diào)的使用往往是為了杰出要點(diǎn),而非著重整體,所以這種局面的處理方式主張用很多的低飽和色調(diào)來(lái)襯托小部分高飽和的要點(diǎn)信息。

網(wǎng)頁(yè)規(guī)劃的按鈕評(píng)論(圖七)

二、游戲按鈕視覺體現(xiàn)

在很多的游戲官網(wǎng)中,能夠看到各式各樣的游戲按鈕,相對(duì)于一般商務(wù)型按鈕來(lái)講,游戲性按鈕愈加在意的是質(zhì)感上面的體現(xiàn),比方金屬、石頭、玻璃、木頭、塑膠等等,經(jīng)過質(zhì)感的挑選體現(xiàn)來(lái)表達(dá)游戲自身的特質(zhì)。

網(wǎng)頁(yè)規(guī)劃的按鈕評(píng)論(圖八)

上圖是韓版C9預(yù)告站的畫面,其中的按鈕是歸于金屬質(zhì)感的體現(xiàn),閱讀完這個(gè)預(yù)告站,這些按鈕給我留下了十分深入的印象,認(rèn)真究其原因,你會(huì)發(fā)現(xiàn)規(guī)劃師同樣是從金屬質(zhì)感出發(fā),結(jié)合游戲自身的某些特色,努力找到一些不同于常規(guī)金屬按鈕的特色,比方圓角處的凸起、下面中間部分的延展圖紋,然后進(jìn)行細(xì)膩描寫,最后在整個(gè)網(wǎng)站里進(jìn)行統(tǒng)一的使用,讓人印象深入。盡管僅僅頁(yè)面里的一些功用按鈕,卻讓我記住了這個(gè)網(wǎng)站,記住了C9。小結(jié)是,主張?jiān)趯?duì)游戲按鈕進(jìn)行規(guī)劃的時(shí)候,能夠盡可能結(jié)合游戲的特質(zhì),究其獨(dú)特性,細(xì)膩的描寫,然后做到系統(tǒng)的使用,到達(dá)視覺的統(tǒng)一性(這種在游戲官網(wǎng)上的使用尤為重要)。

網(wǎng)頁(yè)規(guī)劃的按鈕評(píng)論(圖九)

上面三個(gè)按鈕別離截取于韓版CF、AVA、特種部隊(duì)的網(wǎng)頁(yè)畫面,同樣是FPS游戲,在按鈕的描寫上卻相差甚遠(yuǎn),當(dāng)然,細(xì)心再去閱讀更多的頁(yè)面,也會(huì)發(fā)現(xiàn),就算是都?xì)w于CF的頁(yè)面,不同頁(yè)面的按鈕體現(xiàn)也各有不同,但我們能夠找到他們的共性,這些異樣的按鈕根本都是整個(gè)畫面的要點(diǎn)視覺訴求,也是功用的重要點(diǎn),他們的特色是考慮游戲的定位,然后再依據(jù)每非必須表達(dá)的主題,改變性的規(guī)劃按鈕,或許有游戲特色,或許比較中性,但最終的作用是以求到達(dá)整體畫面的協(xié)調(diào)與要點(diǎn)的杰出。(這種按鈕的改變就比較合適各種專題的規(guī)劃體現(xiàn)上)

結(jié)束語(yǔ):請(qǐng)注重按鈕的體現(xiàn)。

上一條:大型網(wǎng)站動(dòng)態(tài)運(yùn)用體系架構(gòu)...

下一條:交互規(guī)劃心得收拾...