可以在线看av的网站,洗澡BBWBBWBBWBBW毛,大屁股熟女一区二区三区,久久久亚洲精华液精华液精华液

歡迎來(lái)到海淘科技官網(wǎng) 官方微信 官方微博 平面活動(dòng)官網(wǎng)
微信

網(wǎng)絡(luò)傳播媒介服務(wù)提供商

熱線電話

021-62677988

海淘新聞
首頁(yè) > 新聞列表 > 專題網(wǎng)頁(yè)設(shè)計(jì)十大技巧讓網(wǎng)頁(yè)脫穎而出

專題網(wǎng)頁(yè)設(shè)計(jì)十大技巧讓網(wǎng)頁(yè)脫穎而出

發(fā)布時(shí)間: 2016-11-07 10:51

活動(dòng)頁(yè)簡(jiǎn)析

活動(dòng)專題頁(yè)面,顧名思義是承載各種形式的節(jié)慶促銷、宣傳推廣、營(yíng)銷產(chǎn)品發(fā)布等等活動(dòng)的頁(yè)面,形式與內(nèi)容也多種多樣。 典型的靜態(tài)活動(dòng)頁(yè)面通常使用頁(yè)頭banner+標(biāo)題再配以活動(dòng)入口的展示形式,主要以背景、banner和標(biāo)題字體的視覺處理來(lái)烘托整體氛圍;如今也越來(lái) 越多的活動(dòng)頁(yè)會(huì)加入游戲等趣味性強(qiáng)的互動(dòng)方式,采用flash形式展現(xiàn),今年TMALL的喵星球搶紅包活動(dòng)就是絕佳例子。


其實(shí)無(wú)論哪種活動(dòng)頁(yè),當(dāng)我們對(duì)其進(jìn)行拆解分析后會(huì)發(fā)現(xiàn)頁(yè)面中要展示的信息最終都逃不開以下七種

  1. 活動(dòng)標(biāo)題
  2. 活動(dòng)入口
  3. 活動(dòng)獎(jiǎng)品/商品展示
  4. 活動(dòng)參與人數(shù)
  5. 有效時(shí)間
  6. 獲獎(jiǎng)信息

活動(dòng)規(guī)則 如何合理布局,將以上所有信息以最優(yōu)方式展現(xiàn)在頁(yè)面中,是活動(dòng)頁(yè)設(shè)計(jì)的關(guān)鍵。

一、 充分利用首屏,展示核心信息

筆者的建議是第一屏就將活動(dòng)的核心內(nèi)容傳達(dá)給用戶,2011年Jakob Neilsen一項(xiàng)研究結(jié)果表明用戶將80%以上的注意力花在對(duì)首屏內(nèi)容的瀏覽上,尤其是call-to-action按鈕放在首屏或者第二屏,其轉(zhuǎn)化率 差異巨大。 對(duì)于活動(dòng)頁(yè)而言,最重要的核心內(nèi)容有四個(gè):

  1. 什么活動(dòng)?——活動(dòng)主題
  2. 什么時(shí)候?——活動(dòng)時(shí)間
  3. 有什么獎(jiǎng)品(優(yōu)惠/利益)——激勵(lì),折扣,獎(jiǎng)品展示
  4. 如何參加活動(dòng)?——參與入口

這是活動(dòng)頁(yè)面首屏應(yīng)當(dāng)完整包含的內(nèi)容(當(dāng)然考慮到一屏的大小,獎(jiǎng)品商品大多情況下只能展示一部分)。


活動(dòng)頁(yè)設(shè)計(jì)心得3

圖2-首屏中包含頁(yè)面標(biāo)題,獎(jiǎng)品/優(yōu)惠,參與入口

  1. 適當(dāng)控制內(nèi)容分量,尤其是首屏中,限制文字字?jǐn)?shù)以減輕用戶壓力。
  2. 稍顯次要的信息如獲獎(jiǎng)名單(多數(shù)在活動(dòng)頁(yè)面中起到烘托氣氛的作用)、活動(dòng)規(guī)則等內(nèi)容可考慮以倒三角結(jié)構(gòu)呈現(xiàn)。

