2017-8-17 用心設計
導語
QQ在很多人眼里是聊天的工具，那么在聊天這個看似簡單的領域，究竟還能做什么創新功能？在此分享一下QQiPad版v6.7版本的主功能，同時也是設計側主導的創新功能——“來斗”的設計總結，希望給大家一些靈感和啟發。
背景
QQiPad版經過不斷迭代，功能日趨完善，我們希望在此基礎上繼續挖掘創新點，給用戶提供更爽更有趣的體驗，為此做了一些調研和探索，得到了一些有用的結論：
1. QQiPad版的活躍用戶呈年輕化趨勢，90后00后是主力軍
今年五月份ISUX北京設計部針對QQiPad版用戶做了一次調研，調研結果發現，QQiPad版的活躍用戶集中在90后00后這兩個群體，偏年輕化。
2. 90后00后年輕人聊天熱衷斗圖，“斗圖”已經成為一種聊天文化
3. 已有App試水表情包制作的功能，但路徑長，體驗差
目前主打斗圖功能的App中，大部分為表情庫，少部分提供簡單的表情制作功能，以轉發形式發送。聊天過程中使用這些app獲得表情包時，需要在兩個app之間反復跳轉，即時性低，體驗很差。
結合這三點發現，我們認為在QQ上做斗圖功能是一個值得切入的角度，因此我們進一步做了用戶調研，進一步了解現階段QQ用戶對聊天里斗圖及制作表情包的看法，得到如下結論：
1. QQ用戶經常在聊天中斗圖
2. 合適的配文、搞笑的臉部表情、熟人素材是表情包獲得共鳴的三大特點
3. 多數用戶DIY過表情或動過DIY的念頭
4. 多數用戶因為沒有合適的工具而放棄了制作表情的念頭
這些結論說明QQ用戶在聊天時不僅經常斗圖，還希望能自制表情包，但現有的表情包工具體驗不佳，無法滿足用戶的需求。因此，如果能夠在QQ上降低制作表情包和發送表情包的門檻，大量潛在的“表情包用戶”創作欲望將被激活，參與到這場表情包的“戰斗”中來。
目標用戶屬性
在開始設計功能之前，我們進一步分析了斗圖目標用戶的屬性，明確他們需求，根據需求進行設計。
根據以往的經驗，一般用戶產生專業內容的社區，有10%的用戶產生內容，90%的用戶參與，而在10%的用戶中，有1%的人以意見領袖的形式存在。
在表情包領域，也存在著相似的規律。
處于金字塔頂端的是 “達人用戶”，擁有強烈的創作欲望和發起話題欲望，有合適的素材便會動手創作，為了達到目的甚至會用多個App進行創作，不在乎成本，只在乎結果是否好玩、能否彰顯自己引領聊天節奏的地位；
接下來是“活躍用戶”，他們對表情包有較強的認知，雖然較少主動發起斗圖，但是容易被帶動起來，成為活躍的參與者和斗圖的主力軍；
剩下的便是90%的“圍觀用戶”，他們創作欲望不高，更多是以轉發表情包的形式參與斗圖，追求簡單快速低成本。
功能定位&交互設計
1. 迎合表情包文化，制作用戶喜歡的表情包
通過用戶調研結果了解，合適的配文、搞笑的面部表情、熟人素材是一個表情包成功的關鍵因素；縱觀這幾年的表情包文化發展，從最開始的暴漫，到現在廣為流傳的蘑菇頭、熊貓頭表情包，其模式都是“夸張的肢體簡筆畫+搞笑的面部表情+恰到好處的文案”，已經成為斗圖表情包的主流形態，通過這種方式來表達自己的情感和想法，甚至不需要打字就能夠聊上一整天。
因此，我們決定順應斗圖文化，為用戶提供能夠快速制作主流表情包（面部表情+身體+文案）的功能。
2. 讓90%的“圍觀用戶”能一鍵斗圖
前文提到，90%的用戶為“圍觀用戶”，他們參與但不主動發起斗圖，追求簡單快速，為了讓他們參與斗圖，需要設計一個門檻極低的斗圖功能，做到一鍵就能斗圖。
在聊天中，將帶人臉的照片作為觸發元素，通過規則約束，匹配出適合惡搞的場景，再利用臉部圖像識別和摳圖技術，快速匹配素材和文案，一鍵發送，激活斗圖氣氛。
3. 為1%的“達人用戶”提供相對完善的創作條件
達人用戶是最熱衷創作表情包的一波人，網絡上流傳的表情包大部分出自他們之手，相比創作難度，他們更關注能否產出理想效果的表情包表達自己的情感和想法，因此，需要為他們設計一個難度適中的編輯功能，同時為他們提供基礎素材，滿足他們從無到有創作和表達的欲望。
視覺設計
1. icon設計
斗圖功能的icon設計充滿挑戰：
（1） 圖形上需要充分表現斗圖這一行為的特點；
（2） 圖形要足夠有吸引力，讓用戶有點擊的欲望；
（3） 斗圖功能入口眾多，分布在不同的界面，這些界面上的圖標都有其風格，因此設計的圖形必須有較強的拓展性。
這些挑戰也是明確的目標，基于這三個目標，開始著手斗圖功能的icon設計。
開始設計之前先梳理一遍icon的使用場景，了解各自特點。（虛線部分為icon位置）
了解應用場景后開始進行發散，從斗圖的三個維度去發散圖形創意。
根據這三個方向搜集相應的圖片作為參考：
根據設想的維度和參考的元素繪制圖標，將他們進行不同程度的結合，繪制了多個方案。
對各個方案進行比較之后，選出了這兩個方案進一步做結合，前者能更直觀地表現斗圖這一行為，而后者的表情給人一種嘲諷的感覺，更符合斗圖的氣質。
結合后以拿著劍的挑釁臉小人形象呈現，并根據不同使用場景進行了延展。
項目組內小范圍測試了一下，得到一些比較積極的反饋：“這個表情特別賤”、“忍不住就想點”、“可以的”……說明設計結果與目標相符。
2. 界面設計
聊天觸發界面
一鍵生成表情包演示(gif)
首次出現引導(gif)
編輯界面
為了獲得更佳沉浸的編輯體驗，將主界面定為深色調；同時為了強化發送，采用了更加突出的按鈕樣式設計。
3. 素材設計
預設素材的設計重心在于身體素材的繪制。搜集網絡上比較火的表情包進行分析，發現以下特點：
（1） 風格略“糙”，多為簡筆畫；
（2） 形體夸張，體現在動作和身體比例上；
（3） 視覺感受偏“賤”和“萌”。
結合身邊年輕人對這些表情包特點的評價，還可以了解到他們發送表情包的的訴求主要是為了有趣地表達自己的情感，糙、夸張、賤萌的表情包很好地滿足了他們的訴求。基于這三個特點我們進行了大量的嘗試：
繪制完之后又在內部進行小范圍的評選，以了解大家對這些素材的接受程度和反饋。
除此之外我們還對不同類型的素材數量進行了比例分配。斗圖時，表情包大致分為三類，使用數量上有以下特征：
（1） 嘲諷型表情包居多，互相嘲諷是斗圖常態
（2） 過渡型表情次之，經常需要它們來切換話題／挽尊
（3） 懟人型表情最少，只有特別熟的朋友才“械斗”
他們的比例大致為6:3:1。
經過多方面的考慮，層層篩選，選出了50多個素材搭配文案進行上線，展示如下。由于用戶喜好和理解的笑點多種多樣、同時網絡上的新梗層出不窮、再加上初次繪制素材經驗有限，上線的素材可能無法完全貼合所有用戶的喜好，但不管怎樣，這只是一個開始，我們將根據上線后的使用情況和用戶反饋，進一步豐富素材庫，繼續提高“來斗”功能的可玩性。
4. 官網設計
為了配合宣傳，對官網也做了一次風格更新，采用黃黑為主色調，搭配表情包形象，營造一種年輕活力的感覺，貼合本期斗圖的主題。
結語
“來斗”作為設計側主導的創新項目，從創意發散、提案、設計到項目落地，設計側全程跟進，收獲滿滿。作為一個創新導向的設計團隊，我們希望用更多好玩的創新點子，讓QQ聊天更加有趣。而本次項目的順利落地，讓我們堅定了創新的方向，同時對后續繼續創新充滿了期待。
在此感謝項目組成員們的辛勤工作，讓項目能夠順利落地。讓我們繼續為更好的體驗 努
騰訊ISUX北京設計中心
藍藍設計( m.wowo44.com )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務