案例分析:表單錄入頁面過長,我們該如何優化?

本文以線上貨運app為例,發現這款app在發佈貨源頁面存在表單內容錄入過多,貨主可能沒有耐心全部填完等問題,於是開始對其進行簡化優化,並和我們分享了其中的要點。

案例分析:表单录入页面过长,我们该如何优化?

因為ruby姐從事的是線上貨運行業,一個貨源的產生的最源頭其實是我們的貨主爸爸,他是站在我們服務的食物鏈的頂端,沒有他發佈的貨源,平臺上就沒有吸引司機的目標物,就無法形成一個需求的閉環。所以當貨主在一些關鍵流程中有使用不爽的地方,那分分鐘可能就想“踢館”,也會對我們的業務以及獎金產生致命的影響(嚴肅臉)。

今天我們要研究的一個案例就是貨主在使用app進行貨源發佈的使用場景,發貨爽不爽也真的很重要哦,它就是金爸爸對我們平臺的第一印象,咱也千萬別掉鏈子嘞

0、背景概述

線上貨運的一個基本流程是:

  1. 貨主在線上發佈貨源;
  2. 司機看到合適貨源,與貨源溝通並承運;
  3. 貨主跟蹤運輸,司機按貨主要求承運後上傳相應的憑據提交平臺結算
  4. 貨主及平臺審核後打款;
  5. 運輸完成。

好了,不廢話,直接上一個ruby姐在競調發現的同行案例~

案例分析:表单录入页面过长,我们该如何优化?

就問你怕不怕(仰天長笑三聲)~好了,言歸正傳,下面我們來一步步分析這個頁面是否還有的救。

一、分析整理

目前ruby姐發現這個發佈貨源頁面的問題如下:

內容錄入過多,貨主可能沒有耐心全部填完(就問你有沒有被嚇跑吧)~

所以我們的目標是需要對已有的發佈流程進行流程的簡化、交互的優化和引導。

二、流程/交互優化

1. 內容錄入過多,進行步驟拆分

從現有的頁面來看,貨主點擊發貨後給貨主羅列了所有發貨目前需要的字段信息,沒有對發貨的信息進一步的梳理。對平臺發貨規則不清楚的新生貨主可能看到這個頁面就被嚇跑了(內心os:我選擇不發貨還不行麼,求放過啊o(╥﹏╥)o)

對於這種頁面佈局較長的頁面,

需要信息的優先級展示並且分步驟的引導用戶完成發貨的操作

我們來分析一下:發一個貨,首先最重要額基礎信息就是:

  1. 這個貨需要運往哪裡,需要什麼樣的車來運輸;
  2. 貨物什麼時候運輸到,以及這個貨運輸我能給到多少錢;
  3. 貨物其它相關信息(是否需要購買保險、押回單、油氣等)

分析後我們發現如果能夠將發貨進行信息層級分佈,引導用戶進行一步步的設置,並對交互進行優化後,發貨這個動作對於貨主也會更加友好哦

好了,坐穩了,我們開始拿起手中的工具來做一番改造吧(捂臉)

案例分析:表单录入页面过长,我们该如何优化?
案例分析:表单录入页面过长,我们该如何优化?

三、優化後的方案呈現

先上一個動圖吧~大家一起動起來(gif源文件太大壓縮後勉強看一下叭)

案例分析:表单录入页面过长,我们该如何优化?

提煉發貨的重要信息,引導貨主去先行錄入貨源基礎信息,隱藏部分關聯信息、讓信息更加聚焦。

案例分析:表单录入页面过长,我们该如何优化?

下面讓我們一步步分解吧~

1. 信息層級梳理

信息表單的呈現也分為信息的分層與信息的關聯度,在信息框架搭建中要有一條清晰的主線,我們呈現信息的邏輯是什麼以及我們的設計目的? 而不是一股腦把眾多的信息放在用戶面前讓他們自己去做選擇(不要給用戶選擇題,特別是我們的貨主爸爸)。

案例分析:表单录入页面过长,我们该如何优化?

2. 控件的優化

在表單的設計中,有一個不容忽視的就是我們的控件(劃重點),一個好的控件設計不僅僅能引導用戶錄入信息,也在一定程度在保持信息的簡潔。

案例分析:表单录入页面过长,我们该如何优化?

3. 信息的聯動設計

信息與信息也有聯動關係,即A的信息觸發聯動B的信息展示,這樣設計的好處讓用戶視覺和動作上更加集中,不過多的去幹擾到用戶,在一定程度上也減少了信息的冗餘性

案例分析:表单录入页面过长,我们该如何优化?

四、總結

1. 幫用戶記憶,減少用戶的輸入

就像我們常去一家餐館吃飯,當年坐下來的時候,老闆可能就已經知道你想吃什麼,自動就會給你使一個顏色把你愛吃的常備的菜給你端上來一樣。

我們在做產品設計時,也要考慮到哪些信息用戶更改的頻次較少,也可以在本地存儲,減少用戶的操作。

2. 信息有層級,有重點

同樣以吃飯為例,我們要知道我們最想讓用戶買單的菜品是什麼,其它小菜附加值較低的甜品可以在最後再擺上。你距離米其林大廚只差一步擺盤,同樣一道菜怎樣才吸引受眾值得我們深思。

3. 設計產品的同理心

當你都拒絕和延誤一個東西的時候,怎麼去推銷並吆喝讓你的受眾買單呢。

最後的最後,ruby姐碼字真的不容易(尊重每一個碼字的作者,真心的),給個讚唄

本文由 @ruby的筆記 原創發佈於人人都是產品經理,未經作者許可,禁止轉載。

題圖來自Unsplash,基於CC0協議。


分享到:


相關文章: