張經(jīng)理 / 18665606093
Email / service@2000new.com
掃一掃添加顧問
1.廣州網(wǎng)頁設(shè)計(jì)的目的是什么?我們?yōu)槭裁匆O(shè)計(jì)網(wǎng)頁?
在設(shè)計(jì)網(wǎng)頁之前,最重要的是弄清楚這個(gè)設(shè)計(jì)的目的是什么。網(wǎng)頁的設(shè)計(jì)不僅僅是為了好看。如果只是為了好看,可以直接上高清大圖。網(wǎng)頁的設(shè)計(jì)絕不僅僅是模仿,別人的設(shè)計(jì)不一定是對(duì)自己最好的。因此,只有明確設(shè)計(jì)網(wǎng)頁的目的,我們才能有一個(gè)明確的目標(biāo)。
下面將總結(jié)設(shè)計(jì)網(wǎng)頁的幾個(gè)目的。我們明白了設(shè)計(jì)網(wǎng)站的目的之后,就可以進(jìn)行部署、規(guī)劃、原型化,交給UI設(shè)計(jì),然后進(jìn)行網(wǎng)站的重構(gòu)和部署,一步一步的完成我們需要的網(wǎng)站。
2.以網(wǎng)頁設(shè)計(jì)為目的的——網(wǎng)頁是產(chǎn)品的重要入口
這是最常見的。網(wǎng)站是我們的產(chǎn)品,或者訪問網(wǎng)站意味著用戶正在使用我們的產(chǎn)品。
比如:airbnb,淘寶,騰訊視頻,各大門戶。用戶訪問airbnb時(shí),想查詢住宿情況;用戶訪問淘寶,想購(gòu)物;用戶訪問騰訊視頻是想看視頻,用戶訪問門戶網(wǎng)站是想看新聞。
Airbnb:用戶直接進(jìn)入業(yè)務(wù)流程
對(duì)于這種目的的頁面設(shè)計(jì)沒有一般的原則,也不需要按照任何方法進(jìn)行設(shè)計(jì)。在這種情況下,我們需要做的是將網(wǎng)頁設(shè)計(jì)與業(yè)務(wù)邏輯完全結(jié)合起來,讓網(wǎng)頁設(shè)計(jì)服務(wù)于業(yè)務(wù)流程,為用戶提供最直接、最方便、最流暢的產(chǎn)品體驗(yàn)。
3.網(wǎng)頁設(shè)計(jì)的目的是——推廣企業(yè)品牌
有時(shí)候,網(wǎng)頁不是我們展示產(chǎn)品的方式。尤其是大公司,產(chǎn)品種類繁多,各有網(wǎng)站。而貴公司的網(wǎng)站,這是不需要推廣產(chǎn)品或者開展推廣活動(dòng)的。這個(gè)時(shí)候用官網(wǎng)做品牌推廣最合適。所以在頁面設(shè)計(jì)的過程中,要充分了解公司的定位和追求,把公司的思路和想法融入到網(wǎng)頁設(shè)計(jì)中。
以騰訊官網(wǎng)為例。在官網(wǎng)首頁的第一屏,我們可以看到一個(gè)非常醒目的表情:“連接”。我們知道,騰訊的基礎(chǔ)是連接,QQ和微信連接了整個(gè)社交網(wǎng)絡(luò),每月活躍用戶8-9億,為騰訊建立了強(qiáng)大的連接網(wǎng)絡(luò)。騰訊所有的產(chǎn)品和服務(wù)只有兩個(gè)關(guān)鍵詞,即“連接”和“內(nèi)容”。
騰訊官網(wǎng)首頁和第一屏:“連接”
4.——以網(wǎng)頁設(shè)計(jì)為目的的促銷產(chǎn)品
對(duì)于我們自己的互聯(lián)網(wǎng)產(chǎn)品,產(chǎn)品解決了哪些痛點(diǎn),與競(jìng)爭(zhēng)產(chǎn)品相比有什么優(yōu)勢(shì),我們的產(chǎn)品有什么特點(diǎn)?通過網(wǎng)頁告訴用戶才是最合適的。
那么為了這個(gè)目的,我們應(yīng)該如何設(shè)計(jì)一個(gè)網(wǎng)頁呢?一般來說,這樣的網(wǎng)頁將采用模塊化的方法。這些模塊包括:產(chǎn)品特點(diǎn)、產(chǎn)品優(yōu)勢(shì)、產(chǎn)品定價(jià)、產(chǎn)品獲取方式、產(chǎn)品使用方式、產(chǎn)品用戶、產(chǎn)品合作經(jīng)典案例、合作客戶評(píng)價(jià)。從以上模塊中,產(chǎn)品經(jīng)理可以選擇他的產(chǎn)品最想突出的4 ~ 5個(gè)模塊,仔細(xì)設(shè)計(jì)每個(gè)模塊的內(nèi)容,將模塊組合在一起。
以最濕網(wǎng)站的一個(gè)產(chǎn)品頁面(遠(yuǎn)程調(diào)試)為例。在第一個(gè)屏幕上,我們可以看到橫幅突出了產(chǎn)品名稱和產(chǎn)品描述,并在引導(dǎo)用戶時(shí)配備了一個(gè)大按鈕。接下來是產(chǎn)品功能描述,是產(chǎn)品介紹頁面必不可少的模塊。其他模塊的介紹和選擇,請(qǐng)參考后面“實(shí)踐經(jīng)驗(yàn)6”中的圖片。
最濕:經(jīng)典產(chǎn)品介紹頁
5.——用于網(wǎng)頁設(shè)計(jì)的演示數(shù)據(jù)
這樣的頁面是專業(yè)頁面。
專業(yè)頁面經(jīng)常顯示與業(yè)務(wù)密切相關(guān)的各種數(shù)據(jù),如DAU、MAU、Crash rate、ANR報(bào)告等數(shù)據(jù)信息。這些信息需要由負(fù)責(zé)數(shù)據(jù)分析的專業(yè)技術(shù)人員或產(chǎn)品經(jīng)理查看。因此,在設(shè)計(jì)這樣的頁面時(shí),應(yīng)該以規(guī)范、整潔、易讀的形式呈現(xiàn)給用戶。
需要注意的是,這類頁面不僅需要提供顯示功能,還需要提供查詢功能。由于數(shù)據(jù)量大,往往直接顯示關(guān)鍵數(shù)據(jù)或樣本數(shù)據(jù),可能需要用戶自己搜索查看的內(nèi)容更多。
Bugly:經(jīng)典數(shù)據(jù)顯示頁面
Bugly是騰訊推出的崩潰捕捉和顯示產(chǎn)品。頁面設(shè)計(jì)是典型的數(shù)據(jù)顯示類型。從上圖數(shù)據(jù)顯示的頁面中,我們可以清楚地看到,頁面設(shè)計(jì)采用了扁平化、模塊化的布局,使得整個(gè)頁面的布局規(guī)則清晰。另外,在左側(cè)、上側(cè)和中上部,采用TAB切換顯示方式,使得數(shù)據(jù)顯示更有條理。
6.——,網(wǎng)頁設(shè)計(jì)的目的,引導(dǎo)用戶下載app
當(dāng)我們的產(chǎn)品是移動(dòng)產(chǎn)品時(shí),apk類型的安卓或iOS移動(dòng)應(yīng)用。引導(dǎo)用戶下載我們的產(chǎn)品是大多數(shù)產(chǎn)品經(jīng)理的KPI。這時(shí)候自然要充分利用我們的網(wǎng)站來引導(dǎo)用戶下載我們的手機(jī)產(chǎn)品。
優(yōu)步:右下角醒目的“下載APP”
對(duì)于這類經(jīng)典案例,我們來看看優(yōu)步官網(wǎng)。優(yōu)步的產(chǎn)品形式是移動(dòng)客戶端。所以優(yōu)步官網(wǎng)是用來引導(dǎo)用戶下載客戶端的,可以說是完美的。所以在官網(wǎng)首頁的第一屏,設(shè)計(jì)師在Banner上放了一個(gè)大提示,引導(dǎo)用戶下載客戶端。
7.以網(wǎng)頁設(shè)計(jì)為目的的——商業(yè)推廣急需賺錢
有時(shí),當(dāng)產(chǎn)品已經(jīng)建立時(shí),收入流成為產(chǎn)品經(jīng)理的重要關(guān)鍵績(jī)效指標(biāo)。官網(wǎng)作為用戶接觸我們產(chǎn)品最直接的方式,可以配合運(yùn)營(yíng)推廣活動(dòng),吸引用戶購(gòu)買產(chǎn)品。此時(shí),在網(wǎng)頁設(shè)計(jì)過程中,如何將營(yíng)銷內(nèi)容展示在顯眼的位置,讓用戶更容易購(gòu)買產(chǎn)品,是我們的設(shè)計(jì)重點(diǎn)。
騰訊云:首頁橫幅內(nèi)容,典型營(yíng)銷推廣
以騰訊云為例:騰訊云作為國(guó)內(nèi)提供云產(chǎn)品的幾家實(shí)力雄厚的公司之一,在與阿里巴巴云、華為云等產(chǎn)品正常業(yè)務(wù)時(shí),需要提升份額。所以官網(wǎng)作為用戶最容易進(jìn)入的入口,直接展示了大量的營(yíng)銷內(nèi)容,也體現(xiàn)了其助推收益的目的。