Skip to main content
Skip table of contents

短導航

概述

金嗓子有句經典廣告詞:沒聲音再好的戲也出不來。同樣對於IT產品,如果找不到功能在哪裡,再精美的設計也只會折戟於迷宮般的入口前。有一部美劇《硅谷》,講一堆技術宅做的產品,在做用戶測試的時候,找工程師,極客做試用,給出的反饋是很好。然而實際給普通無技術背景用戶使用的時候,大家對界面上的專業術語,操作紛紛表示一臉懵逼。

往往設計功能的時候,都是出於解決一個具體問題,但是當功能多到一定程度,就像房間東西太多不知道如何整理。功能本身的崩壞往往不取決於本身的操作邏輯不佳,而是用戶根本就找不到這貨在哪,信息爆炸的時代,人的注意力都極端稀缺,時間也少,第一時間不能通過直覺找到,大多數就會選擇放棄,很少有會願意思考,看介紹,說明書。

本文介紹基於直覺的設計理念,縮短路徑,提升識別度,持續改進,四個方面來分享改進改進導航的經驗~

基於直覺的設計

在iPhone被髮明之前,智能手機只是少數技術極客手上的玩具。喬布斯,趁著移動互聯網浪潮,把他的藝術和科技交匯的直覺設計帶到了普羅大眾的面前。如何評價個人數碼消費品的友好度,不需要達人的評測,複雜的數據指標。拿給沒有IT基礎的老人孩子操作,如果能用得起來,那就是好設計。

好的設計,不是技術,功能的堆砌,是恰到好處。

如何剋制炫技的慾望,把用戶最需要的功能,以樸實無華的方式呈現出來,知易行難,下面分享一點經驗。

四原則

好的系統界面,如同錯落有致的工匠工具牆,擺放整齊的圖書館,琳琅滿目的大型超市貨架,閱兵時整齊劃一的步伐,即使你不是真正的用戶,看著也覺得很舒服。

《寫給大家看的設計書》一書中提到過的四原則,對比,重複,對齊,親密性,儘管對於設計得通用型建議,但對於做系統級導航來說,也是很好的指導原則。

重複:絕大多數目前的開發框架天然都會幫你做好這兩件事。對齊需要體力,觀察力,而重複,則需要事先有嚴格統一風格的工業設計,這並非一朝一夕能做好,但一旦做好,就能形成很好的品牌語言,做好的一眼能看出,做的更好則能形成品牌溢價,比如蘋果,阿里巴巴,騰訊,微軟,谷歌,各種大公司,反正顏色一出來,就讓你自動產生聯想。

對齊:excel 有劃線的格子對齊,生活中無處不在各種信息對齊,左右上下居中,為的就是讓你一眼看過去能夠快速找到重點。

對比:疫情隔離期間的上海人,最想聽到的聲音,估計就是羅森,全家進門歡迎鈴聲,讓人有種賓至如歸的儀式感。系統的界面在跳轉的時候,為讓用戶有明確感知發生了變化,最好周邊元素也同時有明顯區別,即使是同一家公司出的產品,需要保持的是 UI 一致,但配色方面一定要有區隔。比如經典 微軟 Office 系列,雖然整體框架用的控件長得很像,但是進入每一款產品都會讓你清晰感覺到進入了另一種功能視圖。

親密性:把相似的事務擺放在一起,定義是什麼,然而合併同類項,提供服務方做好歸類,使用的人就可以節省時間。有些事情是非黑即白的,比如男人,女人。但有些事情就是有重疊的,比如職能與項目,產品與服務等

優化路徑

不同用戶對系統的側重方向不同,舉操作系統的例子,MacOS,Windows,Linux,分別對應藝術創意設計,普通用戶,技術極客用戶。Mac軟硬一體簡單優雅,Windows功能適配多,兼容性好,linux功能性能強大,入門門檻高。

專業軟件依賴於良好的付費習慣,自由市場,生態的長期發展,在中國缺少相應的客觀環境和條件,所以經常會出現把外國軟件封裝一個前端或拿掉Logo,當做國產軟件使用的狀況。這並非好的商業模式,只能說是不得已而為之。

做優化,也要深入分析用戶的實際需求,不能照搬原有系統的術語。需要通過用戶訪談,問卷等調研方式從用戶中找出需要的功能,日常操作路徑,喜歡的配色等等

配色:通過配色,凸顯功能差異,彰顯公司品牌,比如搞個員工論壇,知識分享區,那就可以稍微花哨一點,搞點科技,娛樂風格圖片;比如申請報銷,賬號申請等常規操作,就儘量簡潔樸素。各類按鈕儘量搭配公司主要品牌或產品的配色,一方面是內部廣告,另一方面增強員工的企業文化認同感。

導航菜單:常用功能掛出來,一層不夠就兩層,三層或更多,奇怪路徑搜索找。

落地頁:第一落地頁,最好是重要指標集成,常用鏈接,待辦事件跳轉,根據不同角色劃分不同側重項,比如員工側重待辦,便於操作;經理側重過程管理,多顯示團隊績效,高層側重經營指標統計,便於把握戰略方向。

提升識別度


做好路徑結構,如同房子做好硬裝,鋪好水電,接下去就是考慮軟裝改善外觀了。

比如

  • 在常用的菜單前增加表意的圖標,比如配置為🔧,信息搜索🔍;

  • 在可能會產生疑問的地方貼參考鏈接/操作說明,或增加鼠標懸停提示。

  • 相同內容統一字體,降低對比度

  • 長時間懸停彈出客服聯繫方式

  • 使用醒目顏色,提示用戶當前狀態,如處理中黃色,已完成綠色。

  • 在時間等待較長頁面加一些過場動畫避免焦慮感,比如沙漏。

持續改進


沒有什麼天生神力,所有完美的優化都是負重前行。

我們所看到的所有系統,都是在收集我們數據後,持續改進的產物,不管是做數據採集的專業公司,還是自己的研發團隊,對操作的重要環節進行數據採樣,並且進行事後分析,是持續改進的重要依據。從經驗來看,即使當面交流獲取到的用戶需求,實際做出來後效果也不一定好,因為中間有很多不確定因素,比如用戶的口是心非,網絡故障,安全問題,訪談用戶樣本不夠,訪談人群分類不對,流程設計錯誤等等。比較受關注的數據有

  • 功能打開次數

  • 頁面停留時長

  • 菜單點擊率

  • 系統崩潰次數

  • 用戶轉化率

優化是推崇的,但內卷是不必的,任何的優化都有拐點,拐點前的投入產出比為正,超出後即為負,近年大家吐槽 微信,facebook 越來越重,不好用就是如此。在互聯網後期,很多人還在指望做網頁系統優化來達到財富暴增,進而工作就轉化為內卷,比如一個按鈕和菜單擺放出幾十個PPT方案。希望以後這樣的現象可以得到緩解。

還有種例外是習慣的力量,比如鍵盤的排列,雖然不是最佳模式,但因為大家已經養成了習慣,各種嘗試更改都是費力不討好。此時形式主義花時間做鍵盤優化就是內卷。

JavaScript errors detected

Please note, these errors can depend on your browser setup.

If this problem persists, please contact our support.