社交型網(wǎng)站首頁面設(shè)計(jì)分析
本文希望通過對(duì)社交型網(wǎng)站主頁進(jìn)行的對(duì)比分析得到一些思考,并和大家分享探討提升社交型網(wǎng)站的注冊(cè)轉(zhuǎn)化率的優(yōu)秀設(shè)計(jì)原則。
一般來說用戶注冊(cè)轉(zhuǎn)化流程大致由以下幾個(gè)部分組成:
1. 能吸引用戶注冊(cè)的主頁內(nèi)容;
2. 簡(jiǎn)便、快速的注冊(cè)流程;
3. 有效的尋找、邀請(qǐng)朋友機(jī)制;
4. 吸引新用戶注意力的引導(dǎo)。
此文將探討第一部分“ 吸引用戶注冊(cè)的主頁內(nèi)容 ”,我們將以以下11個(gè)社交網(wǎng)站為例進(jìn)行分析:
1. 社交網(wǎng)絡(luò):Google+、Facebook、Linked In
2. 博客:Blogger、Tumblr
3. 新媒體社交網(wǎng)站:Flickr、YouTube、新浪微博、騰訊微博、Twitter、Yahoo Answers
主頁內(nèi)容的價(jià)值是什么?
我認(rèn)為最大的價(jià)值是為新用戶提供加入的理由。心理和經(jīng)濟(jì)理論表明,人類普遍尋求成本的最小化和收益最大化。要說服新用戶注冊(cè),網(wǎng)站應(yīng)致力于提高可感知價(jià)值,同時(shí)降低用戶加入所需要投入的成本。那么我們具體可以怎么做呢?
1. 使用品牌價(jià)值聲明,搭配簡(jiǎn)要的服務(wù)說明
作用:品牌Slogan一般用來描述網(wǎng)站的目的。選擇突出的關(guān)鍵字,讓用戶容易掃描,快速理解品牌所提供的服務(wù)。而對(duì)服務(wù)的概括闡述能更進(jìn)一步提供使用此產(chǎn)品令人信服的理由。
例如:Google+
Facebook:
設(shè)計(jì)指南:
• 專注于對(duì)用戶來說是有價(jià)值的。文案上可以換個(gè)角度,不是告訴用戶在這兒可以做什么,而是猜用戶可能會(huì)想這里產(chǎn)生行為的理由。
• 使用大膽的關(guān)鍵字,排版上換行或者并行結(jié)構(gòu),都能使Slogan更易被掃描,信息被讀取。
• 視覺上讓注冊(cè)按鈕與slogan或logo聯(lián)系更緊密,這樣容易觸發(fā)后續(xù)行動(dòng)。
• 敘述服務(wù)說明時(shí)不要功能導(dǎo)向,要價(jià)值導(dǎo)向,集中在用戶的目標(biāo)上。
• 另使用圖標(biāo)和信息圖形可以增強(qiáng)文案的掃描性(例如:Google.com)。
反思:
提供品牌聲明固然感覺比較友好,但對(duì)于實(shí)際注冊(cè)體驗(yàn)來講,就是讓用戶填寫表單,此時(shí)用戶不需要頁面存在太多沒用的東西,就是設(shè)計(jì)得再花哨,用戶也不會(huì)喜歡注冊(cè)這個(gè)頁面,也不愿意再看到第二次。注冊(cè)時(shí),我的視覺的關(guān)注點(diǎn)和腦子里所想的就是趕緊填完必填項(xiàng),迫不及待的按提交。
以下是tumblr最新的注冊(cè)頁面,大膽的去掉了slogan,反而使任務(wù)更清晰、直接,讓我覺得處理注冊(cè)真是件簡(jiǎn)單的事兒,安撫了用戶的焦躁和習(xí)慣性的反抗情緒。
Tumblr最新的注冊(cè)頁面:
Tumblr舊注冊(cè)頁面:
其它示例:
Linkedin:
Twitter:
Twitter的文案中關(guān)鍵詞的選擇最易被大眾理解且貼切的傳遞了服務(wù)的特色。
新浪微博:
騰訊微博:
騰訊微博的Slogan與Action之間聯(lián)系緊密,需要提升的是Slogan文案的感知性和共鳴性,這和產(chǎn)品定位的用戶群有關(guān)系。
2. 如何注冊(cè)?
若是比較復(fù)雜的注冊(cè)流程比較常采用“1-2-3步”的格式,或者給予范例示意。
作用:
• 讓用戶有預(yù)期操作流程有多簡(jiǎn)單;
• 概括交待交互步驟。
新浪微博企業(yè)版注冊(cè)引導(dǎo)頁:
新浪微博企業(yè)版注冊(cè)頁面:
設(shè)計(jì)指南:
• 視覺上進(jìn)度要與預(yù)覽相配合,引導(dǎo)的指標(biāo)樣式保持一致。
• 使用簡(jiǎn)單,積極的引導(dǎo)文案。
3. 利用情境化注冊(cè)引導(dǎo)
當(dāng)用戶擁有具體行為動(dòng)機(jī)時(shí),提供用戶執(zhí)行后續(xù)操作所必經(jīng)的注冊(cè)捷徑。
作用:讓用戶自己發(fā)現(xiàn)加入的原因。由于用戶采取行動(dòng)的動(dòng)力來自內(nèi)部,他們將更有可能完成注冊(cè)。
例如下圖:新浪微博首頁中有趣的人版塊(http://weibo.com/)
設(shè)計(jì)指南:
• 要使用情境提示,就應(yīng)提出令人信服的理由,并且與用戶禮貌的溝通。(例如,若想看到更多請(qǐng)注冊(cè))
• 不能讓情境注冊(cè)提示感覺上像是一個(gè)錯(cuò)誤提醒,(例如,使用紅色的警示圖標(biāo),或者文案上透露“你必須登錄后才能做到這一點(diǎn)!”的情緒)要減少讓用戶感覺遇到一堵墻的感受。
其它示例:
騰訊微博,用戶在未登錄的情況下瀏覽明星的微博主站出現(xiàn)注冊(cè)提示。而新浪微博允許未登陸用戶瀏覽明星微博(不允許瀏覽推薦的普通用戶頁面,提供無延伸閱讀操作的“大家正在說”版塊),把注冊(cè)提示放在和帳號(hào)相關(guān)的“轉(zhuǎn)發(fā)”、“評(píng)論”的行為上。
騰訊微博:
由此看到創(chuàng)建一個(gè)引人注目的注冊(cè)決策點(diǎn)很重要,即便在同一個(gè)頁面上的不同版塊。信息開放的權(quán)重也應(yīng)是有節(jié)奏的,阻礙用戶想進(jìn)行的某些活動(dòng)可能是不可理喻的,有些則是通過常識(shí)判斷能被大多數(shù)人接受的。
新浪微博登錄/注冊(cè)首頁的 “大家正在說”版塊,推送的是“內(nèi)容”而非“人”,用戶延伸的探知心理也在對(duì)某條內(nèi)容的擴(kuò)展閱讀上,但版塊的注冊(cè)決策點(diǎn)去設(shè)立在頭像賬號(hào)上,多少和用戶心理預(yù)期有偏差。
4. 精選登錄/注冊(cè)網(wǎng)頁內(nèi)容
所提供的內(nèi)容最好是簡(jiǎn)明、重點(diǎn)突出的,并符合大眾化和趣味性。
作用:
• 這個(gè)頁面應(yīng)該要和真正使用此服務(wù)的人溝通。要理解這部分用戶來此可能如何和你的服務(wù)產(chǎn)生共鳴。
• 有的頁面會(huì)展示如何使用該網(wǎng)站的信息(例如,Yahoo Answers的“Ask,Answer,Discover”區(qū)域)。
有的頁面也用生動(dòng)的視頻來做網(wǎng)站服務(wù)的引導(dǎo)。(例如,Dropbox)
Yahoo Answers:
雅虎問答頁面的另一個(gè)亮點(diǎn)是突出了一個(gè)展示優(yōu)秀的答案的區(qū)域(運(yùn)用幻燈片模式,用戶可隨意后退或前進(jìn)查看,讓用戶對(duì)高質(zhì)量信息淺嘗即止),同時(shí)在下方提供了一個(gè)簡(jiǎn)練干凈的最近和流行的問題列表。
設(shè)計(jì)指南:
• 讓網(wǎng)頁保持新鮮和有趣,放置高質(zhì)量的內(nèi)容而非累加數(shù)量。頁面上出現(xiàn)越多內(nèi)容,內(nèi)容本身的特殊性或亮點(diǎn)將越不明顯,如果所有的內(nèi)容都浮出水面,那將對(duì)用戶造成閱讀噪音失去其意義。
• 盡可能具體解釋為什么某些內(nèi)容具有特色。(我們需要考慮哪些是用戶最有可能感興趣的內(nèi)容。 有時(shí)“最新”的內(nèi)容未必是最有趣的)。
示例:
Flickr:
小結(jié):自此我們可以看到優(yōu)秀的首頁設(shè)計(jì)能為新用戶加入你的網(wǎng)站提供多層次的理由,從而為提升網(wǎng)站的注冊(cè)轉(zhuǎn)化率做出初步貢獻(xiàn)。而在接下來的“注冊(cè)流程”中,設(shè)計(jì)師還需要保證提供給用戶的體驗(yàn)是輕松、快捷的,由此用戶才能傾向于嘗試更深入的服務(wù)(哪怕他們并不確定到底會(huì)得到什么好處)。
提升注冊(cè)轉(zhuǎn)化率不是一兩個(gè)環(huán)節(jié)的任務(wù),不能在新用戶注冊(cè)后就停止,將他們拋棄在一個(gè)不熟悉或缺乏下一步行動(dòng)指示的頁面會(huì)使用戶感到迷惘。對(duì)于社交網(wǎng)站的新用戶來說,如何建立屬于自己的社交網(wǎng)絡(luò)是才最大的障礙(沒有好友,社區(qū)的服務(wù)會(huì)失去很大價(jià)值)。因此,幫助用戶迅速找到和加朋友是留住用戶的關(guān)鍵。
本文地址:http://m.likemindfilms.com/tutorial/id1130.html
您可能還喜歡
- 關(guān)于第三方注冊(cè)和本地注冊(cè)的選擇
- 8大網(wǎng)頁前端界面必備jQuery插件
- 掌上指路標(biāo) —– APP架構(gòu)與導(dǎo)航設(shè)計(jì)
- 時(shí)尚電商網(wǎng)站交互分析
- 軟件推薦為移動(dòng)設(shè)計(jì)而生-Justinmind
- TGideas實(shí)例:加載,不只是少一點(diǎn)點(diǎn)
- 網(wǎng)頁設(shè)計(jì)中引人入勝的引導(dǎo)頁設(shè)計(jì)
- 體驗(yàn)新版Apple AppStore ——App設(shè)計(jì)從
- 確認(rèn)按鈕在左邊,取消按鈕在右邊?
- 交互設(shè)計(jì)從登錄開始
- 專訪:石墨文檔產(chǎn)品總監(jiān)羅穎
- UI設(shè)計(jì)不得不知的移動(dòng)端UI尺寸適
- 光音移動(dòng)設(shè)計(jì)規(guī)范 — 表單類
- 體驗(yàn)設(shè)計(jì)中的排序問題
- 網(wǎng)頁設(shè)計(jì)精粹 網(wǎng)頁中那些迷人的按
- aliued:響應(yīng)式設(shè)計(jì)的現(xiàn)狀與趨勢(shì)
- 10個(gè)智能對(duì)象處理的ps技巧
- 網(wǎng)頁UI - 原子設(shè)計(jì)理論(上)
- 如何通過設(shè)計(jì)提升banner點(diǎn)擊率?
- 晉小彥視覺設(shè)計(jì)系列文章(二):全屏