當前位置:陽光暱稱網 >

計算機網絡 >熱點資訊 >

QQ空間V8新版有哪些改進 QQ空間V8裝扮說明

QQ空間V8新版有哪些改進 QQ空間V8裝扮說明

QQ空間V8新版有哪些改進 QQ空間V8裝扮說明

QQ空間V8新版即將發佈了,界面清新簡潔,裝扮更是美輪美奐:提供5種新版式,多達50套新皮膚,將給大家帶來全新的體驗。

提到QQ空間V8,相信Q友們最感興趣的是有什麼改進,特別是裝扮方面,就像騰訊社交用戶體驗設計師所講的“我們做的一切都是爲了用戶在裝扮上有耳目一新的感覺,我們希望以後也會有更多有創意的裝扮繼續誕生,讓每次用戶換裝扮時都有驚喜。”,下面帶來官方關於QQ空間V8的裝扮說明。

相關點擊:免費開通QQ空間V8版體驗資格的方法

裝扮是QQ空間裏的重要特性,關係到用戶進入空間時的感受,我們追求爲用戶帶來更優質的體驗,因此V8新版本的設計,我們想讓裝扮有更新的方向,更酷的形式,讓裝扮更有特點。同時個人中心和個人主頁的裝扮和風格能保持一致,這些都是我們這次嘗試創新裝扮的動力來源。

一、前期探索和風格嘗試

既然要做創新,首先應該滿足的點就是要有足夠的新意去吸引到用戶的眼球,在用戶第一次接觸時就會被觸動“這套裝扮太有意思了,好適合我,好喜歡,好想用。”

爲了彙集各位設計師的奇思妙想,我們組織了一次腦暴會,希望裝扮不僅僅只是替換圖片,而應該有更多互動體驗。

下面是對腦暴後奇思妙想的整理:

隨着Html5技術的成熟,我們可以利用越來越多技術來實現特效,比如視差滾動,空間裝扮當然也要與時俱進。

QQ空間V8新版有哪些改進 QQ空間V8裝扮說明 第2張

來看看這套裝扮的構思,它利用了簡單的視差原理,當用戶滾動鼠標將頁面下滑時,背景的星空也會隨之緩緩旋轉,帶用戶進入到極光的世界。

QQ空間V8新版有哪些改進 QQ空間V8裝扮說明 第3張

這套裝扮同樣利用了簡單的互動原理,眼球能跟着你鼠標指針的方向,定位到眼球所在的位置,給用戶俏皮的感覺“你指哪兒我就能看到哪兒。”

我們都知道空間裝扮的核心體驗是讓用戶自主選擇搭配,每一個裝扮元素都是獨立的,將自己喜愛的裝扮配件自由組合起來,搭配出屬於自己最具個性的裝扮;這樣高自由的體驗,突出了用戶個性的同時也帶來一定的問題——那就是裝扮自定義的尺度過大,導致大多數裝扮最終成品沒有主題,散亂而不夠整體。

QQ空間V8新版有哪些改進 QQ空間V8裝扮說明 第4張

於是在新的V8裝扮方案設計中,提出“場景主題化”的裝扮概念,由專業設計師根據不同用戶羣體以及場景來整體包裝,打造出獨具主題個性的空間裝扮,提升空間裝扮整體的品質感。

二、視覺輸出

通過一段時間的設計,我們終於把概念轉化成了現實。

1.海洋進化論

QQ空間V8新版有哪些改進 QQ空間V8裝扮說明 第5張

這套裝扮僅僅只呈現了海底的世界,除了魚和水母之外,會讓用戶覺得太單調乏味的。

QQ空間V8新版有哪些改進 QQ空間V8裝扮說明 第6張

加入藍天、海平面、海底和小島。初步有了雛形,但是波浪太激烈了,會給用戶不平靜的感覺。

QQ空間V8新版有哪些改進 QQ空間V8裝扮說明 第7張

靜止的海景已經完成差不多,爲了讓用戶有真實感受,那就需要裝扮裏的內容是動起來,魚能在海底遊動,海浪翻滾,天空中的雲朵飄動,這些都是通過Html5技術來完成。

在動畫的製作中,魚的遊動難點是最大的。

