起源
「無名小站」(wretch.cc)是台灣2005年至2013年間熱門的複合媒體平台,無名提供了部落格(網誌)、個人相簿、留言板、好友系統等服務,供使用者免費使用,在當年可說是部落格界龍頭,多少七八年級生回到家第一件事就是開電腦上無名呢!
許多使用者喜歡在自己的網誌中放置音樂播放器,讓前來逛網誌的使用者可以邊看文章邊享受音樂,但無名內建的音樂歌曲選擇不多,要自選音樂還必須購買無名小站VIP會員,無法滿足想要與眾不同的無名使用者。
在「Yahoo知識+」中,有非常多有關「如何在無名放音樂」的相關討論,但有非常多的回答者對於網頁語法都是一知半解,只是將其他人的語法複製貼上,或是不懂其語法參數沒有正確回答問題,導致真正需要語法的人無法正確放置音樂。
如果無名小站使用者要放音樂到網誌上,則必須自己輸入HTML語法,對於沒有學過網頁語法的人來說並不容易,只要有任何錯誤就會失敗(雙引號不對稱、tag錯誤等)。Yahoo知識+上有許多「如何在無名放音樂」的相關討論,我們可以直接使用別人設定好的HTML語法來置入音樂,但音樂播放器有非常多參數可以微調,包含歌曲、顏色、顯示大小等,如果不是非常了解參數很難客製化自己獨一無二的播放器。
以2005年當時IE6的介面為例,若要自己製作音樂語法必須經過以下5個步驟:
步驟1:將音樂上傳至無名相簿
步驟2:使用IE6,於相簿中點選檢視>原始檔
步驟3:在網頁原始碼中搜尋”mp3″,來找到mp3路徑
步驟4:將mp3路徑貼到HTML語法中
<embed src=”http://pic.wretch.cc/e/serv/video_player/player.swf?file=&<MP3音樂路徑>&autostart=<true|false>&repeat=<true|false>&volume=<0-100>&backcolor=<色碼>&frontcolor=<色碼>&lightcolor=<色碼>”></embed>
步驟5:將語法放置於網誌/留言板中
對於不懂網頁語法的使用者來說,「網頁原始碼中找到mp3路徑」實在令人眼花撩亂,讓許多人卡關、放棄,因此我們在2009年2月連同好友龍哥,架設WRESIC網站,希望讓使用者只需要點一點選一選,輕輕鬆鬆就能完成語法製作。
規劃與設計
為了針對找mp3路徑的步驟簡化流程,我們必須利用爬蟲來解析mp3路徑,取得mp3路徑後套用既有的語法格式供使用者使用,運作流程如下圖:
網站如下圖,使用者只需要透過圖形化介面點選即可製作語法,UI/UX感謝友人Celyn Xie設計:
使用者先將音樂上傳至無名相簿,接著填入含有音樂的相簿網址到WRESIC:
使用者可以客製化播放器外觀、大小等:
經過爬蟲解析後,即可取得完整的音樂語法:
如果使用者覺得單純播放器太單調,我們於2009年6月推出WREBOX,使用者可以自選底圖並搭配顏色做出獨一無二的音樂播放器:
使用者取得音樂語法後,可以自行貼到無名小站中的網誌、相簿、留言板等。
遭遇的困難
網站上架後,解決了不少人的困擾,2009年3月WRESIC開始湧入大量的使用者製作語法,這時候遇到了第一個難題:「ERROR 999」
解析mp3路徑的爬蟲每分鐘約300次以上的存取,已超過正常人瀏覽的速度,我們發現在一定時間內多次存取無名小站,會被Yahoo判定為異常攻擊行為,採取封鎖IP並禁止瀏覽數小時,WRESIC曾因為這個問題停機了幾天。
為了分擔廣大使用者的流量,我們將爬蟲分散的放置在30個不同IP的伺服器上,並透過後台系統計算每隻爬蟲單位時間內的存取量,當有使用者需要解析mp3路徑時,後台系統會依照爬蟲的存取量來分配解析工作,藉此應付大量的使用者,如果有爬蟲出現ERROR 999,後台系統將會讓其爬蟲休息1小時,這一切都由系統自動管理與運作。
UI/UX、功能進化
其實WRESIC在友人Celyn Xie設計前有一個舊版介面,可能比較多人有印象(舊版介面如下圖):
由於舊版版面將所有選項列出,且較多都以文字敘述,使用者必須反覆操作才能製作出想要的外觀,這對於新使用者來說非常不友善,因此在上架一年後推出新版介面,每個步驟分開在不同選單中,降低學習門檻。此外,WRESIC也逐步推出附加功能,讓使用更簡單:
- 後續逐步教學:
產生語法後,一步一步提示使用者如何將語法放到部落格 - 錯誤偵測提示:
當使用者的相簿鎖定導致爬蟲無法解析時,將會出現提示告知使用者,並教導使用者如何開放相簿 - 及時預覽功能:
讓使用者預覽播放器放到部落格時的樣子 - 抓取歌名功能:
自動將歌名自動放置在音樂播放器前
周邊效應
WRESIC上架後廣受好評,眾多部落客相互推薦,不過也開始陸續出現功能與介面相似的網站。
功能與介面相似的網站:
成果
WRESIC上架後,降低了語法製作的門檻,每天製作音樂語法超過5萬人次以上、假日可達10萬人次使用:
WRESIC的2010年9月至2011年12月的Google Analytics紀錄,圖中峰值皆為每周六,其中2011年5月14日達最高峰152,669瀏覽量:
以2011年5月14日當周為例,平日(一至五)瀏覽量高峰落在晚間19:00至21:00,假日(六日)瀏覽量落在中午12:00至晚間20:00:
後續
無名小站隨著新社交平台崛起漸漸式微,Yahoo於2013年12月宣布關站,WRESIC也隨之結束營運。