案例分析 | 「頁面跳轉」引發的思考
編輯導語:如何做出正確的設計決策?這要求設計師站在用戶的角度,基于用戶場景和用戶需求進行抉擇,給出相對更合理的、更有效解決問題的設計方案。本篇文章里,作者結合實際案例,聊了聊他對設計決策的思考,不妨來看一下。
同一個需求,設計師可以提出各種設計方案,如何才能做好設計決策呢?
一方面要做好前期的設計研究、競品分析、數據分析等,另一方面也要基于設計經驗,從設計本身出發尋找到更加理想的設計方案。今天就結合一個案例聊聊我個人的思考。
一、案例背景
最近在產品測試時,有同事提出”查看詳情”跳轉到新的頁面,返回時不是跳回當前的列表頁碼,而是返回到列表首頁。用戶必須要再次切換到之前的瀏覽頁,才能在選擇下一條信息繼續查看詳情。使用起來非常不方便,有些“反人類”。
聽了他的說法后,我實際操作了一下,確實是存在這個問題。內心不禁感嘆“竟然漏了這個細節”,但是仔細思考了一下,總覺得這個需求有些不妥。
所以按照設計的常規流程,進行了一些競品調研和場景分析。
二、競品調研
首先查看了一些后臺管理類產品,發現大部場景“返回”都是回到列表首頁,個別是回到當前頁面的。這說明技術上不存在問題,那為什么會有不同的設計呢?
這就需要回歸用戶場景,刨根問底了。
三、場景分析
對于B端產品,用戶面對的可能是海量的數據,主流的數據呈現形式就是表格。為了提高用戶效率,搜索也就成為了標配功能。用戶可能只會有耐心看完前2頁的數據內容,如果不滿足用戶的需要,則會選擇搜索查找。
所以B端產品可以看作是“重搜索”的場景,基于這樣的分析,我們認為用戶不會不停地翻頁尋找自己的操作目標。
另外B端用戶主要目標是為了完成業務工作,如果是非職責所在,不會像C端用戶,主動去“閑逛”查看頁面內容。所以我們首先要保證用戶能夠快速定位目標數據,完成詳情查看。
而測試場景下的用戶行為和真實用戶是有區別的,兩者的操作目標也不相同。最終我們決定這個需求降級處理,暫不修改,還是將返回功能跳轉回表格首頁。后續根據用戶的實際反饋再做處理。
四、交互的深度思考
后來我又做了進一步思考,發現“返回第幾頁”只是表象問題。這個問題的本質在于用戶需要什么樣的信息,如何獲取所需的信息,信息該如何呈現給用戶。轉化為設計需求,主要是以下幾個問題:
- 詳情信息可以通過什么其他方法,更好的呈現給用戶,避免頁面刷新?
- 有沒有可能將用戶想要的信息展示在表格首頁?
- 設計側能否給出更好的解決方案,減少用戶返回,實現連續操作?
我們可以將以上問題歸集到用戶體驗五要素中去尋找答案。
1. 框架層
1)頁面跳轉的方式
通常B端產品頁面跳轉是路徑下鉆式的,也就是說表格頁面和詳情頁面是不共存的。而傳統的網頁瀏覽都是新開瀏覽器標簽頁的形式,實現內容的并行獨立展示,從而避免跳轉和返回的問題。例如電商平臺的詳情頁面展示,通過新開瀏覽器標簽的方式,允許用戶多條詳情的并行查看。
這種新開頁面的形式在管理系統中應用較少,主要用于跨產品的頁面跳轉或者訂單購買頁面。例如阿里云、騰訊云產品功能之間的相互跳轉,都是采用新開標簽頁的形式,可以保證用戶并行操作,方便信息間的對比、參考等。
▲瀏覽器標簽頁
2)系統內標簽頁
系統內標簽頁同樣是相互獨立的,互不干涉,多窗口自由切換,并且信息保留在系統內部,用戶的視覺動線相對集中,交互操作成本更低。當然標簽頁欄屬于框架層級,始終都會占據頁面位置,會進一步壓縮屏幕縱向有效空間。
▲系統內標簽頁
框架層屬于頂層設計,決定了產品的信息架構和交互邏輯,考慮的更多是一致性,需要綜合考慮確定。不能因為一個頁面的交互形式就隨意做出更改,否則會帶來較高的開發成本。
2. 結構層
結構層更多的是信息的組織形式,特別是信息量較大的表格,除了搜索功能外,還需要通過拆解、篩選、過濾、排序等功能,讓用戶可以更加方便的縮小信息范圍,結合列表的基礎信息,準確定位所需的信息,做出查看決策,從而減少錯誤判斷帶來的非必要操作。
例如電商平臺的商家后臺訂單管理中,將訂單根據不同的狀態拆分為不同的表格,并且通過關鍵字過濾、排序策略等,幫助用戶篩選出目標內容。
▲搜索篩選精準定位內容
3. 表現層
1)浮層組件
頁面來回跳轉確實會造成用戶效率下降,如果頁面內容不多,可以采用彈窗和抽屜替代。這兩種方式都是在當前頁面出現的浮層組件,可以避免返回帶來的頁面刷新問題。
▲抽屜組件避免返回操作
2)連續查看信息
對于用戶日常高頻操作信息,可以在詳情頁面增加連續操作按鈕,讓用戶不必返回即可完成信息查看。例如郵箱內容詳情頁,用戶可以通過“上一條、下一條”功能,在固定頁面逐條查看郵件,用戶效率更高。
▲郵箱上一封,下一封切換功能
五、寫在最后
以上就是關于頁面跳轉的一些個人思考??偟膩碚f,設計形式和交互邏輯可以多種多樣,但是設計必須要圍繞用戶需求和業務場景展開,只有抓住根本性問題,才能做出正確的設計決策。
#專欄作家#
子牧先生。公眾號:子牧UXD(HelloDesign),人人都是產品經理專欄作家。產品體驗設計師。8年互聯網行業經驗,擅長體驗設計思維、設計方法論、交互設計研究。
本文原創發布于人人都是產品經理,未經許可,禁止轉載。
題圖來自 Unsplash,基于CC0協議
C端
績效
結構層和框架層是不是反了?
如果沒有特殊的好處,保持一致性就是最佳選擇
設計形式和交互邏輯可以多種多樣,確實如此,都不同的