UI設計師和PM都應該有的思維方式
編輯導語:對于一個產(chǎn)品來說,不論是產(chǎn)品經(jīng)理還是設計師,都對產(chǎn)品有著很大的影響;產(chǎn)品經(jīng)理掌握著產(chǎn)品的各項需求,需要與設計師進行合理的溝通以及雙方的理解,才能保證產(chǎn)品的順利進行;本文作者分享了關于產(chǎn)品經(jīng)理與設計師在工作過程中的思維方式,我們一起來看一下。
今天給大家分享的案例非常給力又有趣,很可能會改變你未來UI設計過程中的思考方式。
而且,如果你常常感覺被PM或者需求方牽著走,自己總是在做執(zhí)行,那這篇文章會讓你找到突破方法。
一、案例解析
分享案例之前,我們先了解一下PM角色的職業(yè)特征,接觸的PM多了會發(fā)現(xiàn),很多PM工作中會給人一種目的性很強的感覺;比如他們在向交互傳遞需求或自己畫原型圖時,常常是A重要的就把A放到最明顯的地方,看似合理,其實很多時候交互邏輯是缺失體驗的。
當然他們形成的這種思維方式是可以理解的,PM常常被各方需求纏身,沒有時間深入考慮體驗層面。
所以PM非常需要與交互、UI配合,這樣才能更好的完成產(chǎn)品設計。
但是,很多產(chǎn)品經(jīng)理缺少與設計師建立配合的意識,而是習慣讓設計師去執(zhí)行自己的設計想法。
更可怕的是,還不能讓設計師理解他設計的目的,這就導致設計師常常被帶跑偏。
1. 開始案例分享
下圖是交互設計師按照產(chǎn)品經(jīng)理的想法設計的原型圖,此頁面是會員成長值的得分統(tǒng)計。
頁面的功能目的是引導用戶做任務,從而得到更高的分值,升到更高的會員等級。
原型圖分為三個部分,上面是五維圖(蜘蛛圖),中間是平臺的推薦任務,下面是對應五維度的五個Tab任務。
身為UI設計師拿到原型圖,你會從哪些方面著手進行設計呢?
按原型圖來設計,最終的設計稿是下圖的樣子:
1)按原型圖設計稿
頁面中五維圖與下面的五個Tab是聯(lián)動關系,用戶點擊五維圖可以控制Tab切換。
然而,現(xiàn)在中間插了一個“推薦任務”模塊,這就會給人一種割裂感。
2)設計稿問題解析
從體驗的角度來看,這樣的設計無法過關,與產(chǎn)品經(jīng)理商討調整“推薦任務”位置,他完全不同意。
他的理由是,推薦任務是系統(tǒng)匹配給用戶最適合當前完成的任務,必須放到首屏這個位置;產(chǎn)品經(jīng)理的表述 “必須放到首屏這個位置”這就是讓設計師執(zhí)行他的目的方案,而不是與設計師配合來解決這個需求。
遇到產(chǎn)品經(jīng)理這樣“有理有據(jù)”的表述,相信很多UI設計師都會妥協(xié),這時其實就被產(chǎn)品經(jīng)理帶坑里了。
產(chǎn)品經(jīng)理落實需求的思考方式往往是直接了斷的,這就很容易缺失體驗,所以,交互設計師的價值就會體現(xiàn)于此。
但無論有沒有交互設計師來梳理交互,UI設計師都需要帶著交互思維進一步去驗證設計。
回到案例,雖然產(chǎn)品經(jīng)理很強勢,但如果有問題,設計師還是應該去驗證并改正問題,以下是幾種改正方案。
方案一
方案一:雖然符合產(chǎn)品的布局邏輯,但是無法滿足產(chǎn)品需求。
因為推薦是算法得出最適合用戶的任務,不出現(xiàn)在首屏就不能及時曝光,也就會降低用戶提升成長值的速度。
方案二
方案二:產(chǎn)品布局邏輯合理,但加標簽提示,只能曝光當前Tab的推薦任務,所以同樣會降低提升速度。
方案三(定稿)
方案三:把推薦任務放到Tab中,不僅符合產(chǎn)品邏輯,也能在首屏充分曝光,能夠滿足產(chǎn)品需求。
當時把第三個方案給產(chǎn)品經(jīng)理看后,他微微一笑欣然接受,相信下次他會多聽聽設計師的想法。
總結:
優(yōu)秀的產(chǎn)品經(jīng)理善于讓設計師明白他的需求目的,或是同設計師一起去探討設計方案,而不是強勢的讓設計師去遵循他的目的方案。
而作為設計師,要善于挖掘需求目的,多思考并驗證上游的產(chǎn)出,為他人把關就是提升自己的價值。
2. 一個更有趣的案例
如果上一個案例,沒能讓你有所感悟,那讓下面這個案例來直擊你的靈魂。
先說一個事,曾經(jīng)與產(chǎn)品經(jīng)理開會過原型圖,當有人質疑為什么這個頁面不能調轉到另一個頁面時。
產(chǎn)品經(jīng)理隨口就說,“那在這個頁面加個按鈕入口就行了”,然后需求方都認同的說,“嗯,這樣邏輯上就走通了”。
這樣的思考方式,我稱之為補窟窿思維,當產(chǎn)品中出現(xiàn)一個問題時,馬上在問題的基礎上找解決辦法。
這樣往往會因為沒有做到全局思考,而影響到其他功能體驗,久而久之產(chǎn)品還會變得臃腫難用。
接下來要分享的就是一個典型案例,產(chǎn)品經(jīng)理和設計師都愛在這點上踩坑,領悟到這個案例的精髓,會讓你的思維更開闊。
下圖是線上版本的推薦醫(yī)師頁面,現(xiàn)在的需求是在此頁面增加一個用戶歷史預約入口,方便用戶找到曾經(jīng)用過的醫(yī)師。
線上頁面
增加歷史預約入口,按照產(chǎn)品經(jīng)理的想法設計,是下圖的樣子。
產(chǎn)品經(jīng)理的設計方案
UI設計師認為產(chǎn)品經(jīng)理的設計方案,不夠好看,視覺上過于突兀,還破壞了頁面結構。
UI設計師的想法是,把歷史預約入口換成圖標形式,放到頁面右上角,如下圖所示。
UI設計師的設計方案
以上兩種方案你會更傾向誰呢?
如果我選,我選擇產(chǎn)品經(jīng)理的設計方案,雖然有點突兀,但可以滿足產(chǎn)品需求,因為滿足產(chǎn)品需求才是最重要的。
UI設計師的想法也可以理解,確實使用圖標不會破壞頁面結構,美觀度也不錯,但用戶的理解成本過高,會失去功能性。
二、敲黑板!重點來了
產(chǎn)品經(jīng)理的設計方案雖然好一些,但未必是最好的設計方案。
現(xiàn)在我們拋去在當前頁面中加入口的思維方式,把此頁面當成0-1重新思考設計。
通過整合梳理會發(fā)現(xiàn),頁面中其實是兩大功能模塊即“推薦醫(yī)師”和“歷史預約”。
推薦醫(yī)師與歷史預約
所以,其實把兩個功能模塊設計成Tab切換更為合適,這樣既能突出功能滿足需求,也不會突兀,如下圖所示。
Tab切換體驗更好(定稿)
問題來了!
Tab切換是非常常見的設計形式,為什么開始產(chǎn)品經(jīng)理和UI設計師都沒想到呢?
其原因就是他們把思維局限在了頁面加入口上,沒有從整合全局功能的思考方式出發(fā)。
所以,當頁面上加功能時,一定要站在全局視角思考設計方案,而且是必須這樣思考。
#專欄作家#
吳星辰,微信公眾號:互聯(lián)網(wǎng)設計幫,人人都是產(chǎn)品經(jīng)理專欄作家。
本文原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉載。
題圖來自Unsplash,基于CC0協(xié)議
作者寫的太棒了!但是我有個疑問,第一個案例中感覺推薦和另外幾個tab 并不是同一層級的 放在一起不對吧?誰能給我解答下~~感謝哦
(1)第一次想到的解決方式不一定是最好的解決方式。(2)頁面加功能時,思維不僅要局限到打補丁入口上。從全局功能分類再整合的角度出發(fā)。
哇偶?。。。。。。?!
都是好用的干貨
寫的真好 確實是我踩過的坑
受教