空·境——騰訊微云為空頁設計

為空頁,簡單理解就是當前頁面內容為空白,分別會在初次使用、完成或清空內容、出錯的情況下出現。本文將簡要闡述關於“騰訊微雲”6.1版本所更新的為空頁(內容為空)設計背後的故事,以及探索創新思維的過程與價值。


空·境——騰訊微云為空頁設計


空·境——騰訊微云為空頁設計


隨著騰訊微雲6.0版本全新品牌形象升級的發佈,6.1的更新將致力於提升品牌的體驗。項目成員細緻入微地考慮著如何優化整體品牌體驗的同時,也不忘將每個模塊細節都統一化、精品化。其中的為空頁面也在規劃當中。 以下將分別從 “體驗 - 創新 - 設計” 3大緯度對為空頁設計進行全面剖析。

Experience

體 驗 —— 極 簡 易 懂

為空狀態並不是時刻都存在的,並沒有多少用戶能夠看到它們。但為空頁的設計是必要的,意義在於為用戶解釋說明當前頁狀態,用戶需要第一時間知道自己現所處位置、環境、情況,再而判斷自己接下來的行為。以最基本的功能角度來分析,為空頁應告訴用戶:此頁是什麼內容?為何內容為空?怎樣獲取內容?

空·境——騰訊微云為空頁設計


空·境——騰訊微云為空頁設計


由於騰訊微雲的功能和場景都較為豐富,APP內也相對應存在著不少的空頁面。為了提升為空頁在整個APP的良好體驗,前期我們將微雲內所有為空場景重新做了蒐集整合,同時也根據場景對用戶的行為進行分析,把為空頁類型精簡為三種:1.提示性圖文+操作按鈕引導; 2.提示性圖文; 3.純說明文字。流程上希望儘可能去引導用戶快捷地完成操作,減輕用戶的認知負擔。


空·境——騰訊微云為空頁設計


文案方面也進行優化,從原來的“XXX空空如也”調整為“沒有XXX”,目的一是為了更快速直白地告知用戶此頁“無”的狀態,其二是希望能設計一系列有創意的插圖與之配合,簡潔的文案更能輔助烘托插圖的精彩。

Creativity

創 新 —— 耐 人 尋 味

要想創造出具有創新意義的為空頁設計,並不是一件容易的事情,尤其為空頁原本就是一個比較常態和無聊的環節……當然,首先分析用戶心理是關鍵。我們把用戶分為兩大類別:新用戶&老用戶。

新用戶正在探索產品,任何操作體驗都會影響他們會否想留下,或許他不清楚這裡的功能是什麼,為什麼會跳轉到這裡,該怎麼使用這裡的功能等一系列未知項;

老用戶則對於功能、內容、操作等都相對熟悉,在某種意義上為空頁對於他們來講僅僅就是一個條件反射型提示,根本不會去留意畫面內容,甚至有的老用戶幾乎不會存在有為空場景的時候。

但無論是哪種類型用戶,都一定會有同種共性——好奇心。好奇心足以牽引著一個人對所產生事物的關注程度和好感度,從而使得他由被動接受信息直接轉型為主動了解信息。


空·境——騰訊微云為空頁設計


我們以“好奇心”為出發點思考,提煉出設計關鍵詞——“耐人尋味”。也把為空頁的設計目標定位“為空彩蛋頁”。希望用戶在無趣中能夠找到一些小驚喜,會心一笑。


空·境——騰訊微云為空頁設計


根據騰訊微雲“智能融入情感”的品牌宗旨,在設計腦爆環節中我們不斷聯想生活中的事物與各為空頁出現場景的共性之處,並把它們都收集了起來(以下均為為空狀態表示)。當畫面與之文案相聯繫一起閱讀的時候,所產生的幽默感和畫面感還是十分有意思的,簡單的圖文更能加大想象空間。

創意構思&草圖

