一、前期的準備

制作這次風(fēng)格稿的時候，問了身邊的一些使用QQ空間的朋友，問他們是如何理解QQ空間的？希望的QQ空間是什么樣子？得到了N多的答案，其中的一些關(guān)鍵字我摘錄了出來：“好玩些、讀寫方便、速度快操作流暢、酷一點、可以看到更多和PC用戶的內(nèi)容、讓我們來選擇自己喜歡操作方式、精致漂亮、要有QQ空間自身的特點…”

在看完這些朋友們給的這些信息之后就到了揣摩消化分析理解體現(xiàn)階段，同時希望可以在風(fēng)格上嘗試一個和以往的版本不同的地方，既可以體現(xiàn)出QQ空間自身的特點又可以讓用戶耳目一新，接下來就是草圖和素材收集階段，下面就是我對QQ空間的一些認識通過圖片表現(xiàn)一下吧：

你能在下面的視覺稿中發(fā)現(xiàn)這些圖片的影子。

二、設(shè)計展現(xiàn)階段：

用戶進入登錄界面后，在未輸入賬號的情況下界面中l(wèi)ogo置灰顯示，用戶點擊賬號輸入框后logo變亮（在視覺上是從不可操作變化為可操作即可點擊狀態(tài)），當用戶輸入密碼后，點擊logo進行登錄。

進入個人中心大家可以看到這里界面的tab欄是做成隱藏狀態(tài)的，只露出一個可以點擊的向上按鈕，而且界面中的title和tab都設(shè)計成了半透明效果，這樣設(shè)計第一為了讓用戶在視覺上擁有更大的閱讀空間，第二也是為了讓用戶有一個愉快的操作體驗，其實用戶在進入個人中心后，他的觀注點會是個人中心里的各種操作，包括寫心情、拍照片、查看留言評論、回復(fù)等等，只有當觀注點改變的時候（目的性改變變強）比如需要進入我的主頁查看自己相關(guān)的內(nèi)容、去玩一些應(yīng)用這個時候用戶才會去切換相應(yīng)界面，這也是把tab欄設(shè)計成隱藏狀態(tài)的一個原因。

在界面中為了讓用戶很輕易的識別出每條FEED的屬性設(shè)計了一些對應(yīng)心情、日志、評論、相片、贊等一些圖標。

用戶進行頻道切換時點擊或向上拖動下面的向上按鈕，在觸覺上會有震動反饋，向上的按鈕變大，從視覺上看像是被手指壓住拖動。

這時轉(zhuǎn)盤形的tab欄從下方被喚出，當前為個人中心界面，所以對應(yīng)在tab欄上的個人中心的圖標是被激活的，在對tab欄圖標設(shè)計處理的時候，均采用了擬物化的設(shè)計。

對tab欄操作的時候，用戶可以用2種方式進行頻道間的切換，點擊相應(yīng)的圖標或拖動環(huán)形轉(zhuǎn)盤便可切換到對應(yīng)的頻道中，這樣在保證快速切換的同時也增加操作的趣味性，每個頻道對應(yīng)的icon移動中間位置被激活（效果為淡入淡出效果），同時頻道進行切換，下面2張圖分別代表手指觸控圓盤進行左右滑動時tab欄的變化：

下面是個人主頁、好友、應(yīng)用界面

個人主頁界面

好友界面

應(yīng)用界面

三、一些細節(jié)和擴展性

1、考慮到用戶的使用習(xí)慣和操作方式的不同，在這里把主動權(quán)交還給用戶，提供3種操作方式讓用戶自己定義，默認情況下的頻道切換為從下方喚出，用戶可以在設(shè)置界面中調(diào)整tab欄的操作方式。

2、目前的tab欄上有5個頻道圖標，考慮Qzone的強大整合性不能排除以后繼續(xù)增加頻道的可能，所以采用轉(zhuǎn)盤式的設(shè)計方式，也就是這個風(fēng)格稿的主題之一——玩轉(zhuǎn)Qzone。

3、在輸入賬號密碼驗證的時候，系統(tǒng)會自動判定男女用戶，如果是女性用戶登錄后系統(tǒng)會自動選擇適合女性的皮膚樣式，對應(yīng)的圖標也會發(fā)生改變，比如個人中心的圖標就會變成一個女孩的ICON。

在產(chǎn)品設(shè)計中用戶需求和具體的情景使用感受，也是一個設(shè)計師要去全面考慮的。