DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> WEB網站前端 >> 關於網頁技巧 >> Q盤項目設計案例:產品-設計-開發無縫對接
Q盤項目設計案例:產品-設計-開發無縫對接
編輯:關於網頁技巧     

項目背景

在互聯網雲時代的背景下,各類“雲產品”層出不窮,雲技術的完善發展讓網絡存儲、實時同步存儲暢通無阻。國外以Dropbox代表下網絡同步存儲市場已然成熟, 市值40億的成績意味著同步市場的強大潛力。 在這樣的趨勢下, 國內也陸續出現了金山快盤、115同步盤、T盤等同步產品,但並不完善。也就是說,國內同步市場仍然存在著極大的缺失,實時同步市場誰來稱雄?

需求要點

Q盤應運而生。Q盤是QQ電腦管家提供的免費文件同步服務。登錄同一個QQ帳號,就可以在不同電腦上查看並使用Q盤中的文件。當一台電腦上Q盤的文件發生變化時,Q盤會將變化的文件同步到其他登錄相同帳號的電腦上。最重要的是,所有的同步都將由Q盤自動為您完成,無需點擊按鈕進行上傳/下載等手動操作。

設計過程

歷時兩個月的時間,經歷了分析、設計、開發、測試、發布階段,效率的提升壓縮了項目的周期。

產品-設計-開發 無縫對接

封閉式的設計雖然沒有舒適的工作環境,但卻極大的提高了工作效率。產品—設計—開發的順序座位讓整個Q盤的開發過程格外順暢。無限制的頭腦風暴

頭腦風暴不再只是產品經理和交互設計的內容,封閉的環境讓整個團隊的人都能參與產品腦暴的過程。集各方之談,產品更加完善。即時的信息反饋

不管是產品對設計的疑問、設計對產品的見解、開發對設計的實現、設計對開發的未知都可第一時間的溝通,實時的信息交流讓設計開發過程暢通無阻。

設計思考

1. 實時同步0感知

Q盤盡可能的減少用戶需要的操作:首次啟用只需一次登錄;再次使用無需啟動登錄;運行時文件自動實時同步,無需手動上傳下載。為了打造同步0感知,運行低打擾的效果,Q盤采用了托盤區靜默運行的形式。首次登錄完成後,Q盤的界面就從有到無,進入到“無界面”的產品模式。

2. 融會貫通-首次啟用界面優化

傳統軟件安裝的用戶教育通常放置在安裝完成之後,用戶可以選擇看與不看。但Q盤無需安裝,只是登錄即可使用。為了在用戶首次啟用時引導用戶了解Q盤,吸引用戶使用,Q盤中的用戶教育采用了提前處理。

3. 弱化步驟引導,讓界面更輕巧

一期方案中,為了凸顯首次啟用Q盤的便捷性,將步驟引導做了最大化處理。但隨著對產品的反復思考,設計師認為這樣的方式存在“空白過多”、“界面不精致”等問題。對此,Q盤首次啟用界面做出了“放血”的改變。從一期(左圖)到二期(右圖),界面尺寸從600*420改為520*380,弱化步驟引導,輕量界面效果。

4. 營造成就感

一期考慮開發成本,產品側期望用戶不要隨意更改文件夾位置。對此,在設計表現上采用了弱化“更改”的形式。但在此形式下,“開始使用”頁面沒有成就感,設計氣氛太弱; 另外,在“已獲得2GB免費空間”的處理上,單純的文本形式也無法凸顯產品優勢。針對以上問題,我們進行了思考,利用最短的時間做出最質優可行的設計效果。

5. 多平台的統一設計

Q盤的產品形式包括客戶端和網頁端兩種。Q盤一期穩定後,網頁端設計逐漸跟進。

網頁版一期首頁,產品側決定:在保證宣傳的基礎上,登錄是重點。經過幾番評審和思考,該界面還是存在重點不明確,登錄與宣傳互搶的問題。對此我們嘗試做出了以下優化。

視覺設計

1. LOGO設計

思維過程  在設計前期與產品方的充分溝通,進行了一些前期試探。考慮到Q盤是管家工具箱中的一個APP,並不是一個完全獨立的全新產品,那麼就必須降低用戶的認知門檻,簡單明了。

產品關鍵詞:Q、雲端、傳輸、盤、輕量

LOGO展示  為了與名稱緊扣,降低用戶認知門檻,最終采用了最簡單直接的表現方式:Q + 盤。

相關延伸應用設計

2. 初次使用教學漫畫

教學界面采用手繪的形式表現,簡單生動地對Q盤的功能、使用方式進行介紹,手繪線稿的表現較有親和力。

結語

感謝導師曉剛和乃哥在項目過程中的悉心指導,讓我們在Q盤項目中快速成長。

Q盤設計過程中經歷了各種角色的洗禮,在與各角色的溝通中我們做為設計者就被默默掛上了“龜毛”的名號。為了追求產品的無感知輕打擾,我們會針對一些體驗細節爭執不休;為了保證界面的視覺效果,我們要跟技術人員反復強調那偏離的“1個像素”。

其實,“龜毛”也不一定是貶義詞,設計師的身份應該具備“龜毛”的特性:過於仔細、過於認真以至於別人受不了而抓狂。仔細認真是我們必備的素質,龜毛是我們永不改變的形象。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved