用Keep的案例，讓你輕松理解交互設(shè)計師的職責(zé)

偶然候咱們會碰到如許一個事情，一個功能或者內(nèi)容，到底是 UX 做，照舊 UI 做？

假如是在小公司就沒有如許的顧慮，可能一小我必要同時擔(dān)任 UX 和 UI 兩種職責(zé)，只要是 APP 相干事宜，找到某位設(shè)計師就行了。但在大廠，由于職責(zé)分得比較細，而設(shè)計又是一項知識交叉比較多的營業(yè)，于是邊界也就不那么清楚，必要去判斷，到底一項活應(yīng)該由交互去做呢照舊由 UI 去做。

分清楚這件事的目的并不是為了推卸責(zé)任不去干活，而是為了明確事情比較適合哪個崗位的設(shè)計師去做，以達到時間和資源行使率上的最大化，用最少的人力去達到最大的結(jié)果。

以下是閣主所羅列的交互設(shè)計師的職責(zé)，如下圖。

今天咱們就用 keep 的小我頁面來說說，哪些事情是 UX設(shè)計師應(yīng)該做，哪些是 UI設(shè)計師應(yīng)該做的事，哪一項是兩者必要共同配合，一同完成的。請先查看 keep 的小我頁面，如下圖。

一、需求角度

首先拿到 PM 給過來的需求之后，UX 會開始從需求的角度分析題目，需求分為商業(yè)需求和用戶需求。

商業(yè)需求 PM 會比閣主講的更專業(yè)，在這里閣主只做初略詮釋，即產(chǎn)品的目的是直接想達到讓用戶進行購買的舉動，或者說收集用戶的數(shù)據(jù)進行間接紅利，普通地說就是產(chǎn)品是怎樣贏利的。用戶的需求，即用戶為什么要使用該產(chǎn)品，使用該產(chǎn)品可以幫助用戶解決他的哪些題目，為他帶去哪些益處，為了達到這個目的，用戶樂意支出哪些成本。

再回到這個案例中，keep 的產(chǎn)品定位為，為用戶提供優(yōu)質(zhì)的健身視頻教程，并形成響應(yīng)的社交圈子，讓用戶形成風(fēng)俗之后靠電商去進行紅利。典型的從一個工具，到社交，再到電商的營銷模式。它能幫助減肥，保持健康與好的體態(tài)，用戶為了達到目的，可以長時間沉浸在 APP 中。而好的體態(tài)原本就有利于社交，于是形成一個良性循環(huán)，健身-社交-更多社交-營銷。

在這種情況下，UX 要做的事情是什么呢？一方面進步用戶在使用健身視頻中的愉悅感，另一方面將用戶往社交的方向指導(dǎo)。所有的出發(fā)點都是朝著這兩點進行前進。

二、設(shè)計角度

原則確定之后，再來看看對于小我頁面，UX 必要做什么。流程是指，用戶在 APP 中的主流程，對應(yīng)到 keep 中，則是打開 APP——選擇訓(xùn)練內(nèi)容——跟著視頻做訓(xùn)練——結(jié)束訓(xùn)練——分享訓(xùn)練的如許這個路徑。信息架構(gòu)是指 APP 的樹形結(jié)構(gòu)，即它是由哪幾個 tab 組成，每個 tab 的內(nèi)容是什么，大體如下圖。

而剩下的內(nèi)容則都屬于單個頁面信息，包括頁面的布局，是像如今頁面分為兩大塊，上面一大塊是關(guān)于小我社交相干信息，包括頭像昵稱、粉絲數(shù)、關(guān)注數(shù)、動態(tài)數(shù)，而下面一大塊則是關(guān)于用戶小我的產(chǎn)出數(shù)據(jù)，又分為主頁和相冊兩個 tab 進行內(nèi)容分區(qū)。在此案例中，布局中也包含了導(dǎo)航。

而信息的來源、屬性、優(yōu)先級、字段、關(guān)系，又代表著什么呢？打比方說，在圖中有個顯明的字體，KG.6，是指用戶的等級，由 keep 平臺制訂規(guī)則，用戶達到響應(yīng)的要求之后，等級數(shù)就會呈現(xiàn)。

那么這個「KG.6」的描述就是字段，由英文和阿拉伯?dāng)?shù)字組成；它的來源是由平臺的規(guī)則和用戶本身的貢獻一路產(chǎn)生；屬性在這里臨時可以理解成為描述和評估性子；優(yōu)先級和關(guān)系可以和整個頁面聯(lián)系起來考慮，它在小我主頁這個頁面來說緊張級別低于整個頁面的小我數(shù)據(jù)表達，但是在單個主頁 tab 上，卻比其他的數(shù)據(jù)更加緊張，所以在顏色和字體大小上做了強調(diào)。

動作是指什么呢，在這個小我主頁上，用戶的操作重要是上下滑動以及點擊的操作，那么用戶的滑動以及點擊的舉動即用戶的動作。動作之后所帶來的頁面的轉(zhuǎn)變即交互體例，點擊之后是會出現(xiàn)彈框呢照舊 push 到一個子頁面，這些都屬于 interaction 交互體例。

而 UI設(shè)計師則偏向于視覺語言的設(shè)計，顏色、字體、間距、插畫等等方面的工作。但也有 UX 和 UI 必要進行合作的，比方說空頁面，UX 可以定義空頁面有哪些文本以及指導(dǎo)的動作，UI設(shè)計師可以繪制更詼諧或者情感化的插畫進行表達，是可以進行合作的。

以上只是用一個案例從狹義的方面去表述交互設(shè)計師的工作內(nèi)容詳細有哪些，假如說要歸納起來的話，只要與用戶體驗的相干的內(nèi)容，UX 都必要進行考慮。能夠進步用戶感受或者服從的事情，UX 都可以進行一些嘗試。還必要秉承一觀點，不管是UX、UI，哪怕是開發(fā)GG、QA同窗，所提出的意見，能對項目有益處的，都可以進行決定，以及進行采納。

作者簡介：Sophia的玲瓏閣，成功從平面轉(zhuǎn)行至UI再轉(zhuǎn)行至好互的設(shè)計師妹紙。

職場設(shè)計技能，更多教程爭先看，請關(guān)注作者的微信公眾號：「Sophia的玲瓏閣」