Qzone平臺個性相簿設計方法和技巧
QZONE平臺的相簿功能為保證載入速度一直以來以簡潔的圖片排列檢視模式呈現相片，隨著市場上各類相簿產品推陳出新，使用者越來越強烈的要求個人相簿的獨特展示，為了給廣大使用者提供更炫更酷的個性體驗，QZONE在2009年5月全新推出了flash動態個性相簿。Vivi有幸參與了個性相簿的設計，專案一期成功推出五套相簿，設計過程令人意猶未盡，下面和大家晒晒專案過程中的設計體會吧。QQ空間
相簿預設的圖片排列檢視模式
剛開始就遇到了“不能”QQ空間
接到需求之初，專案組的同學們對個性相簿的頭緒還不明晰，開發對設計的約束也還沒有具體的說明。為了大家在討論時能有圖可依，我以迅雷不及掩耳盜鈴（囧）的速度輸出了以檔案袋中的相片為情景的版本，拿著草稿便找到了產品和開發的同學討論了。果然一百個人心中有一百個“個性相簿”，討論很激烈，這個未經過深思熟慮的版本順理成章的被pk掉了，換來的是我們對相簿風格樣式，照片瀏覽方式細緻的梳理。
為了提高載入速度、節省頻寬、方便維護，便於開發，開發gg提出了主程式模版化的建議。需要模板化的程式包括相簿翻頁，播放控制，載入圖片處理，切換效果，小圖列表等等。這意味著個性相簿只有面板和過場動畫可以有不同視覺效果的發揮，其餘部分用統一的視覺元素和動畫。經過多輪設計、產品、開發同學的三方會談，最終決定以大局為重， 犧牲一部分視覺效果來配合開發。
雖然主程式模板化使很多表現形式和手法無法實現，但是，勤勞的設計師不會因為各種的限制，放棄對視覺效果的追求，設計組同學們開始在限制中尋找激發創意的入口。
天馬行空尋找各種“可能”
就這樣開始吧，通過對使用人群的年齡喜好分析，我們和產品mm確定了休閒，清新，塗鴉，魅惑，年輕，可愛，商務，簡潔，情感這幾個設計方向。顏色上傾向於黑白、多彩、中性、女性青睞的粉、清新的藍、綠。由於專案一期deadline迫在眉睫，上線的相簿模版數量有限，為了能讓第一期上線的相簿能最大化的滿足使用者使用需要，我們又從中篩選出大眾更偏愛的風格首先進行設計,如清新，潮流，確定了以個性面板＋開場動畫的設計形式展現相簿最個性的部分。
個性相簿“異國風情”面板效果
沒有什麼不可能
相片瀏覽是相簿最基本和最重要的功能，主程式模版化需要我們在各類相簿中保持一致的圖片切換效果。我們首先想到的就是要讓使用者瀏覽相片時不因動畫展示區域大小限制圖片的檢視，簡言之就是圖片的展示區要足夠大，要滿足可能有的大尺寸相片。二是要讓這套動畫適合不同風格的面板。三是減少開發開發量。在嘗試了圖片漸隱等幾款圖片切換效果之後，我們最終選擇了類似相紙的設計，圖片切換設計成了紙張翻頁效果，這種切換效果的特點是：瀏覽區域大。大眾化易在不同風格的面板下統一。
個性相簿“休閒時光”模板載入圖片區域處理成了相紙效果
相片瀏覽模式處理成了紙張效果，瀏覽區域大
面板是個性相簿設計中最主要的部分，為了追求視覺效果，起初我們使用顏色構圖都很講究的攝影作品作為圖例，將它們按載入後照片的位置結合面板進行整體構圖和顏色調整。在設計了兩款相簿後發現：原本色調統一、構圖活潑的畫面卻因為使用者相片替代了攝影圖片而變得整體效果雜亂，主次不清，作為主體的相片在豐富的面板圖案裡黯然失色。這是為什麼？
使用者使用相簿的目的是為了展示相片，他們對相片的關注高於面板，所以設計時應多琢磨如何讓畫面元素襯托相片。普通人日常照片的特點是顏色多，構圖亂，放在視覺中心分散的畫面上容易被喧賓奪主。考慮到這些我們調整了設計中的一個小環節，改將日常相片結合面板來統一設計。面板作為相片的襯托，設計時我們在畫面元素與相片的面積比和位置關係，主體物周圍的裝飾等方面重新調整。之後我們輸出了下面這套“彼岸花”。原來設計面板不僅僅是設計一張圖片。
個性相簿“彼岸花”模板
面板按照原定計劃設計成不同風格的情景表現。QZONE使用者群很廣，根據使用者年齡喜好的要求，輸出了幾套特別版本，如這款活潑歡快的“HAPPY TOGETHER” 。
個性相簿“HAPPY TOGETHER”模板
接下來就是動畫部分，動畫是基於個性面板的輔助性設計，目的是讓相片更突出讓相簿更具動感，開場動畫為了表達情景，配合照片的載入動畫適當的誇張生動。載入完成之後的輔助動畫主要烘托氣氛，為了不騷擾使用者觀看相片，動態設計的和緩有節奏。設計時吸取了之前的經驗，動畫元素以相片為中心運動，襯托相片，製造視覺的中心。具體動畫效果請登入 QZONE相簿設定個性相簿後觀看，謝謝！
個性相簿“印象@China 效果
個性相簿前後有五位設計師傾情參與：菜花，海味，vivi，柱子(平臺設計)，三目(活動設計)，一期的整個版面雖因專案週期等原因不得不做些設計方面的妥協，部分設計元素複用，但是我們在有限的可發揮的位置儘可能保證了設計精美和豐富。個性相簿上線後，使用者反饋滿意度高，使用者使用率高於預期。
