導(dǎo)語：“自選”作為金融類產(chǎn)品的基礎(chǔ)功能，迭代至今已經(jīng)非常成熟了。放眼望去，市面上主流金融產(chǎn)品的自選功能似乎都大同小異，但是體驗(yàn)下來會發(fā)現(xiàn)，細(xì)分領(lǐng)域下的設(shè)計(jì)側(cè)重點(diǎn)卻有所不同。

一、把握需求

如果我們將“自選”轉(zhuǎn)化為熟悉的C端功能，它類似于“收藏夾”、“關(guān)注列表”的概念，是用戶管理交易對象的重要陣地。除了常見的管理對象（交易概念中稱作“標(biāo)的”）、管理分組外，“自選”還會存在對數(shù)據(jù)和使用習(xí)慣的管理需求。

• 站在業(yè)務(wù)視角：券商的核心優(yōu)勢在于“交易”，所以業(yè)務(wù)目標(biāo)自然為“交易”服務(wù)?！白赃x”相當(dāng)于一張快捷交易導(dǎo)航，我們提供的諸多功能都是在幫助用戶快速、便捷的調(diào)整這張表，直到它達(dá)到“為我所用”的程度。
• 站在用戶視角：不同交易習(xí)慣的用戶，對自選的操作頻率有高有低，在保證效率的同時(shí)，還需要讓每一類用戶都能用的順手。

二、競品調(diào)研

1. A梯隊(duì)：美港股券商，富途、長橋

• 共同的設(shè)計(jì)側(cè)重點(diǎn)：功能的組織符合用戶心理模型，任務(wù)專一，功能精煉，不追求全面、追求使用效率。
• 共同的弊端：“管理分組”的交互設(shè)計(jì)不夠流暢。

富途“管理分組”采用的交互方案，初期學(xué)習(xí)成本是很高的，它雖然充分考慮了效率問題，卻低估了用戶理解上的困難。（截止本文發(fā)布前，富途最新版對現(xiàn)方案做了視覺樣式上的更新，看來設(shè)計(jì)師也意識到了該方案目前存在著一些不夠清晰的地方，期待后續(xù)交互上的迭代。）

長橋將分組的“新建、排序、刪除、重命名”拆的很散，理解上不困難，操作起來較為繁瑣。

2. B梯隊(duì)：平臺類產(chǎn)品，騰訊自選、東方財(cái)富

• 共同的設(shè)計(jì)側(cè)重點(diǎn)：相關(guān)功能盡可能的聚合在一起
• 共同的弊端：當(dāng)用戶目前僅想完成一項(xiàng)任務(wù)時(shí)，產(chǎn)品每次都會同時(shí)提供多項(xiàng)任務(wù)，操作通常很難專注。用戶不可避免的會多花些時(shí)間和好奇，來理解與本次操作任務(wù)無關(guān)的信息

3. C梯隊(duì)：社區(qū)類產(chǎn)品，雪球

設(shè)計(jì)側(cè)重點(diǎn)：管理標(biāo)的、分組與數(shù)據(jù)、使用習(xí)慣的設(shè)置完全分開

一些細(xì)節(jié)問題：比如“管理本頁股票”，在批量操作的場景下，底部欄卻存在不能批量操作的選項(xiàng)

小結(jié)：對三類產(chǎn)品的競品調(diào)研也驗(yàn)證了我們最初對需求目標(biāo)的把握，為券商類產(chǎn)品設(shè)計(jì)“自選功能”，效率和流暢度是最關(guān)鍵的。設(shè)計(jì)目標(biāo)明確了，接下來我們看看目前都存在哪些問題，以及對應(yīng)的解法。

三、問題與解法

1. 當(dāng)用戶精準(zhǔn)搜索一個(gè)標(biāo)的，并將其添加至自選后，并不能在當(dāng)前完成該標(biāo)的的分組

如圖所示，現(xiàn)在如果想完成上述任務(wù)，需要4步、且每次僅能將標(biāo)的添加至1個(gè)組。優(yōu)化后我們可以通過3步完成，且每次可以將標(biāo)的同時(shí)添加至多個(gè)組。

（注：Snackbar雖然源于安卓原生的MD設(shè)計(jì)系統(tǒng)，在IOS并無此原生控件。但是隨著二者在設(shè)計(jì)上日漸趨同，且控件的應(yīng)用上也早已互通有無，所以Snackbar在IOS的使用，合理即可，不必糾結(jié)于平臺差異。）

交互關(guān)鍵點(diǎn)：

• 想提升操作效率，不僅局限于步數(shù)、路徑的縮短，它還可能是場景的正確連結(jié)、重復(fù)操作的合并；
• 使用Snackbar，本質(zhì)上是給用戶選擇的余地。在操作a完成后的2-3秒決定是繼續(xù)進(jìn)行操作b，還是離開當(dāng)前場景。

2. A功能和B功能在自選場景分別有兩條觸達(dá)路徑，不過多路徑的存在不但沒有提升功能的使用體驗(yàn)，反而帶來了不小的認(rèn)知負(fù)擔(dān)

關(guān)于“冗余路徑”應(yīng)該保留還是去除，一直以來都存在爭議。討論這個(gè)爭議的前提是：冗余路徑雖然不是最優(yōu)路徑，但是滿足了特定場景下用戶的特定操作習(xí)慣。