二、主標(biāo)題與副標(biāo)題闡明活動(dòng)價(jià)值

我們要做的,是在主標(biāo)題與副標(biāo)題的寥寥數(shù)語(yǔ)中讓用戶了解我們的品牌與活動(dòng)帶給他們的所有核心價(jià)值,對(duì),所有。(親泥醒醒!永遠(yuǎn)不會(huì)有用戶去看那些長(zhǎng)篇大論的活動(dòng)規(guī)則的!TOT)

標(biāo)題若能做到別出心裁、新穎別致自然好,但若時(shí)間所限無(wú)法精巧構(gòu)思,還是有一些原則可以保證至少準(zhǔn)確傳達(dá)信息不出差池:

  • 精辟簡(jiǎn)短——用戶瀏覽標(biāo)題往往一掃而過(guò),文字會(huì)提高用戶的理解成本
  • 使用用戶熟悉的語(yǔ)言——在標(biāo)題內(nèi)拋出陌生概念往往不是個(gè)好主意,用戶看不懂很可能會(huì)直接關(guān)閉頁(yè)面
  • 主標(biāo)題或副標(biāo)題其一要直接告知用戶利益點(diǎn)與價(jià)值所在,簡(jiǎn)單熟悉如“免費(fèi)”“禮包”“立減”等詞語(yǔ)都能起到良好效果
  • 一個(gè)稍顯粗暴保守但往往有用的方法,動(dòng)詞+名詞概括活動(dòng)核心操作或流程,如“玩應(yīng)用,得禮包”“每日簽到抽獎(jiǎng)”等等。


活動(dòng)頁(yè)設(shè)計(jì)心得4

圖3-QQ網(wǎng)購(gòu)搶福袋活動(dòng)(局部)


活動(dòng)頁(yè)設(shè)計(jì)心得5

圖4-騰訊游戲活動(dòng)頁(yè)(局部)

三、參與入口——活動(dòng)頁(yè)的眼睛 參與入口是活動(dòng)頁(yè)轉(zhuǎn)化率的關(guān)鍵。

關(guān)于它的設(shè)計(jì),WAD的文章Creative call to action buttons for inspiration里整理過(guò)一些不錯(cuò)的范例,我們從中也能總結(jié)出要點(diǎn):

  • 足夠醒目卻又不顯得突兀的按鈕尺寸
  • 位于首屏,處于視覺中心區(qū)域的位置
  • 視覺表現(xiàn)——按鈕采用對(duì)比色,漸變,投影等特殊質(zhì)感;采用特別設(shè)計(jì)的字體,但需要特別注意字體可讀性。


活動(dòng)頁(yè)設(shè)計(jì)心得6

圖5-NAVER的Burger King促銷活動(dòng)頁(yè),界面清爽簡(jiǎn)潔,Call-to-action按鈕視覺效果突出;


活動(dòng)頁(yè)設(shè)計(jì)心得7

圖6-支付寶繳費(fèi)活動(dòng)頁(yè),可愛清淡的手繪風(fēng),按鈕選擇了與背景和頁(yè)面主體對(duì)比的橘紅色,并處在首屏的中心位置;


活動(dòng)頁(yè)設(shè)計(jì)心得8

圖7-京東商城雙11圖書活動(dòng)頁(yè)(首屏),大標(biāo)題,暢銷書目突出展示都不錯(cuò),缺陷就是活動(dòng)入口不夠醒目;


活動(dòng)頁(yè)設(shè)計(jì)心得9

圖8-三星NX系列買相機(jī)送機(jī)票活動(dòng)頁(yè),頁(yè)面處理得文藝清新,但購(gòu)買按鈕與視覺主體脫離,位置略顯尷尬;

根據(jù)筆者個(gè)人的經(jīng)驗(yàn),國(guó)內(nèi)用戶大多傾向于簡(jiǎn)單而直切要點(diǎn)的設(shè)計(jì),對(duì)按鈕尺寸接受程度也相較國(guó)外寬松。因此在設(shè)計(jì)受眾為國(guó)內(nèi)用戶的頁(yè)面的時(shí)候我們往往會(huì)對(duì)按鈕進(jìn)行更夸張的處理(說(shuō)白了,就是可以更大更醒目)。

四、特殊情況,怎么辦?

不是所有的活動(dòng)都天生對(duì)用戶存在吸引力,實(shí)際上我們?cè)O(shè)計(jì)活動(dòng)頁(yè)時(shí)常常遭遇各種局限——素材不足,獎(jiǎng)品不豐富,活動(dòng)流程繁瑣,學(xué)習(xí)成本高等等,這就需要設(shè)計(jì)師發(fā)揮巧思以保證頁(yè)面布局清晰,重點(diǎn)突出,足夠吸引用戶。

  • 承載多步操作的活動(dòng)頁(yè),在首屏提供簡(jiǎn)易的示意,讓用戶掃一眼即可了解活動(dòng)流程;

應(yīng)用中心的每日抽獎(jiǎng)頁(yè)面,將三個(gè)步驟列于頁(yè)面中間,同時(shí)頁(yè)面中三個(gè)放大的數(shù)字也起到了很好的引導(dǎo)提示效果。


活動(dòng)頁(yè)設(shè)計(jì)心得10

圖9-應(yīng)用中心抵扣券頁(yè)面(局部)

專題網(wǎng)頁(yè)設(shè)計(jì)之局部設(shè)計(jì)從如何脫穎而出:

(1)文案:不管是做Banner設(shè)計(jì)還是做專題頁(yè)設(shè)計(jì),文案才是最直觀表達(dá)活動(dòng)的定位和運(yùn)營(yíng)策略的信息(而設(shè)計(jì)的作用就是把這個(gè)活動(dòng)定位給傳達(dá)出來(lái)),在我看來(lái)也是最重要的組成部分,那么文案有哪些類型呢?

情緒帶入型

下面是截取的我以前寫的一篇文章里的一小段文字,我覺得拿來(lái)當(dāng)做減肥產(chǎn)品的廣告文案也是可以的:

“以前有個(gè)同事她說(shuō)要減肥要健身

我說(shuō)好啊看你能堅(jiān)持多久

因?yàn)槲乙埠脦状魏斑^(guò)這種話

最后卻都不了了之了

可是幾個(gè)月后再看到他

細(xì)腰美臀大長(zhǎng)腿

顯得更加自信了

是啊她總可以做到付諸行動(dòng)

而我只會(huì)給自己找借口

也許再這樣下去

我都配不上和她做朋友了吧”

促銷型

全場(chǎng)5折起/全場(chǎng)買三免一/1元秒殺0元搶購(gòu)/周年鉅惠等等

口號(hào)型

爭(zhēng)做行業(yè)領(lǐng)跑者/先賺它1個(gè)億/上天貓就購(gòu)了/好物低價(jià)上京東等等

通告型

熱烈慶祝XXX成立幾周年/歡迎XXX領(lǐng)導(dǎo)蒞臨我司/恭喜XXX榮獲XXX稱號(hào)

價(jià)值觀型

趁年輕,住好點(diǎn)/Just Do It/我的青春我做主/你值得擁有

自嗨型

bigger than bigger/again and again/more and more(完全不知所云但是看起來(lái)很厲害的樣子的文案,超級(jí)大牌都愛用。。)

惡搞型

老板跑路了/美工甩手不干了等(歪瓜出品,我后面會(huì)再提到,因?yàn)樗?jiǎn)直是電商設(shè)計(jì)界的一股泥石流。。)

反差型文案(后面我會(huì)解釋舉例為什么反差)

改變食界,條條是道-衛(wèi)龍


uisdc-banner-201611-35

買了就是朋友-故宮淘寶


uisdc-banner-201611-36

擬人化文案

下面是一則日本烤雞肉串的廣告文案:

“那么,我去當(dāng)香蔥烤雞肉串去了”


uisdc-banner-201611-37

“啊!要是把早上下的蛋也帶來(lái)就好了”


uisdc-banner-201611-38

“我可不能在這種地方被吃掉”


uisdc-banner-201611-39

“您好,您的食材到了”


uisdc-banner-201611-310

這則文案就是通過(guò)擬人化的口吻,即讓人覺得新穎可愛,又讓人感受到其食材的新鮮。

功能描述型

保濕護(hù)膚一步到位/棉柔舒適超強(qiáng)吸附力/輕松舒適不變形等等,常用于詳情頁(yè)里

了解完以上文案類型后,所以當(dāng)我們想要自己的設(shè)計(jì)能夠脫穎而出,要么做到在同一個(gè)類型(定位方向)的文案里比別人寫的更出彩,要么就換一種類型(定位方向)的文案去寫,而后者其實(shí)更容易起到脫穎而出的效果,舉例:

在同一個(gè)類型里,但是文案寫得比別人出彩或者內(nèi)容更能打動(dòng)用戶而達(dá)到脫穎而出的目的:比如如果都是促銷型文案,你寫“XXX周年慶特賣惠”肯定不如“XXX周年慶,全場(chǎng)滿100減50”這種文案有吸引力。為什么呢?因?yàn)閷?duì)于這種促銷類型的文案你把實(shí)惠寫的越具體就越能讓用戶感受到真的是在打折,而不是干癟癟的說(shuō)你在做促銷活動(dòng),因?yàn)檫@樣用戶會(huì)很疑惑你到底能給他多少優(yōu)惠,他心里沒底就不敢放心大膽的買了。

換一種定位方向達(dá)到脫穎而出的目的:比如衛(wèi)龍作為一款屌絲辣條居然走蘋果這種高富帥的路線;


uisdc-banner-201611-311

再比如故宮淘寶居然把那些高高在上的皇帝娘娘們塑造成一種賣萌的形象;


uisdc-banner-201611-312

再比如大家都在宣揚(yáng)正能量的時(shí)候,這個(gè)品牌的咖啡飲料卻走負(fù)能量路線;


uisdc-banner-201611-313uisdc-banner-201611-314

以上關(guān)于文案部分,我們就講到這里了,總之文案體現(xiàn)的是你的活動(dòng)定位和策略,所以文案先于設(shè)計(jì)執(zhí)行,并且它很重要很重要很重要。

(2)背景

背景上的脫穎而出,主要體現(xiàn)在色彩/形式/紋理等上面的一種差異化和對(duì)比。

色彩上:明亮鮮艷VS暗黑系/暖色VS冷色/多彩色VS無(wú)彩色。

比如,同樣是表達(dá)年輕,大部分人想到的應(yīng)該是活力多彩的,而如果你用的是暗黑系的,那你就脫穎而出了。


uisdc-banner-201611-315

形式上:扁平VS質(zhì)感/繁雜VS留白/柔美曲線VS剛硬棱角/重復(fù)VS變化。

比如,衛(wèi)龍作為一個(gè)賣辣條的品牌,無(wú)論是從產(chǎn)品的辣這個(gè)特性,還是它產(chǎn)品本身的基因來(lái)看,都應(yīng)該走紅紅火火熱鬧低端路線的風(fēng)格設(shè)計(jì)對(duì)不對(duì)?但他突然有一天開始走蘋果這種高富帥的大量留白高冷路線,大家的眼球立馬就被它吸引了。


uisdc-banner-201611-316

紋理上:有紋理VS無(wú)紋理/無(wú)規(guī)律VS有規(guī)律/重復(fù)VS變化。

比如,有些比較卡哇伊風(fēng)格的頁(yè)面,如果能在背景上有一些相關(guān)元素或紋理的點(diǎn)綴,起到相互呼應(yīng)的作用,就會(huì)比空白的背景有吸引力一些。


uisdc-banner-201611-317

反之亦然,有些背景不適合放紋理,會(huì)顯得累贅或多余,那么空白背景就會(huì)顯得更有吸引力更舒服一些。

(3)產(chǎn)品或模特

產(chǎn)品或模特的脫穎而出主要體現(xiàn)在品牌效應(yīng)/產(chǎn)品品質(zhì)/功能差異等給人的感官感受。

品牌效應(yīng):大品牌VS小品牌/有品牌VS無(wú)品牌/多品牌VS單一品牌/線上品牌/線下品牌/跨品牌合作(吾皇/暴走漫畫)。比如,大品牌的產(chǎn)品比小品牌的產(chǎn)品占據(jù)更多優(yōu)勢(shì),有品牌的產(chǎn)品比無(wú)品牌的產(chǎn)品顯得更可信更正規(guī)等,所以如果上升到品牌這個(gè)層面,僅僅只是設(shè)計(jì)的好看或突出并不會(huì)起到很大的優(yōu)勢(shì)作用,只是錦上添花而已,品牌的影響力和口碑才是最主要的因素。但是當(dāng)2個(gè)品牌一起聯(lián)合,跨品牌做活動(dòng),就會(huì)比單一品牌產(chǎn)生更強(qiáng)的效應(yīng),達(dá)到1+1大于2的作用,比如家紡品牌和可口可樂的合作,在設(shè)計(jì)上也是沿用了可口可樂的經(jīng)典女人曲線般的瓶身形象:


uisdc-banner-201611-318

產(chǎn)品品質(zhì):好品質(zhì)VS差品質(zhì)/有特點(diǎn)VS無(wú)特點(diǎn)/有后期修飾VS無(wú)后期修飾/有人知曉VS無(wú)人知曉。

比如,同樣一款產(chǎn)品,你的產(chǎn)品圖看起來(lái)更清晰更干凈或更有趣好玩更高檔肯定就會(huì)更吸引到相應(yīng)的人群的注意力和購(gòu)買欲望,這些都是會(huì)影響到你的頁(yè)面設(shè)計(jì)好壞的因素。


uisdc-banner-201611-319

功能差異:多功能VS單一功能/有差異VS無(wú)差異/有優(yōu)勢(shì)VS無(wú)優(yōu)勢(shì)

比如如果都是護(hù)膚產(chǎn)品的專題頁(yè)設(shè)計(jì),但是你的這款產(chǎn)品是有別人不具備的功能特性的,那么就可以在你的設(shè)計(jì)里通過(guò)文字排版或圖形描繪的方式表現(xiàn)出來(lái),直觀的傳達(dá)給別人你的這些優(yōu)勢(shì)和氛圍,就比干癟癟的將產(chǎn)品往頁(yè)面上一擺更具吸引力:


uisdc-banner-201611-320

當(dāng)然這個(gè)情況更適合單個(gè)產(chǎn)品的宣傳或者放在詳情頁(yè)里。

(4)點(diǎn)綴物:有點(diǎn)綴物VS沒有點(diǎn)綴物/點(diǎn)綴物合適VS點(diǎn)綴物不合適。

這個(gè)同上面講的紋理類似,比如,有些比較卡哇伊風(fēng)格的頁(yè)面,如果能在背景上有一些相關(guān)元素或紋理的點(diǎn)綴,起到相互呼應(yīng)的作用,就會(huì)比空白的背景有吸引力一些。


uisdc-banner-201611-321

(5)樓層:這里主要包含樓層內(nèi)容和樓層形式2個(gè)方面。

樓層內(nèi)容:內(nèi)容新穎VS內(nèi)容常規(guī)/內(nèi)容豐富VS內(nèi)容單調(diào):

一般來(lái)說(shuō),在樓層內(nèi)容里如果插入一些好玩的游戲,或者有一些視頻播放,再或者變著花樣給用戶發(fā)紅包和購(gòu)物券,會(huì)比常規(guī)的商品列表展示的樓層更有讓人逛的欲望(不過(guò)這個(gè)都不止是設(shè)計(jì)師的事情了,而是運(yùn)營(yíng)/交互設(shè)計(jì)師/產(chǎn)品經(jīng)理/策劃要去做的事情)。


uisdc-banner-201611-322

樓層形式:形式新穎VS形式常規(guī)/形式貼合主題VS不貼合主題。

比如以穿搭建議的方式賣貨的專題頁(yè)樓層設(shè)計(jì),大多數(shù)都是像左邊這樣,將一堆衣服按一定秩序堆放好,但是右邊這種形式呢?每個(gè)模特?cái)[出一個(gè)字母的造型,讓人覺得有點(diǎn)搞怪,都忍不住想要跟著模仿造型了對(duì)不對(duì)?

專題網(wǎng)頁(yè)設(shè)計(jì)之整體設(shè)計(jì)從如何脫穎而出

整體上我們可以從型/色/意/技四個(gè)方面來(lái)探討如何做到脫穎而出這個(gè)問題:

(1)型:主要是指整體的形式/風(fēng)格等方面要與眾不同,那么跟前面的文案一樣,要想脫穎而出話,要么就是在同一個(gè)類型里你能做到你是最優(yōu)秀的;要么是跳出這個(gè)類型,或者跨界到不同的領(lǐng)域或定位類型里去表現(xiàn)。

舉例:反差型(衛(wèi)龍)


uisdc-banner-201611-324

舉例:惡搞型(歪瓜出品)


uisdc-banner-201611-325

(看完這家店的設(shè)計(jì)風(fēng)格,整個(gè)人都要笑屎......簡(jiǎn)直是電商界的一股泥石流,哈哈。我也承認(rèn)這家店成功的脫穎而出了,但是......我有點(diǎn)好奇這家店的美工走出了這家店鋪能不能順利找到工作......除非他打算一輩子呆在這種同類型的店鋪里,啊哈哈哈哈!!!)

舉例:獨(dú)一無(wú)二型(天貓貓頭形象)

自從2015年的天貓雙十一,第一次將所有的頁(yè)面都沿用貓頭的這個(gè)造型,就驚艷了全場(chǎng),因?yàn)檫@個(gè)形象太討巧了,不僅成功地與他的品牌形象掛鉤,還非常有利于品牌延伸,這以后,但凡頁(yè)面里出現(xiàn)這貓頭造型,就一定會(huì)聯(lián)想到天貓,因?yàn)樗仟?dú)一無(wú)二的。


uisdc-banner-201611-326

當(dāng)你擁有了某種獨(dú)一無(wú)二的東西,也就很容易脫穎而出了。


uisdc-banner-201611-327uisdc-banner-201611-328

(2)色:主要是指色彩上的差異化,這個(gè)跟前面講局部的內(nèi)容類似

比如:明亮鮮艷VS暗黑系/暖色VS冷色/多彩色VS無(wú)彩色(別人家都是明亮色系你可不可以嘗試暗黑色系呢?別人家都是暖色系,你可不可以嘗試一些冷色系呢?別人家都是夸張多彩絢麗,你能不能嘗試低調(diào)無(wú)彩色系呢?)

比如,同樣是表達(dá)年輕,大部分人想到的應(yīng)該是活力多彩的,而如果你用的是暗黑系的,從另一個(gè)角度去詮釋年輕,那你比較容易就脫穎而出了。


uisdc-banner-201611-329

(3)意:主要是指品牌特性/理念意義/定位方向等,與眾不同。

品牌符號(hào):從品牌這個(gè)角度來(lái)說(shuō),每一個(gè)品牌形象都是獨(dú)一無(wú)二的,比如,天貓/三只松鼠/初語(yǔ)等都已經(jīng)形成了自己的形象特征,當(dāng)你的頁(yè)面上出現(xiàn)了這些形象特征的時(shí)候,也就有了自己的優(yōu)勢(shì):


uisdc-banner-201611-330

理念意義:圖形代表的含義,靈感來(lái)源等

比如,提到圣誕節(jié),大家都會(huì)聯(lián)想到紅配綠,也會(huì)聯(lián)想到圣誕樹/雪地/圣誕老人/長(zhǎng)筒襪對(duì)不對(duì),所以我猜想你們的第一反應(yīng)應(yīng)該是搞比較基礎(chǔ)的堆疊效果吧?像下面這樣:


uisdc-banner-201611-331

但有沒有想過(guò)像下面這樣提取一種基本型,然后巧妙地與自己的產(chǎn)品相結(jié)合呢?


uisdc-banner-201611-332

定位方向:促銷VS趣味VS溫情VS苦情VS情懷

(比如別人都走促銷路線你可以走趣味路線,別人走趣味路線你可以走溫情路線,別人走溫情路線你可以走苦情路線,別人走苦情路線你就走情懷路線,當(dāng)別人都走情懷路線了,你走促銷路線,哈哈哈哈!!)比如,今冬情人節(jié)那次,別人都走溫情路線,我們走了苦情路線,反響很不錯(cuò)!


uisdc-banner-201611-333

再比如,兒童節(jié)的活動(dòng)設(shè)計(jì),別人可能都走手繪可愛卡哇伊路線


uisdc-banner-201611-334

而我們走了小清新路線(其實(shí)也是因?yàn)榕虑謾?quán)不好用模特之類的,再一個(gè)我們是兒童節(jié)/母親節(jié)/520一起做的活動(dòng),哈哈~)


uisdc-banner-201611-335

(4)技:主要是指技術(shù)創(chuàng)新/跨界合作/手法創(chuàng)新等讓人感到新奇,任何時(shí)候,都是因?yàn)橛辛思夹g(shù)的進(jìn)步才使得我們有了更好的體驗(yàn)和更多的選擇。

比如以前沒有互聯(lián)網(wǎng)的時(shí)候,大家只能在線下購(gòu)物,有了互聯(lián)網(wǎng)之后大家開始在PC上購(gòu)物,后來(lái)移動(dòng)個(gè)互聯(lián)網(wǎng)的發(fā)展和智能手機(jī)的普及和便利,大家又開始轉(zhuǎn)向移動(dòng)端購(gòu)物,現(xiàn)在Vr又出來(lái)了,以后指不定購(gòu)物有多便利了。你搶先運(yùn)用了新技術(shù),你就占有優(yōu)勢(shì)。

舉例:前度時(shí)間很火的雙十一邀請(qǐng)函,就是一個(gè)活生生的例子,可以看下它的幕后制作視頻:


uisdc-banner-201611-336uisdc-banner-201611-337uisdc-banner-201611-338uisdc-banner-201611-339

我在里面看到,它分別涉及到腦爆+前期構(gòu)思+手繪草圖+攝影+后期合成+Vr技術(shù)+threejs+webGL的組合繪制3D場(chǎng)景+渲染等技術(shù)環(huán)節(jié)。最終達(dá)到了刷屏的效果,吸引了幾乎所有互聯(lián)網(wǎng)人的注意力。如果你也有這個(gè)技術(shù),你的作品想不脫穎而出也難了(不過(guò)也只有BAT這個(gè)級(jí)別的大金主才花得起這個(gè)錢了)。

  • 大膽凸顯頁(yè)面中的核心操作(如放在首屏,加大展示區(qū)域或使用特殊視覺處理等等)以吸引用戶

在素材有限條件下,部分設(shè)計(jì)師會(huì)嘗試將最能吸引用戶的操作放在首屏中,如抽獎(jiǎng)、領(lǐng)取禮包等等,盡管有時(shí)候它們并不是第一步;

應(yīng)用中心女生節(jié)活動(dòng)頁(yè),活動(dòng)規(guī)則是每玩一款應(yīng)用即可獲得一次抽獎(jiǎng)機(jī)會(huì),但若是按照常規(guī)思路 來(lái)排布頁(yè)面,禮包展示與抽獎(jiǎng)按鈕必然會(huì)被擠到第二屏,首屏只有平鋪的應(yīng)用列表,平淡無(wú)趣,;于是我們將頁(yè)面進(jìn)行了調(diào)整,將領(lǐng)取禮包放到第一屏,當(dāng)用戶沒有 抽獎(jiǎng)機(jī)會(huì)卻點(diǎn)擊了領(lǐng)取禮包時(shí),再給予用戶去玩應(yīng)用的相應(yīng)引導(dǎo)。


活動(dòng)頁(yè)設(shè)計(jì)心得11

圖10-應(yīng)用中心女生節(jié)活動(dòng)頁(yè)(局部)

