用戶體驗分析:Alibaba國際站首頁改版小結
來源:網(wǎng)站推廣 2012-08-02
阿里巴巴國際站(Alibaba.com)是全球最大、最有影響力的B2B電子商務平臺,是阿里巴巴集團的旗艦公司。長期以來,阿里巴巴國際站視覺風格并未隨著業(yè)務的突飛猛進而有更富魅力的改變,呈現(xiàn)在用戶面前的,依舊是稍顯過時的設計風格。隨著用戶需求和公司業(yè)務的壓力,對網(wǎng)站的視覺重構就成了迫在眉睫的事情,是時候來一次激動人心變革了!
一. 目前線上版本分析:
改版前Alibaba國際站首頁
上圖為目前線上版本,較2009年的版本,總體設計風格和信息結構沒有太多的變化:
首頁沒有傳遞出Alibaba.com的業(yè)務方向和核心價值;
隨著業(yè)務方向發(fā)展,不能滿足業(yè)務需求;
設計風格過時,設計風格不統(tǒng)一。
二. 用戶需求分析:
分析用戶需求之前,一起來看一下外貿(mào)B2B生意從工廠到發(fā)貨的重要環(huán)節(jié)有哪些,Alibaba對應這些環(huán)節(jié)有哪些相關配套服務。
通過用戶調研分析,目前網(wǎng)站用戶對Alibaba.com提供的這幾個核心服務的認知度較低,所以這次首頁改版的首要目標就是要進行用戶教育并傳遞網(wǎng)站的核心服務。
三. 信息推導——框架結構
大牛William Strunk和E. B. White的《The Elements of Style》里寫到:”越精簡的文字越有力。一句話里不應該有多余的詞兒,一段話里不應該有多余的句子。同樣,一幅畫里不應該有多余的線條,一臺機器也不應該有多余的零件。”對首頁信息進行重新梳理,去掉長期沒人運營的冗余信息;重新調整信息結構,核心位置傳遞網(wǎng)站核心價值信息;只專注那些用戶最需要的功能,用20%的基本功能去滿足80%用戶的需求。
新首頁最終線框圖
Alibaba.com主要功能區(qū),全站性買家主功能入口(頂部導航,類目,搜索);
核心服務,網(wǎng)站服務以及用戶教育,對新買家的初步教育以及價值展示,老買家的流程引導和網(wǎng)站服務介紹;
網(wǎng)站運營區(qū)域(次banner運營活動,Bargain Buys,GSD產(chǎn)品區(qū)域);
推送熱門產(chǎn)品,展示和買家瀏覽行為相關的產(chǎn)品;網(wǎng)站Site Map以及應用拓展。
四. 視覺推導——風格、色彩
新視覺風格探索主要從以下幾個維度考慮
1. 色調,感受,明亮的,柔和的,還是暗沉的;
2. Icon,字體,統(tǒng)一性,傳達的感覺,Icon和字體要有連續(xù);
3. 松緊度,留白,行間距,字間距,寬松度;
4. 結構,整齊的,流式的,開放的,還是閉合的。
設計趨勢
近幾年來,隨著Metro風格的簡潔與直觀、Goole全新的UI體驗、Android 4.0系統(tǒng)的平面化,各大主流界面的風格都趨向于簡潔,結構清晰,信息突出,減少噪音。
新首頁視覺關鍵字
新首頁視覺關鍵字
尋找新色彩
通過視覺關鍵字尋找新色域
確定配色
確定配色
藍色是靈性知性兼具的色彩,在色彩心理學的測試中發(fā)現(xiàn)幾乎沒有人對藍色反感。明亮的天空藍,象征希望、理性、理想、獨立等。ColourLovers.com公布了一項調查結果,美國前100大網(wǎng)站的Logo,主要使用12種顏色。其中,采用藍色的網(wǎng)站最多,紅色排在第二種。
五. 設計展示
我們把用戶需求轉化成信息結構,并在用戶群體的生活空間里尋找到網(wǎng)站的顏色趨向,接下來,我們把理論轉化為交互和視覺的表現(xiàn)方式,新的國際站設計風格從而順利誕生了。
Alibaba國際站新首頁
一致性和標準化
一致性意味著產(chǎn)品界面的不同模塊要有相似的外觀、感覺和行為。這次改版,我們對網(wǎng)站核心頁面同時進行了優(yōu)化,為用戶提供無縫而舒服的瀏覽體驗。
Alibaba國際站新首頁_2
Icon重繪
老版本的Icon一是樣式不統(tǒng)一;二是原來的Icon質感太重。在新版設計中,我們對新Icon全部采用扁平化處理,用實色填充新繪制的Icon更加能體現(xiàn)出新版本的簡潔、清新。
Icon重繪
重新繪制UI組件
簡單和統(tǒng)一是體驗的關鍵。新繪制的UI組件,盡可能的去減低UI元素的強度;新繪制的Button采用CSS3實現(xiàn)圓角和漸變;每個組件有2-3個不同的尺寸,盡最大可能為用戶帶來統(tǒng)一的體驗。
重新繪制UI組件
六. 效果反饋
由于考慮到時間和篇幅問題,這次小結還有很多細節(jié)沒有分析到,比如首頁為什么采用990px網(wǎng)格系統(tǒng),布局上采用怎樣的邏輯路徑是合理而有效的等。后續(xù)會繼續(xù)給大家分享。新首頁發(fā)布后,做了A/B測試,做了針對新首頁的用戶調研,新的視覺風格也得到了多數(shù)用戶的肯定。引用一位歸國華僑對阿里巴巴國際站改版的評論。新首頁改版只是我們跨出優(yōu)化阿里巴巴國際站體驗的第一步,后續(xù)還會對整站其他頁面繼續(xù)分期進行優(yōu)化。
感謝大家長期以來對阿里巴巴國際站UED的關注和支持,有任何建議和意見歡迎在此跟帖回復,您的參與和支持將是阿里巴巴國際站UED進步的動力!
文章編輯: 365webcall免費在線客服(www.365webcall.com)
我的評論
登錄賬號: | 密碼: | 快速注冊 | 找回密碼 | ![]() |
| 人妻无码一区二区三区久 | 精品国产一级A片免费看奶水多多 | 红桃视频成人A片免费无码 国产免费午夜精品理论A片 | 国产精品人妻一区三区无码在线播放 | www.中文字幕 | 中文字幕a a a a a | 免费无码婬片AAAA片上门服务 | 蜜桃国精产品二三三区鲁鲁视频 | 极品成人网站入口 | 久久成人免费视频 | 一级黃色真人毛片 | 免费无码婬片AAAA片直播表情 | 1024旧版人妻无码你懂的播出时间 | 国产成人91亚洲精品无码观看 | 极品91尤物被啪到呻吟喷水 | 免费观看人成视频 | 亚洲精品一区二区 | AV第一福利大全导航 | 欧美日韩国产在线观看 | 91麻豆免费高清视频 | 少妇无码字幕在线视频 | 国产aV熟妇人震精品 | 婷婷中文字幕在线 | 强行糟蹋人妻hd中文高清完电影 | 粉色五月天超级碰碰 | 国产第一区第二区在线观看 | 国产精品久久久久久一级毛片 | 久久人妻少妇嫩草av蜜桃麻豆 | 2019中文在线观看免费高清第三季预告 | 全免费A级毛片免费看黄瓜视频 | 日本做爰无遮A片免费 | 色噜噜日日噜狠狠无码秘 | 极品媚黑 黑人 正在播放 | 日本不卡在线观看 | 蜜桃一区二区视频正在播放 | 欧美激情在线播放 | 无码精品少妇一区二区三区久久 | 日本被扒开腿添高潮了 | 久久人妻熟女中文字幕av蜜芽 | 影音先锋豆豆色AV资源网 |