當(dāng)“冗余”只是冗余、沒有任何增益時(shí)，也要敢于做減法；因?yàn)橥瑫r(shí)還需要考慮一點(diǎn)：出發(fā)前的選擇越多，用戶的決策時(shí)間越長。

交互關(guān)鍵點(diǎn)：

在業(yè)務(wù)方提出為同一個(gè)功能再添加一條新的路徑時(shí)，我們必須要弄清楚，這條新路徑是為解決什么問題存在的。不解決問題的需求，大部分是對產(chǎn)品的無效堆砌。做好產(chǎn)品的“守門員”，給出專業(yè)的判斷，是交互設(shè)計(jì)師的重要職責(zé)之一。

3. 關(guān)于“自選”的設(shè)置功能，這里會討論到幾個(gè)典型的“欲速則不達(dá)”的交互問題

1）對功能的整理和歸類，是我們?yōu)橛脩袅粝碌氖褂镁€索。如果推理時(shí)間過長，說明線索的指向性出了問題。

• 問題：將“管理分組”歸至“設(shè)置”，分類不清晰；“數(shù)據(jù)項(xiàng)”Tab中的設(shè)置項(xiàng)沒有根據(jù)相關(guān)性進(jìn)行分組；
• 解法：在“設(shè)置”中去掉“分組” ；數(shù)據(jù)設(shè)置項(xiàng)根據(jù)相關(guān)性進(jìn)行分組 （指標(biāo)→顯示→排序）。

2）如果層級 1 包含層級 1.x，那么層級 1.x 的操作不應(yīng)放置在層級 1 的認(rèn)知區(qū)域。

• 問題：數(shù)據(jù)項(xiàng)Tab的“默認(rèn)數(shù)據(jù)”放在頂部導(dǎo)航欄，功能層級不匹配；
• 解法：功能層級調(diào)整至匹配。

3）如果用戶設(shè)置了一些項(xiàng)目，無法在預(yù)期場景看到對應(yīng)的效果，應(yīng)提前給與說明。

• 問題：完成數(shù)據(jù)項(xiàng)設(shè)置后，無法在豎屏看到全部生成效果；
• 解法：在數(shù)據(jù)項(xiàng)設(shè)置頁頂部進(jìn)行生成效果的說明提示。

交互關(guān)鍵點(diǎn)：

注重“效率”是沒錯(cuò)的，比如上述case中看似有“效率”的Tab結(jié)構(gòu)。但是這里面隱藏著更多的“清晰”問題。如果一個(gè)功能設(shè)計(jì)的讓用戶用不明白，也就談不上“效率”的提升。

4. 最后一個(gè)case我們看下互聯(lián)網(wǎng)產(chǎn)品中最常被忽視的細(xì)節(jié)-文案

場景1：批量管理標(biāo)的。

文案問題：按鈕表意都是“刪除”，帶來的實(shí)際結(jié)果是不同的，存在歧義。

場景2：數(shù)據(jù)項(xiàng)設(shè)置。

文案問題：沒有進(jìn)行規(guī)范化處理，增加了選項(xiàng)的理解難度。

交互關(guān)鍵點(diǎn)：

很多時(shí)候，一套語義清晰、邏輯順滑的文案，可以等價(jià)于某個(gè)功能優(yōu)化的迭代周期。實(shí)際功能點(diǎn)不變，只是替換文案，就能讓用戶用的清爽明白。這樣的“好買賣”，卻一直被嚴(yán)重低估。

四、總結(jié)思考

遇到同質(zhì)化較高的需求重構(gòu)時(shí)，初期應(yīng)扔掉“套路”思維，從用戶視角、業(yè)務(wù)視角推導(dǎo)出主要設(shè)計(jì)思路。帶著問題去分析競品，推敲競品在此類需求設(shè)計(jì)上的精細(xì)差異。不要對行業(yè)top給出的方案習(xí)慣性盲從，要經(jīng)過思考和反復(fù)論證，推導(dǎo)出最適合自己所負(fù)責(zé)產(chǎn)品的交互方案。

當(dāng)設(shè)計(jì)深入到細(xì)節(jié)，出現(xiàn)了可A可B的選擇時(shí)，回頭看看我們經(jīng)過深思熟慮推導(dǎo)出來的設(shè)計(jì)目標(biāo)。重新評估A/B方案是否符合目標(biāo)、是否有助益于實(shí)現(xiàn)目標(biāo)。沒有太多“怎么設(shè)計(jì)都可以”的方案，從我們的選擇中，也透露了決策的傾向。只是我們需要時(shí)刻確認(rèn)這種“傾向”在整體邏輯中是自洽的。

每一份交互輸出都應(yīng)該是有觀點(diǎn)的輸出，即使最終我們的觀點(diǎn)被業(yè)務(wù)方、協(xié)作方的諸多因素所淹沒，仍要保持、增進(jìn)自己提出觀點(diǎn)的能力。那些常被用戶生動提起的、打造出特色和性格的產(chǎn)品，都是由一個(gè)個(gè)鮮明觀點(diǎn)鑄造而成的。




藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請掃碼藍(lán)小助，報(bào)下信息，藍(lán)小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系。

文章來源：人人都是產(chǎn)品經(jīng)理  作者：cony的小書包

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)( bouu.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)