這樣的做法能在當(dāng)前條件所限下加強(qiáng)頁(yè)面沖擊力和吸引力,但同時(shí)存在一定風(fēng)險(xiǎn),會(huì)讓用戶的操作流程與頁(yè)面正確操作流程相悖,增加用戶犯錯(cuò)概率。此時(shí)需要通過(guò)其他的交互手段進(jìn)行彌補(bǔ),如上面提到的提供流程示意圖,或者在犯錯(cuò)后進(jìn)行友好 的引導(dǎo)等等。筆者個(gè)人還是比較理解這種設(shè)計(jì)方式的,找準(zhǔn)頁(yè)面核心任務(wù)與核心操作,大膽地對(duì)非核心的功能進(jìn)行減法和舍棄,雖然最后輸出的可能并非最佳結(jié)果, 很多時(shí)候這也是一種必要且可行的設(shè)計(jì)思路。

五、關(guān)注后續(xù)——活動(dòng)效果的評(píng)估

活動(dòng)頁(yè)面成功上線后設(shè)計(jì)師的工作其實(shí)并未結(jié)束,每一次活動(dòng)頁(yè)面的投放結(jié)束后,我們都能從各不同方面,尤其是數(shù)據(jù)反饋中得到很多經(jīng)驗(yàn)和教訓(xùn)。

前些日子讀到胖胡斐的文章《說(shuō)說(shuō)轉(zhuǎn)化率》,里面提到了一個(gè)簡(jiǎn)單易行的評(píng)估方式,在這里跟大家分享一下:將活動(dòng)按轉(zhuǎn)化路徑進(jìn)行分解,通過(guò)對(duì)比每個(gè)轉(zhuǎn)換路徑節(jié)點(diǎn)的轉(zhuǎn)化率來(lái)評(píng)估活動(dòng)的效果,為進(jìn)一步提升轉(zhuǎn)化率提供參考。我們可以效仿這種拆分的思路,對(duì)整個(gè)活動(dòng)的流程進(jìn)行拆分——以應(yīng)用中心的禮包抽取活動(dòng)頁(yè)為例,整個(gè)活動(dòng)的主要流程與涉及到的頁(yè)面如下:入口(廣告位)→ 活動(dòng)頁(yè)面 → 應(yīng)用列表(活動(dòng)頁(yè)中)→ 抽取禮包 → 禮包兌換中心 → 可使用禮包的應(yīng)用內(nèi)頁(yè)


活動(dòng)頁(yè)設(shè)計(jì)心得12

圖11-禮包類活動(dòng)流程與涉及頁(yè)面拆分

提取每一步的轉(zhuǎn)化率數(shù)據(jù)進(jìn)行對(duì)照,鎖定轉(zhuǎn)化率流失最嚴(yán)重的節(jié)點(diǎn),集中思考解決和改善之道。

總結(jié)一下,其實(shí)對(duì)于活動(dòng)專題網(wǎng)頁(yè)設(shè)計(jì),筆者想與大家分享的也不過(guò)就是以下幾句話:注重信息表 達(dá),充分利用首屏布局核心信息(標(biāo)題,參與入口,獎(jiǎng)品展示);找準(zhǔn)頁(yè)面核心任務(wù)并凸顯核心操作,給予友好簡(jiǎn)明的的流程引導(dǎo)與提示;關(guān)注活動(dòng)數(shù)據(jù),參照數(shù)據(jù) 找出活動(dòng)頁(yè)面的相關(guān)改進(jìn)點(diǎn)。以上都是入職以來(lái)一些經(jīng)驗(yàn)總結(jié),尚顯稚嫩,若能給大家?guī)?lái)那么一點(diǎn)點(diǎn)思考和啟發(fā),筆者就十分滿足了。

海淘科技提供,文章下載點(diǎn)擊:專題網(wǎng)頁(yè)設(shè)計(jì)十大技巧讓網(wǎng)頁(yè)脫穎而出


相關(guān)文章:

版權(quán)所有 @ 2007-2023上海海淘信息科技有限公司 滬ICP備11050025號(hào)-4