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

          首頁

          設計總是憑感覺?那是你不了解這些交互設計原則

          博博

          設計總是憑感覺?你有這樣的困惑么


          本文主要聊一下產品中使用的幾個交互設計原則,一致性,費茨定律,容錯性,希克定律。



          一致性


          我們在做設計時,經常會講到要保持一致。一致性的好處從外部來說,可以極大的提升產品的易用性,降低用戶的學習成本,同時也有利于品牌形象的傳達。從內部來說,將一些相同或類似的功能進行復用,提高團隊的協作效率,讓資源得到更充分的利用。


          那么設計師該如何做到一致性呢?

          一致性體現在產品中可以體現在很多方面,比如是視覺風格統一,交互操作統一。視覺上可以是配色、字體、圖標、頁面布局、插畫,以及在不同終端上的統一。交互操作可以是相同相似功能在不同頁面的呼出方式,一些地方動畫的表現形式。

          另外,產品與本身所處的行業內的競品的一致性,比如音樂播放頁面,用戶已經習慣了上面是歌曲宣傳圖,下面是播放切換的控件,各個產品的排版布局都是相似的,這樣的統一可以讓用戶沒有陌生感,在接觸一個新的音樂類產品時很快的上手。

           

          滴答清單的網頁端、桌面版、網頁插件,將頁面的主要功能信息都放在了左邊,中間部分是清單列表,最右側是清單詳情,配色都是用了灰色、白色、淺藍色,圖標風格上使用的面型風格,這三個終端的視覺風格是保持了高度的一致,傳遞給用戶的也是很強的品牌理念。

           

           

          阿里云盤,App啟動頁和網頁功能介紹,都是使用了C4D插畫,來保證兩個終端品牌風格的一致性。

           

           


          微博App的詳情頁及他人主頁,這兩個頁面的評論功能都使用了相同的底部彈出框的控件樣式,用戶可以在不用思考的情況下直接操作,這是利用了相同功能在不同頁面復用了相同的交互控件。

           

           

           

          費茨定律


          簡單點來說,有兩個關鍵因素,兩個操作目標的距離、操作目標大小。第一個因素意思就是在當前產品中兩步操作,手指移動的距離越短,操作就越容易。第二個因素是當前操作目標越大,操作越容易。

           

          石墨文檔App。在頁面右下角有一個懸浮的新建按鈕,點擊后從底部彈出活動視圖,用戶可以進行新建文檔、表格等操作。這里使用從底部彈出活動視圖,而不是在新頁面或者頁面中間,正是利用了費茨定律,縮短了兩步操作之間手指移動的距離,降低操作難度。

           

           

           

          滴滴出行、如祺出行

          滴滴出行打車頁面,App首先會自動定位你當前所在位置為出發位置,目的地一欄顯示文案「輸入目的地」。設計師將輸入框設計的很大,文案字體也很大,在當前頁面中非常醒目,極大的方便了用戶的操作。這就是應用了費茨定律的第二個因素,當前操作目標越大,操作也就越容易。

          反觀如祺出行的打車頁面,出發地一欄和目的地一欄的尺寸是一樣大的,都是使用圖標+文字樣式,出發地一欄使用深灰色的圖標、深灰色的字體,而目的地一欄圖標雖然使用了橙色主題色,但是文字的顏色是淺灰色,字號也沒有放大,非常不顯眼。要知道用戶當前的迫切需求是輸入目的地,這樣設計無疑是增加了用戶操作的難度。

           

           

           

           

          容錯性


          平時在操作產品界面時,經常會因為一些原因造成操作錯誤,而有些錯誤造成的損失是無法挽回的。那么設計師應該怎么避免用戶操作中犯錯呢?容錯性原則可以很好的解決這個問題。容錯性定義是:


          “容錯性是產品對錯誤操作的承載性能,即一個產品操作時出現錯誤的概率和錯誤出現后得到解決的概率和效率。容錯性最初應用于計算機領域,它的存在能保證系統在故障存在的情況下不失效,仍然正常工作。產品容錯性設計能使產品與人的交流或人與人借助產品的交流更加流暢?!?/span>

          拆解一下,影響「操作時出現錯誤的概率」的因素有,操作前的引導提醒以及操作時的提示。影響「錯誤出現后得到解決的概率和效率」的因素有,操作后的解決方案

           

          微信的修改微信號功能,不同于修改昵稱直接進入編輯頁面,微信在中間增加了一個頁面,頁面內容顯示當前的微信號及提示文字,目的是提醒用戶要慎重,避免有些用戶修改了微信號之后后悔。這里是用到了容錯性的操作前的引導提醒,降低了出現錯誤的概率。

           

           

          QQ注冊頁面,用戶輸入昵稱后,系統會檢測昵稱是否可用,及時給出給出提示。輸入密碼時會自動出現密碼設置的提示,及時提醒密碼都有哪些規則,避免用戶輸入不符合要求的密碼。操作中給出這些相應的提示,可以使用戶更加流暢的完成注冊流程。

           

           

           

          印象筆記網頁版。將一篇筆記刪除后,頁面頂部會出現一個提示框,文案是「已將XX文章移至廢紙簍」,提示框2、3秒之后自動消失。如果剛好這篇筆記是不小心誤刪的,這里的提示框給予了用戶反悔的機會,幫助用戶及時的找回筆記,彌補錯誤。

           

           

           

           

          ??硕?/span>


          ??硕桑纸惺窍?艘缓B桑℉ick Hymalrs 1aw),是一種心理物理學定律。應用在產品設計當中,就是當頁面中需要有不同選項時,要盡可能的少而簡單,降低用戶的決策成本。

           

          美團外賣頁面的金剛區,共有三行應用。核心推薦的5個應用是放在第一排,其他10個應用排成兩排,核心推薦應用與其他應用在圖標風格上使用了區別化設計,用戶在進行選擇時變成了5選1,而不是15選1。這是設計師在功能設計時針對應用做出了重要程度的區分,以幫助用戶更快做出選擇。


          作者:不吃橙子D

          轉載請注明:站酷

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

          魏華的微信.png

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

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

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

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

          在交互設計中,作為設計師應遵循的7大定律-上

          博博

          在設計中尋找真理,探索每一個設計背后的意義。



          除非有更好的選擇,否則就遵從標準  —— 阿蘭庫珀



          費茨定律:

          距離:起始位置離目標位置越遠,我們到達目標位置所花費的時間就越長,反之亦然。

          目標大?。耗繕嗣娣e越大,我們定位到目標位置所花費的時間就越短,反之,目標越小,定位時間越長。


          ·生活中的費茨定律

          剎車和油門踏板相距很近,剎車時的物理面積比油門的物理面積大,會最快接觸到踏板,減少事故的發生。




          ·界面中的費茨定律

          (1)距離目標位置盡量縮短,相關操作保持親密性

          例如:抖音的視頻播放界面,系統會判斷用戶進行觸發時手指與屏幕的接觸位置,并將操作按鈕顯示在離用戶手指最近的位置。


                                                  


          (2)目標尺寸大小要合適

          目標點擊熱區在合適的范圍內,越大越容易精準點擊,越小越容易誤操作。iOS交互指南中規定最小點擊熱區為44*44。

          (3)拇指原則

          人們在使用手機時,75%的交互操作都是由拇指驅動的,考慮到費茨定律,如果目標位置超出拇指的移動范圍,操作成本增加。



          米勒定律:

          是交互設計中常用的一個定律,美國心理學家對人的記憶能力進行定量研究,他發現人的短時記憶能力廣度為7±2個信息塊,超過這個范圍就容易出錯,在7+2與7-2之間浮動。


          ·生活中的米勒定律

          電話號碼,銀行卡號,身份證號碼進行數字分隔,降低記憶成本,提高信息的易讀性,視覺防錯。




          ·界面中的米勒定律

          (1)分段記憶,信息分層

          文章、文本中的字號、字間距,目的就是便于讀者記憶和提高易讀性

          (2)導航和選項卡不超過9個

          網頁設計的一級導航不要超過9個,如果導航和選項卡內容過多,可通過聚合按鈕來包容其他次要入口。(用戶使用導航就是要快速找到自己想要的內容,如不能快速查找,用戶可能會就此流失掉)

          (3)系列位置效應

          首因效應:相對中間位置,我們對最前面的物體記憶清晰。

          新近效應:相對中間位置,對序列末尾物體記憶更清晰。




          席克定律:

          是一種心理物理學定律,用戶所面臨的選擇數量越多,花費時間越長,人機交互界面選項越多,用戶決策時間越長。


          ·生活中的席克定律

          遙控器按鈕越少,越快做出操作;如交互設計四策略:刪除、組合、隱藏、轉移。功能層級也需要細分核心功能、輔助功能、邊緣功能。而核心功能是進入產品第一個發現的功能,操作頻率高,所以它的視覺應是最突出的,可以幫助用戶增強感知和節約選擇時間。


                


          ·界面中的席克定律

          (1)減少選項并提供默認值

          選項越多,用戶決策的時間越長,減少用戶思考的時間就是減少操作時間和學習成本,讓用戶不思考就做出正確的選擇,對于小模塊來說,一般選項不超過9個,9個以上可以用交互約束用戶的行為,如展開收縮。


          (2)選項分類分層,信息區分主次

          在菜單欄的設計過程中,我們會進行同類分組和多級分層的設計,效率會更高。重點信息、推薦信息和普通信息要在時間上做區分,這樣才能搶占視覺并在第一時間感知到。

          (3)分步完成,分布顯示

          分解復雜流程,讓用戶一步步操作,而不是全部堆到用戶面前,通過分步完成一個任務流,降低其他信息給用戶帶來的干擾。例如:用戶填寫表單時,可展示選項,當填完最后一項選“其他”時,再展開剩余的表單,目的上是為了減輕大量表單,給用戶感知上帶來的壓力,達到場景細分的目的。


          接近法則:

          接近法則也是格式塔理論中我們最熟悉的,最常用的一種法則。觀察者看到彼此臨近的物體時,會將它們視為一體。


          ·生活中的接近法則

          小區規劃圖中,會通過較寬的過道,綠植圍欄來劃分他們之間的關系,從而增強人們的感知。



          ·界面中的接近法則

          界面中的接近原則是對相似的信息及功能類別進行分組、布局。作用是直接影響到用戶與產品的視覺交流,引導用戶的瀏覽及操作行為。

          常見的在列表頁面,通過色塊區分大組與大組,分割線區分小組與小組,目的都是在視覺上通過組與組的區分來劃分功能與功能之間的關聯性。



          以上這四條是我們在平常工作時都會用到的,我們再進行一個界面的設計時應該對照下以上幾條定律,在與產品或開發battle時也能有理有據,告訴他我們「為什么這樣設計」。寫的手有些痛,剩下的4條定律下期我再繼續補充,下期見~


          作者:瞧見貓

          轉載請注明:站酷

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

          魏華的微信.png

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

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

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

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

          八大交互設計原則幫你避免出現基礎錯誤

          博博

          八大交互設計原則幫你避免出現基礎錯誤


          八個交互設計原則幫你避免出現基礎錯誤


          一致性:一致性能給用戶節約成本、元素風格統一和延續性、產品內部結構的一致性


          d02058fd5d48a8012160f70f1ec9.jpg





          反饋:操作成功或失敗都有明確的反饋、告訴用戶此刻的狀態是什么會有什么結果


          25a158fd5d6da8012160f7f8444b.jpg




          方便使用: 減法設計(扁平的框架設計—減少不必要的操作步驟,每個流程清晰沒有太多分支)

          881358fd5da8a8012160f755522b.jpg




          重點功能隨手可用 多選擇少輸入






          預防出錯/防錯原則: 操作給予提示


          b8ab58fd5ebfa8012160f77f33f6.jpg




          幫助用戶認識改正錯誤:如果出錯要幫助用戶從錯誤中恢復過來


          085f58fd5ed5a8012160f7506532.jpg




          高識別性:(復雜的交互要給與引導和幫助)


          903558fd5ef0a8012160f79cf40e.jpg




          用戶自由控制權:用戶可以取消正在執行的操作 每個層級都能找到上一級的方法


          465e58fd5f04a8012160f7a13a98.jpg



          符合用戶的操作習慣


          作者:why夏天的風

          轉載請注明:站酷

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

          魏華的微信.png

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

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

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

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

          界面與交互設計的基本原則

          博博

          界面與交互設計的基本原則




          作者:TUTU兔

          轉載請注明:站酷

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

          魏華的微信.png

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

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

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

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

          交互設計:如何做到善意?

          純純

          我們來探討下交互設計的善意。


          善良常常被用來形容人,偶爾被用來形容產品,很少被用來形容交互設計。


          就像人們會說,iPhone 有人文關懷,而很少會說,iPhone 的交互設計有人文關懷。在筆者看來,原因之一,是交互設計很難將人文關懷囊括完,而產品本身則基本可以。


          類似的道理,本文探討的善意,始于交互設計,但不局限于交互設計,還包括產品和企業的善意。


          一家之言,歡迎交流探討。



          01 為什么選擇善意?


          一個 3 歲小孩流落街頭,無家可歸,會讓無數人起惻隱之心。我們普通人的微小善意,有時可能是一種本能反應,或者說是一種感性反應。


          “他內心是有時邪惡,還是對人們始終良善”,這是李宇春《年輕氣盛》里的一句歌詞。


          惡是否為本能,筆者不知道??茖W家的解釋是,有些基因中會帶有惡??梢钥隙ǖ氖?,善惡皆為人性,共存于人類當中。


          感性和理性是會此消彼長的,林黛玉和薛寶釵就是兩個極致的例子。同理,人類體內的善惡,也會此消彼長。


          一款產品,在做決策時,很大程度上是基于理性。


          這種理性決策,很多時候是無意為善,也無意為惡。但遺憾的是,那個非善非惡的中間地帶不會一直存在,有些無意為善和無意為惡,最終會成為非善即惡,比如開屏頁是否放廣告這件小事(下文有詳述)。


          既然善惡會此消彼長,而且產品的有些理性決策會導致非善即惡,那么不可避免的,有時候,善惡會變成一道二選一的選擇題。


          接下來,我們就從理性的角度探討下,為什么選擇善意。



          1 長期主義


          最近幾年,互聯網從業者有個共識:創業是件九死一生的事兒。因為據數據統計,90% 的創業公司活不過三年。


          這是一個值得深思的社會現象,背后的原因究竟是什么?直接原因,往往是資金斷裂。深層原因,會有很多,比如產品不夠好、方向不夠準,等等。


          那么,核心原因呢?筆者認為,和創始人的執念有關。


          有兩類執念可以避免此類悲劇。第一類是做出優秀產品;第二類是長期主義。



          做出優秀產品這塊,有很多例子,最典型之一是特斯拉。特斯拉曾面臨多次危機(資金、產能等),但都挺過來了,這肯定和產品深受車主喜愛有關。


          筆者也見過兩個普通創業公司的例子。他們都有一顆做出好產品的心,都很重視 UI、交互、用戶體驗這些基礎的東西,而且把 UI 做的比較優秀,交互和用戶體驗做的還不錯。其中一家靠著用戶的付費在平穩發展,另一家連產品帶團隊被大廠收購了。


          長期主義這塊,典型例子之一是巴菲特。巴菲特信仰并踐行價值投資,價值投資依賴長期主義。最近幾年,長期主義在國內也被越來越多的提及。


          個人的理解,長期主義至少包含兩個要點,分別是:積累、多贏。因為,沒有積累就不會有成就,沒有多贏成就就不會長久。



          中國女排,世界冠軍。排球界有個說法,叫三年成型,五年成才,八年成器。互聯網行業,也大致如此。這是積累。


          用戶,員工,投資人,三方利益都兼顧好,才是多贏。


          俗話說,顧客是上帝,大家都知道對用戶好;投資人作為強勢一方,利益也往往有保障;員工的利益是否有保障,往往取決于創始人,所以存在很大變數。


          回到主題,長期主義和善意,有什么關系?


          通常而言,多贏能否實現,關鍵在于員工的利益能否得到保障。


          筆者在網上看過一個有意思的評論,說當下的年輕人,如果收入、成就感、高興這三點有兩點達不到,就會辭職。


          所以,員工利益得到保障的標準,可以簡單定義為“三中二“,即收入、成就感和愉悅這三點滿足兩點。



          再來分析一下現狀:相比員工,公司是強勢一方;人們仍受最大程度剝削剩余價值、官僚思想等觀念影響;惡性加班等風氣存在;僧多粥少的就業行情。


          在這樣的大環境下,如果公司對員工沒有愛和善意,員工的利益是很難得到保障的。


          最后,總結一下:公司有善意,員工利益就有保障,就能實現多贏,從而有望實現長期主義。


          2 美好生活


          前段時間,因為給武漢捐款 5000 萬、并且疫情期間蔬菜按成本價銷售,一些網友被胖東來這個商超刷屏了。


          胖東來來自河南許昌,一個三四線城市,也是筆者的家鄉。目前僅在許昌和新鄉有店。


          在一些關于胖東來文章的評論區,很多網友在喊胖東來去自己的城市開店。


          為什么有這么多呼聲?簡單分享幾個例子。


          顧客方面,胖東來有 6 類購物車,包含嬰兒手推車、兒童購物車和老年人購物車。老年人購物車自帶凳子,可供休息,同時還配有放大鏡。


          員工方面,有高薪、高福利和利潤分紅等。胖東來比較為業界稱道的高福利有:每周二閉店,春節閉店 5 天,工齡滿 1 年即有 30 天帶薪年假,一天最多工作 7 個小時。


          從網上的報道、評論以及公布于網上的企業文化來看,胖東來一方面主張工作和生活(愛情、家庭、休假等)的平衡,一方面在踐行和傳播幸福、快樂、尊重等很多積極的文化價值觀。



          看新聞的時候,筆者注意到,老板于東來經常會提到“美好”這個詞兒。實際上,在筆者看來,胖東來本身就代表了一種美好生活,一種物質和精神雙豐盛的美好生活。


          對于這樣的美好生活,用戶和員工自然喜歡??蛇@對企業有什么好處?


          胖東來曾經意欲退出新鄉市場,新鄉合作商家和市民紛紛請愿,政府也多次出面挽留,最終胖東來留下來了??梢姡謻|來在新鄉已經深入人心,顧客自然會大力支持它的發展。


          胖東來有一句 slogon,能夠很好的解釋這一切,那就是:愛在胖東來。


          同樣,既提供體面的收入,又關注員工和用戶的精神需求,給他們帶去美好生活,當然需要更大更多的善意。


          在當下中國,能提供高薪的互聯網公司已經很多了,但是能在精神層面讓員工感覺良好、感覺愉悅、感覺幸福和快樂的公司卻為數不多。


          對于所有企業而言,這又何嘗不是一種機會?



          02 交互設計里,有哪些善意?


          現實中,像胖東來給顧客和員工提供的這種美好生活不常有。但是退一步講,還是有很多產品對用戶展現了很多微小善意,值得我們學習。


          這種微小善意主要有三類,分別是:不打擾,護尊嚴,人為先。



          1 不打擾


          我們生活在一個信息爆炸的時代,不被手機上的信息過度打擾,是一個剛需。有三類信息,如果把握不好度,就會對用戶形成打擾。它們分別是:廣告、推送、推薦



          廣告這塊,主要有兩類會形成打擾,分別是:時機不佳的廣告,過長的廣告。


          這方面,微信是個榜樣,值得學習。比如開屏頁廣告,就是時機不佳的廣告,因為大家不想在這里看到廣告,微信就沒有放。朋友圈里也有較長的視頻廣告,微信的常見做法有兩類,要么先展示一張圖片,要么先是無聲播放。是否看完整的視頻廣告,選擇權在用戶手里。


          推送這塊,常見的有手機系統的通知和 App 內的紅點消息。


          系統通知,目前也有被濫用的趨勢。根據使用情況和感受,個人的建議是這類推送控制在 1-2 類。第 1 類是關于核心功能,比如微信推送新消息,搜狐新聞推送新聞;第 2 類可保留一定的彈性,核心原則是對用戶有價值,比如偶爾的活動通知。


          目前有兩種情況會對用戶形成打擾和困擾,第一種是過于頻繁的活動通知;第二種是推送和核心功能相差甚遠的信息,比如金融類產品推送新聞。


          紅點消息,有一類會對用戶形成打擾,那就是來自官方的過于頻繁的各類活動、促銷等信息。


          推薦這塊,主要指 App 內的 Banner 和專題。目前對用戶形成打擾的主要是一級頻道的一些專題。


          一種是過多,比如網易云音樂的首頁,就有 9 個專題;一種是位置不佳,比如 Keep 的“探索”頻道就包含了課程的推薦,但是在“運動”頻道還有兩個專題來推薦課程。


          2 護尊嚴


          護尊嚴,就是盡最大可能,維護用戶的形象和尊嚴。


          最近幾年,常有產品花巨資撒紅包給用戶搶。產品的初衷自然是好的,而且看起來也是一件皆大歡喜的事情。但是這件事很難提升產品的美譽度,也就無法增加用戶對它的喜愛和忠誠程度。


          為什么會這樣?


          讓用戶搶自己撒的紅包,這件事能維護用戶的形象和尊嚴嗎?非但不能,可能還會對此造成傷害。因為可能會顯得用戶愛占小便宜,也可能會使用戶處于被施舍的一方。總之這種事對用戶來說,并不酷。


          一款產品,要想贏得用戶更多的喜歡、尊敬乃至忠誠,就最好不做哪怕僅是微弱傷害用戶形象和尊嚴的事情,同時多做一些相反的事情。


          3 人為先


          人為先,是當用戶利益和企業利益發生尖銳矛盾時,去追求一種用戶利益在先的雙贏局面。


          大家都知道,吸煙是有害健康的,但是煙草公司又是要賺錢的。泰國香煙那種既觸目驚心又惡心嚇人的包裝,就盡他們最大的可能詮釋了“吸煙有害健康”,是真正的用戶為本,讓人心生敬意。



          泰國香煙的這種做法,值得一些極易讓人上癮的游戲廠商借鑒和學習。



          03 交互設計:如何做到善意?


          上一大段,是善意的三類表現。這一大段,再探討下做到善意的一個原則。


          以社區型內容型產品為例,這個原則就是:先服務后管理。


          這里的服務,是指以服務者的心態做好用戶體驗,并不局限于交互設計。這里的管理,指的是一些必要的管理,一般是用戶的行為規范和用戶違規時的處理,比如評論里罵臟話、發布侵權文章等。


          所有用戶都是需要被服務的,只有少數行為不當的用戶才是需要被管理的,所以我們要先服務后管理,以免誤傷了不需要被管理的用戶。


          服務本身就是一種善意,筆者把它分成了兩個階段,分別是:體驗的初始階段,體驗的完整過程。


          初始階段對應的是:初始服務;完整過程對應兩類服務,分別是:家常服務,極致服務



          1 初始服務


          初始服務,是當用戶剛開始用這款產品時,能給他們留下良好印象的服務。


          如何做到?不出現任何輕微惡意和管理傾向即可,再提供一些便利和幫助則更好。


          下面分享一個反面例子。


          在個別城鎮的衛生死角,有時會看到這樣的標語,“此處禁止倒垃圾!違者罰款 200!“。結果那個地方往往有很多垃圾。


          為什么會這樣?


          這個標語,有兩層意思:第一,你很可能會在這里倒垃圾;第二,禁止你這么做,做了要罰錢。


          也就是說,某種程度上,這個標語在用惡意揣度別人,同時也在很嚴的管理別人。


          看到這個標語的人很可能會這樣想:既然認為我會在這倒垃圾,那我索性就倒了;禁止我?憑什么?還罰我錢,嚇唬誰呢,況且你有證據嗎?


          下面再分享一個很好的正面例子。


          筆者有一個宜家的退貨經歷。把一個已經拆過的桌子打包送到了宜家,宜家沒有檢查里面的零配件(很多螺絲之類的),直接退了。這樣寬松的退貨條件,宜家可能會蒙受一定損失,比如小概率的零件丟失,但宜家還是把這種服務提供給了顧客。筆者當時的感受是宜家挺信任我們的,對宜家就多了幾分好感。


          2 家常服務


          家常服務,是指一種稀松平常,但又讓用戶感到舒服自在的服務。


          舉個例子,你去好朋友家里玩,朋友給你倒了一杯水,并端出一盤削好切好的蘋果,你們一邊吃一邊聊。你和朋友是平等的關系,他這種簡單的招待并不會使你感動,但卻使你有一種接近在自己家的那種舒服自在。


          筆者在用微信公眾號(后臺)時會有這種感受。在星巴克和肯德基時也會有類似感受。


          家常服務,如何實現?第一,要有良好的初始服務,這是基礎;第二,要有周到且較高品質的交互設計,這是關鍵。


          以微信公眾號為例,和微信一樣,它的交互設計也做到了周到和較高品質。下面看看微信公眾號的初始服務。


          面向大眾的資訊平臺大多都有一個發文規范,多是關于禁止的行為,通常都會用一個單獨網頁來展示,有 1-2 頁紙那么多。


          通常情況下,多數作者是不會違反發文規范的。對于這部分作者,當他們首次看到 1-2 頁密密麻麻的發文規范時,可能會產生抵觸心理,即便自己不會違規。就好像高中開學第一天,班主任二話沒說,直接就立了 20 條班規,同學們會是什么心情。


          微信公眾號的做法就很巧妙,它把這些規范分割成了三部分。


          第一部分是嚴禁的紅線行為,以高度概括的一行文字呈現,所有人都能看到,但是得仔細留意才能注意到。這是規范性質。



          第二部分和競品一樣,也是鏈接出來的一個單獨網頁。鏈接入口也和競品一樣,在關聯性最強的發文頁面右上角。不同的是,這一頁展示的是規則,主要以問答的形式呈現,給人感覺是有幫助的信息。這是服務性質。



          而競品的這個頁面,通常都是禁三禁四的規范,給人的感覺可能是緊張、壓抑甚至抵觸。


          第三部分是次于紅線的禁止行為,比如侵權、低俗內容等。這部分內容的管理辦法被以公告的形式分散在公告列表里。而且公告列表里內容多樣,還有很多一般的通知,所以這個公告列表也不會像競品的那一頁規范一樣,給人緊張、壓抑的感覺。性質上是中性。


          另外,這部分的入口在后臺首頁右上角,和發文模塊是分開的。所以不會違法規范的作者一般不會去公告列表里翻這些內容,也就看不到。




          微信公眾號就是這么巧妙的讓多數作者看不到“班主任”的“20 條班規”,同時還讓他們看到了“班主任”的“常見問題回答”。


          這就是微信公眾號在發文規范方面的初始服務。另外還有一個加分的細節,就是檢測疑似錯別字的功能,很貼心,雖然目前還不是很準。


          3 極致服務


          極致服務,是指讓用戶感動的服務,比如海底撈和胖東來的服務。


          這種服務,一般是由許多細節積累而來,是一種做加法的服務,而且背后往往依賴人力。


          好的交互設計,一般都是在做減法,而且純粹是界面、機器在和用戶打交道。所以極致服務難以復制到交互設計上。


          不過,一款互聯網產品,除了交互設計,還有其它方面的內容。


          B 站就是一個例子,它以不走尋常路的方式,在兩個方面做到了較為極致的服務。那就是:視頻無廣告,比較積極、歡樂的彈幕氛圍。



          結語


          以用戶利益為先,不打擾用戶,維護用戶的尊嚴,這是交互設計里的三種善意,值得我們學習。


          先服務后管理。服務作為一種善意,也能夠引來用戶的善意,最終形成良性循環。


          杜絕任何輕微惡意和管理傾向,再提供一些便利和幫助,便能做到良好的初始服務;


          在初始服務的基礎上,提供周到、高品質的交互設計,就能做到良好的家常服務;


          交互設計難以做到極致服務,但是其它方面有機會。


          最后,用劉備的一句話來結束本文。


          勿以善小而不為。


          原文地址:站酷    作者:SnowDesign


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

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

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

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

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



          《簡約至上:交互設計四策略》札記

          ui設計分享達人

          《簡約至上:交互設計四策略》

          著:[英] 賈爾斯·科爾伯恩

          譯:李松峰

          人民郵電出版社

          . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .


          寫札記有什么好處?費時費心又費力的

          1. 梳理知識框架,記錄閱讀收獲、心得,本身就是一個加深理解、溫故內化的過程。

          2. 摘錄重要知識,存儲在數字媒體上,方便隨時按需查閱。

          3. 鍛煉思維和表達。

          百利無一害,來吧,走起。

          這本書是講什么的?

          本書講述了一個產品價值觀和四個策略。

          一個產品價值觀:作者崇尚簡單體驗的產品設計。簡單的產品更容易制造 (成本也更低),也更容易使用 (市場也更廣)

          ① 這里的產品指數字產品或實體產品。

          ② 本書主要考慮大多數用戶 (主流用戶) 的體驗。

          四個策略:刪除、組織、隱藏、轉移。本書的核心內容就是講述如何通過這四個策略(我理解就是方法論)設計大多數用戶喜愛的簡單體驗。這幾個策略適用于簡化功能和內容。

          體會與心得

          1. 知識原理很多都是相通的

          ① 本書的刪除策略與奧卡姆剃刀

          奧卡姆剃刀:“如無必要,勿增實體”。講的也是簡單性原則。

          他說:“切勿浪費較多東西去做,用較少的東西,同樣可以做好的事情。” 講得真好,不能贊同更多。

          ② 組織策略與親密性原則

          親密性原則:彼此相關的項應當靠近,歸組在一起,成為一個視覺單元?!秾懡o大家看的設計書》Robin Williams,非常棒 推薦

          組織策略與親密性原則講的都是正確組織信息的方法論。

          ③ 簡單與別讓我思考

          別讓我思考 (可用性最重要的原則):你的目標應該是讓每一個頁面或屏幕都不言而喻,這樣的話,普通用戶只要看它一眼就知道是什么內容,知道怎么使用它。即他們不需要思考就能明白。可用性是關于人,關于人們如何理解和使用產品的,它和技術沒有關系。技術日新月異,人本身的變化卻非常緩慢?!饵c石成金》史蒂夫·克魯格,很棒 推薦+1

          2. 凡事過猶不及。

          書中有一個案例驚嘆不已,講的是東京蘋果專賣店,沒有按鈕的電梯 (電梯內和外都沒有操控按鈕),自動在每一樓層???、自動開和關門 (乘客干預不了)。置用戶于完全失控的環境中(要是深夜一個人乘坐,估計得嚇不活了)。難以置信,誰能想到以優質體驗設計征服世界的鼎鼎大名的蘋果,居然還有這種反人類的逆天設計!

          3. 這本書的閱讀體驗跟《寫給大家看的設計書》極相似

          ① 簡單、輕松、通俗易懂兩者都為讀者創造了簡單、輕松的閱讀體驗。把知識融入情境、故事,以圖示意,短小的一篇一篇像在和你講故事,娓娓道來、言之有物、簡明扼要、通俗易懂。

          ② 知識框架扁平、濃縮為極簡,過目難忘《簡約至上》把全書核心凝煉為:刪除、組織、隱藏、轉移。《寫給大家看的設計書》將復雜的設計原理凝煉為:親密性、對齊、對比、重復。合上書,就能回憶起來,太簡單又太深刻,真的想忘記都難。

          4. 好書亦師亦友

          “雖然這世界上不能改變的東西很多,但眼前的設計還是有很多簡化的途徑可循。”、“你能做到”... 像不像一個智慧溫暖又真誠善良的朋友在不斷的給你信心和鼓舞?

          思考:為什么大多數用戶喜歡簡單?

          (小聲說,我也喜歡)

          以我淺薄有限的認知來看,人們喜歡簡單不僅因為簡單順應人性,還因為簡單帶來高效:

          ① 簡單順應人性簡單意味著不用思考,以現有的認知水平一看就明白,在人的舒適區,啟用的是人低耗能自動模式,是本能來的。而復雜的事物,如思考、學習、鍛煉、做一件難的事,都是更多的消耗人的腦力、體力、意志力、自控力、耐心、時間,都是調用人的高耗能模式,所以復雜這個東西本質上是反人性的。

          ② 簡單帶來高效不管是工具任務型產品還是內容型產品,用戶使用產品的邏輯路線是一樣的,都是經由認知 -> 決策 -> 行動 -> 達成目標;如果簡單就會:認知快 -> 決策快 -> 行動快 -> 高效達成目標;所以,簡單是大多數用戶的剛需了。

          精選摘錄與總結

          1. 越復雜或少用的知識,忘記就越快。

          2. 簡單源自專注。明確自己的目標,更容易迷途知返。

          3. 解決問題前,先搞清楚狀況。糾結于某個設計時,退一步想想:“用戶在這里真正想干的是什么?” 聚焦用戶。

          4. 共識:把所有利益相關方的目標都統一到最終用戶身上,通過共識構建愿景。然后,阻力和爭斗就會減少。

          怎么讓利益相關方聽自己的?答案是必須理解他們的想法。

          先從傾聽他們和理解什么對他們最重要開始。把匯總的意見恰當地反饋給他們,他們會知道你已經明白了。在感覺被人傾聽后,他們才會樂意敞開心扉。

          “我也希望看到最適合用戶的設計,我們一塊看幾個,看看是否可行?!?

          不要嘗試說服別人,聽他們說,讓他們自己判斷,讓他們自己承認而不是回避問題,然后再去尋找解決他們問題的方案。

          5. 產品使用環境是觀察用戶的最佳地點,必須使軟件設計符合環境需求。你的用戶體驗應該簡單到不受這些干擾的影響,能夠在人們被打斷的間隙生存。

          6. 為主流用戶 (大多數用戶) 而設計,忽略專家型用戶。

          7. 體現品牌特征① 實用性——這個品牌能做什么對我有幫助的事情?(如讓飛行更簡單)② 這個品牌給了我什么感覺?(如充滿活力,好玩)③ 這個品牌崇尚什么?

          8. 簡單就是讓用戶感到自己在掌控一切。你的設計不能跟這種掌控的感覺有什么抵觸,而是應該放大這種感覺。

          9. 設計之所以會變復雜,通常是因為某些不重要的步驟擠占了核心特性。關注用戶行為 (而不是你的設計),并且從用戶的視角把它描述出來。

          10. 在研究某個問題的時候,你需要把它轉換成一種認識。故事是描述認識的一種好方式。與一大堆需求描述相比,故事更容易讓讀者明白什么重要和為什么重要。故事應該用三言兩語把核心體驗表達出來。

          11. 極端的可用性

          ① 任何人都可以使用

          ② 毫不費力的使用

          ③ 瞬間響應

          ④ 一目了然

          ⑤ 始終工作

          ⑥ 不出錯

          ⑦ 恰好夠用的信息

          ⑧ 在混亂無序的環境中工作

          爭取你不可能達成的目標有一個重要的好處:保持正確的方向。

          12. 堅持不懈是達成簡單最重要的一步。

          “乍一看到某個問題,你會覺得很簡單,其實你并沒有理解其復雜性。當你把問題搞清楚之后,又會發現真的很復雜,于是你就拿出一套復雜的方案來。實際上,你的工作只做了一半,大多數人也都會到此為止……但是,真正偉大的人還會繼續向前,直至找到問題的關鍵和深層次原因,然后再拿出一個優雅的、堪稱完美的有效方案。” ——史蒂夫·喬布斯

          13. 簡化意味著改變,而改變始終意味著痛苦。多數人會不惜代價避免痛苦。收集需要改變的證據很重要。

          14. 挑出正確的點子,確保能夠得到很好的執行。

          刪除:通過刪除來簡化設計,刪除所有不必要的,直到減無可減。

          15. 刪除雜亂的特性可以讓設計師專注于把有限的重要問題解決好,而且也有助于用戶心無旁騖地完成自己的目標。

          16. 不要等著別人不分青紅皂白地、無情地刪除最有意思的功能。要總攬全局,保證只交付那些對用戶體驗而言真正有價值的功能和內容。

          17. 體驗的核心是最能打動用戶的東西。找到它,刪什么留什么就一目了然了。能夠消除用戶挫折感的功能同樣也會受到歡迎。

          18. 刪除殘缺的功能、導致出錯的功能、不必要的功能

          19. 如果一個小變化導致了復雜的流程,就應該退一步去尋找更好的解決方案。

          20. 錯誤:即使非常小的錯誤也會讓用戶煩惱。消除錯誤是簡化用戶體驗的重要途徑。無論顯示什么錯誤信息,好像都沒有那么友好、親切和簡單。

          21. 不要以功能的多寡來認定產品的價值,而應該看產品能否滿足用戶最高優先級的目標。

          22. 刪除視覺干擾因素,讓用戶注意力保持集中。界面中的各種小細節會增加用戶的負擔、打斷用戶的思維,會像公路上的減速帶或坑坑洼洼一樣降低用戶的效率。

          23. 太多選擇容易讓人反感。

          24. 清除減速帶:選擇聰明的默認值可以減少用戶的選擇。

          25. 刪除視覺混亂和噪音,意味著人們必須處理的信息變少了,能夠把注意力集中到真正重要的內容上。

          26. 刪減文字、精簡句子:重要的內容“水落石出”,消除了分析滿屏內容的麻煩,用戶更有掌控感,把文字變得簡潔、清晰、有說服力。

          27. 簡化對話,長話短說。一次交互就是用戶與設備之間的一次對話。

          28. 砍掉時間。砍掉功能和內容可以節省時間,因為決定少了、按鈕少了、思考少了、閱讀少了。要在對用戶真正重要的事情上節省他們的腦力。

          組織:通過組織來簡化設計

          29. 通過組織的方式簡化設計,要點在于只強調一兩個最重要的主題。

          信息布局、分類、排序、搜索、使用顏色分層 (地鐵線路圖),找到組織信息的正確方式,可以極大的簡化用戶體驗。要想知道設計是否成功,可以瞇起眼睛來觀察屏幕,看是否能區分出不同的層。

          隱藏:隱藏不重要的,避免分散用戶注意力

           

          30. 無論隱藏什么功能,都意味著你在用戶和功能之間設置了一道障礙。這個障礙可能是遙控器上的塑料倉門,也可能是網站上一連串的點擊。為了避免給用戶造成不必要的麻煩,必須仔細權衡要隱藏哪些功能。

          31. 不常用但不能少,如個性化設置不會經常改變,因此非常適合隱藏。

          32. 隱藏所有需要隱藏的功能,在你需要時出現在合適的位置上。

          33. 細微的線索足以提示隱藏的功能。

          轉移

          34. 轉移合適的功能到其他設備上、系統組件中,向用戶轉移。

          來源:站酷
          作者:蝸牛西米

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

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

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

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

          篩選篇 | 提升用戶決策效率的篩選控件

          ui設計分享達人

          前言

          “少即是多”是經常掛在嘴邊的話題,在設計過程中,設計師們都會想盡一切辦法去簡化交互流程、組件元素及各種設計屬性,讓用戶使用起來更簡單。當產品簡化到一定程度,就必須要面對其不可簡化的復雜性。
          諾曼曾說過 “復雜是世界的一部分,但它不應該令人困惑 ”,如果復雜性是合理的,我們應該學會如何去管理復雜,考慮好復雜的問題在流向用戶后以何種方式處理,篩選控件就是用戶自行處理復雜信息的方式之一,只要是符合用戶行為做出的設計,將應有的復雜以篩選的形式呈現給用戶,讓其自行決定,用戶反而會樂意接受。
          篩選控件的使用頻率非常高,本文根據筆者對各類篩選控件的拆解及自身經驗進行分總結,整理了在移動端中常用篩選控件的類型、使用場景以及設計思路,幫助大家在設計中更好的選擇適合自己產品的篩選控件。

          分享目錄

          一、現實生活中的篩選
          二、篩選功能的重要性
          三、常見的篩選類樣式
          四、篩選的幾個維度
          五、篩選功能設計準則
          六、總結


          一、現實生活中的篩選

          在日常生活中,我們天天都在跟篩選打交道。設想一下,當你走進超市,在沒有任何分類指示的情況下,看到琳瑯滿目的商品是否會不知所措,答案是肯定的,且不論超市規模大小、商品的多少,相信沒有任何一個人愿意在不清楚的情況下花時間去找一個很可能不存在的商品,即便這點時間會很短。
          道理還沒說完,大家都感覺自己很懂,可依然逃脫不了如今在各種形形色色的應用中找不到自己需要的功能而苦惱,那么這些應用又是誰設計的呢?答案就是「大多數人」。


          換言之,如果我們能通過標識牌、平面圖指引(模糊查找),詢問服務員、記憶指引(精準查找),就容易很多,這些指引路徑就完全充當了篩選功能,至于通過什么方式,只能根據人們自身或現場條件自行選擇,能滿足自己的需求即可。在功能繁多、交互流程復雜的互聯網產品中也是如此。


          二、篩選功能的重要性

          1.篩選的定義

          在我們設計篩選控件之前,需要清楚了解什么是篩選,東施效顰不是什么明智之舉。篩選,即用戶根據自身需求、通過一個或多個特定條件,在已有的內容中快速找到滿足自己當前條件的信息,單獨呈現的同時、并將未滿足條件的信息暫時作隱藏處理,以便用戶完成自己的目標需求。
          篩選也可以稱之為過濾器,是搜索框架的一部分。這里需要說明一點,篩選不同于搜索,它是系統結合用戶提出的條件,對內容進行規則性的查找,準確的說,用戶屬于被動,篩選出的結果在產品側「精準」、用戶側「模糊」;而搜索則是用戶通過明確的目標主動進行精準查找,要么直接找到自己想要的結果、要么對結果不滿意,搜索出的結果在產品側「模糊」、用戶側需要「精準」。說直接點就是,搜索直接查找出結果、篩選只是縮小查找范圍(并非絕對,也可以對搜索結果縮小范圍)。


          2.為什么要使用篩選

          在電商應用中,如果有目標的用戶更多使用的是搜索,那么沒有目標的用戶更多使用的則是系統推薦或商品分類,不管是哪種類型的用戶,前面雖然已經進行過一次范圍縮減,但下一步還是逃不掉要面對的海量商品,這時,不給用戶提供選擇上的便利,用戶很可能因瀏覽商品耗時過長、選擇性困難等原因扭頭就走,即便離轉化僅一步之遙,也無法避免用戶流失的問題。
          增加篩選功能就能很好解決這個困局,用戶通過篩選、設置接近于目標需求的條件,縮短查找路徑,就能從海量的商品信息中快速找到符合條件的內容,大大降低了用戶的查找成本,節省了很多查找時間,用戶體驗得到很大程度的提升,由此可見,為什么要使用篩選,不言而喻。



          3.什么時候使用篩選

          1)系統定義篩選需求
          方向性的篩選:用戶通過系統提供的多種類型進行頻道切換,還會存在多少子級,可定義為一級篩選。例如訂單列表(待支付/待發貨/待收貨/待評價),優惠券(未使用/已使用/已過期)等,用戶從已有的類型列表中選擇自己所需。


          2)用戶自定義篩選需求
          精細化篩選:當系統已提供方向性的篩選,用戶依然可從分類篩選出的結果中進一步細化。例如針對單個類型的商品列表自定義價格區間、發貨地、品牌...等,也可稱之為二級次篩選,相比一級篩選,其篩選的結果會更精細化,也更接近于用戶的真實需求。


          (PS:系統定義篩選條件后,配合用戶自定義二次篩選條件以及排序功能,則更容易滿足用戶需求)

          三、常見的篩選樣式

          1.Tab篩選

          Tab式篩選條件大部分在操作前、操作中、操作后基本都會一直顯示,有橫向Tab和縱向Tab兩種,如新聞、視頻類型的應用大多使用橫向Tab,通過將不同的內容以大的方向、區塊進行分類,便于用戶隨時切換、篩選出不同的內容;縱向Tab更多則是在電商類應用中出現,且會存在多個子級,例如我們在京東購買「鼠標」,則需要在tab分類中依次找到「電腦辦公>外設產品>鼠標」進行篩選。


          Tab類型主要以大的維度進行篩選,所篩選出的結果可能模糊且信息量極大,如果想要結果更加精準,則需配備其他類型的控件進行二次篩選。

          2.彈窗式篩選

          操作中以蒙層的方式彈出,其他時候均為隱藏狀態。彈窗類型的篩選最大的優點是占用空間小,僅需一個入口,能在有限的彈出空間中從多個維度展示篩選條件,用戶選中或自定義對應的篩選項,即可快速篩選出自己想要的信息。

          3.折疊式篩選

          介于Tab式與彈窗式之間,篩選條件初始為隱藏狀態并提供一個入口。點擊后展開,期間不影響當前頁面的任何其他操作且一直處于展示狀態,需經過再次點擊才會將篩選條件隱藏。

          4.高級篩選

          基于自定義篩選條件過多,為滿足用戶個性化需求,點擊后會跳轉到新頁面操作多個條件進行篩選。相比前面提到的Tab、彈窗更為復雜,對篩選的要求較高。
          高級篩選適合用在顆粒度很細的場景,為的是避開其他視覺元素的干擾,讓用戶更專注于當前頁面較為復雜的篩選條件,降低因受其他因素影響而出錯的情況。例如:在選擇汽車時,需要對服務、價格、級別、排量...等各種情況作出非常細致的選擇,這時用高級篩選就再合適不過。


          5.篩選、排序組合

          篩選、排序組合方式算是商品列表中的標配了,尤其在空間資源有限的移動端設備中,能最大化的將多個控制條件一次性展示給用戶,在篩選出結果后再使用排序功能,便于更快找到想要的商品。例如美團、餓了么將篩選與排序控件形成組合,極大的提高了用戶篩選的效率。


          四、篩選的幾個維度

          1.單維度

          單維度的篩選不管是設計還是操作都相對簡單,無需操作確定/下一步按鈕,觸發篩選條件后會就會更新信息列表,大家最熟悉的訂單系統(待支付、待發貨、待收貨...)即是單維度篩選。
          另外,單維度具備短、明、快的特點,為方便用戶識別,單個標簽一般不超過5個文字,且語義明確,用戶不用任何思考就能快速理解。


          2.多維度

          當產品中的屬性過多,使用單維度篩選不僅會降低篩選結果的精準度,還可能會導致用戶因反復/重復無用的操作而產生挫敗感,已無法滿足用戶的需求。這時,需采用多維度篩選幫助用戶縮小查找范圍,讓其快速找到符合自己需求的內容。
          多維度篩選條件一般以按鈕(單選/多選)、輸入框為主,有些還會以滑塊來控制數據范圍。設定好篩選條件需通過重置、確認操作按鈕,用來清空篩選條件或進入下一步。在移動端,因屏幕空間有限,一級篩選數量最好不要超過9個,如果太多,建議進行整合或并入二級篩選。


          3.多等級(單維度/多維度)

          在多級篩選控件中,可以把當前篩選條件的上一級看成是篩選分類菜單,每個等級中可包含一個或多個單維度/多維度的篩選條件,移動端最多不超過3個等級。
          從表面看,多級篩選與多維度篩選其本質是一樣的,但多級篩選會存在下一級或再下一級,而多維度會將所有篩選條件平鋪在空間中。當單維度、多維度篩選還是無法滿足用戶需求,多等級就能作為最好的延伸。


          五、篩選功能設計準則

          1.迎合用戶需求

          在設計篩選之前,需要思考用戶為什么要使用篩選、在什么樣的場景下使用篩選、以及如何滿足用戶的心理預期等,有了清晰的用戶需求,設計出來的篩選才能更好的幫助用戶滿足其需求。
          以「餓了么」用戶點餐為例,使用點餐服務的用戶類型雖然很多,不過主力還是來自于辦公室白領、宅男/女這兩大用戶群體,有目標的用戶會從搜索、收藏、訂單記錄等入口直接去購買,但絕大多數用戶因長期點外賣的原因,“吃什么”就成了最大的問題,這時如果用戶還要“吃”,就必須得使用篩選功能,從Tab分類(模糊)到彈窗式篩選(精準)再配合排序功能滿足自己的點餐需求,得出結論:
          1)一群不知道“吃什么”的白領、宅男/女用戶;
          2)需要使用篩選功能解決自己“吃什么”的問題;
          3)問題很快得到解決后,對結果及使用體驗非常滿意。


          上面的案例可以看出,用戶想要在海量的信息中找到自身所需,從表面上看,最直接、真實的需求就是找到滿意的商品去下單。站在產品的角度并非如此,最應該解決的應該是效率的問題,這才是篩選的終極目標,不管用戶花多長時間,筆者相信都能找到想要的,但所花費的時間成本越少,滿意度就會越高,其產品的可信度、使用粘性、用戶體驗也隨之提升。

          2.不同產品不同對待

          篩選并非千篇一律,不要一上場就來一波大眾化的篩選條件,很多APP首頁設計就是最好的例子,什么都不考慮,直接導航欄+輪播圖+金剛區+內容推薦...傳統的一套流程走下來,結果可想而知。
          設計篩選功能時,不同類型的產品需要根據其產品定位、用戶目標以及使用場景來定義篩選條件,用戶需求是用來設定篩選條件范圍的決定因素。例如:購物類產品需要結合商品的銷量、評價、價格及知名度等,而新聞類產品側重于用戶偏好、點贊量、熱度值來提供篩選,方便用戶快速找到感興趣的內容。

          3.根據需求排列優先級

          在滿足上述兩個條件后也不能將篩選項一股腦的挨個排出來,即便是在同一個頁面內,也需要結合當前內容的屬性對篩選條件進行優先級排序,將用戶高頻使用的條件按先后順序依次排列,不重要的也可將其隱藏于某個入口。
          以淘寶為例,在「手機」商品列表,篩選條件中首先看到的是品牌,其次是內存、容量...,我相信很少人不在乎手機品牌吧;而在「鋼釘」列表中,依次是價格排序、銷量...,品牌條件隱藏在了高級篩選中,試問,如果是你購買釘子這種實用性的商品,是在乎價格、還是品牌呢?


          六、總結

          篩選功能旨在滿足用戶查找需求,通過縮短用戶選擇商品的范圍,節約查找時間,快速將符合條件的信息呈現出來,并讓用戶在這一過程中產生愉悅的使用體驗,以發揮產品的最大價值,從而增強用戶的使用粘性。
          至于在設計中該使用何種篩選控件則取決于用戶需求和使用場景,設定符合需求的篩選維度及條件,且根據內容屬性做靈活變動即可,切記篩選的核心需求是通過簡單易用的方式來幫助用戶提高操作效率。

          來源:站酷
          作者:大漠飛鷹CYSJ

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

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

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

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

          用戶體驗設計定義&詳細案例

          ui設計分享達人

          一、什么是用戶體驗?


          用戶體驗(User Experience,簡稱UE/UX)這個詞是在上世紀90年代中期,由用戶體驗設計師 唐納德·諾曼(Donald Norman)所提出和推廣。

          定義:用戶在使用產品過程中建立起來的一種純主觀感受。即用戶在使用一個產品或系統之前、使用期間和使用之后的全部感受,包括情感、信仰、喜好、認知印象、生理和心理反應、行為和成就等各個方面。




          二、可用性原則


          可用性指的是產品對用戶來說有效、易學、高效、好記、少錯和令人滿意的程度,即用戶能否用產品完成他的任務,效率如何,主觀感受怎樣,實際上是從用戶角度所看到的產品質量,是產品用戶體驗的核心,不好的可用性會導致用戶放棄使用產品。

          可用性由易學性、效率、可記憶性、容錯性、滿意度、實用性、個性化、可預測性組成。




          01 易學性


          指的是用戶學習如何與產品進行交互,以實現目標所花費的時間和精力,即用戶能否在初次使用產品時完成簡單的任務或實現用戶目標。




          02 效率


          用戶在使用產品一段時間后,能否在合理的時間完成想要達成的目標任務。這里以騰訊視頻為例,用戶能否快速的下載想要的東西,在同一系列中,可以快速下載更多的相關內容。




          03 可記憶性


          我們常說互聯網是有記憶的,好的產品體驗是幫助用戶去記憶。用戶在體驗中,要對一些有意識、無意識的行為進行記憶是一個比較大的負擔,如果在一些環節通過系統能幫用戶記錄,會降低用戶的負擔。比如在搜索、歷史記錄、瀏覽記錄等。




          04 容錯性


          用戶在使用產品時,發生錯誤后,能否快速幫助用戶識別和糾正錯誤,幫助用戶從錯誤中恢復的能力。如常見的注冊登錄,當用戶屬于郵箱格式不對的時候,給出提示,并且告知錯在哪里。如果提示語只是:"請輸入正確的郵箱" 用戶可能會疑惑,錯在哪里。




          05 滿意度


          滿意度指的是用戶與設計互動產生的愉悅程度,可以是用戶使用產品時流暢的交互和優秀的視覺設計,也可以是用戶在產品中得到的滿足感。比如sir語音交互,王者榮耀等級(滿足感)





          06 實用性


          產品能否提供用戶在完成任務時所需要用到的基本功能,例如P圖類軟件,用戶需要對圖片進行裁剪、添加濾鏡、摳圖、美顏、補妝、添加文字、去除水印、添加文字等操作。




          07 個性化


          在滿足實用性的基礎上 針對用戶提供不同場景下的功能定制,如美圖秀秀,在提供圖片美化的同時,針對用戶不同的使用場景還提供視頻剪輯、視頻美容等功能。




          08 可預測性


          用戶能夠預測到下一步操作或者整個流程的交互,將會發生什么。舉例淘寶的購買流程。點擊購買按鈕> 選擇商品屬性> 付款> 輸入密碼> 購買成功; 用戶在點擊購買按鈕開始就能夠預測到下一步或者整個流程的步驟會發生什么。




          三、可見性原則


          可見性是用戶根據界面中可見元素確定產品可以做什么的設計原則。



          01 物理功能可見性


          物理功能可見性是基于對象的物理外觀。在視覺上,這種類型的功能可見性使用戶能夠立即清楚地看到在設計界面中能干什么。例如當我們使用音樂類軟件,最常使用的就是播放/暫停,上一曲/下一曲。我們就會尋找去這些圖標。其次是分享、收藏、下載、評論等功能需要用到的功能展示在頁面中,這就是功能可見性。




          02 狀態可見性


          當信息或者列表過多時區分狀態的展示,將重要的狀態信息呈現在盡可能高的信息層級當中。如iOS信息和QQ郵箱中區分未讀信息的微標。如果將這些徽標隱藏起來,會極大地破壞易用性,因為人們將不得不進入一個個郵件詳情頁當中進行確認,才能獲取到原本由徽標提供的狀態信息,這樣的互動非常低效且乏味。




          03 步驟可見性


          當用戶在執行某項任務的時候應該清晰明了的告知用戶目前在什么步驟,后面還有多少步驟,完整清晰的流程展示。如果將這些信息隱藏起來,用戶會困惑當前進行到哪一步,接下來還有多少步驟。




          四、可供性原則


          強調需要明確的視覺線索向用戶展示產品可以做什么。例如用戶界面中的交互元素(如滾動條、命令按鈕和圖標等)的設計必須能夠為用戶提供足夠清楚的建議,讓用戶可以清晰地辨別出這些元素所代表的意思是什么、它們的功能是什么,以及如何與它們進行交互行為(點擊、長按、滑動 等)




          五、反饋


          給用戶及時、恰當的反饋,是體驗設計中非常重要的一項原則;對每個用戶的操作都應該有恰當的系統反饋(包含視覺、聽覺、觸覺)。



          01 告知性


          明確告知用戶當前操作發生了什么。如點擊下載和下載過程給出相對應的反饋及進度條。




          02 動作連接性


          當用戶產生某個動作時,給予相對應的連接反饋。如大概用戶點擊某個按鈕時,按鈕默認的外觀與點擊后的外觀發生變化,結合現實世界的開關去思考(按下 開燈)動作與反饋是連接的,即時的。




          六、??硕?


          ??硕?,是1951年由威廉·埃德蒙·??耸紫忍岢龅?,認為人們從數組中選擇目標的時間取決于可用選項的數量。也就是當一個人所面臨的選擇越多,做出選擇所花的時間就越多,當面臨選擇的數量增加,做出決定的時間也會跟著增加。




          如京東篩選,在搜索結果頁會將篩選條件收起,因為里面的篩選條件內容過多。用戶會在當前頁面選擇的時間增加.將一些項目分組放入二級下單,并且做好歸類,用戶能夠更迅速的作出決定。




          七、費茨定律


          費茨定律,是1954 年 由保羅.菲茨首次提出,在人機交互中指的是通過圖形用戶界面使用鼠標或其他類型的指針從一個起始位置移動到一個最終目的所需的時間。


          T:代表完成移動所需的平均時間

          A:代表光標開始/停止時間

          B:代表光標移動速度

          D:代表從起點到目標中心的距離

          W:代表目標的尺寸


          簡單來說就是指:隨著目標的距離增加,移動到目標的時間更長,并且隨著目標的尺寸減小,選擇目標的時間也會增加。


          所以在界面設計當中會遵循越重要的功能,占據面基會越大。重要圖標的點擊熱區也會增大。便于用戶快速點擊。




          屏幕外邊緣和四個角部比屏幕中的其他位置都更容易被定為和選中,所以我們在進行產品設計的過程中,會將常用/重要的操作放置在屏幕邊緣處,便于用戶操作。



          八、神奇數字 7 ± 2


          神奇數字7±2法則是1956年由 喬治·米勒 所提出的,根據喬治·米勒的研究,人類短期的記憶一般一次只能記住5-9個。也就是為什么大多數APP底部導航為5個的原因。




          由于人類的大腦處理信息的能力有限,大腦會將復雜信息劃分成 塊 和小的單元。如:京東和每日優鮮的分類處理。




          人類短期的記憶一般一次只能記住5-9個,所以人們總是傾向于把一串數字拆分為多個較短的部分進行記憶。如銀行卡號和手機號碼等。




          九、復雜守恒定律


          復雜守恒定律是1984年由 拉里·泰斯勒 所提出的,也稱作泰斯勒定律。認為每一個產品設計的過程中,都有其固有的復雜性,存在著一個臨界點,超過了這個點產品設計的過程就不能再簡化了,你只能將固有的復雜性從一個地方轉移到另外一個地方。


          在產品設計中,會盡量的簡化界面。當功能過多時進行一個整合的處理,跳轉或者滑動操作。如查看更多或者常見的漢堡導航。




          十、新鄉重夫:防錯原則


          新鄉重夫認為遺忘有兩種:一種是疏漏,另一種是忘卻。他建議采用一些措施來預防產品的缺陷。


          防錯原則認為大部分的意外都是由設計的疏忽,而不是人為操作疏忽。因此,在設計中要有必要的防錯機制;比如常見的信息輸入狀態,未輸入置灰不可點,輸入變為可點擊狀態。




          微信拍一拍:微信在出了拍一拍功能之后,很多時候點擊頭像的時候會不小心拍到別人,現在的拍一拍是可以撤銷的,在客戶端鼠標懸浮上就可以進行撤回,移動端長按出現撤回彈窗,兩分鐘內有效。




          微信朋友圈動態:點擊返回圖標會出現的彈窗,避免誤操作。利用防錯原則,可以避免用戶重新編輯。微信當中有很多友好的體驗細節??梢远喽嗳ジ惺?。




          十一、奧卡姆剃刀原理


          奧卡姆剃刀 定律 :它是由14世紀英格蘭的邏輯學家、圣方濟各會修士奧卡姆的威廉 (William of Occam,約1285年至1349年)提出。 這個 原理 稱為“如無必要,勿增實體 ”,即“ 簡單有效原理 ”




          01、只放置必要的元素


          不必要的元素會降低設計的效率,不管是實體、視覺或者認知上,多余的設計元素,有可能造成失敗或者其它問題。這并不意味著不能提供給用戶很多的信息,可以用「更多信息」來實現。如夸克瀏覽器,首頁只放置重要功能 搜索 和幾個整合內容的圖標入口。




          02、減少點擊次數


          讓用戶通過較少的點擊就能找到他們想要的東西或使用功能。如音樂類軟件,在播放音樂之后進入其他的tab,在上面都會懸浮播放/暫停的區域。都能夠隨時操作。




          03、“老人”規則


          就是產品的易用性,如果年紀大點的人,也能夠輕松使用所設計的產品那么是成功的。如抖音沉浸式的體驗,簡單的滑動就能夠觀看想看的內容。目前抖音的用戶老年人也逐漸包含在內,并且抖音會根據用戶的停留時長等推送用戶感興趣的內容。




          04、減少“段落”個數


          頁面的使用率,當你想要在一屏新增很多內容時,頁面的布局就會變得擁擠和區域變小,容易過于干擾用戶做出選擇,重要功能不夠突出等??淇藶g覽器首頁強化了搜索功能 和幾個整合內容的圖標入口;uc瀏覽器首頁內容過多,當用戶想要使用搜索功能時很容易被其他內容干擾。




          05、給予更少的選項


          前面說到的??硕烧f到,當選擇的數量越多,用戶做決定的時間就更長。做過多的決定也是一種壓力,在展示內容的時候要努力減少用戶的思維負擔。如攜程和馬蜂窩金剛區的內容展示,馬蜂窩根據產品屬性放置了6個重要的功能入口,便于用戶更快的去選擇所想要的功能。




          十二、設計和藝術的區別是什么?


          最后我們來探討一下設計和藝術的區別是什么。我看到一句話覺得挺好的。設計和藝術的重要區別是:藝術拋出問題,而設計解決問題。


          我們設想一個場景,當你在藝術展廳站在一副名畫面前,你所思考的是什么?是驚嘆畫家的畫技還是整個畫面給你的感覺是一種故事,你會不會思考藝術家在作畫時的心情,處境,為什么要這么去畫?想表達怎么樣的情感?



          然后我們再設想一個場景,同樣在藝術展廳,你身上帶有手機和相機。你會選擇用相機拍照還是用手機。答案是 相機 對吧?因為相機的拍照效果在任何環境下都會比手機好。這就是設計。是能夠真真切切的解決用戶問題的。能夠去感知到的。


          原文地址:站酷
          作者:左言右設

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

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

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

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

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


          淺析產品體驗設計細節

          ui設計分享達人

          目錄

          一、馬蜂窩 — 人性化設計識別文章地點

          二、微博 — 社區游戲化設計提升互動率

          三、QQ — 通過手勢消除未讀消息

          四、最右 — 情感化設計保護用戶隱私

          五、抖音 — 深夜提醒貼心的功能

          六、網易音樂 — 把分享游戲化

          七、QQ音樂 — 歌詞沉浸式體驗

          八、盯潮 — 趣味性banner輪播,增加用戶點擊

          一、馬蜂窩—人性化設計識別文章地點





          產品體驗

          在馬蜂窩任意文章中,如果出現地區則可以通過當前頁面對地區進行提取

          目標

          減少用戶操作路徑,降低產品使用成本

          設計思考

          日常在各個平臺瀏覽文章時大家都會遇到在文章內會出現一些如地名、人名、物品等相關名詞,此時如果對名詞感興趣則需要切換場景去進行搜索,而馬蜂窩在這方面深入洞察到用戶痛點,基于旅游社交產品背景下在添加地點直達(包含多個地點)功能,解決了對景點感興趣的用戶使用體驗。

          延伸設計

          根據馬蜂窩這個人性化功能,是否可以在不同的產品內進行應用,如在一些游戲社區中所提到的虛擬裝備、道具等物品添加彈窗簡要說明,幫助新手玩家快速理解玩法、功用等

          二、微博—社區游戲化設計提升互動率



          產品體驗

          在微博動態詳情中進行長按點贊觸發動畫

          目標

          通過游戲化點贊玩法激勵用戶進行互動,提升互動率

          設計思考

          打破傳統點贊動畫,微博設計動效采用大膽創新的全屏動畫并搭配上散發的微表情,在長按與連點兩種手勢下動效規律不同,消除用戶枯燥感,微博作為國內最大社交平臺,頁面展示上已經形成用戶深刻認知,在不影響基本風格上進行彩蛋設計有效的提成用戶互動率

          三、QQ—通過手勢消除未讀消息



          產品體驗

          在qq聊天頁面中對底部消息氣泡進行拖動,消除所有未讀消息

          目標

          提升用戶操作效率和使用體驗

          設計思考

          qq作為社交工具,每位用戶都會添加大量人、群以及關注各種推送,在這種場景下用戶每條消息都去操作需要花費大量時間,QQ把傳統的消息已讀以一種簡單的交互手勢作為代替,相對全部已讀在操作上更佳便捷

          延伸設計

          通過qq的這個交互細節,在其他產品場景中同樣適用,如一些音樂、電臺相關的產品在離開播放頁面后播放狀態會懸浮在頁面之上,如果關閉的話則需要點擊暫停或者進入詳情后關閉,也可以考慮使用拖動手勢進行關閉

          四、最右—情感化設計保護用戶隱私



          產品體驗

          在最右登錄頁面輸入密碼時ip形象會出現捂眼睛動作

          目標

          強化用戶隱私和心理信任感

          設計思考

          日常在使用一些敏感性操作時我們都會注重隱私,如一些表單的填寫、密碼輸入等相關操作,最右在登錄頁面使用到了ip形象的動作去向用戶傳遞心理上的暗示,這種手法很好的把品牌曝光與體驗相結合

          五、抖音—深夜提醒貼心的功能



          產品體驗

          長時間刷抖音時會系統會提示,在深夜使用時會支持設置提醒時間

          目標

          防止用戶疲勞使用產品,定時緩解注意力

          設計思考

          在使用抖音時大家可能會經常深陷其中無法自拔,往往忽略了時間影響身體健康,提醒機制則在深夜不同時間段進行間接提示,雖然在用戶體驗中不提倡打擾用戶,但在短視頻這個場景下如果過渡沉浸便會造成反向影響

          六、網易音樂—把分享游戲化



          產品體驗

          在網易音樂對某首音樂進行分享時可以對音樂進行個性化定制,對歌曲進行編輯添加文字、圖片、語音等以視頻方式呈現

          目標

          把分享以一種偏游戲化的形式呈現,提升用戶分享率

          設計思考

          傳統分享基本是直接讓用戶分享到第三方平臺,而網易音樂這個設計把分享場景進行多元化處理,以定制音樂罐子為切入點,用戶自由編輯個性化處理裝進罐子進行分享,是一種視頻剪輯融合音樂的一種新玩法,破圈傳統枯燥的分享場景,提升用戶分享率

          七、QQ音樂—歌詞沉浸式體驗



          產品體驗

          在音樂歌詞頁面中可以支持設置歌詞主題

          目標

          新穎的呈現手段,強化用戶沉浸式聽歌

          設計思考

          傳統的音樂產品在詳情頁面展示了一屏歌曲歌詞,面對大量的文字用戶在尋找某段歌詞時效率不是很高,對大量的字段也極為枯燥,而qq音樂使用了創新的展現形式,把手機主題概念融入歌詞中達到新的視覺體驗,根據不同的主題對應的動畫也不同,大大的提高了用戶的視聽體驗

          八、盯潮—趣味性banner輪播,增加用戶點擊



          產品體驗

          在盯潮首頁banner處對其進行拖動甩出

          目標

          通過交互玩法提升用戶對banner的點擊

          設計思考

          banner在頁面通常點擊率較低,用戶會默認為廣告,在盯潮內滑動banner時會發現banner可以進行拖動,并且松開時會自由掉多,把傳統的banner切換做出了可玩性更高的效果,同時這個設計手段也能吸引用戶注意力引導用戶對banner進行點擊

          原文地址:站酷
          作者:愛吃貓的魚_

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

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

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

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

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

          設計心理學-15種用戶體驗法則

          純純

          一、認知負荷


          定義:

          認知負荷是完成一項任務所需的精神努力總量。您可以將其視為用戶與產品交互所需的處理能力。如果需要處理的信息超出了用戶的處理能力,那么認知負荷就太高了。


          案例:

          造成用戶認知負荷的的原因大多都是,產品在交互和視覺上過于復雜,設計的統一性不夠,導致用戶在使用時不斷進行思考無法形成習慣


          例如移動端中的空狀態,目的是為了引導用戶完成任務,在設計時無論是文案展示與視覺表現都應簡單明了、層次分明、視覺統一




          二、錨點效應


          定義:

          用戶獲得的初始信息會影響后續的判斷,用戶對某件事做出判斷時,會不自覺的將開始看到的信息作為衡量標準。


          案例:

          在日常生活中錨點效應非常常見,例如平常不帶帽子,偶爾帶帽子出門的你,走在大街上會發現挺多人都有帶帽子,因為心理活動是把帶帽子這件事作為起始衡量,而你刻意的在尋找與帽子產生共鳴的事


          在產品設計中最典型的就是會員體系,例如某視頻平臺的會員價格默認選中的那一欄會比其他的價格低,那么用戶在使用時心理會默認這是會員的價格,相對應其他更高的價格只是作為衡量這個最低價格而存在



          三、誘餌效應


          定義:

          又稱對比效應,指人們對兩個不相上下的選項進行選擇時,因為第三個新選項(誘餌)的加入,會使某個舊選項顯得更有吸引力,通過對比誘導人購買商家想讓他購買的商品。


          案例:

          有一位著名的行為經濟學家他叫丹·艾瑞里教授,他曾經做過一本《經濟學人》雜志的定價策略,這里不細講感興趣的可以搜一下。誘餌效應運用最多的是在超市場景,我們經??吹匠械呢浖苌蠒锌雌饋砗軐嵒莸奈锲吩冢缫淮菝婵赡苁?元,而旁邊還有3包泡面一起出售可能也就12元,然后開心的拿走了,這就是誘餌效應,那一袋5元的就是誘餌,商家的目的就是為了讓你買走12元的


          而在線上產品策略中運用最多的則是電商場景,如下圖中的圖書商品,單價610元,定價980元,三件單價488元,這里的單價和定價都是誘餌,目的是為了讓用戶同時購買三件商品,而用戶內心是欣然接受因為更劃算




          四、注意偏差


          定義:

          在檢查所有可能的結果時,我們傾向于關注一些看起來合理且熟悉的事物,從而忽略了其他結果。


          案例:

          13年9月twitter公司宣布IPO,當時11月份才開始交易,但是在這兩個月時間里有一家名為twweeter的公司三天內漲了13倍,只是在名字上與推特公司極為相似,但實際業務毫無關系,機構就是利用用戶的注意偏差讓不了解實際情況的投資者只看到相關性,而另一面的不相關的結果用戶自然的忽視掉


          在產品設計的客服助手中,就屬于注意偏差,我們習慣的認為向客服回復人工等關鍵字時,會自動切換人工客服,而產品則會設置一些虛擬的智能客服來節省成本,而用戶在這個過程中則忽略了細節,誤以為智能客服是人工客服



          五、菜斯托夫效應


          定義:

          前蘇聯前蘇聯心理學家菜斯托夫提出特殊事物才易被人牢記。也就是說,有個性的人、與眾不同設計得商品、不尋常的事情,都會讓人留下更深的印象。


          案例:

          生活中我們很難記住某個點或某件事,但是當這件事足夠突出擁有獨特的個性我們便會深深印在腦海里,比如一串字符ezol4tpmb,我們最容易記住的是4,因為他是唯一的數字,在比如說讓你去記憶國內某些城市的特點,如西安、開封、浙江我們想到的就是秦皇陵、包青天、西湖等著名具有特征的地點,因為這些事物比較特殊更容易被記住


          在品牌設計中菜斯托夫效應運用的比較廣泛,如何通過視覺的表現讓用戶對產品更加的印象深刻,對此就衍生出產品IP、品牌符號這種具有特殊意義的標識便于加強產品印象



          六、菲茨定律


          定義:

          任意一點移動到目標點的時間與該目標點的距離和大小有關,距離越遠時間越長,目標越大時間越短,公式: 

          T = a + b log2(D/W+1)


          案例:

          在交互設計中經常用到此定律,無論是正向還是逆向此定律都能夠很好的運用到交互中,如mac系統上的關閉按鈕,始終在左上角并且很小,我們的鼠標在右側,移動到左側上角時間會隨之變長,因此這一交互結構就避免了用戶誤操作關閉軟件


          再例如移動端中會把重要的按鈕操作放置在屏幕右下或者居下,因為大多數人是右手使用手機,因此在使用時右手拇指距離點擊區域會更近



          七、幸存者偏差


          定義:

          幸存者偏差是指把一些事的不同角度的人員篩選出來,篩選出一部分人進行采訪從而制造輿論,觀察者只能看到事物的一面,而另一面則被忽略,也被稱為以偏概全


          案例:

          某次春節記者采訪到一些在火車上的群眾,聊一些購票的過程以及買到票的心理感受,最后向公眾公布出今年回家的票大家都買到了,但這個過程中卻忽略了那些不在車上或者沒買到票的人們,因此就以偏概全的傳輸單方面信息,這些被采訪到的人們就是幸存者


          在做產品時經常會聽到用戶畫像這個詞,用戶畫像就是利用幸存者偏差而把廣大的用戶數據通過典例呈現,當然這個幸存者的樣本必須是壓倒性的龐大,否則就掉入幸存者偏差的陷阱



          八、鄰近法則


          定義:

          彼此靠近或接近的對象往往會組合在一起,相近的元素可以建立關系,人們會不自然的把相近的元素看作一個整體。


          案例:

          在UI設計中,經常會用到鄰近法則進行設計,如一些組件、卡片的建立,由不同的元素組成變成一個整體,其次鄰近法則能夠有效的用戶層級的劃分,如下圖中的一些卡片、icon進行規律的排布最后組成一個整體,與上下模塊的層級有效的區分



          九、特斯勒定律


          定義:

          特斯勒定律又稱復雜性守恒定律,他指出對于任何系統都存在一定的復雜度并且是無法避免的,問題是誰來處理它。


          案例:

          在任何產品設計中無論是功能還是流程都存在一定的復雜度,依據特斯勒定律有些復雜度是無法避免的,那么需要我們在設計中去解決這些問題,保證在用戶的角度來看它是合理的簡單的


          像我們常見的話題功能,輸入#自動引導出關鍵詞供用戶填寫省去用戶輸入時間,再例如b站的一鍵三連,長按點贊的同時會把收藏、打賞功能一并完成;結構層面也會用到此定律如產品中的設置頁面,按照不同的維度進行區分如系統維度、反饋維度、功能維度幫助用戶更快的完成操作



          十、帕累托原則


          定義:

          它是由意大利經濟學家帕累托提出,它指出對于許多事件,大約80%的影響來自20%的原因


          案例:

          在設計中我們會發現一個產品頁面有幾十上百個,對于用戶而言能夠提供價值的可能也就那么幾個功能頁面,這幾個頁面可能占總產品的20%左右,那么我們在做優化的時候則需要去考慮如果把20%做好把它的價值放大


          再往細了說,例如打車軟件在這個頁面中能夠為用戶提供核心價值的區域則是地圖區域和選擇目的地區域,那么在做優化體驗時應當著重關注此區域,而頁面中剩下的區域則受上面20%的影響



          十一、社會證明


          定義:

          社會證明是用戶用來確定行為方式的便捷捷徑,當他們不確定目標時,他們最有可能認為并接受他人的行為是正確的,人數越多,行動似乎越合理。


          案例:

          最近抖音在評論區新增了一個踩一下與點贊進行互補,但是奇怪的是我們進行踩一下時并不會展示具體數量,試想一下當點贊的數量大于踩一下的時候,我們有時就會被影響認為這條評論值得點贊


          再例如購物中的評論排序,像京東把好評優先展示在前面,當好評的數量大于其他維度時就會影響用戶判斷,用戶會把數量多的好評當作參考依據認定這個商品符合自己的需求



          十二、好奇心差距


          定義:

          指用戶知道的內容與他們想要或需要知道的內容之間的空間,這個空間叫做差距,差距會導致痛苦,要消除痛苦,用戶需要填補知識差距。


          案例:

          例如在做產品設計中都會涉及到登錄注冊流程,那么對于有些產品則需要在登錄注冊階段大量收集用戶信息完成更好的推薦策略,但對于用戶而言用戶的認知是固有的流程,如填完手機號就收到驗證碼,最后完成注冊進入首頁,如果說中間的過程需要收集用戶信息,則需要對應的解決方案來彌補用戶的心理差距


          即可App在收集用戶信息的階段使用了偏趣味性的一些設計表現,在用戶的這個空間差里面來緩解用戶的情緒,激起用戶填寫欲望



          十三、心智模型


          定義:

          心智模型是對某人關于事物在現實世界中如何運作的思考過程的解釋,它是對周圍世界的表示,可能準確或不準確,用戶認為他們對您的產品的了解會改變他們使用產品的方式。


          案例:

          心智模型其實就是我們對未來發展的預測,內心對要發生的事情進行預判,然后采取行動,例如我們要購物想到的就是淘寶、京東,想到吃飯可能就是美團、餓了么,這些產品就打入了用戶的心智。往細了說心智模型是一個廣泛的概念,它還包括行為模型、實現模型、表現模型


          像我們常用的聊天軟件,在聊天過程中撤回消息,就會有個重新編輯功能,這就是滿足用戶的心智模型,預判用戶的操作例如微信、釘釘、飛書



          十四、擬態認知


          定義:

          擬態是在頁面中模仿現實世界物品,通過它的外觀和交互模仿現實,擬物化適合用來讓用戶適應新的頁面和技術形態。


          案例:

          我們在做頁面時都會涉及到圖標的繪制,那么那些具有業務屬性的圖標則需要通過擬物的方式進行呈現,對于用戶能夠降低理解成本,如經典的紅包、自如的金剛區等



          十五、奇點效應


          定義:

          與群體相比,用戶對個人的關注不成比例,與大型抽象群體相比,人們更愿意同情一個單一的、可識別的人。


          案例:

          這個如果用逆向思維來想的話,類似于我們說的“對抗性人格”在大多數人都對一件事或事物看法一致時,出現一個不一樣的聲音,試想一下我們在刷短視頻時評論區總有那么些人與大多數人的看法不太一致,這就是奇點效應


          在設計中體現最多的是等級體系和勛章體系,一方面為用戶的攀比心理,另一方面則是奇點效應,這類用戶的想法就是為什么要一樣,為什么不可以獨樹一幟。


                 原文地址:站酷
          作者:愛吃貓的魚___

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

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

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

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

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


          日歷

          鏈接

          個人資料

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

          存檔

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