相信大家都在網上看過老羅在星巴克打臉的視訊,這個視訊每次在老羅有什麼新聞的時候都會被挖出來發一遍,我們在這個視訊中還是可以看出很多東西的。 包括多用户體驗、營銷方法、甚至文化差異等等。真的很有意思。首先我們要肯定星巴克這樣杯型的命名是有着他一套營銷邏輯的。星巴克的點單環節,可以説是一次遊戲、一次社交行為及表演,客户在此也得到了某種程度上的滿足。但確實對於點單的客户最初會造成很大困惑,這就和頁面一樣,如果沒有對場景進行分析,設計就會給多用户帶來困擾和一些非常不適的心裏感受。那麼設計出的輸出物也可能是一次互動設計和 UI 設計的失敗。我們首先來看這個介面,真的很好看很漂亮,按鈕的質感和配色都無可挑剔,但是大家有沒有注意到,這個管理上傳檔案的彈窗在功能操作上的感受會讓人有和老羅一樣的感受。它的介面有上傳、刪除、和取消功能,但我們看這張圖片,我們真的無法去判斷如何操作,它功能按鈕做的雖然很精緻,但是配色方面讓多用户覺得無從下手——我們經常作為警示的紅色用到了取消,我們最常用的上傳功能用到了灰色,按照普通多用户的操作習慣來説,最長按的就是刪除的按鈕,顯然這是讓人崩潰的設計。我很難去快速地識別和操作。看這些非常精美的按鈕,可以説 UI 做到了極致,那您可以説這是個好設計嗎?顯然不是,他錯在哪裏?錯在他脱離了場景,表意的換亂造成操作的不確定性和糟糕的多用户體驗。我們在看下圖二顯然它是合格的,為什麼呢?場景對了!藍色代表功能,灰色代表取消功能,紅色代表刪除並有提示作用。在上傳檔案管理的操作場景下,這樣的表達就符合了這個場景的功能特點。我在接下來的文章中會從場景的定義和分析、場景分析對於互動設計詳細展開來説一下自己對於特定場景下設計的理解和感受。一、場景的定義和分析在設計中很多需求是針對場景來提出的,有計時的需求、有對比的需求、有需要瀏覽的需求。轉化成頁面的話,就是這樣,每一個需求都會有他的場景,所以我們需要知道什麼叫場景,場景的定義有很多每一個資料或者文獻都有不同的定義,但讓我覺得總結下來,場景不會離開這些:誰在什麼時候在什麼地方做了什麼事情周圍環境怎麼樣用 WordPress 微信和好友聊天時一種場景。記錄工作時間是一種場景,記錄工時的同時我繼續工作又是一種場景,場景的應用真的是無處不在。比如一個計時功能的應用,他可能的場景就是,一名律師,在下午的星巴克接待了他的委託人。這個就是場景。在瞭解了場景後,我們要繼續認識場景的型別。看下如何利用場景的不同來捋清設計的思路:場景型別一 基於目標或者任務的場景要描述的是多用户想做什麼,不是如何去做。這種型別的場景是大面積的場景,用途在確定網站架構和內容的時候作用較大。比如:一名律師想要記錄和客户談話的時間,並很快記錄下來。場景型別二 精細化的場景掌握多用户的細節,瞭解更深的多用户資訊和習慣。這些細節能幫助我們更深入的理解多用户特徵及行為。知道了這些資訊,我們更容易設計出讓多用户更舒服、更易操作的產品。就像剛才的例子,如果我們把它精細化,一名律師,在週六下午 2 點和客户約在了他住宿樓下的星巴克見面,在他座位周圍的人都在安靜的學習或休息,所以他和客户説話的聲音很小,也不希望被任何聲音打擾。場景型別三 全面的測試場景站在多用户的角度呈現多用户完成任務的每一步操作除了背景資訊之外,還包含了多用户完成任務的所有操作步驟。它可以用來完整地呈現多用户完成某個任務的所有操作步驟,它很好的解釋了多用户是如何利用您的產品一步步操作完成自己的目標。比如説:根據上面律師會客户的分析,我們會做一款計時器放到手機端產品中,並且是不打擾他其他工作,也不會出現任何聲音,停止計時後我們會讓他直接錄入記錄文字。在瞭解了一些場景的概念後,我們簡單瞭解下什麼叫場景設計:場景設計,即一系列場景的判斷與分析,理解多用户每一場景的痛點及需求,結合上文場景,預期多用户下一步的目標及意圖,通過設計縮短關鍵流程,輔助多用户提高操作效率。場景設計分為四點,首先我們要把這些場景列舉出來,形成一個流程圖,找出其中最關鍵的場景。通過關鍵的場景,我們要找到多用户當前的痛點和需求,並且結合場景預期多用户的需求和行為。我們瞭解了場景和需求之後,我們的設計要、貼心、高效、富有情感的細節表達。我們的產品則是要更具有易用性。為了檢測我們通過上一步設計策略產出的方案是否符合標準,這一步我們需要對方案進行衡量判斷,結合設計目標,我們設定了四個衡量標準:效率、驚喜、感動、期待。總結起來就是簡單和高效。二、 場景分析對於互動設計我們剛剛瞭解了場景和場景分析,我們繼續今天第二個題目:場景分析對於互動設計。那麼互動設計師要如何設計頁面呢?如果是我 我會了解多用户的目標,繼續剛才的例子,多用户的目標就是想要計時。多用户進入介面的場景,直接進入、上次計時後忘記停止再次進入、在 PC 端計時後忘記結束後再進入。這些都是可能的進入方式,我們要針對每一種場景設計不同的任務流程。我們詳細列舉出每一個環節的流程之後我們分析他記入頁面的預期,計時功能,可以編輯內容。瞭解並分析了這些之後,我們就可以開始完整他的所有資訊,設計她的細節並開始互動。這樣的方法就是場景化的互動設計。站在多用户的角度去思考問題,為多用户所處的場景,提供相應的解決方案,做好資訊的整理與分類,引導每一類多用户能夠準確快速的找到相應的功能。他總結起來可以分為三大部分:需求分析、場景分析、原型設計。要求分析階段,我們要分析各種的需求,我們設定的場景不是在想當然中完成的,而是通過對調查研究多用户現場,並從中獲取有效資訊和經驗等方式來進行的。場景分析,是設計的核心階段,這個階段是情景設定過程中的核心階段,可以細分為多用户調研、分析和模擬流程。通過多用户的研究,並分析多用户的具體行為和對產品的具體要求;場景分析是將獲取到的資訊進行結構化及視覺化 分析環境,載體;模擬產品被使用的全過程,這些模擬的過程必須反應多用户對產品的要求,能夠充分地描述多用户在產品使用過程中遇到的問題,並進一步提出解決問題的方案,通過這個階段,設計師可以清楚地觀察到多用户在產品使用中呈現出怎樣的形態。製作我們的 demo 原型,可以對原型進行測試和易用性的評價,可以讓設計師進一步瞭解多用户需求、瞭解多用户和產品之間的關係,為最終產品方案提供最有力的價值。原型設計階段,在原型製作過程中可以生成形式多樣的模型,我們可以通過直接使用這些模型來進行產品的測試及適用性評價。通過這個評價過程,設計師可以進一步觀察多用户和產品之間存在其他關係,並未產品最終設計方案提供參考價值。我們可以給以上互動的場景總結做一個總結——需求場景、環境場景、具體應用場景。需求來源於多用户在現實生活中遇見的問題,多用户需要一種有效解決問題的措施,這個措施就是互動設計提供的方案。也就是説,多用户的需求就是做設計最根本的依據,可以把需求當做一個場景。場景的第二部分我歸結為環境場景,環境場景包括多用户使用應用時的時空狀態以及人體的肢體動作狀態。應用場景,我們可以總結為,應用產品的系統、應用產品時系統狀態、產品目前的執行狀態。最後我們總結一下今天的內容,我們首先知道了場景的概念誰,在什麼時候,在什麼地方,做了什麼事情,周圍環境怎麼樣。我們還了解了互動需要在場景中考慮什麼,瞭解了場景化的互動設計。最後想和大家説的是,設計有很多種方法,每一種方法都可以幫助我們輸出好的設計。