<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>

          首頁

          后臺界面設計的7條原則

          seo達人

          圖片

          Illustration: Outcrowd

           

          1、構思儀表盤界面的大腦

          讓我們深入研究設計解剖學。儀表盤的“父母”是客戶端、設計人員和開發人員,每個組件設計都需要他們的合作產出,所有關鍵點在一開始要做出說明。

          智人是由胚胎發展而來的。首先形成的是腦細胞和神經細胞,然后是身體的其他細胞。這正是任何可行的項目應該遵循的方式。第一個階段是最重要的。如果你忽視這個階段,再花哨的設計也不能挽救局面。這正是為儀表盤的長期發展奠定基礎。

          儀表盤如果會說話的話,它會問“我為什么出生?誰需要我?“。

          試問你能回答嗎?因此你需要明確:

          • 儀表盤將如何助力公司目標?
          • 什么結構,功能和視覺效果將幫助儀表盤服務好用戶?
          • 哪種設計最適合目標受眾?

          這些問題的答案將構成你的設計理念基礎。

          圖片

          Perls

           

          儀表盤中沒有瑣碎的細節。

          儀表盤顯示的信息應該使用戶能夠做出決策。設計師的工作是幫助用戶解決問題,而不是讓他們使用一堆很酷的小工具。任何對目標不起作用的事情都會與目標背道而馳。

          從項目的最初階段到最后階段,設計師必須關注公司的目標、儀表盤的目標和用戶的目標。

          否則,儀表盤將永遠不會做的更好。

          圖片

          Clover

           

          2. 數據及關鍵指標選擇:循環系統

          儀表盤數據就像循環的血液。我們必須理解它們來自哪里,當用戶需要它們時如何處理,以及應該如何可視化。

          設計師需要理解數據的目的。顯然,這將幫助他們選擇合適的組件,但還有更多的工作要做。例如,用戶希望在屏幕上看到大量不同的讀數。你不需要移除任何東西來清除一些空間,但你可以做的是突出最重要的元素,并在視覺上“弱化”次要的東西。然而,要做到這一點,你必須知道數據的優先級。

          圖片

          Bidding Car

           

          最重要的指標是哪些數據能幫助達成目標。例如:

          • 顯示實際成功率;
          • 影響產品的感知方式;
          • 激勵創造產品的團隊。

          參數的選擇也需要了解用戶。用戶應該看到哪個關鍵指標,他們認為什么樣的可視化表現最容易理解?

          人們喜歡看到與他們的目標相符的數字。

          圖片

          Panch

           

          3. 儀表盤結構:骨架

          想象進入一個酒店房間,看到一張床,一張桌子和椅子,一面鏡子和一個壁櫥。甚至不用打開壁櫥,你就能猜到里面有什么。吹風機、拖鞋和毛巾都在你想要的地方——有人確保了這些。一個好的儀表盤就像那個房間。它是干凈的,整潔的,可預測的。你馬上就能看到所有的要點,憑直覺知道在哪里可以找到其余的內容。

          設計師有自己的工具來確保整潔。

           

          1) 層次結構

          首先,你得整理思緒。在開始設計之前,一定要對所有數據進行排序,將其分類,了解什么是最先發生的,什么是最后發生的,接下來是什么等等。確定用戶必須馬上看到的關鍵內容。

          視覺層次結構必須反映信息層次結構。

          數據層次結構通過小組件的大小和位置表示。如果你的讀者從左到右閱讀,關鍵信息必須放在左上角,最不相關的信息將在右下角。

          對數據排序的方法將取決于儀表盤的用途。重要的是根據信息的優先級組織信息,并創建邏輯場景。

          把信息面板看作是一個故事,而不是一系列數據點。

           

          2) 網格

          網格對于創建頁面的總體布局、排序、平衡和對齊元素非常有用。

          圖片

           

          3) 信息模塊

          模塊系統類似于公寓的分區。臥室是用來睡覺的,餐廳是用來吃飯的——每個區域都有自己的功能。你的舒適度取決于他們所處位置的便利程度。糟糕的布局不能通過裝修或家具來修復。相應地,必須提前考慮模塊劃分。

          模塊幫助顯示內容層次結構,根據數據的重要性、相關性和邏輯連接對數據進行分組。每個模塊都應該在給定的流程中服務于特定的目的。

          圖片

          圖片

           

          4) 連續性和接近性

          如果你去廚房需要經過有兩扇門的走廊,這是一個糟糕的布局?;ミB的流程假定邏輯接近。如果一個模塊中的流程需要來自另一個模塊的信息,那么布局上應該保證數據的連續性。這一點必須提前考慮,這樣用戶就不必在晦澀的存儲空間中尋找他們需要的信息。

          圖片

          Illustration: Outcrowd

           

          所有相關信息都應按重要到不重要的順序進行分組,并就近放置。

           

          5) 分離模塊

          沒有人需要一個延伸到臥室的廚房。為了將一個模塊與另一個模塊分開,你需要負空間。確保從一開始就考慮到這一點:將負空間視為需要視覺平衡的設計元素的組合。

          圖片

          Wingle

           

          4. 功能:肌肉

          功能和工具的數量由儀表盤的用途及其用戶的關鍵目標決定。

          要想自由活動,人類只需要兩條腿,狗需要四條腿,蜘蛛需要八條腿。一個功能太多的儀表盤就像一條六條腿的狗一樣,這有點令人毛骨悚然。

          不要在控制面板上放置過多的工具。用戶只需要手邊有必要的東西。過多的可用工具會讓人們感到困惑,并嚇走他們,因為它看起來太復雜了。個性化總是比標準化好。

          圖片

          Band

           

          5.小組件:重要的器官

          如果屏幕上有超過5到7個小組件,人們就很難理解內容。因此,我們的工作是讓相關數據易讀,但不過量。用戶應該在幾秒鐘內理解他們所看到的內容。

          數據可視化工具包括:

          • 表格
          • 圖表
          • 示意圖
          • 卡片
          • 指標
          • 地圖
          • 圖片
          • 分組
          • 篩選器
          • 列表
          • 選擇樹

          圖片

          Activity

           

          小組件的選擇取決于儀表盤的用途和用戶。想想以下幾點:

          • 哪個組件能最好地顯示一個特定的KPI?
          • 用戶可以立即看到什么?
          • 哪個組件是用戶最容易理解的?
          • 什么可以幫助用戶更快地找到他們需要的東西?

          選擇易于理解和閱讀的小組件。

          這里是一個令人困惑的小組件的例子:

          圖片

          想想主要的“目標”來吸引用戶的注意力。例如,如果你的優先級是績效目標,你應該使用數字;如果你需要比較值,用直線或柱狀圖會很好;為了激勵團隊,可以使用帶有相關亮點的排行榜。

          不正確選擇的小組件或默認小組件模板可能會使用戶混淆或導致他們誤解數據。

          最好的解決方案是分析和測試的結果。

          圖片

          最好的小組件設計是極簡和易于閱讀的。例如,一個3D圖表可能看起來令人印象深刻,但它占用了用戶太多的注意力,最終證明會分散用戶的注意力。這也適用于漸變、過度使用顏色和過多的細節。

           

          6. 視覺設計:一般技巧

          我們已經創建了儀表盤的思想和身體。唯一要做的就是皮膚——最外層。這可以根據優秀設計的基本原則來實現,但仍有一些新的需要注意的細節。

           

          1) 簡單

          儀表盤應該像你喜歡工作的桌子一樣干凈:它必須只有必要的文件和工具,沒有干擾。

          圖片

          MEMO

           

          2) 顏色

          儀表盤顏色的選擇必須有一個目的:盡可能清晰地顯示信息。顏色跨度越大,就越難把數據展示清晰。所以不要讓儀表盤的顏色過多。使用同一顏色的深淺是一個好的辦法。

          圖片

          首先要選擇底色,然后是補色。每種顏色都必須有特定的用途。一種顏色可以用來組合元素,另一種顏色可以用來高亮。顏色還能體現一個元素是積極的還是消極的。

          避免使用可能有負面含義的顏色。例如,在這個例子中,紅色看起來像是代表壞的和不受歡迎的東西:

          圖片

          如果儀表盤提供了可定制的顏色,確保所有可用的選擇看起來都比較舒服。

          選擇顏色組合的一個好工具是Adobe color CC。

           

          3) 突出

          語義高亮應該與視覺高亮相對應。為了突出一個元素,你可以使用顏色(對比度,亮度),形狀,大小,負空間等。

           

          4) 可讀性和數字格式化

          這是確保視覺清晰度的重要因素:干凈的布局,視覺層次,重點突出,對比元素,適當的字體,這些字體也必須具有對比性和易讀性。

          高精度的數字格式很難理解。最好把所有的數字都四舍五入,然后把較長的數字尾巴去掉。

           

          7. 適應性

          在實踐中,當用戶優先考慮桌面版本時,在移動版本之前創建網頁版本是合理的。如果你的目標用戶主要使用的是手機版本,那么你可以先從移動設備著手構建儀表盤,然后再開發桌面版本。

          圖片

          Snap

           

          總結

          設計一個好的儀表盤不是一件容易的事情。我們把它比作人類的發展,因為它是一個很好的方式來呈現重要的東西。當你在設計儀表盤時,請不斷地問自己:是否一切都已就緒?有多余的肢體嗎?身體的各個部位協同工作嗎?用戶會喜歡這個結果嗎?它有用嗎?

          正如你所看到的,視覺設計實際上是設計師最不應該擔心的事情。

          最后,彩云再分享一組常用的后臺圖表界面組件庫,相信會對大家的日常設計工作有幫助,

          圖片

          圖片

          圖片


           

          本文翻譯已獲得作者的正式授權。

           

          原文地址:medium

          作者:Erik Messaki

          譯文地址:彩云譯設計(公眾號)

          譯者:彩云Sky

          轉載請注明:學UI網》后臺界面設計的7條原則

          藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請掃碼藍小助,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系。

          截屏2021-05-13 上午11.41.03.png

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.
          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

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

          UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司



          UI設計師交互設計-被忽視的UX產品文案

          周周

          在很多體驗設計師的認知中,產品界面上的文案是設計中最細枝末節的事,往往會被忽視。大部分時候,能讓用戶理解的文案就是合格的。而什么是好的文案,沒有一致的評價標準,在復雜的業務場景中也很難做出判斷。

          體驗設計師的成本思維

          ui設計分享達人

          為什么設計師要有成本思維,以及成本思維在做我們做設計時對我們有什么幫助。



          不僅僅在工作中我們需要思考成本,在生活中我們也無時無刻都在計算成本。成本總是和收益掛鉤,所以貝克爾在《人類行為的經濟學分析》中提到:人的任何行為都是理性選擇的結果,無利可圖的事人們事不會去做。雖然這句話不能覆蓋所有的人,但是大多數人就是如此。



          在夜深人靜的夜晚你饑腸轆轆想吃夜宵,你可以選擇下樓到周邊小吃店就餐,也可以選擇叫外賣,前者付出的成本是你需要通過身體行動來交換最后的結果,后者則是花費一定的金錢來代替前者的行動。


          那么我們通常會如何選擇呢?如果這兩種成本有很大的差異,比如需要到很遙遠的地方那么除了身體行動成本外,時間成本也會計算其中,所以相比后者成本陡然增大,于是我們就會選擇成本低收益大的方式。但是假如你現在極度想要吃那家的夜宵,外賣點餐會特別影響口感,那么你可能會選擇前者,這里由于外賣口感和主觀意愿影響到了我們理性的選擇?!?



          1.為什么要關注成本


          成本決定了收益的效率、大小和方式,小到你伸手拿一支筆你會選擇最近的,大到我們人生的投資。成本與收益之間并非是直接關系,收益的大小的不取決于成本的大小,還有風險因素。例如我們在對UI界面進行優化,可以選擇的方式有很多:


          1.只調整視覺,替換樣式

          2.對頁面邏輯進行重構

          3.整體功能進行重新分類組合

          ......


          我們的目標是讓用戶獲得更好的體驗并且提升業務價值。3種方式需要的成本高低不同,我們都希望付出最小的成本達到最好的效果,于是我們就會考慮到風險因素,假如新流程用戶不會用怎么辦,假如新版本導致的數據下滑怎么辦,假如行業出了新政策了怎么辦等等。所以除了這些成本外也要考慮應對風險的成本。



          你看為什么有錢人都會坐頭等艙是因為頭等艙可以幫他們節約更多的時間,提供更好的環境與服務,讓他們產出更多的價值。還有假如你的車壞了,你最直接的方法就是花錢找人幫你修而不是自學自修,因為你將花費太高的成本。


          再舉一個例子,我們想提升能力,有的人選擇自學、白嫖,有的人選擇報培訓班,這也只是時間和金錢上的成本選擇,如果你的自學(白嫖)在短時間收益很大那就毫無疑問幫你省了一大筆錢,但是如果自學很久都毫無效果,那么時間就是你花費的成本,時間和金錢不同的是,時間不可逆??雌饋砘ㄥX比花時間更好?不是,花錢也有風險,比如課程質量和服務很差,錢沒了還學不到,甚至賠上了時間。但如果你選對了,那么收益就遠遠會大于自學。




          2.設計師可以關注哪些成本


          1.實現成本


          實現成本指的是想法與落地中間需要付出的行為、時間和其他損耗,例如我們希望提升用戶下單的轉化率,我們可以選擇:1.減少整個流程的步驟 2.將按鈕設計的更明顯 3.給用戶發放優惠券 4.給用戶營造搶購氛圍,在這幾個方案中最低成本是2,因為只需要調整樣式和簡單開發就可以實現,但收益并不是最高的,而其他的方案需要更多的角色花費更多的時間來參與,但是收益也不是顯而易見的。所以如果你的產品比較成熟,那么我們一定選擇成本更低的方案,反之我們會進行更高成本的嘗試。



          還有比如我們找工作,新公司福利待遇比現在公司好50%,平臺也更大,是否不需要思考直接去呢?當然不是,你需要考慮通勤成本、生活成本、自身成長成本等等因素。如果你50%薪資漲幅換來的是996、每天通勤時間3、4個小時,不僅僅是時間精力,還有我們的身體健康的成本,我會覺得遠遠不值,成本太高。




          2.機會成本


          我們先來看一下定義:機會成本是指面臨多方案抉擇時,被舍棄的選項中價值最高的就是本次決策的機會成本。舉個例子,比如當前版本我們有1個開發一個設計一個產品,我們面臨著兩個需求,但是資源和時間只夠我們做一個需求,這時候2選1,那個被拋棄的需求所擁有的價值就是我們所選擇的那個需求的機會成本,相當于我們放棄了那個需求所擁有的價值。


          再通俗一點講,我現在有100萬,面臨著兩個選擇:1.銀行理財,年收益4%,4000. 2.做生意投資,年收益8%,8000,那么就相當于我花費了這4w的潛在成本獲得了8萬的收益。



          3.邊際成本


          邊際成本的理解很簡單,我們可以理解為我們每付出一定的成本收貨的收益或者每收獲1個單位的收益所付出的成本。用一個通俗一點的例子來講,比如你一共學習10天,第一天學完你考了30分,第二天學完你考了50分……第8天學完你考了94分,第9天學完你考了98分第10天學完你考了100分,花費的單位天數一樣但是每次增加的分數卻越來越少,收益也就越來越少。



          在做產品設計的時候,我們往往會有一個板塊叫為你推薦,比如微信閱讀中的這個板塊,它一次提供了用戶6本書,雖然算法可以算出有許多書,但是這里每次只提供給用戶6本,是因為涉及到了邊際成本,少量多次提供能夠讓用戶更聚焦,更快的選擇好書本進行閱讀,每多提供幾本書,用戶選擇閱讀的時間成本就會越大。有同學會問:那我只給1本不就好了,用戶就能馬上讀了,何必要推薦6本?



          我們如何保證那一本剛好是用戶想讀的,沒有辦法做到如此精準,如果每次只推薦一本書,而用戶嘗試了幾次都不喜歡,他們就會放棄,所以這里就會選擇一個臨界值,比如我們可以選擇每次放不同數量的書,根據數據判斷在給用戶幾本書的時候用戶閱讀轉化和選擇時間成本更低。




          4.體驗成本

          體驗成本也是我們設計師需要時刻關注的,俞軍老師在產品方法論中提到,用戶價值=新體驗-舊體驗-替換成本,體驗成本可以包含很多信息,最主要的就是認知與交互的成本。


          4.1認知成本

          如何降低認知成本可以從以下這些點進行優化


          4.1.1.文案

          文案的設計要求是簡單易懂,避免產生歧義,之前給大家舉過的一個高德地圖導航在到達目的地之后給出一個“原路返回”按鈕的分析,大家可以再思考一下,是否會產生歧義。還有確定、確認大家是否知道怎么用呢?


          文案也需要有情感化,避免生硬、帶負面情緒的問題等等


          4.1.2.樣式

          視覺最為直觀,一個按鈕一個控件的樣式是否能滿足用戶的心智和預期,將會影響用戶的認知,例如以下的幾個按鈕,出現在不同場景用戶會出現一系列問題:為什么我點了沒用?為什么還不能點?我到底該點哪里?



          還有你的品牌是否識別度高,也決定了用戶對你的認知,最近小米花了百萬請大師做了新的logo,在視覺上更加圓潤,在圓logo的基礎上做了很多的微調,實際上也是避免了太大的logo變化導致品牌認知成本的提高,認知成本一旦太高,品牌市場的敏感度和曝光度還有各種替換、衍生、配套的隱性成本也會大大增加。所以這一舉動是明智的。



          4.1.3.信息

          比如我們希望新用戶去關注一些大咖、kol獲得更好的推薦,但是如果我們只是將推薦者的頭像和昵稱給新用戶,那么這個策略就是失敗的。因為我們沒有考慮新用戶的認知:1.我為什么要關注她 2.關注她我能獲得什么。所以僅僅依靠頭像和名字在這里對用戶的認知是沒有任何幫助的。




          4.2.行為成本

          我們通過利用肢體來和媒介進行交互,目的是完成某項任務。其實只需要你抬手,那么就是產生了成本,只不過某些成本是固定的無法減少的,比如你要去騎車那就需要去解鎖,如果沒有鎖車可能就會被偷走,這是出于安全考慮。


          行為成本在具體數字產品中我們可以發現很多,例如你只需要將手機拿起,屏幕就會亮,相比于找到解鎖鍵再按一下成本就低了很多。而亮屏后不直接解鎖是為了防止誤觸或者隱私,所以還需要通過指紋或者人臉進行識別。


          例如幾種不同的驗證方式,利用滑動拼圖來解鎖和輸入相關驗證碼解鎖,前者比后者的學習成本和操作成本都低。


          在移動端我總結了幾個減少交互成本的方法,不妨來看下:



          1.利用滑動代替點擊


          soul音頻處理

          日期選擇

          iPhone底部橫條切換窗口




          2.利用點擊代替輸入

          游戲昵稱隨機

          股票買入數量



          這里也有同學會問,既然都可以代替,那滑動能否代替輸入?必須也是可以的,例如iOS自帶的計時器中選擇時間的控制器,還有鬧鐘設置,這里要注意的是,滑動代替輸入是要基于本身該信息是由范圍內并且不需要精細化控制的,比如房價篩選,房價本身量級很大,用戶篩選也不會精確到個位數,在這里用點擊和輸入會比滑動的成本更低。


          反例就是音量、明暗控制,大家可以感受一下輸入在這里的雞肋。你需要精確控制選輸入,需要大致的范圍選點擊,非常模糊的感受選擇滑動。



          3.在必要時利用語音代替輸入

          例如我們在開車進行導航的時候,打字輸入非常不便,于是加入了語音輸入。還有在微信進行賬號切換時,我們可以選擇利用語音輸入數字來驗證身份。



          4.給予詳細的提示

          對于新用戶操作復雜功能和界面的時候,提供更多提示能夠很大程度上減少用戶的操作成本。



          5.盡量不使用二級手勢

          在iOS或者安卓的手勢控制中,我們會發現又一些常用的手勢比如:點擊、拖動、輕掃、雙擊、縮放,這里我們可以定義為一級手勢。還有一些不常用的比如:重按、長按、三指滑動、三指縮放等,這些手勢的認知成本和行為成本都很高,定義為二級手勢,不建議頻繁使用。




          總結

          設計師在日常工作中接到的需求繁多,無論是在做需求之前還是在思考設計方案的時候,成本思維可以幫助我們很好的規避一些問題和風險,我們追求控制成本使收益最大化。所以學會控制成本的設計師不僅僅題可以提高個人工作效率還可以幫助公司創造更多價值。

          文章來源:站酷      作者:應駿

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

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

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



          淺析用戶體驗四維度

          ui設計分享達人

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

           

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

           

          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。

           

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


          用戶體驗四維度的金字塔關系

          文章來源:站酷  作者:Snow Design

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

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

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


          合理預設:如何為用戶提前設置好默認值

          ui設計分享達人

          What 是什么

          「合理預設」是指系統提供默認選項,這些默認選項不需要用戶做任何操作,可以節省用戶完成表單的時間和精力。

          這些默認選項來的數據源包括: 先前輸入的會話數據、來自用戶帳戶的信息、當前位置、當前數據和時間等等。


          案例 釘釘的“代辦事項”設置功能,可以自動抓取到語句中的時間信息,自動幫助用戶默認填寫時間,減少用戶的操作時長:

          相關模式 :語句填空


          Why 為什么

          系統通過提供合理的默認信息和答案,分擔了用戶思考和輸入信息的工作,減少時間,提高效率。

          而就算預設信息不是用戶想要的,也為用戶提供了一個示例來說明答案應該是什么樣子的。這一點也可以節約用戶幾秒的思考時間,或者避免輸入錯誤的信息。


          另外,合理的默認值還可以幫助用戶應對一些“難題”。如果用戶跳過了一塊字段,那么可能是這個問題沒有引起他的注意。用戶可能是不理解這個問題、或是默認值的含義。輸入答案,選擇值,或單擊按鈕的動作會迫使用戶有意識地面對這個問題。


          比如疫情期間,大部分公司都需要做健康打卡,下圖中有一些選項是直接填了默認值,但是有些就沒有填。比如下圖的左圖中,有關于“請假未到崗”這些問題,因為沒有填默認值,用戶就會對這個問題有印象。然后比如“今日是否有發熱癥狀”,“是否有咳嗽”這些,因為被系統默認填了,用戶很容易就忽略過去了。

          所以一些刻意希望被關注的問題,其實最好不要提供預設值,這樣可以讓用戶感知到這個重要信息的存在,進而加深對內容的認知。



          When 什么時候使用

          當產品要求用戶提供類似表單的信息輸入(例如文本框或單選按鈕),并希望減少用戶填寫時長時,可以使用提供默認設置。


          但是當問題的答案會很敏感或是與政治相關時,最好不要提供默認值,例如密碼、性別或公民身份等。最好也不要為用戶擅自訂閱非必要的內容信息,如“請給我發送廣告郵件”等。


          使用條件

          · 用戶需要做類似表單的信息輸入操作;

          · 系統希望減少用戶需要做的工作;

          · 系統希望確保用戶填寫的準確性和一致性;

          · 可能用戶并不知道或者不關心答案,不需要引起用戶的重視;

          · 問題的答案不屬于敏感信息或是與政治無關。


          How 如何使用

          設定「合理預設」有兩種普遍的用法:

          1、使用一個通用的、常識性的、滿足大部分用戶需求的默認值,預先填寫輸入框;

          2、可以調用用戶早些時候提供給系統的信息來動態地設置默認值。例如,某個用戶提供了一個中國的郵政編碼,系統可以從這個編碼推導出用戶所在的省,甚至市和區的名稱。


          除此之外要注意幾點應用原則:

          · 使用預設的默認值不僅僅是為了防止用戶留下空白的輸入區域;

          · 要充分的了解你的用戶,默認值的設定要有絕對合理的理由 —— 否則,系統會給所有人帶來額外的工作量。


          Example 案例

          案例一:唯品會小程序在購買服飾類選擇 SKU

          用戶需求:購買服裝時需要選擇尺碼


          唯品會小程序在購買服飾類選擇 SKU 時,每個尺碼點擊后會顯示對應的衣服參數,用戶不再需要去商品描述中的尺碼表格中再找,也可以是設置好自己的身材數據,平臺會默認選中適合你的尺碼。

          案例二:螞蟻鏈實人認證表單

          用戶需求:需要根據表單內容填寫和上傳文件

          螞蟻鏈實人認證在上傳證件時會根據用戶所在國家和地區,幫助用戶默認選擇概率最大的選項,不需要用戶自己操作。

          案例三:Photoshop 創建新文件

          用戶需求:創建新文件,調整畫布大小

          在 Photoshop CC 中創建新的圖像文件時,默認情況下會從操作系統剪切板開始。這里的假設是用戶剛剛創建了一個屏幕截圖,并且正在編輯該圖像。因此,Photoshop 在剪貼板中獲取圖像的寬度和高度,并使用它們來預先填充創建新文件的尺寸,這是一種節省時間的聰明方法。不用擔心圖像和畫布會有尺寸不匹配的情況。


          當用戶想要調整畫布大小時,原先畫布的長寬尺寸會預設出現在新的畫布大小里面,方便用戶進一步進行尺寸調整。


          文章來源:站酷  作者:Ant_Design
          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

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

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



          B端產品界面高屏效初探

          ui設計分享達人

          背景

          在 B 端設計領域中,不管是內部用戶、產品、設計師、開發,還是外部產品、設計師等,總能聽到關于界面「屏效」方面的訴求或吐槽。


          undefined


          「屏效」狹義理解是「界面過度留白」;廣義理解,「屏效」源自諧音“坪效”,指的是每坪的面積可以產出多少營業額(營業額/專柜所占總坪數)。而「屏效」對于界面而言可以指屏幕單位時間、單位面積內的信息可以帶來多少商業效益/效率提升。


          為了探索在 B 端產品中用戶為何對「界面過度留白」或「屏效」問題如此敏感,于是我們展開了「屏效」專題的設計探索與實踐。「屏效」專題探索主要以「探索」與「實踐」相結合的方式展開,將實踐過程中反復驗證有效的設計策略沉淀成設計手冊,同步將部分功能進行工程化,確??梢蚤_箱即用。


          undefined


          探索階段-為誰在何時何地設計

          用戶聲音|不同的故事相似的訴求

          面向內部設計師和終端用戶投放的《高屏效訴求》《中后臺產品滿意度調研》問卷中認為提高屏效能極大提升用戶體驗的設計師占 58.14%;認為提升屏效對體驗有提升的終端用戶占 50.6%。


          undefined


          外部知乎上針對《Ant Design 4.0 設計價值觀》的 13 條反饋里,其中就有 2 點提到關鍵字「效率」。


          undefined


          通過了解不同用戶和產品類型發現,不同的用戶在工作場景的產品使用中有著相似的特征:


          undefined



          案例收集|發現問題,大膽假設

          縱觀 B 端產品界面,發現普遍問題和收錄在解決屏效問題上實踐得比較好的案例,為了逐步突破問題,選擇以數據產品中覆蓋率極高的表格為設計切入點,通過線上跨產品多端地毯式的體驗走查,發現表格三個層次的問題:


          undefined


          視覺、交互層在無需理解業務場景和用戶目標的情況下,都較容易發現,屬基礎問題,但很多「過度留白」的屏效問題往往是信息被組織方式的差異導致的「過度留白」。

          綜上我們提出假設:為提高屏效,可從視覺、交互、信息三個層次解決

          視覺層為提高信息查閱速度,可以通過提高信息密度;交互層為提高操作速度,可以縮短當前手勢到目標之間的距離;信息層為提高信息被理解的速度,可以通過重組織等方式。

          基于假設,我們進行了進一步的桌面研究,查閱論文等書籍,尋找設計理論的驗證和指導。


          競品分析|尋找實踐證據,謹慎驗證

          我們知道視覺上界面留白過多(過疏會增加滾屏成本,過密因易串行而影響閱讀效率),以表格「行高」為例,探索各表格在字號、字高和行高的關系,因為不同字體的同字號實際像素高度會有差異,因此選擇的是字高(即文字垂直高度的視覺大?。┒亲痔柣蜃中懈?,決定留白的兩個重要因子是字高和表格行高,以次推演,界面元素和元素間距的留白關系,探究在視覺層怎樣的留白率能保證甚至提升屏效。


          undefined


          以數據產品中的表格為例,通過直接和間接競對的方式,分別從數據的查閱(視覺)、分析(交互)維度進行功能點和設計細節上的比對,來看看優秀產品是如何解決屏效問題。

          直接競對:內部用戶口碑較好的產品 A、B外界競對:同領域的 Tableau、網易有數、金山、微軟表格;間接競對:谷歌郵箱、AntD 等的緊湊主題的常規列表(一維表格)


          undefined


          通過競品分析可以發現,數據分析領域的表格留白率普遍較低(信息密度高),尤其是金山和微軟的電子表格,其次是同類面向數據用戶的 Tableau、網易有數,而谷歌郵箱等工作臺常用的常規列表緊湊版本中,留白率和數據領域的電子表格不相上下。


          緊湊版的使用場景也常常是面對數據量巨大的信息呈現,通過切換緊湊主題,提升信息的快速瀏覽,而這也非常適合數據分析場景中巨大的數據量呈現。因此我們的產品在留白率的提升空間極大,而在實際案例實踐中,也已經將表格行高優化至 30px,克制的使用留白。


          除此外,競品其他層次的設計也做了比對,總結來看整體設計做法:高密度、少屏數、少留白等。


          文字陷阱:中英文字高不等于字號


          舉個容易犯錯的競品參考是,谷歌在緊湊版主題下字號 12px,列表行高是 28px,但在 AntD Table 中同樣的 12px 和列表行高 28px 就會發現非常擁擠,缺乏呼吸感。


          undefined


          原因在于谷歌的 12px 是英文字體,實際字高只有 10px,而 AntD Table 的語境是中文字偏多,實際字高有 12px,所以留白的差異在于一個是 18px(28-10),一個是 16px(28-12),這也是為什么決定決定留白的兩個重要因子是「字高」和表格行高,而非「字號」和表格行高,進一步推演,決定界面留白的是「元素視覺高度」和「元素間距」。


          論文查閱|尋找理論證據,謹慎驗證

          研究表明,低密度認知負荷低,但高密度任務完成率高,用戶更喜好

          參考資料:論文《基于眼動的網頁對稱性和復雜度對用戶認知的影響的研究》

          對于信息,用戶需要需要閱讀(視覺),思考和理解(認知),需要點擊按鈕、操作鼠標和打字(行動),在人機工程學中,統稱為負荷。即認知(記憶)負荷、視覺負荷、動作負荷,即分別對應用戶體驗設計的三個層級,信息/視覺/交互。而負荷所花費資源從多到少依次為:認知 > 視覺 > 行動。


          認知負荷,舉個例子,看了但不一定懂了。你是否有這么一種體驗——刷抖音,雖然很多(信息密度小,輸出效率低),但可以一直刷下去并且刷很久;而看一門 C4D 教學視頻,即使就短短十來分鐘(信息密度大,輸出效率高),但是卻要看上半天。因為刷短視頻時,你的輸入效率遠高于作者的輸出效率,而看一門 C4D 教學視頻時,你的輸入效率遠低于作者的輸出效率??墒牵敵鲂适强陀^的,輸入效率是主觀的。如果輸出效率很高,你可以通過提高自己的輸入效率(比如讓自己成為 C4D 專家)來跟上作者,從而變強;否則輸出效率很低(信息質量低),你的輸入效率很高(很專業),信息于你而言都是無效的。


          假設負荷總量不變的情況下,那么以上三類場景界面需要對用戶負擔分配大致如下,官網品宣類需要低認知成本,低視覺負擔,視覺要求高,用戶才會被吸引過來閱讀,甚至酷炫的交互更能增加互動體驗而帶來的趣味感,比如蘋果官網,信息量極少、圖版率高帶來極具藝術的視覺體驗、進而吸引用戶愿意跟隨屏幕滾動漸進式接受信息,而 B 端應用因為是專業使用,首先認知方面隨著員工的專業度提高而降低,因此可以通過提高視覺負擔,來降低行動負擔,進而減少操作用時,當然最佳情況是三個維度能整體降低負擔,讓總負擔降低,就需要更多設計巧思了。


          undefined


          面向內部設計師和終端用戶投放的《高屏效訴求調研》預設解決方案中,設計師常用的 Top 3 做法為:【信息層】隱藏不必要信息、【視覺層】提高布局緊湊度、【交互層】減少點擊跳轉。


          undefined



          實踐階段-如何設計

          通過以上的探索,我們可以確定的是,B 端產品面向專業人員的工作界面設計中,提高屏效可從視覺、交互、信息三個層次進行,視覺層-高密度,即提高屏幕信息密度;交互層-低跳轉,通過減少頁面跳轉、手勢與常用操作的距離等;信息層-有效性,通過重組織或輔助信息幫助用戶理解,甚至提供幫助手冊等以提高用戶專業能力。


          undefined


          基于以上的總結,對產品進行優化。下面以一個簡單案例進行設計策略的解讀。一位運營同學想對比 A、B 兩不同人群在相同維度(白領-有信用卡)下的人數差異,尋找運營機會點。


          如下表格經過高屏效策略優化前后對比圖,優化前相同維度下不同人群數量的對比需要視線來回跳動比對,而優化后的表格內容,更符合用戶看差異場景下分析目的數據查閱,視線鎖定相同維度,即可快速比對數值大小。


          undefined


          下面以視覺、交互、信息三個層次解剖設計過程背后的思考。


          視覺層|高密度-克制的留白

          眼動理論:研究表明,人眼最小可視視角 0.3 度,水平最大眼動舒適轉動區 30度,垂直最大眼動舒適轉動區 55度。可得出人眼最小識別范圍 12px,水平視野舒適眼動寬 1200px,垂直視野舒適眼動高 2200px。參考資料:論文《基于眼動交互的用戶界面設計與研究》


          undefined


          如圖,縮小表格行高的同時,目標信息之間的眼動距離隨之縮短,在眼動舒適區內看到更多信息,便于信息的高效獲取。


          undefined



          交互層|低跳轉-高頻信息前置

          理論基礎:菲茨定律是用來預測從任意一點到目標位置所需時間的數學模型,它由保羅·菲茨在1954年首先提出。這個模型考慮了用戶定位點的初始位置與目標的相對距離、目標的大小、移動的最短時間。三者之間關系公式為:T=a+blog2(D/W+1),W為其中目標的大小;D為到目標的距離;T為移動到目標所用最短時間。參考資料:菲茲定律


          undefined


          表格單元格借助交互狀態,增加懸浮出現的信息組件,前置顯示目標單元格明細信息,同時通過交互出現的指示器輔助行列信息的獲取,高頻操作考慮手勢位置放置,縮短與操作目標的距離,以提高整體操作效率。


          undefined



          信息層|有效性-信息重組織

          理論基礎:交互設計四大策略「組織、刪除、隱藏、轉移」參考資料:《簡約至上》


          undefined


          用戶為了對比 A、B 兩不同人群在相同維度(白領-有信用卡)下的人數差異,但內容的重組織方式讓兩數據行需要頻繁點擊滾動條來查看,根據用戶目標,將關聯性大的數據放置相鄰列(即將要對比的人群放置列頭),即可快速查閱,減少眼跳距離。


          undefined


          結語

          設計趨勢中常見的大字體大留白界面,但在 B 端場景中,面對緊張的工作節奏,時間和注意力變得尤為可貴,相對而言,基于復雜度守恒定律, B 端信息量大且高頻訪問的產品中,「用得快」要比「看得美」更重要,「高密度」「低跳轉」詮釋的即是「空間換時間」,少一次點擊,少一次跳轉,少一份等待,就多一份時間和效率。

          文章來源:站酷  作者:Ant_Design

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

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

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



          按鈕組 Button Groups:大量的操作按鈕如何排布與設計?

          ui設計分享達人

          What 是什么

          簡介: 按鈕組是把相關的動作組織成一組按鈕的設計模式。按鈕組的內部內容彼此水平或垂直對齊,并采用相似的視覺設計。如果超過三個或四個動作,往往會采取多個分組。

          例子: 語雀編輯器的頂部工具欄

          undefined


          Why 為什么

          按鈕組可以讓界面不言自明。在復雜的布局中,被精心安排過的按鈕組會很容易被用戶感知和使用。一方面,它們在界面上往往非常明顯,用戶能夠一眼看到有這些功能可以進行相關操作。


          大家所熟知的格式塔原則(Gestalt principles)也在這里起作用。彼此相鄰的按鈕往往暗示著這些按鈕的功能相近,因此會讓用戶感覺到這一組按鈕可以完成類似的功能。相對的,不同的按鈕分組往往暗示著不同的功能類型,因此彼此間應該保持間距,或用不同的形狀,或用分割線進行區分。


          When 什么時候使用


          如果你需要在界面上展示許多操作按鈕,且需要確保它們隨時在界面上可見。但同時,你又需要用圖形化的方式組織它們,以使它們看起來不會特別散亂。

          這些動作中有許多是彼此相似的 —— 它們有相似或互補的效果,比如,它們的功能語義相類似 —— 由此它們可以三五成組地放在一起。

          按鈕組可以用在對產品全局有效的操作上(例如「打開」和「選項」操作),或特定的一些通用操作(「保存」、「編輯」和「刪除」),或特定的某些操作(例如布局的「對齊」、「分布」)。不同范圍的操作不應當被到一個組中。


          使用條件:

          · 存在大量操作按鈕;

          · 希望用圖形化的方式組織這些按鈕;

          · 操作按鈕間存在功能相關性和差異性;


          How 如何使用

          這個模式的總結簡單到像是一句廢話:把相關的操作按鈕分成一組。


          但如果詳細展開就會有更多的介紹。比如:


          · 如果需要包含文本說明,盡量使用兩個字或三個字的動詞短語,不要使用專業術語。

          · 不要把不同功能范圍的按鈕放在一個組,應當將它們分成不同的分組。

          · 同一組的按鈕應該有同樣的視覺設計:邊框、顏色、高度或寬度、圖標風格、動態效果等。

          · 在空間排布上,可以將它們并排起來作為橫排放置,如果空間不太適用的話,也可以考慮一列縱列放置(例如Photoshop的左側工具欄)。

          · 如果某一個動作是核心動作,可以將其區別對待。例如網頁表單中的“提交”按鈕。核心動作是希望大部分用戶都需要(或期待)執行的動作。讓這個按鈕擁有更加強烈的圖形或視覺風格來讓它在顯得更為突出。

          · 如果按鈕足夠多,而且它們都有小圖標,你也可以把它們放在工具條或者像工具條那樣的狹長條上,放置在頁面的頂部。


          通過使用按鈕組可以避免界面上按鈕或鏈接過于擁擠混亂,也可以避免一長串冗長的動作列表看起來毫無關聯或區別。

          通過這一模式,你可以創建一個較為清晰的元素層級結構:用戶可以一眼看出哪些動作是彼此相關的,哪些是重要的。


          Example 案例

          案例一:Sketch 的頂部按鈕工具區

          用戶需求:編輯設計文件中的對象


          Sketch 也是個很典型的應用了按鈕組的設計工具。Sketch頂部的按鈕不少于15個, 有很多要理解和追查。 但是得益于精心的視覺和語義組織,界面按鈕始終保持一定的可理解性。

          undefined


          案例二:macOS Finder

          用戶需求:按自己需求對文件進行顯示修改和操作


          這個案例顯示了來自 macOS 的 Finder 窗口的頂部按鈕組。 秉承其設計傳統,按鈕風格明顯。 導航組是放置在左側中的按鈕組。 布局相關的按鈕組放在了中間,文件操作相關的按鈕組放在了右側。這樣的設計使得界面變得易于理解和使用。

          undefined


          案例三:WebStorm 頂部操作區

          用戶需求:項目執行相關操作


          這個案例顯示了 Webstorm 的頂部功能操作區。WebStorm 采用了按鈕組的模式,將項目執行的相關操作和Git相關的操作聚合在一起,中間使用了分割線進行了區分。

          undefined

          文章來源:站酷  作者:Ant_Design

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

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

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



          詳解|用戶體驗地圖,到底該如何使用?

          ui設計分享達人

          用戶體驗地圖是什么 | WHAT

          用戶體驗地圖(Experience Maps)旨在通過描述用戶歷程和故事,使設計師、產品經理等項目成員更好地了解用戶和洞察訴求。所以對于用戶體驗地圖,我們可以將其定義為以下內容:

          - 是一種描述用戶故事的可視化工具;

          - 是一種幫助設計師、產品經理等更好地了解用戶的共創工具;

          - 從用戶視角出發,直觀展現產品流程各個觸點上用戶的痛點、需求和情緒;

          - 用戶體驗地圖繪制的形式并不唯一,可以根據項目需求,增減內容。


          undefined  

          △ 途家 App 用戶租房 · 用戶體驗地圖案例



          通常在接觸到需求之后,設計師就可以開始梳理現有流程、使用用戶體驗地圖了。要注意的是:

          - 需要梳理的功能不分大小,都可以使用;

          - 做之前,務必要先調研和訪談用戶使用產品的情況。

          建議時長:

          - 重要項目:120~180 分鐘- 日常項目:60~120分鐘

          參與者:

          - 必選:設計師、產品- 可選:研發、市場、其他

          工具:

          - 電腦或白板+便利貼

           

          為什么需要用戶體驗地圖 | WHY

          需要發現和拆解產品現有問題,梳理用戶流程時使用用戶體驗地圖,可以在聚焦階段,整合用戶訴求和業務訴求,共創機會點,找出解決方案,通常在以下場景中使用:

          - 新產品設計:需要對需求進行拆解和優先級排序;

          - 產品優化:發現產品現有問題,洞察設計發力點。

           

          由此可見,在設計過程中使用用戶體驗地圖作為設計工具,有以下益處:

          - 更好的以用戶視角來看產品的體驗;

          - 通過共創,項目成員達成共識;

          - 確認觸點,作為我們的設計方向;

          - 通過用戶痛點找到機會點;

          - 幫助梳理產品流程。


          undefined


          △ 用戶體驗地圖共創現場

           

          用戶體驗地圖操作流程 | HOW

          我們通常會將流程分成4 個階段:定義原則和目的 —— 梳理階段流程 —— 洞察痛點 —— 尋找機會點。


          1. 定義原則和目的

          首先要了解我們做用戶體驗地圖的原因和目的,包括用戶是誰、解決什么問題、用戶的目標、產品的整體目標、限定條件等等,對用戶群體、整個項目背景和共創任務目標有清晰、全面的認知。


          undefined


          2. 梳理階段流程 

          首先是劃分階段,將用戶的行為拆分成幾個大的階段,在整理時要注意:

          - 在整個產品的范圍之內盡量把故事、流程講完整;- 以廣度優先,而非深度,不要過早的沉浸到細節中。

          接下來我們要將主要階段拆分成單個任務,并梳理具體的任務和觸點,羅列出過程中的任務和各個觸點,要做到事無巨細。


          undefined


          然后根據任務和觸點,整理對應的用戶疑問、用戶感受/情緒。通過對用戶的觀察和訪談進行梳理,客觀的描述事實,切勿自說自話或是將自己的情緒代入其中,也不要急于猜想與分析。


          undefined


          3. 洞察痛點

          這一步需要我們匯總用戶的痛點,并將痛點分級,洞察用戶痛點背后的真實訴求。這個過程中可以先讓大家在一定時間內寫出自己的想法,每一條寫在一張卡片上,做到先相互不干擾,之后再統一整理和總結。


          undefined


          4. 尋找機會點

          通過上述總結,思考新的機會點、解決方案、優化整體流程,并對新流程下的功能做優先級排序??梢酝ㄟ^準備一些問題來刺激大家腦爆出更多的內容,比如:用戶還有其他選擇么?怎么做用戶才能更爽?其他用戶來到這里該怎么處理?等等。在這個階段需要:

          - 對內容進行對標、討論,把公認的點保留下來,無用的點剔除出局;- 根據實際情況和項目成本、進度等條件,對新流程下的功能做優先級排序。


          undefined


           

          如何為過程提效 |TIPS

          在實際的工作過程中,因為項目時間都非常緊張,繪制這樣一個完整的用戶體驗地圖比較耗費時間,所以推薦大家幾個提效的技巧,既可以減少時間浪費,也可以提高共創質量:

          1. 事前

          充分做好用戶調研,提前準備好用戶地圖模板,可以在開始之前的一到兩天發給參會人員,讓所有人對產品有一個整體梳理和思考,有助于提高大家的產出質量。

          2. 事中

          如果是優化的產品,可以將設計稿 demo 或者線上產品截圖打印出來,這樣可以增強大家的代入感,有利于想法的輸出。

          3. 事后

          整理電子版體驗地圖,需要跟隨產品的演進進行更新,上傳到項目共享空間隨時查看。

          文章來源:站酷  作者:Ant_Design

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

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

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



          如何通過數據驅動設計

          ui設計分享達人

          一、前言


          在日常的工作中,會經常接觸到一些數據方面的內容,同時我也在不斷的加強相關方面的專業知識學習,希望可以借此做一個總結,與大家分享。如果你也在平時的工作中遇到相關的數據問題、不知如何利用數據推動設計、或者對數據抱有一定的興趣,那我們可以一起往下看。

          本文主要圍繞以下幾個方面來進行解釋說明:




          二、背景


          隨著互聯網大環境從增量進入到存量市場,企業發展與產品的迭代越來越離不開數據的指導,數據驅動已然成為當下產品的主趨勢。身為設計師的我們,更應該對數據保持高度敏感,通過一系列的數據分析推動設計迭代,并讓其更合理、更具有可信度。

          任何一款產品,設計師都無法根據自己的心情、想法,一拍腦門的迅速產出。好的產品,既要考慮市場價值,也離不開用戶體驗,應該明確目標而進行實現,所以設計過程中需要依靠數據給予我們指導,即利用數據驅動設計。



          三、深入了解數據


          3.1 數據的作用

          數據在產品迭代過程中有著舉足輕重的地位,對于設計師而言也是極其重要。在了解數據之前,簡單的理解一下為什么需要數據,在互聯網產品設計中,數據的作用主要分為以下三點。


          3.1.1 提效賦能

          工作中或許會常常面臨多種需求并線進行的狀況,合理客觀的數據有助于我們更好的分清任務的優先級,并聚焦于當前最緊急的任務展開進行。合理有序的安排可以推動任務的快速高效完成。



          3.1.了解用戶

          設計師與真正的用戶之間往往存在一定的差異,我們不能按照設計師固有的思維方式去衡量用戶的想法,更不能想當然的覺得用戶需要什么。

          數據可以幫助我們更好的了解用戶,利用數據分析的種種方法,我們可以進行抽絲剝繭,發現更深層次的問題,不斷的去深挖用戶需求,進而更好的滿足用戶,只有這樣我們才能更好的留住用戶,促進產品增收。



          3.1.設計支撐

          在進行設計輸出的過程中,我們可能常常會遇到以下情況:

          我相信各位設計師在日常的對接中,一定是根據需求文檔進行了設計輸出,但是在設計評審階段卻很難去說服各需求方。數據在此情景下就顯得非常重要,它可以幫助我們針對設計方案有一個理性的數據支撐,去衡量我們的設計方案是否合理有效。

          其次在項目上線后依據數據反饋,可以驗證此次設計是否達到理想目標,是否還有進一步優化的空間。了解數據可以更好的幫助我們深耕需求、把控方向。



          3.2 數據的類型

          為了進一步了解數據,現將所有的數據進行整合區分,大致上可以分為兩個類型,分別是定性數據與定量數據兩大類。

          定性數據指導設計過程,往往判斷某件事物的意義與價值。定量數據關注數據頻率,在結果上更具有說服力。這兩種數據的類型在數據分析以及設計驅動的過程中都非常重要。時常會通過定性數據來發現、定義問題,最后再由定量數據來驗證結果。


          3.2.1 定性數據

          定性數據是非統計數據,在樣本選取上,數據量較少,主要收集途徑有以下方法:應用商店評論、客服反饋、音視頻記錄、筆記反饋、訪談調研等。

          可以快速了解到用戶的行為和態度,這種數據具有可調查性,是可以進行深入研究的,能進一步推斷出設計的哪些方面存在問題,從而通過設計方法優化產品設計體驗。


          3.2.2 定量數據

          定量數據是統計性的,可以用來問“多少”的問題,最終生成結論性的數據信息。收集途徑可以有以下方法:測試、產品數據、指標上報、實驗調查等。

          定量數據提供了對設計的間接評估,可以快速了解用戶基礎信息數據以及對產品的使用感知,例如完成率、滿意度等等數據指標,它不僅可以幫助我們快速統計信息,還能驗證結果。




          3.3 數據的維度

          數據不應該是只停留在表面的數字,需要深入的了解數據,善于從這一堆數字背后,發現數據的真實意義。

          由此,Google推出HEART模型,作為一套完善的用以評估以及提升用戶體驗的標準。HEART模型包括五個維度,分別為:愉悅度(Happiness)、參與度(Engagement)、接受度(Adoption)、留存度(Retention)、完成度(Task success)。通過這種方式將數據分為五個維度,可以更有效的明白不同類型的數據所體現的真實含義。



          3.3.1 愉悅度(Happiness)

          什么是愉悅度?關于這個問題,大概一千個人會有一千個回答吧,因此愉悅度更偏向于用戶在產品使用過程中直觀的主觀感受,例如滿意度、產品體驗感受、推薦指數、易用性感知等等體驗指標,通過這一類的數據可以有效的了解用戶對于產品或者某個功能的喜好程度。

          可以利用定性研究的方式獲取用戶在體驗和感知上愉悅程度,例如一對一訪談、觀察小組、可行性測試等。也可以通過定量調查中的問卷、數據反饋、AB測試等了解用戶的使用情況以及推薦指數等。



          3.3.2 參與度(Engagement)

          指用戶在使用產品功能時的參與深度,衡量指標即為有效活躍用戶的數量。用戶參與度并沒有統一的可量化的界定標準,但大致上可以分為以下幾個指標,產品訪問頻次、平均訪問時長、訪問頁面數量、產品使用間隔。

          數據的衡量只是最基礎的一步,更重要的是如何提升用戶的參與度,對于新用戶而言,可以通過引導、幫助等建立良好的第一印象;對于老用戶,需要合理的推送相關優惠與活動,也可以利用游戲化運營建立長期關系,這些都是比較有效的提升參與度的方法。



          3.3.3 接受度(Adoption)

          當一個新的產品與功能出現時,由于陌生感,用戶短時間內很難接受,而接受度就是指用戶在特定時間內真正開始習慣并使用。

          為了快速得到用戶的認可,往往產品設計中會通過競品分析的方式確保框架內容與市場的同類產品保持一致,滿足用戶的使用習慣。而針對大部分的新用戶也會使用新功能引導以及相關通知推送等加快新用戶的接受度。



          3.3.4 留存度(Retention)

          在產品運營中,留存是最關鍵的數據指標,它也是產品獲利與增長中最主要因素之一,留存直接決定了用戶是否愿意繼續使用,它是最真實的數據表現,而留存通常體現在,多日留存率、回訪率、不同平臺的使用重合率等。

          針對這一數據我們需要關注的核心問題就是如何提升用戶留存率,大致的方法可以分為以下兩個維度:

          (1) 產品維度

          產品功能決定是決定用戶留存的關鍵。在需求設計上,通過挖掘潛在需求,刺激用戶長期使用,并且通過拓展應用場景,不斷提供細分服務,進一步滿足用戶;甚至我們也會發現在大多數產品中,通過建立社區,打造社交圈子,強化用戶的粘性。

          (2) 運營維度

          產品使用過程中,合理的運營也是提升用戶留存的關鍵之一,常用的方法有定期舉辦活動、例如砍價、助力、簽到、每日任務等;也可以通過消息推送挽留用戶。



          3.3.5 完成度(Task success)

          完成度主要是指用戶對于關鍵任務的完成率,常常用來衡量交互流程是否合理。主要包括以下維度:首次點擊時間、操作完成時間、完成點擊次數、完成率、失敗率、出錯率等。

          A: 任務完成度的衡量指標該怎么計算呢?

          (1) 任務完成時間

          用戶在整個任務過程中,所花費的時間即為任務完成時間。

          (2) 完成率

          完成率=完成的操作次數/開始操作的次數


          產品設計中,為了提升完成率,需要輔助用戶進行交互并進行引導設計,不僅需要符合不同場景變化以及用戶的心智模型,還要給予用戶體驗流程中的舒適感受,進一步輔助其完成任務。


          B: 如何提升任務的完成率呢?

          (1) 降低理解成本

          利用設計手法,降低任務流程中的理解成本,切入到實際的場景中,幫助用戶快速完成任務。

          例如在列表模塊中,默認狀態下的輸入框內,展示灰色的提醒文案,提前告知用戶該區域應該填寫的內容;比如說高德地圖通過AR技術結合導航,快速幫助用戶完成導航任務;再類似于可視化數據看板,幫助用戶快速獲取信息結果。


          (2) 精簡任務流程

          降低理解成本只能單一的滿足用戶操作前的理解,而操作過程中的步驟長短也起到非常關鍵的作用。優化任務流程,目的就是為了提升完成率。

          例如用戶在進行登錄注冊時,可以點擊右上角的文案即可實現登錄注冊狀態的快速切換,減少用戶切換的流程步驟。再比如說表單填寫類的產品,還可以將相同的內容進行整合,減少操作。甚至電商產品中,可以通過找相似減少用戶的篩選成本。



          (3) 系統智能預判,提供幫助

          結合用戶的場景與行為,進行合理的預判設計,有助于縮短用戶操作路徑、引導用戶轉化。例如下面的案例,在表單信息填寫中,通過智能判斷關聯內容,提供幫助,甚至通過判斷用戶的行為,進行精準內容推送。



          3.4 常用的數據

          通過以上數據的五個維度,可以發現數據的覆蓋面是十分廣泛的,不同的數據反映不同的內容。在工作中我們也會接觸到復雜且多樣的數據,對于設計師而言,常用的數據大致可以劃分為用戶數據、行為數據、業務數據這三大類別。



          3.4.1 用戶數據

          從字面上理解用戶數據即為與用戶有關的數據,這種數據常常用來描述用戶人群、用戶基礎屬性等。通過一系列的“用戶數據”進行支撐,可以快速梳理關于產品的基礎用戶群體,構建用戶的畫像。

          不同的產品屬性,有不同的用戶人群畫像。比如說美柚這款記錄類APP,主要的用戶人群是年輕的女性,對生活有一定的追求;再比如說英語流利說這款產品,主要的用戶人群是年輕的、有明確學習英語需求的人群。

          用戶數據主要包括兩大類別:用戶基本屬性與用戶生命周期數據。


          a、用戶基本屬性

          用戶基本屬性通俗解釋即為關于用戶自身最基本的屬性,包括性別、地域、年齡、職業、學歷、收入、婚姻狀況等等......通過這一系列的屬性,我們可以對用戶有一個更深刻、更全面的認知。

          只有更好的了解用戶,我們才能進行針對化的設計產出、精準投放,從而推動產品更好的發展。這就好比兩個人談戀愛,只有清楚對方的想法、習慣、喜好,才能減少吵架的幾率,實現和諧發展。



          b、用戶生命周期數據

          生命周期指的是從開始到結束,用戶都會經歷著從接觸到流失的階段,我們通過生命周期結合用戶數據可以簡單分為新增、活躍、留存、流失。


          1、新增用戶數

          新增用戶從字面上拆解開來即為新、增,廣泛意義上來說,我們可以將一段時間內打開產品的新用戶人數算作新增用戶,但是更嚴謹一點的話,則表示某產品一段時間內新增加的注冊用戶數量。

          通常我們將下載且訪問過產品的用戶稱為訪客,這部分人群是潛在的注冊用戶。


          2、活躍用戶數

          活躍用戶在體驗產品的過程中會花費更多的時間與精力,相比普通用戶而言他們更加認可平臺,對于平臺的發展有著重要的地位。那什么是活躍用戶?如何具體的去定義活躍用戶呢?

          通常來說,用戶在規定的時間周期內,有打開過產品,這就算做一個活躍用戶。當然,不同平臺對于活躍用戶的定義存在一定差異。而活躍用戶主要也分為兩類:新用戶與老用戶,而從商業的角度上還可以劃分為低價值用戶與高價值用戶。

          活躍用戶數常見的指標有DAU、WAU、MAU。

          DAU:Daily Active User,表示日活躍用戶數量,指的是從0:00-24:00一個自然日(統計日)之間,登錄并使用了某一功能的用戶數量。

          例:某個產品的日活計算方式為打開該APP即算活躍,2022年1月19日這天打開APP的行為有50次,經排重后發現有30個用戶打開了APP,那么該產品的DAU就是30。

          了解完DAU,我相信大家對于WAU(周活躍用戶數量)與MAU(月活躍用戶數量)應該不至于陌生了。WAU與MAU,他們兩者最大的區別就是計算周期的不同,但需要注意的是,月活的計算并不是簡單的日活相加,我們需要進行去重。



          3、用戶留存率

          在講解用戶留存率之前,我們應該了解用戶留存。何為用戶留存?顧名思義,就是最終留下來的用戶。用戶留存率這一指標可以反饋當前產品的質量如何,這是產品自初期開始就需要持續關注的內容。常用的用戶留存指標有次日留存、3日留存、7日留存、15日留存和30日留存。



          4、用戶流失

          用戶流失的定義是什么?用戶流失需要結合時間(Time)與動作(Action)這兩個指標進行,即用戶在一段特定時間內未進行關鍵行為的操作。與之常常相關聯的因素大致分為產品生命周期、負面體驗、競品策略等等。

          用戶流失率的存在表明了用戶對產品的負面反映,對于產品發展有著非常重要的數據反饋。

          當下市場中的獲客成本越來越高,獲取新用戶的成本要比留住現有用戶的成本高出5倍。因此降低用戶流失率,就顯得尤為重要。



          3.4.2 行為數據

          行為數據常用來描述用戶使用方式,指的是用戶在使用產品過程中所產生的一系列交互相關的數據,通過分析快速了解用戶特征,為流程優化、精細化運營、產品體驗等設計措施提供判斷依據、輔助設計。

          行為數據的指標主要包括轉化率、平均停留時長、跳出率、PV、UV等等。

          1、轉化率

          什么是轉化率?轉化率就是下一頁面與當前頁面的訪問占比。它常常被用來衡量產品路徑中的用戶體驗是否合理,從而進一步推動流程優化以及設計迭代。

          以下圖為例,有200個人來到了頁面A,其中有100人點擊頁面A的按鈕進入頁面B,那么頁面A按鈕的轉化率則為(100/200)*100%=50%。


          2、啟動次數

          通常指的是某一特定時間段內用戶啟動應用的次數。與之相關的兩大指標分別為用戶總啟動次數與人均啟動次數,常用來反映用戶粘性與活躍度。


          3、使用時長

          使用時長是指某一特定時間段內用戶從打開到關閉產品的使用時間。使用時長需關注的指標為用戶總使用時長、人均使用時長、單次使用時長。這些指標常用來衡量用戶粘性與活躍度,常常需要與啟動次數一起結合進行分析。


          4、訪問分析

          頁面訪問分析包括頁面訪問次數、停留時長、跳出/退出率、用戶訪問頁面數和用戶訪問路徑。


          (1) 訪問次數

          訪問次數是指訪客完整打開頁面進行訪問的次數,常用來衡量產品的訪問速度。

          (2) 停留時長

          停留時長表示用戶進入產品中,呆了多長時間后離去。這一指標是考量用戶粘性以及貢獻度的重要指標。

          (3) 跳出率/退出率

          跳出率,指的是只訪問了入口頁面即退出的次數與入口頁面訪問次數的占比數。

          跳出率越低,說明流量越好,用戶對產品的興趣越高。

          計算公式為:跳出率=訪問一個頁面后離開的次數/總訪問次數*100%

           

          退出率是指從該頁面退出的頁面訪問數與進入該頁面的頁面訪問數之比。

          計算公式為:退出率=退出次數/總訪問次數*100%


          跳出率為(2/8)*100%=25%

          退出率為{(2+2)/(8+2)}*100%=40%

           

          注意:跳出率與退出率較高,也不全部都是壞事。我們需要具體問題具體分析。比如說某些下單頁面,點擊提交后會進入第三方支付平臺,該頁面跳出率高則為正常。



          (4) 用戶訪問頁面數

          用戶訪問頁面數常常離不開兩方面的指標,PV值與UV值。

          PV(Page View):指的是在一個特定周期內,頁面訪問量或點擊量,側重瀏覽量。

          用戶每訪問一次就算作一個PV。

          UV(User View):指的是在一個特定周期內,訪問頁面的人數之和,側重訪客數。

          一天內同個用戶多次訪問僅算作一個UV。



          (5) 用戶訪問路徑

          用戶訪問路徑是統計用戶從進入產品到離開產品整個過程中的路徑與頁面訪問情況,不同的用戶路徑是不同的,我們需要去定位關鍵節點,針對性的產出優化方案。

          如下圖所示,用戶在進行針對性的查找歌曲時,通過首頁的搜索入口進入,在搜索引導頁面中輸入歌名,最終出現結果頁。通過用戶的訪問路徑分析,可以為我們進行優化提供合理的切入點。





          3.4.3 業務數據


          1、ARPU

          ARPU是 “The average revenue per user” 的縮寫,是指在某一周期內用戶產生的平均收入,用來衡量單個用戶為企業所帶來的效益。

          注意:ARPU值是有時間屬性的,我們在計算的時候需要有清楚的時間定義,不同的定義方法,計算出來的結果是有很大差異的。



          2、付費率

          不同業務模式之間的付費率計算方式是不同的,在進行分析之前,我們就需要弄清楚分析的維度。

          (1) 注冊用戶付費率

          注冊用戶付費率=付費人數/注冊人數

          (2) 活躍用戶付費率

          活躍用戶付費率=付費人數/活躍用戶人數



          3、GMV (成交金額

          GMV (Gross Merchandise Volume),即成交金額。這個指標常用在電商行業,是用來衡量電商企業綜合實力的核心指標。

          GMV=真實成交金額+未付款訂單金額+拒收訂單金額+退貨訂單金額。簡而言之就是GMV為已付款訂單與未付款訂單兩者之和。



          4、LTV (用戶終身價值)

          LTV(Life Time Value),為用戶生命周期價值。一般常用指標為3日、5日、7日、30日、60日、90日LTV。常用來衡量用戶從開始使用到不再使用產品的整個生命周期內,為企業貢獻了多少收入。

          它的計算方式由兩部分組成:LTV=LTxARPU,LT為用戶生命周期,ARPU為每用戶平均收入。




          四、數據分析思維

          數據分析不僅僅是擺數據,同時深度的結論也非常重要。空有數據,沒有結論,對于決策者而言并沒有什么明確的用處。那么,面對一堆數據,我們該如何分析得出深度的結論,從而驅動決策?


          4.1 數據來源

          數據的獲取渠道有很多種方式,接下來分享幾個我在工作中經常使用的方法。


          4.1.1、數據分析平臺

          注意:同一關鍵詞,不同平臺的搜索結果可能存在一定差異



          4.1.2、內部咨詢

          平時的工作中,我們不能僅僅是沉浸在自己的世界,需要加強與其他同事之間的溝通交流。通過與用戶運營、數據分析師的交流,可以了解到最新的數據情況,時刻保持敏感度。

          如果公司沒有專門的數據分析師,也可以從客服人員下手,他們無疑是與客戶打交道最直接的人了,他們對于用戶的痛點會更及時感知??梢酝ㄟ^詢問客服人員,更好的了解用戶的痛點需求,輔助我們設計方案的執行。




          4.1.3、用戶反饋

          我們可以通過多種方式了解用戶對于產品的反饋,比如說Feedback用戶反饋,Twitter、Facebook等社交媒體,以及Google Play應用商店評論等。



          4.1.4、數據埋點

          針對想要查看相關數據的模塊內容,提交關鍵數據指標給到數據分析師、開發等,從而進行一個定制化的內容獲取。

          注意:說到這里就不得不提到數據埋點,有一個需要我們注意的地方,那就是在進行埋點時,一定要在設計階段就提前告知開發以及數據分析師,做好溝通工作,針對需要的數據進行埋點處理。



          4.1.5、需求評審

          在需求評審前,設計師可以提前了解相關數據,幫助我們對于設計層面有個更深刻的理解。在評審過程中,通過溝通碰撞了解到更多的數據,也能依據之前項目的數據資料作為參考,輔助本次設計優化。



          4.1.6復盤分享

          在一些大的項目上線一段時間后需要進行數據反饋,大家針對結果做一個項目復盤,開展相關會議。在這結果之外,我們還需要關注是否產生了新問題以及是否有新的機會發掘點。在復盤之后,針對知識點進行共享,設計師可以通過這種方式了解更多信息,方便后期迭代。




          4.2 甄別數據

          數據的呈現往往告訴我們已經發生了什么,但它沒有告訴我們將會發生什么。我們應該利用數據,從歷史中吸取教訓,也可以依據過去的趨勢預測未來,甚至可能是非常準確的預測。我們需要對數據有一個理性的判斷,進行甄別。

          4.2.1 虛榮數據

          什么是虛榮數據?如果空有一個數據,盡管該數字看起來很美,卻無法依靠該數據去進行設計驅動以及提供具體價值,那么該數據就是一個虛榮數據,毫無意義。

          以下幾個指標則是常見的虛榮數據,我們需要引起注意。


          1、點擊量

          無論什么網站,只要頁面上存在的可點擊區域多,那么該頁面的整體點擊量數字必然都比較高。相比之下,我們更應該關注的是點擊人數,而不是點擊次數。100個用戶每人點擊1次,與1個人點擊100次,后續帶來的結果是必然不同的。


          2、下載量 

          下載量的多少有時候會影響產品在應用商店中的排名,但是這個數據指標并不能帶來實際價值。反觀下載之后的注冊轉化率、付費轉化率等等才是我們關注的重點。


          3、用戶數

          用戶數量越大,這個產品聽起來似乎就越成功。但是產品的成功與否,并不僅僅取決于這一個數字,而是與之相關的一系列指標。

          比如說A、B兩款產品的用戶量分別為100萬以及50萬,用戶活躍度分別為1%與30%,其他都是沉默用戶,那么就一定能說A產品要比B產品好嗎?

          用戶數量再大,沒有體現出對應的價值,那么就是虛擬數據。我們不能被這些虛擬數字所欺騙,還沾沾自喜。


          4、停留時長

          用戶的停留時間越長就說明這個產品越好嗎?真的是由于產品的用戶體驗做的足夠好而讓用戶產生了沉浸式的體驗從而一直停留嗎?

          用戶的停留時長并不是越長越好,這個指標也無法直觀反映用戶對產品的粘性。我們更應該結合完成度、內容跳出率等數據進行綜合判斷。




          4.2.2 異常數據

          數據分析過程中,也會存在很多異常數據,需要從多個角度看待數據,一般來說,產品的部分數據指標存在固定的波動周期,當某項數據指標突然不符合常規波動變化的時候,我們就需要去進行深入的研究,挖掘異常背后的原因。


          1、幸存者偏差

          幸存者偏差是數據分析中常見的邏輯錯誤,那么簡單來說是什么意思呢?

          通過以上幾個例子,想必大家對于幸存者偏差都有一定的理解了吧。所謂幸存者偏差,即我們在進行統計的時候忽略了樣本的隨機性與全面性,用局部樣本代替總體樣本。歸根到底這就是由于獲取信息知識的不全導致的認知偏差。這啟示我們在查看數據的時候,不能只看顯而易見的信息,同時還要找出沉默信息。否則,一定會存在著巨大偏差。


          2、數據樣本不夠

          在進行數據提取的過程中,除了需要注意上面所描述的樣本選擇問題上,還需保證足夠多的樣本數量來進行支撐。按照常規定律來說,數據樣本達到一定的數量程度,才能展示出相對真實的規律。

          例:比如說我們在產品中新增了一個功能,但是由于預算、人力資源等原因在前期的推廣宣傳階段并沒有多少曝光,只有一部分老用戶知道,這就說明這個功能很失敗,沒有存在的意義嗎?答案未必是這樣。

          所以在進行數據提取時,我們就需要盡可能的保證有足夠多的樣本數據,這樣才能保證最終輸出的數據結果是最客觀的。


          3、存在臟數據

          臟數據,也被稱為壞數據,常常是指不合理、對于業務毫無用處的數據。

          臟數據產生的原因有多種,數據統計過程中可能是由于輸入了多余空格、重復插入多余數據等等。在前期數據收集分析階段,例如問卷調查,往往會存在很多無意義的問卷,為了保證問卷的準確性,可以通過設置分支題目、陷阱題目等等方式來進一步篩選問卷,做好對臟數據的防控與清洗。



          4.3 分析方法

          接下來給大家分享幾個平時工作中常用的數據分析方法,包括以下幾種:漏斗分析法、矩陣分析法、對比分析法。


          4.3.1 漏斗分析法

          漏斗分析法是數據分析過程中非常重要的一種分析模型,能夠科學的反映用戶行為狀態以及從起點到終點各階段之間的用戶轉化情況。

          常用的指標包含轉化率與流失率。通過層層的分析,觀察流程中是否存在提高轉化率的機會點,挖掘設計。(后面會結合實際項目為例進行詳細闡述,這里就不做過多講解)


          4.3.2 對比分析法

          所謂的對比分析,就是給孤零零的數據一個合理的參考,否則這種數據是沒有意義的。在利用對比分析法進行數據分析時,需要關注兩個方面內容:對比對象與對比維度。

          在產品迭代測試的過程中,為了增強說服力,擇決出最佳方案,往往會采用對比分析,也就是常說的A/B Test。A/B Test最核心的思想是要保證單一變量,其他條件保證相同?;氐皆O計本身,一般來說每個方案應該大體上相同,只是某一個地方有所不同,比如某處文案、顏色、圖標等。然后針對不同的用戶展示不同方案,統計并對比不同方案的轉化率、留存率等指標,從而確定最優方案。


          4.3.3 矩陣分析法

          矩陣分析法常常是通過兩個指標的交叉,利用分析矩陣劃分為四個象限,找出問題的優先級。

          例:如下圖所示,為某個運營活動點擊的四象限分布情況。X軸自左向右,Y軸自下而上,分別代表了從低到高。

          通過矩陣分析的方式,我們可以快速定位當前最值得的MVP優化方式,指引我們在復雜的數據中正確前行。



          五、數據驅動設計

          作為一名設計師,在了解了數據基礎的內容后,就需要掌握通過數據驅動設計最關鍵的內容,接下來我將通過用戶、行為、業務三個角度來給大家分享幾個不錯的設計案例。


          5.1 用戶增長

          通過上面的分析,我們了解到用戶數據涉及到兩個方面,用戶的基礎屬性數據可以很好的輔助設計,通過數據對用戶進行分層,例如性別、年齡、地域,這些都是常見的用戶基礎屬性;

          除此之外,與用戶相關并關聯產品的重要數據還包括新增用戶、用戶活躍度、用戶留存率、用戶流失率等數據,我們可以通過這些數據的表現挖掘背后的原因,進而通過設計手法深入優化促進用戶數據增長,形成閉環。簡單分享以下幾個方法。


          5.1.1 產品拉新

          關于產品拉新,并不只是產品上線后需要考慮的事情,在產品設計的每一環節中,都是需要去進行考慮的。產品拉新可以通過邀請碼、新手福利、邀請好友等幾個方面進行。


          1、邀請碼

          邀請碼通常是由企業發放,優先發放給種子用戶,然后通過種子用戶的社交圈去進行擴散,進而吸引更多的用戶參與進來。

          前段時間爆火的一款國外音頻社交軟件Clubhouse,便是利用了這種方式進行擴散傳播。與Facebook、Instagram、Twitter等社交軟件有所區別,Clubhouse并沒有對全部用戶開放,而是需要得到其他用戶發出的邀請碼驗證后才能進行使用。邀請碼的稀缺性將Clubhouse的熱度炒得越來越高,使得參與其中的用戶能產生一種自我滿足感,同時這種模式大大保證了音頻內容的質量。


          2、新手福利

          一些產品針對未注冊或者未使用過產品的新用戶,會發放專屬福利,促進用戶轉化。

          新手福利通常是以開屏頁、Banner、彈窗、活動頁、新手任務等形式進行領取,隨著市場環境的緊張,獲客成本越來越高,新手福利的成本的也在逐漸增加。


          3、邀請好友

          針對注冊或使用過產品的用戶而言,通過發掘他們自身的社交圈子,促使老用戶自覺邀請新用戶,提升產品的用戶數量增長。

          邀請好友有以下兩個常見方式:

          (1) 增加分享入口

          老用戶可通過點擊分享圖標的形式直接分享給相應的好友。比如說,網易云音樂這款產品,用戶可以邀請好友一同在線聽歌,或者是單獨分享給特定的人。這種方式主要是利用了人的分享和展示心理。

          (2) 福利刺激

          平臺發放一定的優惠券、獎勵等給到用戶,新老用戶都可以通過這種方式獲得對應的獎勵。這種方式主要是利用了人的獲利心理。


          5.1.2 活躍運營

          活躍運營可以提升沉默用戶的活躍度,對于產品的發展有著非常重要的作用,常常通過一系列的方式來進行布局。

          1、用戶積分體系

          積分體系如果運用的好,那么對于增加用戶粘性以及提升活躍度是非常有幫助的。這個積分體系是否能夠吸引到用戶,就在于積分所兌換的產品是否有足夠價值。

          比如說常見的外賣平臺——餓了么的積分體系,其核心就是圍繞下單行為而展開,下單之后返還吃貨豆,吃貨豆可兌換紅包,紅包再次消費抵扣。整個操作流程,圍繞用戶的核心行為構建獎勵并形成閉環。


          2、簽到

          很多產品都設置了簽到功能,希望借此方式提升用戶粘性。這一功能的常見名稱為“簽到”“打卡”,或者根據運營活動的場景來進行命名,比如說螞蟻莊園、新浪種樹等。

          一種良好的簽到模式對于用戶習慣的培養是有著積極的正向作用的,但是關于在產品中是否增加該功能,也是要根據自身的產品特性去進行更細致的考量。

          簽到的方式主要有自動簽到與手動簽到這兩種。

          (1)自動簽到

          登錄自動簽到的方式常見于游戲類應用中,比如說王者榮耀這款產品,用戶打開即以彈窗形式告知用戶,領取相應的獎勵。

          (2)手動簽到

          用戶點擊簽到入口,即可完成簽到。相比自動簽到而言,這種簽到方式應用范圍更加廣泛。


          3、社區

          現如今越來越多的產品開始打造自己的社區,比如說淘寶的逛逛,咸魚的會玩等等。為什么社區功能越來越普遍呢?社區的存在,可以讓用戶在產品有一個屬于自己的社交圈子,這樣有助于用戶產生粘性,從而提升產品活躍度。

          例:Keep通過打造高品質的UGC內容社區,滿足新老用戶的價值需求。頂部Tab分為關注、精選、圈子三個模塊。關注一欄方便用戶快速查看自己感興趣的人,滿足社交需求。精選一欄承載了KOL與內容生產者的分享內容、用戶社交留存功能。圈子一欄更好的滿足用戶想要一群人打卡的情感訴求。


          5.1.3 留存

          留存的本質是要滿足用戶的核心需求,只有滿足了這個條件后用戶才會持續使用。它應該貫穿于整個用戶生命周期,而不僅僅是局限于其中某一個節點。好了,廢話不多說,直接上例子。

          1、流暢的首次體驗

          用戶首次使用該產品時是否順暢,能否在第一時間找到自己所需要的內容,很大程度上會影響用戶后續的留存情況。

          比如說現如今很多產品為了降低用戶的登錄注冊成本,通過手機號一鍵注冊即可實現快速登錄。若未注冊過,在登錄時系統會自動判斷并為其創建賬號。這種方式極大的降低了用戶記憶成本,同時還有安全性的保障。


          2、降低學習成本

          通常來說一款產品的學習成本越高,用戶理解起來就越困難,那么用戶長期留在該平臺的概率就會降低,故而我們應該通過一些設計手法去降低用戶的學習成本。

          例如一些金融產品,其晦澀難懂的專業知識對于新手小白來說真的是非常困難,基本的認知都存在困難的前提下,更別說指望用戶轉化了?;诖吮尘埃率忠龑崾?、新手教學視頻、在線客服服務、模擬交易等等方案,都會極大的降低用戶理解成本,為后續用戶的下單轉化提供有力的幫助。


          3、遷移成本

          何為用戶遷移成本?用戶選擇新產品的行為需承擔的代價。隨著遷移成本的增加,用戶長期使用該產品的概率也會相應增加。

          例如有道云筆記這款產品,用戶在該平臺創作了大量的內容后,就很有可能會長期留在該平臺,因為重新換平臺的成本著實有點高。




          5.1.4 挽留機制

          挽留機制是留住用戶、促進用戶轉化的最后一道程序。

          常見的挽留機制有以下幾種形式:

          1、提供解決方案

          當淘寶用戶在進行退款時,若原因是地址填寫錯誤,那么頁面會自動出現彈窗提醒用戶修改即可,避免用戶取消訂單,從而降低退款率。


          2、利益刺激

          當用戶退出購買頁面關鍵節點時,會以彈窗形式進行挽留。

          例:知乎會員購買頁面退出時,系統會自動出現二次確認彈窗,將價值點信息以動效形式展示在視覺中心,并對支付按鈕進行突出設計,吸引用戶注意,再次挽留。

          例:拼多多的二次挽留同樣以彈窗形式展示,突出利益點,同時有時間維度,使得用戶產生緊迫感,刺激用戶下單。


          3、操作警告

          操作警告類的文案二次提示,可以讓用戶對當前行為有更清楚的認知,并仔細思考。用戶會考慮到一些時間成本、花費精力等因素,可能會取消放棄的念頭。

          例:全民K歌這款應用,用戶想要刪除之前發布過的創作內容,點擊刪除之后,會出現二次警示確認彈窗,對用戶的行為進行一個挽留。就算最終用戶刪除了創造內容,還可以在最新刪除列表中恢復。這樣既可以避免用戶誤操作引起的后果,還能最大程度的保護創作內容的多樣化存在。




          5.2 行為優化

          行為數據描述用戶使用方式,雖然與用戶相關,但更加關注的是使用的流程、方式與產品體驗,其中重點關注的數據包含點擊率、轉化率、訪問分析等。


          5.2.1 行為場景復現

          深入分析用戶的訪問數據,模擬行為場景,更好的把握用戶當下的心理,從用戶角度出發去設計。下面,我將以一個工作中的實際項目為例,詳細闡述如何從設計側推動項目迭代。

          例如我們接到一個需求,需要進行注冊流程的優化,提升這一模塊的轉化率。很多時候,我們往往會陷于視覺層面進行調整,但這并不能從根本上解決問題。我們需要靜下心來仔細思考,真正找到這個需求背后的目的以及當前存在的問題。

          那么我們可以怎樣去進行呢?首先,為了對用戶行為有更直觀的理解與感受,可以利用用戶體驗地圖的形式將用戶行為場景復現,通過對用戶的情緒曲線、想法的剖析,從中找到合適的機會點,為后續設計的迭代優化提供一定思路。

          通過對用戶的旅程進行分析,可以發現在不同關鍵階段中所對應的數據指標也不同。因此在設計的過程中可以針對不同的行為場景,制定對應的數據優化目標,從而提升整體的產品價值。



          5.2.2 行為路徑優化

          用戶的行為是決策的重要因素,了解用戶的行為和意圖后,會發現大部分用戶的行為與設計會存在很大的偏差,所以需要更多關注用戶的行為數據,揣摩用戶行為下的真實心理與訴求,才能做出用戶滿意的產品。

          緊接著上面的案例,咱們繼續通過漏斗模型進行深入分析,優化用戶在登錄注冊路徑上的體驗,提升轉化率。

          原有的登錄流程轉化率如下圖所示


          1、快速定位問題環節

          通過數據反饋,發現從注冊頁面到點擊注冊按鈕這頁面之間存在較高的流失率,其次再是安全驗證頁面。我們需要對這一流程中的關鍵節點進行梳理,同時將主要的精力聚焦于該模塊的優化。針對流失率較高的主要頁面進行著重設計。


          2、分析問題

          通過數據分析可知,用戶很大一部分都在點擊注冊按鈕這一頁面流失掉了,當前頁面的停留時長較長,那么我們是否可以縮短停留時長,幫助用戶快速注冊呢?該怎樣設計才能提高用戶的操作效率呢?


          3、方案輸出

          通過聚焦問題后,發現最終我們的落腳點應該在如何提升用戶的操作效率,幫助用戶快速完成注冊。

          針對此設計目標,運用競品分析、用戶體驗地圖等方式對于該模塊進行了思維拓展。提出了一些可行性方案,比如在輸入郵箱時增加常用高頻郵箱格式后綴,減少用戶手動輸入的步驟;比如增加用戶輸入錯誤之后的快捷刪除圖標,方便用戶一鍵操作.....等等(詳細的可見之前項目復盤)。


          4、數據驗證

          在設計上線一段時期后,查看數據情況。

          經過一段時間的驗證,漏斗模型的數據轉化有了很大提升。再次驗證,此次改版方案較為成功。

          以上案例大致展示了工作中如何運用數據驅動設計的常規流程與方法。從整體漏斗分析原因,定位關鍵問題節點,進而推動問題環節的優化,最終解決問題。



          5.3 價值體現

          數據會給到我們一定的指導作用,我們需要對數據進行深入思考,從設計的層面去賦能業務。從宏觀的角度去看待業務價值的增長點,尋找設計機會。那么我們該如何通過設計手段提升業務價值呢?產品價值的實現離不開用戶,從用戶的角度進行拆解分析,可以更好的洞察到機會點。

          例如我們需要提升會員模塊的開卡率,該怎么進行落地執行呢?


          5.3.1 目標拆解

          我們將用戶的行為路徑劃分為感知——決策——行動——傳播這幾個主要階段,通過體驗地圖,深挖可優化的空間。

          通過流程的梳理,將目標進行拆解,我們可以從中找到一些值得優化的地方。



          5.3.2 設計方案

          有明確的設計目標之后,我們就需要針對每一節點進行針對性的設計。

          1、感知階段-用戶觸達

          當前會員購買的入口隱藏的過深,很多用戶都對該模塊的存在缺少認知。要想會員卡的購買率有所提升,最基本的舉措就是要加大對其宣傳力度。因此,我們需要增強用戶感知。常見的形式有Push推送、郵件、短信等等,吸引用戶去查看相關的內容,并引導后續轉化。

          我們需要提升關于會員內容的用戶感知,就可以嘗試在首頁增加會員入口。宣傳的形式可以采用Banner圖,方便用戶直接點擊就可進入了解詳情。另外,產品頁面還可增加氣泡文案引導,底部懸浮彈窗等等,增強用戶的感知。

          有一個需要特別注意的地方,就是在進行宣傳引導時,一定要考慮到產品自身的屬性,進行差異化設計。比如說海外產品的用戶一般都很討厭廣告,那么我們在進行設計的時候就要做到克制。在滿足運營需求的前提下,盡量減少對用戶造成不好的體驗。


          2、決策階段-價值觸達

          用戶受吸引來查看會員相關內容時,我們需要對會員的價值進行一個高效快捷的輸出傳遞。只有讓用戶在該階段感受到價值大于價格,才會有后續的購買行動。在會員權益模塊,需要根據用戶的狀態進行區分,針對化展示。人群大致劃分為普通用戶、會員與過期會員。

          我們可以通過一些設計手法,強化用戶的價值觸達感知。

          (1)文案刺激。告訴用戶辦會員卡一年預計能省下多少錢。

          (2)增加計算器功能,讓用戶根據自己的習慣輸入預計交易額,更智能的感知優惠。

          (3)向用戶發放一定的優惠券,并增加倒計時,出于沉沒成本,用戶轉化的幾率很有可能會增加。

          (4)人數比例展示,利用人的從眾心理,促進購買。



          3、行動階段-購買轉化

          到了行動階段,用戶的整體購買流程是否高效、是否順暢則成了我們需要關注的重點。我們在現階段的設計策略,可通過以下方式進行展開:


          (1)避免用戶過多選擇

          原有的會員頁面將三種會員模式全都展示出來讓用戶自己選擇,對于很多新手來說這無疑是非常困難的,會員的購買率也比較低。更新后,我們將會員的價值點簡單的羅列出來,讓用戶可以直觀的了解會員卡的優勢,同時會員卡按照時間周期與價格劃分為3個不同的層級,針對平臺主推的年卡,增加標簽,強化感知。


          (2)減少頁面跳轉

          用戶在進行購買時,無需跳轉頁面,只需在當前頁面操作即可。懸浮收銀臺的形式,可以避免用戶在跳轉頁面之間可能帶來的數據流失,最大化的保障用戶購買行為的完成。


          4、分享階段-持續正向裂變

          用戶完成分享即可獲得相對的獎勵,被分享的新用戶再進入產品進行體驗,即可獲得新用戶獎勵。在進行分享的操作中,有以下優化方向。

          (1) 增加分享引導

          可以通過文案引導、運營位的形式進行宣傳,吸引用戶進行分享操作。

          (2) 優化分享體驗

          增加分享的渠道,引入常用的Twitter、Facebook、Telegram等社交平臺;

          增加用戶分享圖的制作,為用戶提供更多的選擇空間。




          六、總結

          數據驅動是一項長期的工作,需要去不斷的跟蹤、反饋,通過不斷的數據驅動,才能推動設計的更優發展。在日常的工作中,我們需要對數據保持敏感,從這些數據背后找出真正的原因,并進行針對性的優化。設計師了解一定的數據知識,可以更好的輔助我們進行設計產出,使得我們的方案更有說服度。

          感謝閱讀,以上就是我要分享的如何利用數據驅動設計的全部內容。


          文章來源:站酷  作者:甜西瓜汁



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

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

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



          App 信息架構:如何讓用戶始終有掌控感

          ui設計分享達人

          信息架構是產品的骨架。具體而言,就是一款產品有幾個一級頁面,以及支撐起整個產品的一級頁面、二級頁面各有幾種內容樣式。所謂一級頁面,微信的“發現”頁就是一個一級頁面;在“發現”頁點“朋友圈”,進去的就是一個二級頁面。所謂內容樣式,Banner 是一種內容樣式,九宮格是一種內容樣式,設置頁面那種列表也是一種內容樣式。

           

          這樣的信息架構,有什么價值?

           

           

          01 信息架構的價值:掌控感與健康迭代

           

          對用戶而言,信息架構的主要價值在于掌控感;對產品而言,信息架構的主要價值在于健康迭代。

           

          1. 掌控感

           

          如果房間里很亂,到處都堆滿了東西,常穿的衣服也找不到了,我們就很容易變得煩躁不安。相反,如果混亂的房間被收拾得很整潔,我們的心情也會隨之變得愉悅起來。

           

          這中間的原因是什么?

           

          個人覺得,從原始社會到 21 世紀,我們人類一直生活在競爭中,所以一直在追求一種對生活的掌控感。這種掌控感,會讓我們找到一種存在感和價值感,從而給身處競爭中的我們一種安全感。一個收拾得井然有序的房間,會讓我們覺得一切盡在掌握中;一個胡亂塞滿東西的房間,則會讓我們覺得這個房間處于失控狀態,從而引發煩躁不安。

           

          一款 App,如果主要的幾個一級頁面也都塞滿了各式各樣的內容,那么用戶通常也會感到煩躁不安。這是因為用戶不能馬上理出頭緒,不能馬上獲得那種掌控感。另外,如果大的改版經常讓用戶體會到這種煩躁不安,用戶就會對這款 App 感到不滿和失望,甚至失去信心和期待。

           

          所以說,信息架構的第一個價值,就是讓用戶始終有掌控感。

           

          2. 健康迭代

           

          產品的更新迭代,有時會出現“發?!焙汀拔⒄巍钡那闆r。這都屬于不健康的迭代。

           

          所謂發福,就是變得臃腫了,比如一級頁面突然增加了很多內容樣式。所謂微整形,就是和之前比有點亂套了,比如有的一級頁面突然消失了、有的一級頁面突然出現了、有些常用的功能突然找不到了,諸如此類。

           

          一款產品,如果大的改版總是通過發福、甚至微整形的方式實現,用戶就很難獲得掌控感。

           

          反過來,一個優秀的信息架構,是接近“凍齡”的。也就是說,不管產品怎么更新、怎么加新功能,都能簡單如初,都能讓用戶馬上獲得掌控感。典型的例子是微信:微信已經加了很多功能,但整體給人的感覺依然是簡單的。

           

          這樣的信息架構,很少發福,也幾乎不做微整形,所以能讓用戶永遠有掌控感,從而確保產品能夠健康迭代。

           

           

          02 怎樣實現信息架構的價值

           

          什么樣的信息架構,能夠實現“掌控感”和“健康迭代”?

           

          其實參考答案剛才已經出現了,那就是接近凍齡的信息架構?;蛘吒_切地說,是一種“以不變應萬變”的信息架構。

           

          這里的不變,是指信息架構看起來永遠沒有明顯變化,永遠都很簡單。萬變,是指不斷新增的功能,不斷變化的功能。

           

          如何做到以不變應萬變?一級頁面和二級頁面都很關鍵,其中最核心的是一級頁面。這里也順便拋一個問題:一級頁面,用來干啥?

           

          一級頁面主要用來干三件事,分別是:提供掌控感、提供常用功能、提供小入口。也就是說,一級頁面尤其要把掌控感給到用戶,要讓用戶快速找到常用功能,同時還要為不常用的功能提供一個小入口。需要說明的是,這個理念可能不太適合一些商店類產品,比如淘寶這樣的電商產品,所以僅供參考。

           

          那如何完成這三件事?主要有以下四個要點。

           

          1. 不要超過 4 個一級頁面

           

          4 個和 5 個,它倆之間存在微妙的區別。比如我們給手機號或銀行卡號分段時,更喜歡每段最多分 4 個數字,而不是 5 個,直觀對比見下圖。


          4 個還是 5 個

           

          很多 App 的底部導航欄,也是只有 4 個Tab,即 4 個一級頁面。受生活經驗等因素影響,當我們看到 App 有 4 個一級頁面時,內心或潛意識里可能會覺得:哦,4 個,還算簡單,基本能記住;而當看到有 5 個一級頁面時,可能會感到一絲壓力:5 個啊,有點多了。

           

          總的來說,我們更偏愛只有 4 個一級頁面的產品,因為 4 個仍在簡潔的范疇內,5 個就已經開始走向復雜。在《微信背后的產品觀》這場分享中,張小龍也提到過:“微信保證只有 4 個底部 Tab。”

           

          2. 不要超過 3 種內容樣式

           

          Keep 6.0 系列的“探索”頁面有 5 種內容樣式,顯得很復雜。微信的 4 個一級頁面中,“發現”和“我”頁面只有 1 種內容樣式,“微信”和“通訊錄”頁面只有 2 種內容樣式(加上頂部的搜索框),顯得非常簡單,和 Keep 的對比如下圖所示。

           

          Keep 6.0 系列與微信的內容樣式數量

           

          像微信這種內容樣式數量上的極簡,可能很多產品難以做到。那么,我們不妨退而求其次,早期先從 1 種、2 種內容樣式開始。后期加功能了,可以考慮第 3 種,謹慎考慮第 4 種,盡量不要增加第 5 種,因為一定會變得復雜。

           

          大家可能會說,產品的功能很多,3 種內容樣式不夠用。

           

          針對這種情況,只要邏輯上不存在大的問題(比如把“支付”放到“通訊錄”頁面),就可以嘗試把不同內容合并成一種樣式。微信在這方面就做得很好,大家可以參考它的設計。比如下圖的“通訊錄”頁面,聯系人上方那些內容,和聯系人不是同一類內容,但它們共用一種內容樣式——一個簡單的圖文列表。

           

          微信“通訊錄”頁面:不同內容合并成一種樣式

           

          3. 不為二成需求,去打擾八成用戶

           

          產品設計里存在一個比較常見的問題,就是往一級頁面塞很多內容或功能,其中有相當一部分是用戶日常用不到的,這種設計容易讓人覺得臃腫。比如 Keep 6.0 系列的“運動”頁面,就用了較大空間來推薦付費計劃和運營活動,如下圖所示。

           

          用較大空間來推薦付費計劃和運營活動的 Keep 頁面

           

          相信有相當一部分用戶是不需要這些內容的,所以這其實也是一種打擾。這種打擾會影響到這些用戶對這個界面的掌控感。

           

          這種現象有兩個可能的原因。一是企業擔心用戶不用這些功能,所以就在一級頁面用很多空間來展示它們,Keep 的例子應該屬于此類。二是有部分用戶提建議,所以企業就加了這些功能。

           

          關于第一個原因,個人觀點,有些功能本身就屬于二成需求,在一級頁面占用太多空間不僅改變不了這個現實,還會對用戶形成打擾。

           

          關于第二個原因,個人看法,用戶的建議通常只代表個人立場,而企業至少要代表大部分用戶的立場。比如,網上就有人建議微信在朋友圈加一個屏蔽別人的功能,實際上微信有這個功能,只是一直隱藏,沒有放出來——因為用的人少,它屬于二成需求,放出來的話會對八成用戶形成打擾。

           

          總的來說,理想情況是接受現實、尊重規律:是八成需求就提供八成空間,是二成需求就提供二成空間。具體參考如下圖所示。

           

          是八成需求就提供八成空間,是二成需求就提供二成空間

           

          4. 盡量不在標題欄使用 Tab 或下拉框,增加維度

           

          這其實是張小龍分享過的一個觀點,我個人很贊同,就直接引用一下。下面直接看兩個例子。Keep 6.0 系列的前三個一級頁面,標題欄都使用了 Tab,就顯得內容很多,有點復雜,如下圖所示(僅展示前兩個)。

           

          使用了 Tab 的標題欄

           

          微信中擁有標題欄的前三個一級頁面,其標題欄都沒有使用 Tab 或下拉框,就顯得簡單、內容少,如下圖所示(僅展示前兩個)。這也是微信保持簡單的一個重要原因。

           

          沒有使用 Tab 的標題欄

           

           

          結語

           

          一般情況下,產品都需要更新迭代:增加新功能,完善舊功能。

           

          用戶則是一個矛盾體:一方面對新功能和新事物懷有好奇心;另一方面又希望每次打開常用的產品時,都有一種回到家一樣的熟悉感和一種家里井然有序的掌控感。

           

          好的做法,就是類似微信那樣:盡管加了新功能,但是看起來沒有明顯變化。也就是說,以“不變”的信息架構,來應對萬變的功能。


          文章來源:站酷  作者:Snow Design

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

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

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


          日歷

          鏈接

          個人資料

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

          存檔

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