close

國內2.0音樂網站首頁設計謬談 - 網頁設計

http://webdesign.zoapcon.com

一、關于YOBO

YOBO要為你解決以下問題:

想聽歌卻不知道聽什么歌;——發現音樂
工作忙碌后再也沒空去找歌;——自動發現音樂
對著搜索引擎不知道搜什么歌;——發現潛在的(用戶喜歡的)音樂
挖掘排行榜外那些鮮為人知的好歌!——發現個性化的音樂

通過以上YOBO的自我介紹,我們明白YOBO的宗旨就是幫助用戶方便、容易的發現那些潛在的適合自己的音樂。從而使用戶:

——輕松享受音樂體驗
——只聽愛聽的音樂
——用個性化音樂裝扮自己

 


二、關于YOBO的首頁

 

首先要說明的一點,這個首頁是主要針對從未訪問過YOBO的用戶,如果是登陸會員訪問首頁缺省url,將跳轉到登錄用戶的專門頁面。

因此,這個頁面承載的任務應該是:

1、該新用戶對網站產生興趣并快速使用上手;
2、為老用戶提供登陸快捷入口。

如圖所示,該頁面第一屏的焦點是一個碩大的搜索框,黑白反差的UI將用戶注意力直接拉到搜索。這是YOBO為用戶預設的最主要的一條訪問路徑:

任意一個興趣點->由興趣點開始聽音樂->在音樂試聽記錄中發現用戶喜好->滿足用戶需求->附加服務->迭代。

所以這個搜索入口是與百度極不相同的,百度解決的是把內容交給用戶的問題,而YOBO解決的是用戶要什么的問題。通過百度的入口,用戶到達的是直接目標點,快速滿足需求并離開,下次重復。而通過YOBO的入口,用戶只能到達階段性目標,在階段性目標會有下一階段的用戶引導。

這個流程設計很有層次性,把入口降低。同時在界面上,也讓這個入口權重極高,起到幫助用戶選擇,誘導用戶少選擇不選擇的作用。

(所有的煩惱都是選擇太多……)

在這個權重之下,是一個叫做心理測試的服務。這是預設的第二重要的用戶路徑,和搜索入口一樣,最終這條路都將引導用戶走向注冊,同時用戶是樂意注冊的,因為注冊可以讓他享受到的愉快體驗更好的延續下去,很自然。

 


這是友播的LOGO,雖然在以上的首頁設計中,用戶不太容易關注到這個LOGO的細節,但我仍然忍不住要對這個LOGO發表異議。

1、沒有中文名——如何幫助用戶記憶網站名字?
2、沒有域名——如何幫助用戶記憶網站地址?
3、沒有說明——如何幫助用戶了解這是干嘛的網站?

第三點尤其是放到外站做鏈接時讓人很茫然。

接下來是第二屏,到了這一步,可能新用戶該走的已經走了,該被第一屏截流的已經截流了,如果用戶能拉到這里來,那么說明這個用戶有可能是非常典型的門戶用戶,不拉不快;另一種可能是用戶對這個網站了解的還不夠,還要多看一看。

因此,在這個位置,YOBO的三個版塊分別是:介紹YOBO,介紹YOBO,分類索引。

從預設的用戶流程上講,這個設計非常之好(我很希望能拿到這個數據來驗證啊)。但從訴求表達的程度來講,還有優化余地。

我在第一張圖上已經列出了,站在功能介紹和用戶反饋的兩個方面對產品進行宣傳訴求的要點。

 


很顯然,YOBO的這個設計并沒有表達出應該表達出的內容,這兩個版塊甚至讓人不知所謂,用戶來到這個位置,會去對一個“YOBO客服產生興趣”,這么快就要小工具放博客了?而熱門音樂與歌手的訪問路徑,放到搜索旁邊比做在這里更清晰,更有效果。

右側藍圖的宣傳比較靠譜(當然還是沒有我第一張圖那個目的更明確),但字跡不清晰,另外用語過于書面化,不夠直接而有效。造成的結果就是用戶看不清,看不懂。

三、小結

YOBO在國內新音樂網站中,我個人是認為最有特色的,定位最清晰,交互最親切。

從數據上看,YOBO的用戶活躍度是很高的,


(僅供參考)


可能存在的問題有:

1、YOBO這個首頁沒有考慮網吧用戶,預設的模式是針對于擁有固定PC的用戶。

這與1ting等網站方向完全不一樣,1ting的做法是,我先給你大量的選擇,讓你聽,同時你不用登錄也可以使用一些很實用的網站功能(臨時列表)。最后我也做一些推薦,但也就是做做而已。

可以看到,1ting的門坎比YOBO低得多,但1ting能達到的深度不如YOBO。

我們可以預設一個網吧用戶的模型,細想一下,他們在看到YOBO時,該怎么去使用呢?

2、YOBO的核心價值在于推薦(發現)引擎的準確性,如果不準怎么辦。以我個人為例,我明明喜歡舞曲(非DJ),測出來我喜歡緩慢的薩克斯——那是我極其討厭的音樂類型。

不準是肯定的,一個簡單的測試不可能準,準確來自于大量的用戶數據挖掘,我是在豆瓣用了一年,看了數百部電影后才得到靠譜的內容推薦的。

實際上,大部分推薦類引擎的效果都在將準不準之間,用戶得到的是有總比沒有好的效果,這一點,和模仿last.fm 的songtaste一樣。


arrow
arrow
    文章標籤
    網頁設計 web design
    全站熱搜
    創作者介紹
    創作者 imarketin 的頭像
    imarketin

    imarketin的部落格

    imarketin 發表在 痞客邦 留言(0) 人氣()