整套裝扮中都是寫實風格,爲了保持風格的統一,魚也不例外。所有的魚都是PNG的圖片,怎麼才讓它動得更真實呢,在看完很多海底世界的視頻之後,纔開始着手設計。

QQ空間V8新版有哪些改進 QQ空間V8裝扮說明 第8張

動畫都是有Html5技術完成,所以我們需要提供給前端哥哥的是魚遊動時候的關鍵幀,要讓魚遊動的更流暢,根據觀察視頻得出的魚遊動動作尾巴和身體的變化,用一張靜止的魚的圖片,通過PS變形,微調出5張魚遊動的關鍵幀,然後給他們排好順序,做成GIF動畫,邊播放邊微調,直到魚的遊動接近真實。

QQ空間V8新版有哪些改進 QQ空間V8裝扮說明 第9張

我們希望讓所有用戶都能看到完整的海洋全景圖,利用前端的自適應技術,讓海洋能適應幾乎所有分辨率。

空間的用戶在看完動態後,都不會直接關閉,而是掛機去做其他事情,鮮活的海底動畫依然栩栩如生迎接用戶歸來。

2.星空

QQ空間V8新版有哪些改進 QQ空間V8裝扮說明 第10張

前期資料收集,看了許多星空、極光、太空等,開始設計之前,先要對自己要設計的內容有足夠多的瞭解。

QQ空間V8新版有哪些改進 QQ空間V8裝扮說明 第11張

腦暴時候的星空裝扮優化和深入,星空隨着頁面滾動以不同的速率移動,時而有流星滑過。

樹木的剪影在一開始會隨着鼠標滾動越來越大,經過多次調試,效果都不太好,爲了不讓用戶有眩暈感,最後決定樹木剪影固定不動。

要做到自適應,底部的樹木兩頭就需要能對接起來實現能無限延展,無論你屏幕有多大,媽媽再也不用擔心我看到的整個星空裝扮是不完整的了。

QQ空間V8新版有哪些改進 QQ空間V8裝扮說明 第12張

爲了讓用戶有流暢的體驗,我們不得不損失部分視覺效果,在技術能實現的前提下,始終堅持視覺最優效果。

3.角色化裝扮

不同用戶會有不同的身份和愛好,同一個用戶也會有不同的愛好,對用戶的身份進行分類,挖掘用戶愛好,進行專屬裝扮的設計。

a.角色類型

廚師

QQ空間V8新版有哪些改進 QQ空間V8裝扮說明 第13張

烹飪與食物帶給人們一種溫暖的感覺,所以在整體用色上,我們選用了紅色、黃色等暖色系;背景選擇了偏居家的格子底紋去做鋪墊烘托;在Cover圖的選擇上,我們也偏向一些食材以及烹飪工具的圖片,希望以此營造一種現實生活中廚房場景的氛圍;最後是把一些設計的細節融入到整個裝扮當中,爲整個裝扮增加亮點;

學生

QQ空間V8新版有哪些改進 QQ空間V8裝扮說明 第14張

學生大多數時候都是通過老師在黑板上的文字來收穫知識,所以講臺上的黑板能帶給我們學習的氛圍。Cover圖設計了一塊被老師擦過無數次的舊黑板,黑板上幾個大字母便是受過高等教育的學生都學過的愛因斯坦著名的質能方程式E=mc^2。 細節上,天氣掛件區域用手繪畫出邊框,讓整個天氣掛件就是整個黑板上的一員一樣,背景也選擇了牆壁紋理平鋪,使整套裝扮裏更加整體。

白領

QQ空間V8新版有哪些改進 QQ空間V8裝扮說明 第15張

白領給人的感覺就會是很商務化,商務普遍給人的第一感覺就是藍色,但是棕色和黑色給人更加符合白領氣質的感覺,所以最後選擇了和咖啡相近的棕色做爲主色調。Cover圖則選擇了一棟商務大廈的外牆,建築外牆的結構同時也具有構成感,整個風格也較簡潔,不做多的修飾。

b.社交關係

親子

QQ空間V8新版有哪些改進 QQ空間V8裝扮說明 第16張

再來看看這套主題定位爲“親子”的裝扮,是爲那些用空間記錄自己寶寶成長故事的爸爸、媽媽而設計的。整體的設計上,我們想通過整體柔和的色調、局部輕微的擬物效果、以及添加可愛的小元素,體現出一種嬰兒房中溫馨,柔美,充滿濃濃愛意的氛圍。 在用色上,我們主要選用了粉橙色、粉紅色這類暖色系色調。在Cover圖的選擇上,我們選用了一張熊偶的照片,那是嬰兒房中各式各樣的可愛小玩具中的一員。 在細節方面,我們採用了一個嬰兒房常見的掛飾的剪影作爲天氣模塊的承載,在內容區域用嬰兒服飾上常見的小動物圖案來平鋪,等等。這些元素、局部的設計都爲了更加的凸顯我們這套裝扮的主題。

情侶

QQ空間V8新版有哪些改進 QQ空間V8裝扮說明 第17張

表達愛情的物品挺多的,比如:玫瑰、戒指、心等等。

我們想帶給用戶一些不一樣感覺,人們常常通過疊千紙鶴來表達對自己愛人的思念,本套裝扮則恰恰想通過兩個千紙鶴來表達對對方的思念,天氣掛件的背景巧妙的做成郵票則是爲了表達我想把我的思念寄給你。通過散落的桃心、桃心外輪廓的導航加上粉紅色背景更能烘托主題。

c.興趣愛好

遊戲迷

QQ空間V8新版有哪些改進 QQ空間V8裝扮說明 第18張

在設計前期對部分遊戲進行了分析,比如“鬥戰神”、“軒轅傳奇”等遊戲,它們的風格都是酷炫、暗黑、玄幻的整體氛圍; 在一開始,我們將這款遊戲主題的目標用戶定爲男性遊戲玩家,如果反饋良好,再推出女性遊戲主題;所以就考慮將暗黑系列的遊戲UI元素複用到裝扮中,以增強用戶的遊戲即視感。 比如個人主頁左側模塊的花紋邊框,就是直接複用遊戲中“人物狀態欄”的邊框,帶着玄幻與破舊的感覺; 而背景紋理也是選用了和遊戲感比較貼切的暗黑風格;Cover直接用了遊戲畫面,天氣模塊用旗幟作爲底板;希望裝扮的設計效果,和遊戲操作界面的氛圍貼切,讓用戶感受是在玩遊戲的體驗感。

足球迷

QQ空間V8新版有哪些改進 QQ空間V8裝扮說明 第19張

作爲一個忠實的足球迷,極力的想把這套裝扮做好,讓我們廣大的球迷同好們再也不用擔心沒有好看的足球裝扮可用。

設計之初,覺得有太多太多的足球元素可用,就什麼都想往上放,在平鋪的草地上想把整個足球場的邊線,中線都畫出來,角球旗、球門和球網都做上去,後來發現其實東西越多非但沒能表現好整個足球場的氛圍,反倒是影響了用戶閱讀裏面的內容。

於是開始做減法,把足球場上面積最大,深淺交替的草坪做爲背景,導航下平鋪的是用石灰在草坪上畫出的中線,在草坪上放上足球,再在頭像上加上球迷帽,是不是就已經有想在上面踢球的衝動了。球迷朋友們趕緊去商城裝扮上這套足球裝扮吧!

三、感悟

在整個設計中,最核心的點就是主題化與空間品質。

所有的用色、材質、設計細節等等都是圍繞着這個核心來進行。我們不會選用過於個性與異化的元素去包裝空間,但所有的設計都是爲主題而服務,設計上的取捨都是爲了烘托整個空間裝扮的場景感、品質感。

我們做的一切都是爲了用戶在裝扮上有耳目一新的感覺,我們希望以後也會有更多有創意的裝扮繼續誕生,讓每次用戶換裝扮時都有驚喜。

這次的裝扮的設計中領悟到一點道理,要做出打動用戶的裝扮,首先你應該打動你自己。其實所有的設計都是一樣,連設計師自己都不能打動的設計,你又該怎麼去引起別人的共鳴呢。

標籤:
  • 文章版權屬於文章作者所有,轉載請註明 https://ygncw.com/jisuanji/redian/ej3k05.html