<address id="ttjl9"></address>

      <noframes id="ttjl9"><address id="ttjl9"><nobr id="ttjl9"></nobr></address>
      <form id="ttjl9"></form>
        <em id="ttjl9"><span id="ttjl9"></span></em>
        <address id="ttjl9"></address>

          <noframes id="ttjl9"><form id="ttjl9"></form>

          首頁

          UI設計師交互設計|談談產品細節體驗

          周周

          用戶體驗是用戶對產品價值的整體感受,其中包括用戶感受到的產品價值以及用戶感受到的操作體驗。不要讓用戶思考,這是每個設計師所追求的。這篇文章舉了大量的例子,來跟大家一起進行產品細節洞察分析。感興趣的朋友一起來看看吧。

          UI設計師交互設計-如何提升B端界面精致度

          周周


          對于B端,我想剛開始很多同學就直接拿Ant Design套套界面,因為公司要求并不高,隨后字節Arco Design也推出了對應的模版和規范,能讓我們快速作出一個不出錯的方案。

          但是隨著公司對B端越來越重視,這些模版顯然就太爛大街了。公司、市場的要求顯然不止于此,我們的設計追求也不止于此。

          那么我們如何才能擺脫套模版,提高界面的精致度,提升界面的交互體驗呢?

          其實很簡單,王陽明先生告訴我們知行合一,知是行之始行是知之成。我們如何才能提升B端界面端精致度,第一需要知道什么是好的設計;第二需要不斷的去實踐去練習,缺一不可。

          本文先和大家談談知的層面,提高我們的眼界,下面就和大家分享一些不錯的B端產品,大家有時間可以去慢慢體驗。

          PS:作為B端設計師,一定要去多拆解競品,多研究好的產品,別面試的時候,面試官問你研究的B端產品是什么,你只知道阿里云、騰訊云、百度云哦!


          1、Hubspot


          做B端的同學,尤其是做CRM的同學應該都知道Salesforce,他是全球最大的 CRM(客戶關系管理) 工具公司。

          Hubspot同樣是提供客戶管理相關的應用,雖然成立相對Salesforce晚,但是在市場上也占有一席之地。

          從設計的角度來看,他的界面風格更加簡潔舒適,從體驗上來看和國內的CRM系統完全不同,其體驗更加自然和舒適。


          這種風格大家看了有沒有覺得很熟悉呢?

          大家在去看看 GoDoddy , Airbnb ,Zillow,是不是發現風格有一點類似,大家可以對比國內產品去拆解下他們的交互細節有什么不同,完成同樣的任務他們采用的方案有何不同,相信你會有很多的收獲。


          國外的界面看著總讓人覺得很舒適,僅僅是因為克制的設計、中性灰使用得好嗎?當然不是,是因為英文本身就是圖形化的文字。

          如果翻譯成中文,你會發現好像不是特別理想。


          這個樣子拿給領導過稿,怕是分分鐘被拍死,因此我們還是需要多看看國內優秀的產品。


          2、神策


          神策的設計,我想B端的朋友不陌生吧,國內產品中他的設計一直是我們的參考對象。

          不同于其他產品,他的體驗門檻比較低,注冊后就可以去體驗他的demo,也沒有試用期限,參考對象從可視化報表,到界面交互均能找到參考。


          不過當你參考一次后發現,做出來的界面怎么還是少了一些靈魂,雖然界面風格上了一個臺階,但為什么用戶還是覺得產品難用。




          3、項目管理類


          這里不得不和大家推薦項目管理類產品了,這類產品是專門給互聯網公司的開發團隊使用,他們都是專業用戶,同時這些都是提高他們工作效率的工具,因此這些產品投入的成本更高,優化得更好,拆解他們的產品,就是直接觀看高手的成長之路。


          Jira

          Jira是Atlassian公司出品的一款事務管理軟件,JIRA的界面效果交互都非常不錯。大型互聯網公司如LinkedIn、Facebook、eBay等內部都在使用Jira。



          同時他也是國內項目管理類產品的學習研究對象,因此大家可以通過文章、B站、界面截圖,自己申請體驗等方式全面的進行體驗。

          同時也可借助群的力量,調研下有使用Jira的小伙伴,看看他們在使用中有什么問題,下面是我收集Jira網頁版和本地配置版的問題截圖,這些都來自不同角色的真實體驗,會更有分析的價值。(這部分截圖涉及到公司的數據,同時數量多不太方便打碼,就不分享給大家了。)



          當然國內的項目管理類產品也得去看,我們要對比哪里做得好,哪里還需要改進。國內的有Worktile、Gitee、Tower、Ones、PingCode、TAPD、Teambition,這些產品不管從視覺還是體驗都非常不錯,大家一定要去體驗。




          5、文檔管理類產品

          通過不斷對競品進行拆解,你已經不是當初那個小白了,你的行業認知,方案設計能力應該趕超了一大波人。

          成長的同時,又發現你設計的界面,不太精致,少了些溫度,這時候推薦你看文檔管理類產品。


          WPS

          第一個和大家推薦的是WPS,界面簡潔,配色舒適。




          飛書


          在管理類的軟件中,不得不提飛書的管理界面,從設計到使用體驗,他給我的感覺終于不是那么千遍一律,用組件庫搭建起來的感覺。

          他開始有了溫度,開始注重品牌感的打造,用戶的引導,符合品牌調性的插畫。


          對一些體驗的細節進行優化,比如傳統的編輯都是放在頁面頂部,它采用了離光標更近的位置。


          根據菲茲定律,光標當前的位置和目標位置的距離D越短,所用的時間越短,具體好不好用,歡迎大家在評論區留言哦。


          6、概念稿


          到這時候如果你覺得線上的產品太禁錮思維,那么推薦你看看dribbble、behance,搜索data、web、dashboard等關鍵詞,去看看有沒有新的靈感。


          我的花瓣收集了一部分,如果不嫌棄,可以去看看,順藤摸瓜應該可以找到很多不錯的設計。

          風箏KK的花瓣:https://huaban.com/boards/76913106


          7、畫重點


          如何提升B端界面的精致度?

          第一,要知道什么是好的設計,多拆解國內外優化的B端產品。

          第二,多在工作中時間,有時間多做ABC方案,鍛煉自己的方案設計能力,多踩一些坑,時刻保持學習能力,慢慢就成長了。


          文章來源:站酷   作者:風箏KK

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.


          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務

          UI設計師交互設計-知識圖譜的信息可視化設計方法

          周周

          知識圖譜作為語義網絡,其技術算法研究被廣泛應用在人工智能和大數據等領域。通常,知識圖譜的運轉過程是由數據模型完成,用戶可見的只是計算后的結果,其數據的可視化也僅停留在對結果的可讀性展示上。但其實,圖譜之間的關系、數據計算的過程,也具備分析價值和潛在的機會信息。將知識圖譜轉化為可視化信息圖,能幫助用戶更好的理解和利用數據及其關系,但對于沒有技術背景的界面設計師來講,從技術架構、計算函數等技術視角去理解知識圖譜概念和應用相對困難。本文分享一種設計思路,幫助大家在實際工作中,完成知識圖譜向可視化交互界面的轉化。

          UI設計師交互設計-注重產品細節的使用體驗

          周周

          前言


          在使用產品的過程中,你是否看到了一些有趣的細節,而這些細節提升了你的使用體驗?這些產品細節,便是產品設計師需要留意的,因為這些產品細節在某種程度上提升了用戶的留存與轉化。本文我就對一些產品細節進行了拆解,一起來看一下。









          一.【夸克瀏覽器】節日彩蛋-特定場景下輸入關鍵詞觸發彩蛋效果

          二.【酷狗音樂】播放Tab-多交互操作,應對多場景使用

          三.【騰訊新聞】左滑熱點榜單-用戶關注的熱點放在路徑短的位置

          四.【荔枝博客】品牌傳播-產品情感漏出,與用戶產生共鳴

          五.【百度網盤】自定義倍數-給用戶更多可控操作,精細化觀影感受

          六.【網易云音樂】情感彩蛋-給你夢幻的魔法,帶你重拾記憶

          七.【即刻】頭像彩蛋-趣味互動回彈,把喜歡強烈表現出來

          八.【荔枝】錄聲音-輕擬物動態圖,使用中的及時反饋

          九.【微博】點贊反饋-情緒最大化宣泄,盡情釋放情緒

          十.【36氪】隱藏的浮窗-深挖用戶操作,快切與停頓的奧秘



          一、【夸克瀏覽器】節日彩蛋-特定場景下輸入關鍵詞觸發彩蛋效果


          1. 使用場景


          在圣誕節日來臨之際,用戶使用搜索引擎輸入關鍵詞的頻率會增加,在此增加彩蛋給用戶營造節日氛圍





          2. 設計思考


          設計目標:增加關鍵詞趣味彩蛋雨,提高產品趣味體驗,提高用戶搜索頻次。


          設計方案:在節日來臨前,用戶通過搜索節日特定關鍵詞,會在搜索結果頁中以彩蛋雨的形式墜落下來,圖案貼合節日物品,給用戶營造出節日氛圍,給予用戶節日的浪漫。用戶在使用時并不是一個冰冷的產品,而是有情感共鳴有情緒的產品。




          二、【酷狗音樂】播放Tab-多交互操作,應對多場景使用


          1. 使用場景


          想要提高屏效,一屏顯示更多內容。在瀏覽操作時會因為功能按鈕外漏造成誤操作情況。





          2. 設計思考


          設計目標:提升屏幕顯示內容面積,給予TAB播放更多交互形式,增加趣味性提升產品記憶點。


          設計方案:在TAB播放中給予「長按」「雙擊」兩種交互操作,長按中包含雙擊的播放暫停,因為此操作,使用率較高,提供多入口能有效提高易用性。長按時,激活更多常用功能,包含移動進度條、收藏、下一首等操作,配合特有的交互展示形式,給用戶形成產品記憶點,同時在瀏覽不同頻道時,功能的隱藏大大降低誤操作以及視覺干擾的情況。




          三、【騰訊新聞】左滑熱點榜單-用戶關注的熱點放在路徑短的位置


          1. 使用場景


          如今的新聞產品都提供熱點時事新聞,給用戶提供更多豐富內容聚集。





          2. 設計思考


          設計目標:提高用戶使用率,不影響主框架的情況下給用戶最短路徑查看熱點新聞的入口,提高用戶瀏覽時長。


          設計方案:首屏以及導航模塊更多還是以新聞資訊等內容為主,關注熱點更多是娛樂熱門等內容,瀏覽率都高的情況下,把熱點模塊放到左滑頁面中,在不影響首頁框架情況下,增加新的板塊,給用戶更多瀏覽選擇,豐富產品多元化內容。



          四、【荔枝博客】品牌傳播-產品情感漏出,與用戶產生共鳴


          1. 使用場景


          如今的產品趨于同質化,由原來只注重功能轉變為產品情感表達,給用戶產生情感互動,從功能付費變為情感價值觀付費。



          2. 設計思考


          設計目標:傳播產品價值觀,給予用戶引導,產生產品正向記憶,從而提高粘性。


          設計方案:上幾期產品分析中有說到頂部logo外漏的設計描述,有的植入隱藏功能,有的表示刷新功能等,歸根結底都是給予靜態標志功能屬性,提高屏幕利用率同時提升用戶探索欲望。


          荔枝博客本身產品內容相對聚焦,想要做出差異化就要往品牌情感入手,當用戶點擊左上角「荔枝博客」標志時,會彈出產品的由來以及做博客的初衷,讓用戶思考產品深層意思時無形中把產品植入到用戶記憶中,給用戶情感綁定,提升用戶使用粘性。




          五、【百度網盤】自定義倍數-給用戶更多可控操作,精細化觀影感受


          1. 使用場景


          市場上的視頻倍速參差不齊,0.25、0.5、1倍三種遞增邏輯,用戶在觀影時會存在沒有想要選擇著倍速,只能使用平臺提供的選擇使用,操作受限制。





          2. 設計思考


          設計目標:解決倍速不是用戶想要的,提供自定義倍速,給用戶更多可操作性,提升觀影感受。


          設計方案:在百度網盤中觀看視頻時,點擊調節倍速在提供默認常規5種倍速下提供自定義倍速,以0.1的速度逐漸遞增,用戶可以在0.5-3倍之間任意選擇,根據視頻類型、觀影習慣選擇合適的速度,同時把市面上不同倍速問題給用戶造成的觀影困擾也同步解決,提高視頻觀影體驗。




          六、【網易云音樂】情感彩蛋-給你夢幻的魔法,帶你重拾記憶


          1. 使用場景


          音樂無國界,每首音樂背后都有一段很長的故事,在我聽哈利波特主題曲時,瀏覽評論發現特定特定位置點擊會有彩蛋,嘗試了一下果然如此。網易云音樂評論區的強大之處展示之一。獨有的彩蛋。





          2. 設計思考


          設計目標:提升評論活躍度,強化廣告的表現形式,增加用戶對產品的探索欲望提高使用粘性。


          設計方案:哈利波特音樂中,在評論區第九和第十條中間分割線處,點擊兩下!觸發魔法視頻,把用戶帶入情境之中,勾起滿滿的回憶,配合音樂聲音,真可謂視覺聽覺雙重享受。


          對于開發來說,只需要在特定歌曲評論中寫一個位置判定以及觸發條件,當用戶觸發條件后,播放特定視頻,觸發 用戶情感共識,提升使用粘性。同時如果做為廣告植入也是比較好的呈現方式,但要注意視頻質量,盡量弱化廣告中的產品,可以把品牌情感揉入視頻中與用戶產生情感關聯。




          七、【即刻】頭像彩蛋-趣味互動回彈,把喜歡強烈表現出來


          1. 使用場景


          在看關注人主頁時,想要強烈的表達出情感給予對方,釋放自己心中的喜歡時如何表現出來。





          2. 設計思考


          設計目標:提升趣味玩法,增強用戶操作感受,豐富產品玩法體驗,提升使用粘性。


          設計方案:在個人主頁,通過拖拽用戶頭像放手回彈,頭像以拉距來彈射回原有位置并且迸發出愛心動畫,讓用戶產生更貼近的情感傳達,反復操作達到一定數量會有文字提醒,文案的趣味描述也讓彩帶功能增加了一份趣味。




          八、【荔枝】錄聲音-輕擬物動態圖,使用中的及時反饋


          1. 使用場景


          在使用錄音功能時,單純靠進度條記憶靜態按鈕顯示很難產生強提醒,除非做大做突出,荔枝在錄音中是如何表現的。



          2. 設計思考


          設計目標:解決錄音功能頁面元素單一用戶進行中與暫停感知淺的問題,結合動態插圖給用戶及時反饋,同時貼合線下使用場景,給用戶注入產品記憶點。


          設計方案:在我的-進入錄聲音模塊中,頭圖展示一個錄音磁帶機,當開啟錄音功能時,磁帶機會進行旋轉播放,左慢右快的展示形式符合真實機器的運動規律,給用戶強提醒告知用戶此時正在錄音中,當暫停時,磁帶機及時停止,和按鈕形成觸發綁定,提高產品使用體驗。




          九、【微博】點贊反饋-情緒最大化宣泄,盡情釋放情緒


          1. 使用場景


          單一的贊有時無法滿足用戶的愛意,用戶希望更強烈的表達情感,來滿足自己反饋欲。





          2. 設計思考


          設計目標:提升贊的強烈感知,釋放用戶內在情緒,提高產品趣味體驗,從而增加使用粘性。


          設計方案:在微博單條動態頁面中,對“贊”進行點擊一次操作是普通點贊反饋;長按觸發連贊機制,會帶來多彩多圖標的更強的視覺感受,帶來強烈的情感反饋,讓用戶盡情的釋放情緒,得到內在解壓。




          十、【36氪】隱藏的浮窗-深挖用戶操作,快切與停頓的奧秘


          1. 使用場景


          新聞資訊產品,文章之間來回切換閱讀,時有發生,或者手頭有事忙完再回過頭看。





          2. 設計思考


          設計目標:解決閱讀中斷導致回看路徑長,影響閱讀效率的問題。


          設計方案:瀏覽文章時,屏幕側邊從左向右劃動是返回上一級的交互手勢,當用戶在滑動中停留一下就會激活浮窗功能,隨著手勢操作移動到黑圈內顏色會顯示藍色,表示移入成功,這時放手返回首頁,右下角會顯示一個圓形浮窗,可快速查看浮窗內的文章。


          值得學習的是,左滑浮窗圖形隨著手勢上下位置進行移動,路徑更短更快的進行操作,提高用戶使用體驗。因為隱藏式的交互有一定學習成本,產品充分考慮到這點,在文章右上角更多按鈕中放置加入浮窗功能,兩個激活入口,兼容新老用戶使用,提高產品易用性。









          十一、結語


          設計師要有發現美的眼睛。美不僅是視覺,還有好的體驗流程。不要讓用戶思考,這是每個設計師所追求的。認真記錄產品細節,了解背后的思考,也是不斷提升自己邏輯思維和表達能力的一種方式。


          文章來源:站酷 作者:碳水sir

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 平面設計服務


          UI設計師交互設計-教你在UX輕松創建文案

          周周

          在了解了人物性格語氣的重要性以及在大廠中的應用場景之后,大家一定很關心,要如何在自己的業務中從0開始創建文案的人物性格語氣呢?下面會結合在酷家樂云設計工具的實踐,針對這部分內容做詳細介紹。酷家樂云設計工具主要是針對內裝設計師的設計工具。整個過程大致分為 5 個階段:資料研究、小組研討、確定人物性格關鍵詞、豐富人物性格、繪制畫像。




          <h1 data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-weight: bold; line-height: 1.5; letter-spacing: -0.006em; font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode5" style="white-space: normal; margin: 0px; padding: 0px; outline: none; box-sizing: inherit; caret-color: rgb(40, 40, 40); color: rgb(40, 40, 40); font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">Chapter ONE 「資料研究」

          <h4 data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-weight: bold; line-height: 1.5; letter-spacing: -0.006em; font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode__7" style="white-space: normal; margin: 0px; padding: 0px; outline: none; box-sizing: inherit; caret-color: rgb(40, 40, 40); color: rgb(40, 40, 40); font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW; font-size: 14px;">-研究內部資料,了解基調和方向

          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" font-size:="" 14px;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode
          8" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">工具產品文案的人物性格和語氣一定是符合公司的戰略定位、品牌形象和設計原則的,因此我們首先對公司現有的內部資料進行收集和研究,為工具產品文案的人物性格與語氣確定一個基調和方向。研究的資料包括但不限于以下內容,包括公司戰略書、品牌白皮書、設計價值觀、設計原則、用戶畫像等等。









          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" font-size:="" 14px;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode__10" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">閱讀相關資料,分析資料中的關鍵詞,在公司資料傳遞出的氣質和價值觀中,提取與人物性格語氣相關的內容。在我們的資料研究中,有一些詞是被反復提到的,且能反映一定人物性格的。比如權威、專業、引領、靈活友好、高效專注、冷靜、秩序、簡潔等等。









          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" font-size:="" 14px;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode11" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">


          <h1 data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-weight: bold; line-height: 1.5; letter-spacing: -0.006em; font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode__13" style="white-space: normal; margin: 0px; padding: 0px; outline: none; box-sizing: inherit; caret-color: rgb(40, 40, 40); color: rgb(40, 40, 40); font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">Chapter TWO「小組研討」

          <h4 data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-weight: bold; line-height: 1.5; letter-spacing: -0.006em; font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode
          15" style="white-space: normal; margin: 0px; padding: 0px; outline: none; box-sizing: inherit; caret-color: rgb(40, 40, 40); color: rgb(40, 40, 40); font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW; font-size: 14px;">-設計小組舉行研討會,輸出各自的人物理解

          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" font-size:="" 14px;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode__16" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">設計師基于自己對產品的了解,以及通過對不同角色的同事、比如視覺、運營、客服的調研,提出工具產品人物性格的大致方向,進行分享討論。我們理解的工具產品要具備以下的一些人物特征,包括沉著冷靜、專業有經驗、善解人意、自信的、隨和的、理性的、靠譜的等。





          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" font-size:="" 14px;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode18" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">


          <h1 data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" font-size:="" 14px;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode__19" style="white-space: normal; margin: 0px; padding: 0px; outline: none; box-sizing: inherit; caret-color: rgb(40, 40, 40); color: rgb(40, 40, 40); font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">Chapter THREE「性格關鍵詞」

          <h4 data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-weight: bold; line-height: 1.5; letter-spacing: -0.006em; font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode
          21" style="white-space: normal; margin: 0px; padding: 0px; outline: none; box-sizing: inherit; caret-color: rgb(40, 40, 40); color: rgb(40, 40, 40); font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW; font-size: 14px;">- 歸納總結,得出人物性格關鍵詞

          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" font-size:="" 14px;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode__22" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">基于以上兩輪發散的思考之后,我們進行了一下收斂和聚合。將所有的關鍵詞匯總在一起,對這些關鍵詞進行分析和排查。







          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" font-size:="" 14px;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode24" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">首先,我們將這些詞匯分為兩大類。一類是描述性格的,比如善解人意、隨和的、理性的、直接的等等。另一類則不是描述性格的,比如關注用戶,更多的是一個人的表現,而非性格。再比如專業有經驗,是指一個人的能力,而不是性格。


          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" font-size:="" 14px;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode__25" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">


          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" font-size:="" 14px;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode
          26" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">性格描述的詞匯里,我們進一步聚合細分,總共歸為 3 類。靈活友好、隨和的、善解人意為一類,理性為一類,直接坦率為一類。非性格描述的詞匯里,我們主要看這些描述是否和前面的性格相關聯,是否出現一些詞匯,是前面的性格類詞匯涵蓋不了的,進而對性格類詞匯進行一個校準。比如,專業、品質化、值得信賴等描述主要表示我們的產品是專業資深,有一定有話語權,這和性格描述的理性關聯性很大。我們認為一個靠譜的、沉穩的、理性的人,他的能力一定是足夠專業,表現出的特質一定是自信的,值得大家信賴,有一定權威性的。再比如,我們認為崇尚科技、科技感的東西在某種程度上和理性、冷靜這種氣質是相吻合的。依此類推,經過所有的分析后,我們發現性格描述下的3類詞匯基本和非性格描述下的詞匯是相關聯的,滿足這3類性格的人物是符合公司和品牌整體調性的。所以這3類性格將作為我們人物性格的考慮范圍。最后我們將每一類性格進行一個關鍵詞的總結,得出了善解人意、理性、直率三個關鍵詞。







          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" font-size:="" 14px;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode28" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">


          <h1 data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-weight: bold; line-height: 1.5; letter-spacing: -0.006em; font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode__29" style="white-space: normal; margin: 0px; padding: 0px; outline: none; box-sizing: inherit; caret-color: rgb(40, 40, 40); color: rgb(40, 40, 40); font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">Chapter FOUR「豐富人物性格」

          <h4 data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-weight: bold; line-height: 1.5; letter-spacing: -0.006em; font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode
          31" style="white-space: normal; margin: 0px; padding: 0px; outline: none; box-sizing: inherit; caret-color: rgb(40, 40, 40); color: rgb(40, 40, 40); font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW; font-size: 14px;">-細化性格關鍵詞,讓人物更好理解

          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" font-size:="" 14px;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode32" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">基于每種性格,為了更好的理解,我們詳細描述這個人物是什么樣的,不是什么樣的,并給到一些例子描述。


          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-weight: bold; line-height: 1.5; letter-spacing: -0.006em; font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode__33" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">


          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-weight: bold; line-height: 1.5; letter-spacing: -0.006em; font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode
          34" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">善解人意


          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" font-size:="" 14px;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode__35" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">是什么?

          • 能夠理解用戶當下的心理狀態,知道別人的需求是什么,然后說相應的話
          • 能夠理解用戶的困難,并幫助他們克服
          • 懂得聆聽用戶,給到用戶反饋渠道,關心用戶的反饋
          • 提供新的或更好的方法,幫助用戶實現目標
                                              <p style="font-size:16px;white-space:normal;margin-top:0px;margin-bottom:0px;padding:0px;outline:none;box-sizing:inherit;color:#666666;position:relative;line-height:32px;font-family:&quot;">
                                                  <br />
                                              </p>

          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" font-size:="" 14px;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode__36" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">不是什么?

          • 置身事外,只是客觀的描述事實,沒有體諒用戶的心情
          • 給人以壓迫感或距離感
                                                  <p style="font-size:16px;white-space:normal;margin-top:0px;margin-bottom:0px;padding:0px;outline:none;box-sizing:inherit;color:#666666;position:relative;line-height:32px;font-family:&quot;">
                                                      <br />
                                                  </p>

          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" font-size:="" 14px;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode__37" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">具體表現:

          • 發生問題時,應告訴用戶可行的解決方案,或產品為用戶做了哪些挽救措施
          • 從用戶視角描述價值
          • 多給用戶支持和鼓勵,不要命令、強迫用戶,不要責怪用戶
          • 使用貼近用戶的用語,不使用過于專業、用戶難以理解的表述,也盡量不創造新的概念或詞匯




          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-weight: bold; line-height: 1.5; letter-spacing: -0.006em; font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode__39" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">理性


          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" font-size:="" 14px;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode__40" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">是什么?

          • 能夠聚焦關鍵信息,精煉表達
          • 能夠控制情緒,克制表達
          • 邏輯清晰,表達嚴謹,前后一致
                                              <p style="font-size:16px;white-space:normal;margin-top:0px;margin-bottom:0px;padding:0px;outline:none;box-sizing:inherit;color:#666666;position:relative;line-height:32px;font-family:&quot;">
                                                  <br />
                                              </p>

          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" font-size:="" 14px;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode__41" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">不是什么?

          • 說話沒有重點,所有細節都面面俱到
          • 采用情感化的表達方式強調或放大情緒
                                                  <p style="font-size:16px;white-space:normal;margin-top:0px;margin-bottom:0px;padding:0px;outline:none;box-sizing:inherit;color:#666666;position:relative;line-height:32px;font-family:&quot;">
                                                      <br />
                                                  </p>

          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" font-size:="" 14px;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode__42" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">具體表現:

          • 提供幫助用戶實現目標的關鍵信息,不用把前因后果都解釋一遍
          • 慎用“啦”、“哦”、“吧”、“嗎”等矯飾的語氣詞,以及“!”、“?”等語氣標點
          • 不說“可能”、“不確定”、“也許”這類似是而非的詞,也不能說過于絕對的話,會影響嚴謹性








          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-weight: bold; line-height: 1.5; letter-spacing: -0.006em; font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode__44" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">直率


          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" font-size:="" 14px;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode__45" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">是什么?

          • 不卑不亢,平等地和用戶對話
          • 表達簡單清晰,不繞彎子
          • 追求效率,為用戶提供解決問題的最短路徑
                                              <p style="font-size:16px;white-space:normal;margin-top:0px;margin-bottom:0px;padding:0px;outline:none;box-sizing:inherit;color:#666666;position:relative;line-height:32px;font-family:&quot;">
                                                  <br />
                                              </p>

          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" font-size:="" 14px;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode__46" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">不是什么?

          • 過度的關懷和討好
          • 過于官方,沒有提供有效幫助
          • 掩蓋問題
                                                  <p style="font-size:16px;white-space:normal;margin-top:0px;margin-bottom:0px;padding:0px;outline:none;box-sizing:inherit;color:#666666;position:relative;line-height:32px;font-family:&quot;">
                                                      <br />
                                                  </p>

          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" font-size:="" 14px;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode__47" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">具體表現:

          • 說話平等直接,避免用”您“這類詞,而是用你、我來進行對話
          • 在出現問題時,及時通知用戶,無需遮遮掩掩
          • 在用戶遇到問題時,坦誠客觀描述事實,無需過多表達歉意




                                              <p style="font-size:16px;white-space:normal;margin-top:0px;margin-bottom:0px;padding:0px;outline:none;box-sizing:inherit;color:#666666;position:relative;line-height:32px;font-family:&quot;">
                                                  <br />
                                              </p>

          <h1 data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-weight: bold; line-height: 1.5; letter-spacing: -0.006em; font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode49" style="white-space: normal; margin: 0px; padding: 0px; outline: none; box-sizing: inherit; caret-color: rgb(40, 40, 40); color: rgb(40, 40, 40); font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">Chapter Five「繪制畫像」

          <h4 data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-weight: bold; line-height: 1.5; letter-spacing: -0.006em; font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode__51" style="white-space: normal; margin: 0px; padding: 0px; outline: none; box-sizing: inherit; caret-color: rgb(40, 40, 40); color: rgb(40, 40, 40); font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW; font-size: 14px;">-將性格形象化,讓人物更立體

          <p data-darkmode-bgcolor-16497343928436="rgb(25, 25, 25)" data-darkmode-original-bgcolor-16497343928436="#fff|rgb(255, 255, 255)" data-darkmode-color-16497343928436="rgb(136, 166, 217)" data-darkmode-original-color-16497343928436="#fff|rgb(23, 43, 77)" data-style="color: rgb(23, 43, 77); font-family: -apple-system, " system-ui",="" "segoe="" ui",="" roboto,="" oxygen,="" ubuntu,="" "fira="" sans",="" "droid="" "helvetica="" neue",="" sans-serif;="" font-size:="" 14px;="" text-align:="" start;="" white-space:="" normal;="" background-color:="" rgb(255,="" 255,="" 255);="" margin:="" 5px="" 8px="" 10px;"="" class="js_darkmode
          52" style="font-size: 16px; white-space: normal; margin-top: 0px; margin-bottom: 0px; padding: 0px; outline: none; box-sizing: inherit; color: rgb(102, 102, 102); position: relative; line-height: 32px; font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB", 微軟雅黑, STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif, HYWenHei-GEW;">為了讓大家更直觀的理解我們的人物,方便在與各職能角色溝通時快速達成共識。我們收集了符合我們人物性格的一些畫像打印出來,通過討論投票的形式,選出最符合我們產品的人物畫像。





                                                          <p style="margin-top:0px;margin-bottom:0px;white-space:normal;caret-color:#282828;color:#666666;font-family:&quot;font-size:16px;outline:0px;padding:0px;line-height:32px;text-align:justify;">
                                                              <strong style="margin:0px;padding:0px;outline:none;box-sizing:inherit;"><strong style="margin:0px;padding:0px;outline:0px;max-width:100%;box-sizing:border-box !important;overflow-wrap:break-word !important;"><br />



          文章來源:站酷 作者:酷家樂UED



          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

                                                          <p style="margin-top:0px;margin-bottom:1rem;white-space:normal;caret-color:#282828;box-sizing:border-box;font-size:16px;background-color:#FFFFFF;color:rgba(0, 0, 0, 0.843);font-family:&quot;letter-spacing:0.1px;text-align:justify;">
                                                              <strong style="margin:0px;padding:0px;outline:none;box-sizing:inherit;"><strong style="margin:0px;padding:0px;outline:0px;max-width:100%;box-sizing:border-box !important;overflow-wrap:break-word !important;"><strong style="box-sizing:border-box;font-size:14px;font-family:微軟雅黑, Arial, Helvetica, sans-serif;color:#323232;"><b style="box-sizing:border-box;widows:1;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><b style="font-family:&quot;font-size:14px;background-color:#FFFFFF;white-space:normal;widows:1;line-height1111111111111111111111111111111111111111111111:20px;color:#3e3e3e;box-sizing:border-box !important;"><strong style="box-sizing:border-box;font-family:微軟雅黑, Arial, Helvetica, sans-serif;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><b style="box-sizing:border-box;"><b style="box-sizing:border-box;"><b style="box-sizing:border-box;"><b style="box-sizing:border-box;"><b style="box-sizing:border-box;"><a href="http://www.syprn.cn/blog/admin" target="_blank" style="box-sizing:border-box;text-decoration-line:none;color:#886353;transition:all 0.5s ease 0s;">藍藍設計</a>(&nbsp;<a href="http://www.syprn.cn/" target="_blank" style="box-sizing:border-box;text-decoration-line:none;color:#0C386E;transition:all 0.5s ease 0s;vertical-align:baseline;padding:0px;margin:0px;text-indent:34px;background-position:0px -60px;">www.syprn.cn&nbsp;</a>)是一家專注而深入的<a href="http://www.syprn.cn/index.html" target="_blank" style="box-sizing:border-box;text-decoration-line:none;color:#886353;transition:all 0.5s ease 0s;padding:0px;margin:0px;background-position:0px -60px;">界面設計公司</a>,為期望卓越的國內外企業提供卓越的UI界面設計、<a href="http://www.syprn.cn/bs.html" style="box-sizing:border-box;text-decoration-line:none;color:#886353;transition:all 0.5s ease 0s;padding:0px;margin:0px;background-position:0px -60px;">BS界面設計&nbsp;</a>、&nbsp;<a href="http://www.syprn.cn/csjm.html" style="box-sizing:border-box;text-decoration-line:none;color:#886353;transition:all 0.5s ease 0s;padding:0px;margin:0px;background-position:0px -60px;">cs界面設計&nbsp;</a>、&nbsp;<a href="http://www.syprn.cn/scjm.html" target="_blank" style="box-sizing:border-box;text-decoration-line:none;color:#886353;transition:all 0.5s ease 0s;padding:0px;margin:0px;background-position:0px -60px;">ipad界面設計</a><a href="http://www.syprn.cn/csjm.html" style="box-sizing:border-box;text-decoration-line:none;color:#886353;transition:all 0.5s ease 0s;padding:0px;margin:0px;background-position:0px -60px;">&nbsp;</a>、&nbsp;<a href="http://www.syprn.cn/baozhuang.html" style="box-sizing:border-box;text-decoration-line:none;color:#886353;transition:all 0.5s ease 0s;padding:0px;margin:0px;background-position:0px -60px;">包裝設計&nbsp;</a>、&nbsp;<a href="http://www.syprn.cn/icon.html" style="box-sizing:border-box;text-decoration-line:none;color:#886353;transition:all 0.5s ease 0s;padding:0px;margin:0px;background-position:0px -60px;">圖標定制&nbsp;</a>、&nbsp;<a href="http://www.syprn.cn/yhty.html" style="box-sizing:border-box;text-decoration-line:none;color:#886353;transition:all 0.5s ease 0s;padding:0px;margin:0px;background-position:0px -60px;">用戶體驗 、交互設計、&nbsp;</a><a href="http://www.syprn.cn/web.html" target="_blank" style="box-sizing:border-box;text-decoration-line:none;color:#886353;transition:all 0.5s ease 0s;padding:0px;margin:0px;background-position:0px -60px;">網站建設</a><a href="http://www.syprn.cn/WEB.html" style="box-sizing:border-box;text-decoration-line:none;color:#886353;transition:all 0.5s ease 0s;padding:0px;margin:0px;background-position:0px -60px;">&nbsp;</a>、<a href="http://www.syprn.cn/xz.html" style="box-sizing:border-box;text-decoration-line:none;color:#886353;transition:all 0.5s ease 0s;padding:0px;margin:0px;background-position:0px -60px;">平面設計服務</a></b></b></b></b></b></b></strong></b></strong></b></strong></b></b></strong></b></strong></b></strong></b></strong></b></strong></b></strong></b></strong></b></strong></b></strong></b></strong></b></strong></b></strong></b></strong></b></strong></b></strong></b></strong></b></strong></b></strong></b></strong></b></strong></b></strong></b></b></strong></strong></strong>
                                                          </p>
                                                          <div>
                                                              <strong style="margin:0px;padding:0px;outline:none;box-sizing:inherit;"><strong style="margin:0px;padding:0px;outline:0px;max-width:100%;box-sizing:border-box !important;overflow-wrap:break-word !important;"><strong style="box-sizing:border-box;font-size:14px;font-family:微軟雅黑, Arial, Helvetica, sans-serif;color:#323232;"><b style="box-sizing:border-box;widows:1;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><b style="font-family:&quot;font-size:14px;background-color:#FFFFFF;white-space:normal;widows:1;line-height1111111111111111111111111111111111111111111111:20px;color:#3e3e3e;box-sizing:border-box !important;"><strong style="box-sizing:border-box;font-family:微軟雅黑, Arial, Helvetica, sans-serif;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><strong style="box-sizing:border-box;"><b style="box-sizing:border-box;"><b style="box-sizing:border-box;"><b style="box-sizing:border-box;"><b style="box-sizing:border-box;"><b style="box-sizing:border-box;"><br />




          交互設計中排行榜設計詳解

          博博

          排行榜設計有幾種展示方式?排行榜入口引導怎么做?視覺表現有那些?看這一篇,帶你全面了解排行榜的背后思考及做法!

          “今天吃什么啊?”

          “不知道啊,看看大眾點評,哪家店比較靠前”

          “一會去看什么電影?”

          “我看豆瓣上,這部片子評分特別高,我們去看這個吧”

          當我們每天面對類似“吃什么”“買哪個品牌”“周末去哪玩”等等需要抉擇的問題時,會發現當你面對的選擇越多時卻越不知道該如何做決定,或者當下做了決定后會一直思考做的這個決定是不是最好的,這恰恰是當代絕大部分用戶在實際生活中面臨的問題-選擇困難。面對用戶的選擇需求各大平臺都有自己的方式,幫助用戶做決定的同時,引導用戶購買目標產品,極大的降低了用戶的選擇成本,其中排行榜就是平臺的常用套路。用戶的選擇成本是什么?排行榜為什么能夠幫助用戶降低選擇成本?如果排行榜僅僅是用來降低用戶的選擇成本,為什么所有商家都對排行榜趨之若鶩?下面帶你了解為什么人人都愛排行榜,及我們生活無處不在的“顯性”“非顯性”排行榜。你可能不知道是我們的生活正在被各種排行榜所支配!


          排行榜的本質是一個沒有感情的信息篩選機制,將所有相關的同類事物之間通過比較,從而反映出同類事物的客觀實力。排行榜建立的基礎在于用戶對信息篩選平臺權威性的認可,比如我們買衣服會首選淘寶,電子類產品會首選京東,看電影會看豆瓣評分,這些都是對平臺某一領域權威性的認可。用戶信任平臺權威性對信息的篩選,由于錨定效應使得用戶降低自己的選擇成本,可以準確快速的做出選擇。同時由于用戶的從眾心理或者羊群效應,也會對上榜主體產生強烈的品牌認可,為上榜主體帶來更多的利益、強烈的榮譽感、甚至流量以及平臺背書標簽,比如:B站的百大up主,各個平臺排行榜的銷量冠軍、朝陽地區必吃榜第一名,那么這一切背后的原理是什么?


          一個完整的排行榜是由平臺、上榜主體、用戶三大組成部分,俗話說屁股決定腦袋,不同的定位決定了排行對三大組成部分不同的作用,當然背后的原理也不盡相同。


          1.選擇類排行榜-降低用戶選擇成本

          在沒有各種應用前,當我們決定購買什么東西或去哪家消費時,前期需要花費大量的人力、物力去搜集相關的信息進行整理集合對比集合信息后才能做出決定,也就是說用戶需要經過信息的搜集-備選集的建立-擇優決策3個過程才能等到最終的結果。在建立備選集后,做出擇優決策階段發生的成本或費用都是用戶付出的選擇成本(前兩個階段發生的成本是交易費用,而不是選擇成本)。在備選集的建立過程中,包含的選擇越多,用戶選擇的難度就越大,選擇成本就會越高。

          選擇性排行榜在備選集建立完成后,利用沉錨效應在用戶心理建立潛意識的目標參照,幫助用戶完成擇優決策,降低用戶的選擇成本。(另一方面平臺在幫助用戶降低選擇成本的同時,也影響著用戶的最終選擇,在接下來的平臺側方面會有詳細的分析)。

          比如說:當我需要買個耳機時,如果在沒有各大應用的前提下,我需要通過找到我身邊的耳機發燒友或數碼電子方面方面的內行人對耳機進行了解,收集信息建立備選集,但由于京東在電子設備購物方面的權威性,我會優先查看京東的耳機類排行榜,也就是說京東幫助我完成了前期對于信息的搜集及備選集的建立,而用戶出于對平臺權威性的信任,根據平臺給出的維度參照、品牌參照、價格、標簽參照等信息,最終快速的完成自己的選擇。整個過程就是用戶在對錨的尋找,以及用戶對信息確定性的尋找過程。

          2.信息類排行榜-滿足社交需求

          在馬斯洛需求中,當個人的生理需求和安全需求被滿足時,與他人建立情感聯系或關系成為人們最強烈的需求,即社交需求。社交又分為:為達到某種目的產生的功利社交或為獲得情感連接及體驗的共情社交需求。例如:QQ音樂新增的撲通社區、微博的明星超話打榜等功能模塊的火熱正是滿足了擁有共同興趣愛好的用戶對于共情社交的需求。

          無論是“功利社交”還是“共情社交”首先需要的是溝通,溝通的本質則是信息的流通,但當雙方都沒有可以溝通的信息時則社交不成立,而類似:微博熱搜、今日頭條、澎湃新聞等信息類排行榜,則給有社交需求的用戶提供了可以展開話題相通的談資。

          選擇類排行榜中,提到的從眾心理(又稱羊群效應),是指人類由于對信息壓力規范壓力,會希望融入到群體中尋求安全感的特性,即便此類信息與自己無關。大部分人由于對未獲得及時信息的焦慮感,會熱衷于瀏覽此類排行榜來獲取實時信息,融入群體生活。每天早上,在通勤的路上用戶利用碎片時間刷微博、瀏覽知乎或今日頭條等應用了解最近發生了什么社會事件,在上班電梯或工作間隙討論各自掌握的信息,及對事件的見解,甚至在與他人有相同的見解或之后,會對對方產生莫名的親近感等等,這些都是在滿足大眾自己的社交需求。

          3.分享類排行榜-自我確認需求

          過年期間各家app紛紛都推出了自己的用戶年度報告總結榜,不知道你有沒有參與到其中,并把這些報告的截圖分享到自己的朋友圈!在我們的日常生活中也會在朋友圈、B站等看到各種測試自己隱藏能力或性格的小程序,人們對于這類活動的空前熱情其實是因為人類除了需要信息的確認外,還需要清楚自身在大數據下的自我確認,通過各種各樣自我測試類榜單,判斷自身的能力、情緒、價值等等,來達到自我認同,否則就會感到焦慮不安。

          加拿大社會學家歐文·戈夫曼在《日常生活中的自我呈現》中提出他對社會生活的理解是“社會是舞臺,人人皆演員”。 在社會這個舞臺我們需要對外有印象管理的過程,我們想要呈現給觀眾怎樣的形象,需要我們對自身及身邊人有所思考和了解。所以在社會生活中我們呈現的是自己思考管理下被他人和社會接受的自己,為了維持自身的平衡防止崩潰,人類會自發“忠誠、紀律、謹慎”的維護自己的外在形象。而互聯網平臺大數據則折射出“隱形”的自己,讓用戶更加清楚的認知自己,同時通過分享,滿足自我確認以及他人確認的需求。

          我目前只總結出這三種類型的排行榜,如果有小伙伴想到其他類型歡迎在評論區提出,大家一起參與討論。

          無論哪種排行榜,用戶信任的基礎都來自對平臺的信任,那么用戶為什么信任平臺?排行榜對平臺意味著什么?背后原理是什么?下面我們來討論排行中平臺的影響及背后的原因。


          對于用戶來說排行榜是為了滿足用戶對于數據參數、社交信息、自我個人的確定性,選擇成本是品牌經濟學的核心,而用戶對于排行的信任首先要建立在平臺品牌的權威性下的結果。

          1.平臺權威性—用戶側

          從我們記事起,我們對世界的認識來自我們的父母或老師,而這些教導我們什么是對、什么是錯的長輩或老師,對當時剛來到這個世界的我們來說就是權威的化身。長大后我們對于權威的認可則更傾向于某一領域的專家,比如:醫生、律師、教授等,認為處于權威地位的人在某一領域相對普通用戶的判斷更可靠,可以幫助普通用戶節省研究這一領域問題的工作,做出更輕松的決定,雖然不一定是正確的。

          搜索我們會第一時間想到百度,需要觀看影視、書籍會想到豆瓣,想聽音樂會打開網易云音樂、QQ音樂等等。各大應用經過長時間的廝殺各自在用戶心中建立了某一領域的權威性,形成品牌號召力,推動著用戶做出需求決策。另一方面排行榜中也會說明數據來源,比如京東會在排行榜頁面有明確的榜單說明,豆瓣根據平臺數據更新,汽車之家依靠外部的權威數據等等方式力證自己榜單的公正、透明,減少用戶做出決定中的思考、猜測,獲得用戶的信任,增強平臺的權威性。那對于平臺來說權威性的建立意味著什么?

          2.平臺權威性—平臺側

          • 影響用戶的決策方向

          平臺權威性對用戶來說意味著說服力和影響力,在減輕用戶的決策壓力的同時,也影響著用戶做出平臺所需的決策方向;

          • 平臺自帶話題性

          平臺本身的權威性也會為平臺承載的內容帶來討論的話題度,加大平臺承載內容的傳播范圍。比如,每年蘋果發布會都會帶來范圍極大的熱度討論,而app store內的熱門推薦自帶話題度和討論熱度。

          • 輸出口優化

          排行榜作為內容輸出口,在平臺權威性的背書下,產品優化自身的價值,而平臺也可以通過排行榜優化自身平臺價值。

          • 平臺盈利

          平臺權威性下,可以通過多種方式達到盈利,比如蘋果app store應用商店內的付費應用,百度的鳳巢系統、微博熱搜的第3、4位排名等。

          3.平臺權威性—廣告告知

          在平臺完成建立權威性后,部分平臺開始利用排行榜進行商業變現,比如百度、58的競價排名等,現在大部分應用會使用明顯的方式告知用戶,防止平臺建立品牌權威性。比如微博熱搜第3、4位廣告位的“薦”,淘寶、小紅書推薦猜你喜歡的“廣告”。


          上榜主體作為整個排行榜的內容中心,由于排行榜自帶的競爭機制、篩選機制,使得上榜用戶會很樂于分享出去,比如游戲類應用王者榮耀的勝利者排位、微信運動排行榜。

          由于馬太效應上榜主體中的頭部用戶會獲得平臺更多的曝光量、絕大部分用戶的關注度,以及各種潛在資源,比如:流量、資源、人脈、某一領域影響力、平臺背書等等,這些都是潛在的社交貨幣。這種激勵機制極大的滿足了上榜主體的榮譽感、及平臺歸宿感,比如bilibili不同粉絲量級會送出相對應的粉絲牌。

          而平臺方也利用上榜主體挖掘潛在的用戶,為平臺帶來更多的新用戶,加強平臺權威性,形成平臺和上榜主體的良性循環。甚至與出現上榜主體自己的流量超過平臺自身流量,帶走平臺用戶的情況。比如去年和熱鬧的“巫師財經推出b站,簽約西瓜視頻”,各大平臺也時不時會出現搶占流量up主的情況。

          排行榜資源的建立

          排行榜設計要達到用戶攀比的效果,很重要的充分條件就是相同需求好友基數足夠大,這樣才能構成排行榜設計成功的必要條件。

          • 同系同門資源導流

          對于已有成功產品的公司,可以借助平臺相互間的導流完成初試資源的搭建,比如:微信初期借助QQ好友流量,帶來好友初期的爆發;抖音最初的活躍借助今日頭條的流量輸入。

          • 自建用戶體系

          不斷推送已關注好友的信息流,當通訊錄好友開始使用頭條都要發送系統推送。比如全年年低火爆全網的cloubhouse就是利用的熟人社交,你要先有這個人聯系方式才能要求好友,關注的人越多才能解鎖更多的聊天室。通訊錄、地理位置、興趣偏好等等,不斷社區建設推送動態信息流和好友卡片推薦。

          • 偽造

          當應用建立初期,沒有很多的資源和內容時,需要平臺自行填充內容,使得排行榜信息量大,增加用戶活躍,才能挖掘用戶的需求和個性化。不如一些小編推薦、猜你喜歡等等,或是平臺pgc發布推送的內容。


          面對不同的用戶人群及使用場景排行榜的入口表現形式也會千變萬化,根據表現形式大體可分為“顯性排行榜”和“隱形排行榜”。

          在界面有明顯的榜單名稱、排序、評判規則、上榜主體、賣點信息等。排序和內容主體是這個排行榜的基本構成,其他則根據不同產品類型及產品需求決定是否展示。

          1.頁面tab

          在首頁底部或頂部tab形式出現,多出現在以UGC或文字信息為核心的產品,以內容信息為主,常見以信息熱度為主要功能的資訊、新聞類應用。比如:知乎、今日頭條、36氪。

          知乎熱榜內容完全展開;36氪分為話題榜、人氣榜,話題榜僅展示前5條,人氣榜展示10條,僅在前5條有名次圖標,在36氪熱榜的中部還會出現收藏榜,綜合榜。

          而今日頭條僅在整個頁面的1/3處展示部分“頭條熱榜”,點擊“查看更多”后,展開“頭條熱榜”及“今日關注”“北京熱榜”,整個交互形式類似微博熱搜。

          2.圖標入口

          首頁功能入口處明顯排行榜圖標,優先級較高,常見自帶推薦屬性,能夠幫助用戶快速選擇,減少選擇成本,比較依賴榜單的應用。比如:豆瓣、音樂類、騰訊動漫等應用。

          其中豆瓣、網易云音樂由于各種類型的排行榜很多,在圖標點擊開后,在當前頁面平鋪不同維度榜單類型,用戶進行點擊跳轉;騰訊動漫相對榜單類型較少,在左邊側邊欄切換不同的榜單。

          3.商品詳情頁榜單入口

          用戶查看商品詳情時,可能會希望能夠橫向對比同類商品,才能最終決定購買那件商品。常見于電商類應用,比如:京東、拼多多、得物等。點擊后進入不同的榜單頁面,獲取更多產品信息進行篩選。(淘寶的商品詳情頁沒有排行榜,但在首頁卻存在隱形排行榜,在隱形排行榜模塊會有詳細說明)。

          4.搜索-篩選(無明確搜索目的)

          當用戶沒有明確搜索目的時,搜索框的下方,平臺會推薦沒有明確指向性但有熱度的產品信息。衡量的標準一般為搜索熱度或信息本身的熱度。利用榜單效應留住用戶,比如:微博熱搜、淘寶熱賣、抖音熱榜等。


          沒有明顯排名及規則,但經過大數據、平臺或榜單制作者篩選后呈現在平臺用戶的面前,位置越靠前,在用戶心目中的默認位置越靠前,比如淘寶的“有好貨”、編輯精選等。

          1.編輯推薦/小編推薦

          在平臺建立初期沒有特別的內容供平臺呈現,這時候就需要平臺人工有目的的推薦一些內容,不同于“猜你喜歡”建立在用戶的行為數據下,編輯推薦更多的平臺希望用戶看到的內容,一方面作為平臺內容的輸出口引導用戶,另一方面內容是平臺自己發布內容,也可以保證內容的高質量。

          2.猜你喜歡/相關推薦

          平臺根據用戶之前的瀏覽量、收藏量、轉發、搜索等用戶行為數據推薦給用戶相關內容。這個時候的應用基本已度過最初的獲客期,并且存在大量的平臺用戶使用數據,“猜你喜歡或相關推薦”模塊用來增加用戶的瀏覽時長及購買的可能性,各大應用平臺適用性強,一般出現在首頁部分。

          3.年度總結排行榜

          朋友圈每年年底都會曬出的各種各樣的生活、音樂、消費的排行榜,這些其實是用戶自己確定了解自己,且喜歡他人了解自己的一種方式。用戶通過網絡數據折射出自我的輪廓,清楚的認識自己。

          4.TOP排行榜

          不知道大家小時候看沒看過《第10放映室》,那是我最早關于排行榜的印象,里面會有各種最佳動作片總結、最佳男配角總結等等,以香港電影偏多,是我早年的電影信息資料庫?,F在我們也會在小紅書、抖音、公眾號平臺刷到各種各樣的top推薦,這其實也是排行榜的一種。TOP類是已經經過人為篩選的排行榜,從眾多選擇中選擇出部分答案,給出理由,而用戶只需在已被篩選過的內容中進行決定,節省選擇成本,比如豆瓣每年都會舉行的豆瓣電影。另外一種TOP榜并不能幫助用戶做決定,但可以迎合用戶對確定性需求的各種盤點性質的排行榜,比如抖音的TOP榜哥就是盤點各種內容,人物。

          5.搜索-篩選(有明確搜索目的)

          相比其他排行榜,篩選后的內容已經體現了用戶的具體需求,高效明確的給用戶提供選項,引導用戶快速選擇。


          排行榜一般由必需的榜單頭部、上榜主體,及非必需的榜單規則、更新信息構成;而上榜主體由必需的主體信息、排序,以及非必需的推薦理由、排名變化、熱度信息構成。

          好的榜單能夠快速吸引用戶快速找到自己的需求點,引導用戶點擊排行榜進行查看。而榜單頭部也由于功能需求的不同分為唯一性榜單頭部、可復用性榜單頭部。

          1.唯一性榜單頭部

          當排行榜在整個應用中有且只有一個時,通常會對榜單頭部的背景及榜單名稱進行個性化、品牌化設計。比如微博的微博熱搜、知乎的鹽選榜單、今日頭條的頭條熱榜、大眾點評的大眾點評榜單等。其中微博、頭條、大眾點評都在名稱上有做品牌漏出,增加平臺的品牌權威性。

          2.可復用性榜單頭部

          有些應用平臺會存在內容需要多種不同緯度的排行榜展示的情況,為了平臺的統一性、降低后期的維護成本,一般會使用可復用的榜單頭部,如豆瓣、京東、QQ音樂等。

          得物通過替換左右切換商品進行宣傳。豆瓣、微博、馬蜂窩雖然都是通過替換圖片及文案的形式達到適配,但根據場景又有不同。豆瓣、微博因榜單效應根據榜單第一位的變化更換底圖及文案;馬蜂窩沿用自己品牌的蜂窩形狀及“馬蜂窩榜單”的標簽設計形式,通過更換文案底圖達到適用不同主題;京東就相對比較簡單,只是更換標題的文案達到多主題適配。


          排行榜上榜主體由于不同的場景業務需求,一般有純文字形式、圖文結合形式、橫排+列表結構3種表現形式,其中主體信息及排序為排行榜必須信息,而推薦理由、排名變化、熱度信息、評分等等非必須信息則根據用戶關注信息點選擇漏出。

          1.純文字形式

          純文字的排行榜一般是以內容(或標題)加排名的形式出現,常見以信息為主的排行榜,比如微博、知乎、今日頭條等以信息為主要關注點的應用,或是搜索列表下方的熱度排行榜。信息類排行榜一般以信息熱度為衡量標準,因此會在標題及排位外,增加各種突出熱度信息的表現形式,如關注熱度人數,或是“熱”“新”“爆”等等表示熱度的標簽,如抖音、微博。而淘寶搜索熱度則是在標簽外增加了上升下降的排名變化。

          2.圖文結合形式

          相對于純文字形式,圖文結合的排行榜因為圖片信息的增加,使整個榜單主體占居更多的空間也可以展示更多的產品信息,輔助用戶進行選擇。

          • 圖片形式

          上榜主體圖片尺寸一般會有橫版、方版、豎版3種形式。頭條、知乎等資訊類應用都采用傳統的橫版圖片形式,延續了用戶閱讀新聞類資訊的習慣;而豆瓣、騰訊動漫等由于現實中書籍封面、電影海報等用戶視覺場景都是豎版構圖,因此沿用至線上使用的也是豎版圖片形式;而京東、大眾點評、馬蜂窩則使用方版的圖片形式,大概是因為產品的多樣性需要考慮多種圖片的適配問題。(視頻、游戲類由于使用場景大部分采用橫版圖片形式;但由于游戲封面、宣傳海報也會有豎版的形式,比如:游民星空、小黑盒)。

          • 左文右圖VS左圖右文

          每當設計圖文結合的部分,首先要考慮到底是采用左圖右文還是左文右圖的形式呢?可能很多人會說這兩種形式沒有什么大的區別啊,有什么可糾結的!或者認為由于視頻、圖片、文字對人類的吸引力是呈遞減形式的,因此應該選擇左圖右文的形式。但實際上這跟我們長久以來的閱讀習慣以及應用希望觸達的用戶類型有很大的關系。

          人類對畫面的閱讀及掃描方式通常為三種布局方式,包括:古騰堡圖(Gutenberg),Z型(z-pattern)和F型(f-pattern)。其中產品列表頁中最常使用的就是F型布局模式,F型布局是雅各布·尼爾森(Jacob Nielsen)在公司進行眼動追蹤研究后首次提出的。與其他模式相同的是,眼睛從上/左,水平移動到上/右,然后回到左邊緣再此進行水平掃描。但在F型布局第二次掃頻后,向右掃動的次數會越來越少,并且會隨著向下移動,眼球會緊貼左邊緣。用戶也傾向于F型模式瀏覽瀏覽整個頁面,即自左向右自上而下的閱讀模式,越向下信息獲取效率會越低

          因此今日頭條、知乎等需要通過文字傳遞給用戶準確、豐富的新聞資訊類應用普遍以左文右圖的形式展現。而電影、游戲、動漫等以畫面觸達用戶需求的應用則都采用的是左圖右文的表現形式,比如:騰訊動漫、愛奇藝、得物等等。

          3.橫排+列表表現形式

          說到排行榜我們一般第一個會想到領獎臺,很多平臺也采用領獎臺這種前三名橫排+其他排名列表的結構。純列表形式的排行榜,平臺用戶的注意力大部分集中在第一名,而領獎臺的形式模仿現實生活中的獎勵形式和儀式感,將整個排行榜的關注范圍從第一名擴展至3名,另一方面排行榜的競爭關系從單一爭爭奪一名變成前三名的競爭關系,增加了第一名的高度。(目前這種形式我只在微博的明星勢力榜及抖音的直播總榜中有看到)


          榜單規則是排行榜規則的描述,是平臺權威性的體現。榜單規則有些平臺本身具有數據庫,會有相關的平臺數據支持如京東;而汽車之家則依靠“汽車工業協會”外部的數據支持,增加平臺的權威性及榜單的可信度;

          信息更新一般存在在榜單頭部和上榜主體的中間,有些是固定時間更新,也有類似微博熱搜是實時更新的模式,而騰訊動漫的更新作為用戶的痛點會在延續企鵝形象的側邊欄頭部標明榜單更新周期。


          排行榜的成功看似是人們對于選擇困難、信息獲取的解決方案,但歸根到底因為人們對于不確定性的懼怕,無論是信息的不確定性或是對自身價值的不確定性。而平臺方利用金錢、名譽、獎勵的外部激勵方式,結合滿足感、確定性、社交性的內在激勵相互作用使得排行榜成為無論何種平臺都非常受歡迎的產品功能。作為平臺方因產品使用受眾、產品側重點、宣傳方式的不同,排行榜會以多種入口及展現形式出現。作為設計師需要深入了解排行榜等功能背后的產品邏輯,以及用戶操作行為背后的思考及心理效應,提出合理的設計,幫助用戶了解產品功能,滿足用戶需求。



          資料來源:

          • 社交的本質

          • 社會心理學對用戶體驗的影響系列:權威性原則

          • 3 Design Layouts: Gutenberg Diagram, Z-Pattern, And F-Pattern

          • 交互分析:排行榜應該如何設計?

          • 如何利用好排行榜產生榜單效應?

          • 萬字長文深度分析:產品排行榜的設計和玩法

          • 關于排行榜的設計,這有一份7000字干貨手把手教你做!

          • 淘寶“有好貨”競品分析:淘寶為何要把排行榜藏起來?

          • 我們曬網易、支付寶年度榜單,其實只是在曬自己?

              文章來源:站酷   作者:9號自習室

              分享此文一切功德,皆悉回向給文章原作者及眾讀者.

              免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

              藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、
              BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務


          UI設計師交互設計-如何寫好產品體驗文檔

          周周

          文章將分為6部分

          1、撰寫文檔的目的

          2、什么樣的產品值得體驗

          3、產品體驗類型

          4、產品體驗文檔應該包含的內容

          5、文檔質量的評判標準

          6、體驗文檔和競品文檔的異同


          一、撰寫目的


          首先要理清楚,我們為什么要寫產品體驗文檔, 是工作需要?還是興趣使然?
          明確寫作目的才不會迷失方向,不知道自己在寫什么,應該寫什么。 


          其次,要 明確文檔的受眾是誰。 
          好的文檔,是寫別人想看的內容,你要明白受眾想要看什么內容。 

          二、什么樣的產品值得體驗


          1、與你工作相關的

          如果你是做平臺型電商,那么淘寶、京東這些你就得去體驗體驗。


          2、上熱搜、應用商店登榜

          例如之前大火的啫喱,一度在APP Store的熱度超過微信、抖音,作為產品經理就很有必要下載體驗一番,琢磨一下它爆火的原因,提升自己的產品感覺。 

          3、新穎的商業模式

          例如之前QQ音樂,在聽歌過程中給用戶插入廣告播放,雖然極度惡心,但確實是一個比較新穎的商業模式。。。 


          4、新穎的交互模式

          例如現在有很多APP的開屏廣告,直接使用手機的重力感應器,用戶稍微搖動手機就會跳轉到對應的廣告頁,不需要用戶去點擊。 
          雖然我覺得這種交互方式挺惡心的,但在不同的場景下,其實也有可借鑒之處。 


          5、新穎的解決方案

          例如之前房產平臺推出的3D實景看房,用新的方式更好地滿足,用戶想直觀了解房屋布局的需求。 


          三、產品體驗類型


          1、深度體驗


          特點: 多角度、深挖產品細節。 
          這意味著,我們需要投入大量的時間和精力,持續做很多案頭工作。 

          哪些產品適合我們去做深度體驗呢? 
          個人建議是:經久不衰、行業TOP 10、與你工作比較相關的產品。 

          全面體驗這些產品,可以在很多方面帶給我們靈感。 
          例如從0到1它是怎么做出來的?1到100的推廣它是怎么完成的?100到正無窮的行業壁壘它是怎么形成的?...... 

          相信我,花一段時間去持續研究這些產品,一定收獲滿滿。 

          2、快速體驗


          「快餐式」體驗,特點: 短平快。 
          當我們想了解一些產品有趣的表現層、交互層設計時,就可以用這種方式,花個1-2小時把玩,記錄你覺得特有意思的點。 

          四、文檔應該包含的內容


          接下來,阿G將通過分析「善診」這款APP,和大家分享一下,好的產品體驗文檔應該包含的7部分內容。 

          注意: 我們不是為了寫文檔而寫文檔。

          1、體驗環境


          1)產品信息,通常會包含

          • 產品名稱 
          • 產品logo 
          • 產品版本 

          2)體驗信息,通常會包含

          • 體驗人 
          • 體驗目的 
          • 體驗時間 

          3)系統信息,通常會包含

          • 體驗系統 
          • 體驗設備 


          撰寫體驗環境的 3個注意事項: 

          1、產品版本 
          不同環境,版本可能不一樣,導致功能、界面等差異。 
          例如善診,截止文章發出前,蘋果最新的版本是2.7.0,小米最新的版本是2.6.0,華為最新版本是2.6.9,所以寫的時候最好備注一下。 

          2、體驗時間 
          可以是持續一段時間,特別是深度體驗時。 

          3、寫體驗環境的目的 
          為了讓讀者(包括自己)清楚了解所體驗產品的基礎信息,方便(日后)翻閱。 
          特別是體驗目的,  很清晰地讓讀者知道, 為什么要體驗這款產品,體驗這款產品能收獲什么。 


          2、產品概述


          1)產品類型

          寫清楚產品的類型和形態,例如善診是一個中老年健康醫療服務平臺,專注在移動端。 


          2)Slogan

          一個產品向外界傳遞的產品理念,例如「父母健康找善診」。 


          3)產品介紹

          通過體驗產品和查閱公司/產品的資料,為讀者提煉產品特點,介紹產品的主要用途。 


          4)產品歷程

          按時間線,介紹產品一些重大事件。 

          以上信息獲取渠道:
          1、公司官網(特別是B端產品,官網會給你安排得明明白白) 
          2、應用商城相關的產品介紹(注意靈活使用搜索引擎,哈哈) 


          3、用戶分析


          1)用戶畫像

          一般會從人口學、社會學角度,放一些用戶的年齡分布、地域分布、學歷、性別占比等數據。 
          具體還是要以體驗的產品類型、所處行業為準,把需要呈現給讀者的重點信息放出來就好,不用貪多。 


          2)用戶需求


          3)使用場景

          通過行業信息、產品功能、用戶畫像,結合自己的思考,提煉重點用戶需求和使用場景。 
          很多時候,我們不熟悉體驗產品所處的行業,不要緊,可以猜,然后通過和他人交流、查閱資料,修正內容。 


          以上信息獲取渠道:
          1、用戶畫像:百度指數、頭條指數,或者行業報告 
          2、需求和場景:行業報告 + 體驗產品(當然如果你身處于行業之中,就可以依據經驗來做一些總結) 

          4、商業模式


          1)模式概述

          詳細描述一下公司/產品的變現方式,最好可以圖文 + 數據。 


          2)模式優勢

          每一個產品能活下來,都有能夠形成閉環、具備一定優勢的商業模式。利用搜索引擎查閱相關資料,再加上對產品的體驗思考,剖析、學習其商業模式,有助于培養我們的商業嗅覺。 


          以上信息獲取渠道:
          行業報告 + 新聞報道 


          做產品,可不僅僅是為了情懷,首先你要考慮的是,如何活下去。


          5、市場表現


          1)市場/用戶規模

          產品在所處市場的占比,或者用戶規模,可以側面驗證它是不是一個好產品。 
          這里的「好」不僅是用戶體驗好,更是真正解決了一些行業/用戶的需求。 


          2)融資情況

          資本是最敏感的,一個產品有沒有前景,融資情況會很坦白地告訴你,哈哈。 


          以上信息獲取渠道:


          1、市場/用戶規模 
          • 上市公司,可以看一下財報,里面真的啥都有...... 
          • 非上市公司,那只能去官網瞅瞅,或者通過搜索引擎,看看對應的小道新聞或者行業報告 


          2、融資情況:企查查 

          6、運營體系


          1)版本迭代

          為什么要看產品的版本迭代? 
          任何產品的迭代,都是基于內外部環境變化引起的策略調整,我們可以通過觀察某個產品的迭代情況,培養我們對市場環境變化的敏銳度。 
          同時可以通過歷史版本迭代,思考產品的迭代邏輯和規律,看看是否有可借鑒之處。 


          2)增長轉化策略

          結合時間線和版本迭代記錄,思考體驗產品的運營策略是如何完成其用戶/銷量的增長轉化。 


          以上信息獲取渠道:
          版本迭代:七麥數據、App Annie(付費) 

          7、功能體驗


          1)核心流程圖

          通過把玩產品,梳理出最核心的業務流程圖。 

          2)信息架構圖

          信息架構圖,簡而言之就是把產品主要對象的屬性列出來,與頁面、交互都無關。(后面可以再單獨出一篇和大家聊聊信息架構圖應該怎么畫) 

          3)特色功能

          可以找一些你覺得最有意思,最特別的功能,并做簡單介紹。 

          4)產品建議

          在體驗產品過程中,覺得哪些地方可以改進,具體說一下問題點,分析問題點可能產生原因,再提出有效的改進建議。 

          8、總結反思


          對比自身

          思考一下體驗產品上某個亮點,如何能和自己負責的產品進行有效結合,站在巨人的肩膀上看世界。 

          上面說的7部分內容,是不是每次寫體驗文檔的時候,都應該有? 
          當然不是,我們應該根據體驗目的、體驗類型、產品類型,適當地做一些裁剪。 

          五、文檔質量的評判標準


          圍繞著體驗目的和讀者感受,可以把產品體驗文檔的質量評判標準做一個總結。


          1、通用(兩種體驗類型都應該有)

          1)體現產品核心價值

          2)抓住產品重點

          3)體現產品特色

          4)結構清晰

          5)格式美觀

          6)思考總結


          2、深度體驗可以有

          1)詳細數據支持

          2)商業模式分析


          六、體驗報告和競品報告的異同


          很多小伙伴會把產品體驗報告和競品分析報告搞混:都是對產品進行體驗和分析,除了名字之外,到底有啥區別?


          我們從「異同」兩個方面來分析,看看它們究竟有啥區別。


          1、異


          1)目的不同

          競品分析文檔是對競品做分析,常用SWOT模型,將自己和競品做對比分析,學習借鑒。而產品體驗,不一定是競品,可能只是你個人感興趣而已。


          2)范圍不同

          競品分析文檔,一般僅限于輸出競品的思考總結,而產品體驗的范圍更廣。


          3)深度不同

          產品體驗可以淺嘗輒止,但競品分析不行,競品分析需要透過現象看到本質,觀察競品的一舉一動,配合市場動態,不斷調整我們自身產品方向,甚至是公司戰略定位。


          2、同


          產品分析報告和競品分析報告,除了都是對產品進行分析之外,還有一個共同點:我們要 做自己。 
          不管體驗的產品多厲害,不管競品多無敵,我們都是抱著學習、借鑒的心態去分析,去思考問題。 
          每個團隊、每個產品誕生的環境都不盡相同,縱然其他產品做的再好,我們也不能「全盤皆抄」,要時刻保持初心,做自己。 


          好了,產品體驗文檔如何撰寫,阿G就先聊到這里。 

          其實產品體驗的整個過程,最重要是以下幾點思考: 
          1、如果你是這個產品的產品經理,你會用什么方案去解決重點用戶的需求?
          2、你的方案和現在產品方案的差異點在哪里?
          3、為什么會有這些差異點?

          4、方案對比的優缺點各有哪些?


          不管是C端還是B端,不斷思考這幾個問題,相信慢慢就提升自己的產品Sense。 

          多體驗、多思考、做自己、少糾結模板

          文章來源:站酷 作者:阿G聊產品

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務



          淺析用戶體驗四維度

          純純

          用戶體驗四維度的概念、價值以及相互之間的關系

          用戶體驗,是用戶在使用產品過程中建立起來的一種純主觀感受。

           

          解讀用戶體驗,可以有很多視角。本文提供一個以人為本的視角:用戶體驗四維度。具體如下。

           

          HI X:Human Interface Experience,人與界面的交互體驗。

          HC X:Human Content Experience,人與內容的交互體驗。

          HH X:Human Human Experience,人與人的交互體驗。

          HB X:Human Brand Experience,人與品牌的交互體驗。


          用戶體驗四維度

           

           

          01 四維度的概念

           

          怎樣判斷一款產品有幾個維度?這就要從四維度的概念說起。

           

          1. HI X(人與界面的交互體驗)

           

          HI X 是指用戶在瀏覽、閱讀、操作界面過程中產生的主觀感受。

           

          HI X 既受信息架構、交互設計和UI設計的影響,也受根需求和功能架構的影響。主要依托手機和電腦的互聯網產品,天然存在界面。所以,HI X 屬于基礎屬性,所有產品都有。

           

          2. HC X(人與內容的交互體驗)

           

          HC X 是指用戶在消費內容時,內容本身帶給用戶的主觀感受。

           

          這里的內容,既包括衣服、鞋子等實體商品,也包括文章、圖片、視頻等虛擬內容。諸如淘寶、網易嚴選等電商產品,以及公眾號、Instagram、抖音等 UGC 產品,都具備 HC X 屬性。

           

          3. HH X(人與人的交互體驗)

           

          HH X 是指用戶與其他用戶、產品工作人員溝通交流時產生的主觀感受,或產品的社區氛圍、溝通氛圍帶給用戶的主觀感受。

           

          所以 HH X 有兩層含義。第一層發生在用戶與用戶之間,是指當用戶扎堆或溝通交流時,交流氛圍、交流內容帶給用戶的主觀感受。第二層發生在用戶與產品工作人員之間,是指當產品依靠人力向用戶提供咨詢、售后、配送等服務時,產品工作人員的服務行為帶給用戶的主觀感受。

           

          關于第一層含義,不管是更強調社區屬性的產品,比如天涯社區、豆瓣小組、百度貼吧,還是更強調內容屬性的產品,比如公眾號、微博、小紅書的筆記,都具備 HH X 屬性。

           

          關于第二層含義,常見的 HH X 由客服人員提供。如果是電商產品,提供人員還包括快遞員和售后人員等。

           

          4. HB X(人與品牌的交互體驗)

           

          HB X 是指當用戶想起、談論起品牌,或使用品牌的產品、體驗品牌的服務時,品牌帶給用戶的主觀感受。

           

          只要一款產品做成了品牌,它就有 HB X 屬性。

           

          HB X 會直接影響到我們是否信任、喜歡一個品牌,以及是否會使用它的產品和服務。所以,我們對 HB X 往往會有一個抓重點的綜合評價。就像一個外向活潑的女生,雖然在外向程度方面和一個內向安靜的男生不一致,但雙方也可能會選擇在一起,因為內向、外向并非雙方關注的重點。

           

          因為 HB X 牽涉到對品牌的綜合評價,所以就像工作都有一段試用期、戀愛都有一段了解期一樣,HB X 的形成往往也需要較長時間,通常至少要 3~5 年。

           

           

          02 四維度的價值

           

          每一個維度,各有什么價值?

           

          1. HI X(人與界面的交互體驗)

           

          作為基礎屬性,HI X 的價值主要體現在以下兩方面。

          如果是一款只具有 HI X 屬性的工具型產品,比如視頻會議產品 Zoom,那于這款產品而言,HI X 就是一切,這款產品的成敗也幾乎完全取決于 HI X。

           

          如果是一款同時具有 HC X、HH X 屬性的內容型社區型產品,比如 B 站、快手這些視頻類產品,那此時的 HI X 就會扮演一個類似交通出行(基礎設施)的角色。如果 HI X 比較差,這個“出行”過程就會像出去玩時的塞車一樣,讓人難受;如果 HI X 很優秀,這個“出行”過程就會像準點的高鐵、飛機一樣,又快又爽。

           

          2. HC X(人與內容的交互體驗)

           

          HC X 主要從內容層面影響用戶滿意度。

           

          如果 HC X 比較好,用戶消費時的決策時間就會被大大縮減,同時用戶滿意度也會比較高。比如淘寶上就有一些原創設計、質量不錯、價格不貴的精品小店,很受歡迎。我們去網易嚴選、優衣庫天貓旗艦店這些質量不錯、設計不錯、價格適中的店鋪買 東西時,也會很快很省心。

           

          以上說的是電商產品,對于 UGC 類的內容產品,也是類似的道理。比如站酷上的首頁推薦和編輯推薦,相對而言,HC X 比較不錯,所以看這些內容的用戶也會比較多。

           

          3. HH X(人與人的交互體驗)

           

          HH X 是用戶情緒的最大影響因素,在情感方面對用戶具有最大吸引力。物以類聚,人以群分。HH X 良好的產品,會像一場談笑風生、其樂融融的聚會,吸引用戶去扎堆。

           

          良好的 HH X 往往意味著良好的氛圍,它不僅能帶給我們諸如輕松、愉快等積極情緒,還能在一定程度上帶給我們一種歸屬感。最終的結果,就是我們喜歡用這款產品。比如 B 站的 HH X 就比較好,具體而言就是彈幕氛圍比較歡樂友好,這樣的氛圍帶給用戶的感覺是比較好的,用戶也喜歡在 B 站就著彈幕看視頻。

           

          4. HB X(人與品牌的交互體驗)

           

          HB X 事關品牌能不能以正面形象住進用戶心里。

          良好的 HB X,往往意味著良好的品牌美譽度和忠誠度。HB X 良好的產品,就像你信任和喜歡的男/女朋友一樣,他/她會在你心里占據一定的分量和地位,讓你樂意介紹給家人和朋友認識。比如蘋果的 Mac,就有很高的品牌美譽度和忠誠度,用戶也很樂意把 Mac 推薦給身邊的朋友。

           

           

          03 四維度的關系

           

          四維度之間存在怎樣的關系?

           

          1. HI X 是另外三個維度的基礎

           

          HI X 作為基本維度,相當于“水之源,木之本”。如果把用戶體驗四維度比作一個金字塔的話,塔底的基石一定是 HI X,塔尖則是 HB X。

           

          2. HC X 通常是 HH X 的基礎

           

          HH X 的產生,通常離不開 HC X。也就是說,通常得有一個合適的“內容”或“主題”,才能把人聚攏過來。比如結婚的時候,你可以邀請到很多親朋好友來參加婚禮,但在平時,你很難邀請到這么多人。我們在 B 站看視頻的時候,彈幕通常比較歡樂友好,氛圍不錯,但如果沒有這些視頻,也就不會有這些彈幕,以及不錯的社區氛圍。

           

          3. HI X、HC X 和 HH X 共同構成了 HB X 的基礎

           

          HC X、HH X 和 HI X 一樣,都可以成就 HB X。

           

          以早期 Keep 為例,剛開始只有課程這個功能,也就是說只有 HI X 和 HC X 這兩個屬性。其中,HI X 還可以,HC X 比較優秀。在此基礎上,慢慢發展出了社區功能(HH X 屬性),而且做得不錯。再往后,有了“自律給我自由”的品牌精神。在課程、社區、品牌精神等因素的助力下,Keep 有了不錯的品牌美譽度和忠誠度。也就是說,HC X、HH X 和品牌精神等因素,一起成就了良好的 HB X。

           

          4. HB X 也可以僅有 HI X 這一個基礎

           

          有些產品并不具有 HC X 和 HH X 這兩個屬性,而是僅有 HI X 這一個屬性。單憑一個良好的 HI X,也可以成就良好的 HB X。

           

          比如 Zoom,作為一款開視頻會議的工具應用,它最初只有 HI X 這一個屬性。但是因為很好用,HI X 很優秀,所以如今的 Zoom 即便沒有內容(HC X)和社區(HH X)屬性,依然成了一個在全球都很受歡迎的品牌,擁有了不錯的 HB X。

           

          總的來說,在四維度的金字塔里面,它們的關系如下圖所示。


          文章來源:站酷    作者:SnowDesign

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 平面設計服務


          產品用戶體驗案例分析

          純純

          目錄


          1.百度網盤 :會員標識

          2.當當:搜索記錄隱藏

          3.當當:分享動效 ? 一鍵制作朋友圈分享海報

          4.抖音:點擊復制 ID

          5.飛書:效率工作—語言自動轉化

          6.美團:優惠卷新到提示

          7.墨跡天氣:一鍵登錄(大部分應用已上線該功能,部分應用仍未上線)

          8.起點讀書:長按可進行互動

          9.騰訊視頻:亮度調節的動效設計

          10.微博:點贊動效設計

          11.知乎:刪除搜索記錄

          12. QQ:可隱藏會話

          13. QQ 音樂:搜索入口的聽歌識曲

          14. QQ 閱讀:長按復制的放大設計


          一、百度網盤:會員標識別


          在開通會員后百度網盤會進行對于應用圖標的更換,使得應用圖標更加高級,在分享鏈接時也會加入會員分享的標識。


          屬于用戶激勵體系中的一個板塊,增強用戶的標識和身份。




          二、當當搜索記錄隱藏


          搜索隱藏功能設定。


          我們在使用各大應該的搜索功能時總會遇到過這樣的場景,當你要某人或者在某種場景下需要進行搜索時,來不及刪除自己的搜索記錄出現社死的情況。


          而當當的搜索隱藏就可以完美的解決這個問題,退一步講我們可以思考一下為什么別的成熟型應用,沒有采用這樣的方式。大部分是沒有這個功能,其余則是在搜索這一個功能上已經添加了其余用戶體驗的設計。所以在這一塊就沒法加入這個設計。




          三、當當:分享動效 ? 一鍵制作朋友圈分享海報


          在當當應用中點擊分享進入頁面后不同于傳統的分享頁面,而是把分享到微信和分享到朋友圈進行了動態設計。并且在分享到朋友圈的右上角加上了海報的標識。我們點擊會自動跳轉生成海報。


          這樣的設計可以更加吸引用戶的眼球并且自動生成海報可以激發用戶在朋友圈轉發的次數。



          動效展示



          四、抖音:點擊復制 ID


          主頁 ID 點擊可進行復制  很多應用都有 ID 。但是當我們要進行 ID 搜索的時候,我們便需要一遍一遍的反復查看或者記住這個 ID 然后再進行搜索。


          目前部分的應用也上線了類似的功能,讓用戶點擊 ID 區域可進行復制。對于用戶體驗的提升有著很顯著的效果。




          五、飛書:效率工作語言自動轉化


          飛書屬于一款協同辦公類的應用


          在飛書的設置用有語音直接轉換文字的說明,飛書本身便是一款協同辦公類的產品。此產品效率便是產品關鍵詞之一,所以加入這樣的設置可極大的提升用戶的體驗。




          六、美團:優惠卷新到提示


          有提示用戶新到多少張優惠卷的提示


          可以促進用戶消費的同時能幫助和提醒用戶去使用消費卷不僅提高了商家的銷量還使得用戶在消費中發現自己的優惠卷及時使用




          七、墨跡天氣:一鍵登錄(大部分應用已上線該功能,部分應用仍然未上線)


          一鍵登錄


          應用登陸中目前主流為(1.第三方登錄,登陸之后需要再次綁定手機號。2.手機號注冊登陸,登陸之后可選擇是否綁定第三方。3.一鍵登錄,登陸之后可以選擇是否綁定第三方)在設計流程中,設計開發者需要盡可能的減少對流程的復雜化。


          一鍵登錄在為看來是最喜歡的一種登陸方式。導致現在如果需要各種注冊綁定,除非必要的情況下,我會直接放棄這款應用。





          八、起點讀書:長按可以進行互動


          長按頁面可以框選當前的段落,并且出現互動選項。

           

          增加用戶和用戶之間,用戶和作者之間的互動。使得用戶在讀書的同時有著較強的參與感。




          九、騰訊視頻:亮度調節的動效設計


          滑動可調節亮度

           

          左邊的小動效的設計加上右邊的漸變進度條,使用戶可以更加明確的知道自己所處于一個什么樣的觀看環境,并且加入了漸隱漸現的出場和入場。

           

          用一個小巧的動效設計幫助用戶確定自己的亮度屬性,




          動效展示




          十、微博:點贊動效設計


          點擊點贊會出現彩色的波浪并且不斷擴散的同時有小表情彈出。


          增加趣味性和互動性。




          動效展示




          十一、知乎:刪除搜索記錄


          清空時會在進行確認,再次點擊全部刪除方可刪除。


          在下方列表中可逐一刪除,上面清空中不是點擊后就全部清空。而是再次出現,起強調和確認的作用。


          增加用戶體驗,幫助用戶進行二次確認和防止用戶誤觸。作為一款咨訊類應用用戶的搜索記錄也是比較重要的。




          十二、QQ:可隱藏會話


          前幾天發現的一個神級功能(雖然我已經不用 QQ 進行社交了),當時我外甥和我講述了這個功能他么00后戲稱為養魚神器。


          在好友的設置中可隱藏會話,開啟隱藏會話以后。此聯系人發來的消息不會顯示在聯系人列表。需要自己手動去設置隱藏會話列表去尋找。


          應用的功能更加多樣化滿足多種不同的需求。




          十三、QQ 音樂:搜索入口的聽歌識曲


          在搜索入口加入了聽歌識曲且進入界面后可進行聽歌識曲和哼唱識別的切換


          搜索歌曲界面的使用場景為:1.用戶得知該歌曲的名稱或者歌詞進行搜索。2.用戶聽到了某一首很好聽的歌曲想進行搜索。此時在場景二的情況下,正好可以進行聽歌識曲。聽歌識曲此功能在比較舊的版本屬于主頁中的一個模塊,把聽歌識曲放到搜索入口處更加符合用戶場景。


          對用戶場景進行細致的研究,增加了用戶體驗。




          十四、QQ 閱讀:長按復制的放大設計


          長按復制會有放大鏡設計


          當用戶處于復制文案的場景下時,由于復制需要拖動,在拖動的過程中會按壓住自己所處于的復制內容位置。所以在用戶進行復制時加入放大鏡的設計會使得用戶清楚的明白自己復制到哪里,不需要后續用戶在進行刪減。


          極大的加強了此場景下的用戶體驗


          動效展示


          文章來源:站酷    作者:張陽光Designer

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務


          交互設計之探索GUI和VUI

          純純

          一、GUI和VUI的定義:


          1.1GUI


          GUI(Graphical UserInterface)圖形界面,市面上最常見的交互方式。點觸,滑動,作為主要輸入方式。圖像顯示作為主要輸出方式。




          1.2VUI


          VUI(Voice User Interface)語音界面,常見沒有屏幕的智能音箱/耳機,靠語言輸入和交流,如我們常見的小艾同學,天貓精靈等。





          二、GUI和VUI的發展歷程:


          2.1GUI的發展歷程


          1973年第一個可視化操作的Alto電腦在施樂帕洛阿爾托研究中心(Xerox PARC)完成。Alto是第一個把計算機所有元素結合到一起的圖形界面操作系統。它使用3鍵鼠標、位運算顯示器、圖形窗口、以太網絡連接。

          1981年施樂公司推出了Alto的繼承者Star,Alto曾首次使用了窗口設計。

          1983年蘋果電腦公司推出Apple Lisa個人電腦,是全球第一款搭載圖形用戶界面(GUI)的個人電腦。

          1984年蘋果電腦公司推出Macintosh。

          1986年首款用于Unix的窗口系統X Window System發布。

          1988年IBM發布OS/2 1.10標準版演示管理器(Presentation Manager),這是第一種支持Intel計算機的穩定的圖形界面。

          1992年微軟公司發布Windows 3.1,增加了多媒體支持。

          1995年微軟的Windows 95發布,其窗口操作系統的外觀基本定型。

          1996年微軟發布Microsoft Bob,此軟件具有動畫助手和有趣的圖片。

          1996年IBM發布OS/2 Warp 4,它的交互界面得到顯著改善,至今仍有不少ATM機運行這樣的系統。

          1997年KDE和GNOME兩大開源桌面項目啟動。

          1997年蘋果電腦公司發布Mac OS 8,這個系統具有三維外觀并提供了SpringLoaded Folder功能。

          2000年蘋果電腦公司推出Mac OS X系統的默認外觀Aqua。

          2001年微軟發布Windows XP,實現了主題支持。

          2003年Mac OS X v10.3提供了一鍵單擊訪問任何已打開窗口的功能。

          2003年Sun公司的Java桌面系統為GNOME桌面添加了和Mac類似的效果。

          2006年微軟發布Windows Vista,對此前其視窗操作系統的外觀作了較大的修改,實現了Aero功能。



          2.2VUI的發展歷程


          20世紀90年代,誕生了第一個可行的、非特定的(每個人都可以對他說話)的語音識別系統,交互式語音應答(Interactive Voice Response,IVR)系統的出現代表了VUI的第一個重要時期。人通過電話線路進行交互并執行任務,如機票預訂、銀行轉帳、業務查詢等。


          目前很多像siri、Google這類集成了視覺和語音信息的APP,以及Amazon Echo這類純語音的設計產品,逐步發展并成為主流。隨著語音識別技術、AI技術、互聯網技術的發展,我們已經可以在手機設備中用語音處理很多事情,但還有很多事情目前無法通過語音完成,需要我們探索。




          三、GUI和VUI的設計要領:


          3.1GUI



                  交互的多樣性:


          不同于PC機通過鼠標來點擊,在觸控設備上通過手指點按,由于手指的精確度相對于鼠標指針差很多,所以子啊移動頁面設計當中的交互元素一定得辨識作用,手機并沒有懸停操作所以圖標如果特征不明顯時一定要加文字識別,設計時也應注意圖標和菜單元素的尺寸。


          拖拽和移動是很相似的交互工作,被拖拽的元素始終跟隨著緊貼屏幕的指尖


          除了使用單指之外,還可以用兩個手指放大,縮小圖片,如果設計了一些新的多指交互一定要給用戶提示和指導。


          3.2VUI


          3.3VUI的適用場景


          智能家居

          在智能家居領域VUI應用越來越廣泛,相信在不久的將來我們一定能夠享受到更多的VUI所帶給我們的便利。


          輔助駕駛

          車載語音交互系統使得我們可以在開車的同時接聽電話、聽廣播等。


          企業應用

          未來大型企業中將會多領域應用VUI,用于書寫、記錄等工作。


          醫療教育

          智能記錄病例、管理病例的出入。


          四、VUI的語言設計注意事項


          過多的聲音干擾,不但會增加用戶的心智負擔,將會引起用戶感到厭煩,尤其是,語音在資訊的負荷量上又比單純的聲音來的更多,考量是否存在存在的必要性就放在格外重要。而言,可以尋找替代的方式,透過震動和燈光甚至狀態變化來提示,減少使用者的認知負荷,并確保聲音只會在特定的時間點出現,并提供使用者自行設定關閉聲音的功能


          除了聲音本身的設計外,還要考慮整體環境的影響因素,可能周遭受非常的吵雜。換句話說,在KTV的包廂,吵雜的環境,會使用者無法聽到消防警鈴響,而容易造成危險事件的產生。也因為如此,消防警鈴的聲音頻率設計就應該介于2kM到4kM,因為研究指出人類的耳朵對于這個范圍的聲音最敏感


          從音量的角度來看,耳朵對不同頻率的音量有不同的感知程度,有些聲音聽起來很響亮,有些則是很沉悶因人而異,但比較客觀的量化體驗指標就是分貝(decibel,dB) ,在尺度上超過70分貝以上,會讓人產生憂慮不安,并引發各種癥狀,因此要盡量避免尺寸大小過大的設計, ,,降低主動的侵入性?;谶@些因素總和來說,還要考量到用戶和產品間的距離,與產品愈近,對于體積的需求量較大,反之為然


          在聲音體驗設計(Amber Case,2018)一書指出,當警告或提示音出現的頻率愈高,就應該設計成愈短,但不足就是,如果把聲音設計成短而急促,從而使用者需要集中相反地,事件發生時間間隔長且久,則聲音提示更需要明顯且激烈的聲音來提醒用戶,例如手機鈴聲響時,需要告知用戶

          文章來源:站酷    作者:張陽光Designer

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務

          日歷

          鏈接

          個人資料

          藍藍設計的小編 http://www.syprn.cn

          存檔

          亚洲va欧美va天堂v国产综合