一、前期的準(zhǔn)備

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

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

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

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

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

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

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

用戶(hù)進(jìn)行頻道切換時(shí)點(diǎn)擊或向上拖動(dòng)下面的向上按鈕，在觸覺(jué)上會(huì)有震動(dòng)反饋，向上的按鈕變大，從視覺(jué)上看像是被手指壓住拖動(dòng)。

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

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

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

個(gè)人主頁(yè)界面

好友界面

應(yīng)用界面

三、一些細(xì)節(jié)和擴(kuò)展性

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

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

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

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