以下為創意解釋:a.文件-時間:魔術帽內的兔子(隨時備份,隨拿隨到) b.筆記:正在削鉛筆(等著你新建筆記) c.共享組:滿是笑臉的插排(隨時共享,滿心歡喜) d.新建文件夾:沒有水的泳池(此處空間沒東西) e.文件-根目錄:已漏完了的沙漏(很長時間未動過) f.分享鏈接:未摺好的紙飛機(未完成內容所以紙飛機無法成型和起飛-無法分享) g.搜索:孤獨的燈塔(附近什麼都搜不到) h.視頻:未打板的場記板(等你來開拍) i.回收站:空牛奶箱(回收箱裡沒有奶瓶) j.照片-相冊:疊成塔的照片堆(還沒整理成冊) k.地點-城市:樂高積木模擬建築(你來到了假的城市吧) l.照片-地點:在迷宮中探索(毫無地點信息) m.收藏夾:空白郵票(沒有收藏意義) n.搜索-圖片:展覽內的空畫框(沒內容展示) o.相冊-人物:稻草人(

假人-沒有人物信息) p.搜索-音樂:斷絃的吉他(沒法產生音樂) q.搜索-文檔:打印出來還是白紙的打印機(沒內容可打印) r.已下載文件:空雞蛋盒(下載-下蛋) s.文件保險箱:層層包裝的紙箱(多重保護) t.任務列表:天文望遠鏡內空空如也(沒有目標) u.相冊-智能分類:無法完成的魔方(難以識別完整樣貌) v.搜索-其他:就差一塊拼圖即可完成(結果只剩一塊明顯是對不上的)


空·境——騰訊微云為空頁設計


當然在腦爆過程中,因為持續的創意思維發散,中間也關聯出許多其他有趣的關聯物體,而最終選定的物體也是精心挑選出來的,都是相對好理解的代表物體。

Design

設 計 —— 精 益 求 精

創意過後,該如何選擇適合的設計風格去搭配才能既凸顯效果同時也不至於搶眼跳脫? 經過幾輪繪圖嘗試後,團隊果斷選擇了能代表“極客”屬性的單線極簡風格作為主視覺風格(表面工整冷淡,內心情感豐富)。以下為重新繪製的插圖樣式。


空·境——騰訊微云為空頁設計


總覽插圖,雖然畫風一致,但會發現其產生了兩種不太一樣的視覺角度(正視+平行透視)。為了加強整體畫風的統一度和滿足所有元素角度的兼容性,我們把角度統一定為“平行透視”,且僅由一特定角度作為繪圖標準,在細節的體現上更勝一籌。


空·境——騰訊微云為空頁設計


顏色搭配上,結合新品牌專屬品牌色(藍、綠、紫),將插圖中的最關鍵聯想區域加入品牌色進行點綴和視覺中心提示,弱化插圖描邊的分量感。同時為了避免枯燥,品牌色的選用也經過分析和精心搭配(並非平均分配,主要以品牌藍為主,強化品牌關聯性),希望給用戶展現最清新極致的插圖風格。


空·境——騰訊微云為空頁設計



空·境——騰訊微云為空頁設計


空·境——騰訊微云為空頁設計


空·境——騰訊微云為空頁設計


空·境——騰訊微云為空頁設計


總 結 —— 秉 持 創 新

本篇文章著重介紹設計中的創新理念,項目雖小,但創意滿滿。當然也許還會有更棒的創意點子或者視覺呈現,但根本目的還是希望設計師能夠用創新的思維去探索設計方式,時刻秉持創新的出發點,以誕生更多有趣、特別、巧妙的設計作品。創新的維度也不要僅僅侷限於視覺呈現和插畫風格,花點時間在思維上、細節上,或許會有令人意想不到的小點子或者玩法可以打破常規呢~

原文鏈接:https://mp.weixin.qq.com/s?__biz=MjM5NzQxMDkwMg%3D%3D&mid=2655404371&idx=1&sn=64c32528b278b36b0e36eca29464f52a&scene=45#wechat_redirect


分享到:


相關文章: