用“腳”思考的設計語言
借著近期乘車碼相關業務版本迭代的成果產出,本文復盤了過程中的設計工作,將設計體驗的思考與經驗重新梳理成體系,建立可指導的規范組件庫與設計語言。
一、前言
交通部數據顯示,2017年全年完成城市客運量1272.15億人。其中,公共汽電車完成722.87億人,BRT客運量21.96億人次,軌道交通完成客運183.05億人;
“公交+地鐵”2017年月使用頻次為77億次,簡單對比一下,共享單車月使用頻率為18億次(2017年9月);滴滴打車月使用頻率為6億次(2016年Q2);
在國民日常出行中,中國的公共交通覆蓋率只占20%,而東京占到了50%多;按照當前的趨勢,公共交通潛力足夠大,到2020年預計年出行超過2285億人次。
行業數據結合市場趨勢去看,一方面城市公共出行領域,是為數不多尚未打通移動支付的高頻場景,現金與物理卡片依舊是出行的主流支付方式,市場痛點與用戶需求日益強烈;另一方面是傳統公交地鐵等企業隨著互聯網新興出行方式的涌現,面臨著轉型壓力;這些因素都為乘車碼產品入市提供了契機。
從我們自身的專業角度去考慮,人的因素在其中發揮著極其重要的作用,如何提升個體用戶的體驗愉悅度,讓用戶數據與行為成為產業升級的助推力,是設計參與的價值體現。
二、尋求定位
乘車碼版本迭代優化,具體落在了產品功能迭代以及設計體驗優化上,當功能需求逐漸被梳理成案,設計則需要找到相匹配的設計定位。
設計定位的內核不應該是充斥于市面的極簡、年輕、商務、品質等形容詞。只因在持續翻滾迭代的互聯網產品中,這些對于設計宣講的形容詞被反復提及,從標新立異到隨波逐流,大概已模糊了其獨特代表性與用戶記憶點。
在我們理解中它更應該是一個:從產品受眾的體驗場景中,不斷聚焦用戶訴求并提煉出來的關鍵名詞,支撐整個項目的產品設計體系,以此指導后續的風格與樣式的設計原則。
本文題目之所以稱為“用腳思考”,是因為出行業務真正的痛點,不會發生在辦公室這樣的單一場景,而是在真實的線下場景中,不同角色立場的訴求在不同場景下都各有不同;設計師在辦公室絞盡腦汁也未必能得到預期的結果,產業互聯網的方向驅動為我們提供了解決問題的思路方向與試驗機會。
設計團隊得以邁開腳走出辦公室,從G端政府機關部門、到B端交通企業主的各類研討會,再到實際C端用戶的使用場景,設計與產品、用研以及研發同學一起深入到各種線下場景,希望通過對toG/B/C不同角色立場不同訴求的深化考量,能夠在設計體驗上找到突破點。
從消費互聯網到產業互聯網的轉變,互聯網已不再是一個行業,而是成為各行各業的連接器、加速器、助推器,產業升級為企業以及用戶提供了更多的線上線下體驗融合空間。
B端重視的商業價值與G端強調的社會價值有太多值得深挖與思考的地方:乘車碼工具屬性背后的數據支撐能力,可以為B端產業轉型升級提供管理決策依據,同樣也可以助力G端政府科學治堵,優化城市公共交通體系建設。
這其中的關鍵點在于真實有效的用戶數據,這也是設計能真正觸達到的場景,服務好用戶,以良好的體驗設計讓更多用戶行為數據產生應有的價值。
在調研中發現,線下C端的主觀訴求與客觀環境在某種程度上出現兩極分化:一是明確且集中的用戶需求,另一方面是在行走中注意力易分散的不穩定客觀環境。能否通過設計參與來優化基礎體驗,幫助用戶快速獲取正確信息,安全執行有效操作最終達成其目標,這是我們需要設計思考的地方。
經過反復梳理篩選與對比排除,我們確定了其中設計定位的核心關鍵詞:效率。
三、分析驗證
從調研的用戶畫像中來看,在出行場景下單人出行(87%)居多,女性(55%)略高于男性,年齡多集中在中青一代「18-26(38%)、27-35(47%)、36-40(15%)」;這樣的用戶群體,在行程中特別是在車廂的封閉環境內,有太多的娛樂方式或移動產品可填充個人的手機使用時間,因此我們擺正了交通工具屬性的立場,協助用戶在短時間內高效達成目標。
從需求上看,用戶主要集中在找車與坐車。坐車已經通過二維碼解決零錢與實體卡的不足,而找車就是在各種繁雜的信息堆中,找到可支撐行程決策的正確信息。
從用戶心理來看,雖然產品側想要提供給用戶的功能是越多越好,但隨之而來的信息也將越來越多;用戶對于界面的注意力始終只有那么一丁點,因此設計體驗更應該關注能否掌控用戶的注意力,提升信息獲取與完成目標流程的效率。
反推到B/G端角色,“效率”的核心目標同樣有效。相比C端用戶,B/G端面對的是更加龐大且復雜的信息,通過數據分析整合,提升管理決策與資源調度的效率,同樣能為其帶來價值。
四、解決思路
設計來源于生活,線上體驗與線下行為有著許多相似的地方。在社會發展歷程中,針對某些日常行為中存在的體驗問題,線下場景已提供了不錯的解決思路。
對信息閱讀效率有極高要求的場景,一般是需要在時間限制下快速達成需求的場所,期間還伴隨著焦慮的用戶情緒,現實中以車站、醫院為明顯例子。
紐約地鐵從1906年開通,三個路線由不同公司負責,因此路線指標等導視系統的設計完全不一樣,各類手寫而成的字體、大小不一的字母以及隨意掛在空中的指示牌,這常常為乘客和觀光客們帶來很多困擾,難以辨認這些視覺代表的意思而導致迷失方向。
設計公司Unimark在1966年的紐約地鐵導視系統設計改造中,通過替換大小不一的手寫字體,在白色背景板上選擇Standard Medium字體,并統一使用規則,通過“白紙黑字”提升字體識別度;指示牌原本混亂無規則地放置在頭頂的狀況也得到了改善,他們將標識模塊化處理后固定在長條鐵架上,規整位置的同時讓標識在不同場合的需求下可以有所替換。
從紐約地鐵導視設計中看體驗設計完整性,同樣的思路沿用至今,世界各地的地鐵、機場等交通樞紐的導視系統設計也大多建立在此基礎上。
當下“極簡設計”的概念被互聯網應用得太寬泛,在市面上同質化嚴重的產品中反而失去了設計指導意義,而且極簡的設計和粗陋原始的設計,兩者之間往往只有一線之隔。
少點套路多些真誠是這個時代的精神追求。
在一些醫療機構中可以看到,院內的導視系統基本都遵循簡單直觀的設計表達,不會有過多的視覺噪音來干擾用戶的注意力,但是依然可以在版式層次與視覺細節上看到設計的思考。通過清晰可見的目標指引,結合實時信息的同步反饋,讓用戶行為更加直觀也更具有目的性。
五、原則雛形
前期調研分析后,我們確定了設計定位的關鍵內核:效率。同時從線下場景的解決思路,結合我們的設計目標,逐步梳理出指導工作的設計語言雛形【Smart Metro】。我們希望它并非高深的理論知識點,更應該是易于理解并能落地執行的設計指導,協助設計師在具體設計工作中,串聯業務形成產品矩陣的設計品牌感。
模塊化
隨著更多城市不斷接入乘車碼相關業務,通過功能模塊化拆裝后的組件庫,便于產品研發快速響應不同地區B端業主的定制化需求。
從設計執行的角度來看,模塊化的設計布局便于內容的組織和管理,需要設計師有意識地去控制內容之間的視覺關系,讓頁面內容更具邏輯性;通過洞察用戶閱讀與操作習慣,將符合用戶預期的信息內容模塊化,幫助用戶在腦中建立頁面框架模型,提升產品使用的閱讀效率。
【例】將相似內容整合,通過有規律的版式結構進行模塊化分區
信息聚焦
信息聚焦是為了提升用戶在產品使用中信息獲取的效率,通過精簡信息量、降低閱讀成本來達成這一目標。
信息量與理解成本在數軸模型中呈拋物線走勢,因此在表達核心信息無歧義、閱讀語序通順的前提下,我們盡可能精簡文案描述的信息量。
在具體設計中,我們通過不同信息的排序組合、適當應用體量對比的版式設計處理,增強信息模塊與個體的版式節奏感,強化視覺信息在眼睛停留的立體感,以此提升大腦信息模型處理效率,降低用戶閱讀成本。
【例】相同的內容表達,通過精簡與強對比的排版調整,提升閱讀效率
設計降噪
作為交通出行工具,雖然用戶也很享受產品提供的附加價值,但使用非娛樂性產品的初衷是快速達到目的,產品無論在靜態或動態場景中,提供觀賞性和趣味性并非首要目標;
用戶要快速集中注意力執行關鍵性的任務,則設計中不應有過多的視覺干擾;但同時考慮到兼顧產品側的運營與視覺要求,所以在實際的設計工作中,我們認為“設計降噪”比“極簡設計”更易于落地執行。
【例】乘車碼首頁刷新二維碼操作。通過3種表現形式(圖標+描述文字+可點文字鏈),去支撐1個功能邏輯(點擊刷新),通過簡化樣式達到設計降噪,而不影響實際操作
導向清晰
現實中當某件事情需要一定的時間周期去完成,其間經常會因為各種因素而中斷操作,除了一些客觀原因,也有因體驗挫敗感而導致的主觀情緒在干擾;
用戶從找車到坐車,不同交通方式的流程長短不一,需要在關鍵環節不斷強化目標指引,而每個目標在頁面中都應該是一個簡單的句子來表達,幫助用戶建立自信心完成體驗流程。
【例】網約巴士整體拼車流程較長,根據不同狀態,在頁面中展示明顯的信息指引
六、后續可期
經過初步整理,Smart Metro設計語言在乘車碼、騰訊出行、網約巴士、乘機碼、城市大腦等不同業務場景得以落地應用,設計伴隨業務共同成長,后面我們組內的同學也會陸續整理相關業務的設計工作總結,通過文字的形式記錄下來,借著這種形式去復盤項目并沉淀知識,梳理我們在交通出行領域的設計成果與思考。
而聚焦到具體的產品業務與體驗設計場景,我們希望伴隨業務成長的過程中,能夠不斷完善與修正設計語言的核心。
后續請期待更多的分享。
參考鏈接
經典識別設計系統標準手冊-紐約地鐵 http://circlezine.com/2016/04/18/cisdesign/
導視系統的通用設計原則 https://zhuanlan.zhihu.com/p/46389439
作者:davidbai,公眾號:騰訊FiTdesign(ID:FiTdesign2017)
本文來源于人人都是產品經理合作媒體@騰訊FITdesign,作者@騰訊FiTdesign
題圖來自Unsplash,基于CC0協議
- 目前還沒評論,等你發揮!