洗衣機的操作界面交互分析

2020-12-14 人人都是產品經理

從洗衣機的操作界面交互,我們可以學的哪些產品設計方法呢?

最近家裡需要購買一個洗衣機,由於空間有限只能選擇波輪洗衣機,因為家裡有老人,在選擇過程中界面操作簡單成為我的一個重要的標準,但在某東上逛了許久以及和客服溝通我只好放棄了這個標準。原因是我面對這些操作面板我是懵的,在和客服溝通後我依然很懵,很顯然產品功能的疊加帶來是操作界面操作成本的變高。下面我買的洗衣機操作界面:

在看了說明書和操作實踐後,基本的信息架構是這樣的:

存在的問題如下:

一個指示燈代表了兩層意思,通過常亮和閃爍區分,理解成本過高。功能選擇中兩個業務沒有區分開選擇。水量描述的表述和洗衣服的量不能建立關係,用戶對於27L、32L…55L、58L的概念很模糊,也無法和洗衣服的量聯繫起來,如用戶放了大半桶衣服進去,那應該選擇多少升的水量來洗衣服,估計只能靠主觀判斷了。沒有根據使用頻次和功能的優先級排列,如預約功能應該屬於附加功能,屬於低頻次的操作,位置居中且顏色突出不能理解。組合健的學習成本和使用成本均有點高,特別是對於老年人來說。「常用」的欄位描述有歧義,是根據我的使用習慣來記錄的嗎?還是系統已設定的洗衣服功能,這個只能去求助說明書了。洗衣服的業務的功能選擇(水量選擇、功能選擇、洗滌方式選擇)是有先後順序的,我們可以在界面上進行步驟的引導,如用戶如果選擇單脫水業務,洗滌方式選擇和水量選擇就沒有必要了。

最近又再次翻看了《簡約至上-互動設計四策略》這本書,書中提出了簡化設計的四原則:組織、刪除、隱藏、轉移,書中舉了Flip相機的例子,是如何在大品牌的功能很多的相機中殺出一條血路,Flip 攝像機從默默無聞到一下子銷售出上百萬臺,當時全美國市場的攝像機銷量只有6百萬臺。設計者卡普蘭和布朗斯坦的設計目標就是簡單易用,甚至每個人拿到手中就可以使用,不需要任何說明書,很顯然他們做到了。

重新回到洗衣機的問題上來,如何運用簡約設計四原則來重新設計洗衣機操作界面,才是我們這次討論的主要問題。其實用戶在洗衣服的過程中的心理模型是這樣的:把衣服和洗衣液放進洗衣機, 關上門,打開開始按鈕,很類似把大象裝到冰箱裡分為幾步的梗。很顯然事實並非如此,大致看了下現在市面的洗衣機,為了提高競爭力功能的疊加是一種趨勢,在有限的空間下滿足多功能的操作成為設計的挑戰。

接下來我們利用簡化設計四原則對於洗衣機操作界面分析和重新設計:

1、組織

組織是簡化設計的一種常見方式,首先需要根據功能進行分組,並將功能分組根據使用頻次進行優先級排序,其次可以根據功能的使用先後順序引導用戶按照步驟操作,將主要的頻次較高的流程或功能突出。

所以我們可以得到如下的設計方案:

按照用戶使用的頻次和優先級重新分類,並增加步驟引導,且在設計上需要突出:第一步是功能選擇,是指用戶洗衣服所用到的功能,因為功能的選擇會印象後面程序和洗衣量的選擇,例如如果用戶選擇了單脫水功能,其實後面的兩個選擇已經沒有意義了,第二部是洗衣服模式,是指引用戶選擇如何進行洗衣服,第三步洗衣量的選擇,指用戶這次洗衣服量的選擇,度量單位是較為直觀的洗衣桶。將水量改為洗衣量,用戶只要關注自己的洗衣量就行了,具體需要放入多少水那是洗衣機的事情。常用改為智能洗,欄位描述更加符合業務場景,是指按照程序設定好的流程進行,用戶不用選擇任何功能,只需打開電源放進衣服,點擊開啟即可。聰明的默認值:由於用戶在使用洗衣機的過程中大部分場景是洗衣服,所以默認的選擇需要和這個業務一致,所以功能選擇默認選中:洗滌-漂洗-脫水,洗衣模式選中智能洗,洗衣量選中較為常見的5桶。電源功能不同其他按鈕,位置和形狀上需要和其他按鈕有區別。

操作區域分析:

洗衣機操作面板底部為操作熱區,所以將主操作區域放在底部,並突出顯示。

操作路徑分析:

用戶多為右手操作,主要操作流程了是從左到右,符合使用習慣。

多種狀態說明:

功能選擇:

顯示屏

2、刪除

刪除不必要的功能可以讓用戶更加專注,快速實現用戶的目標,回歸產品本來的核心功能,我們現在就從洗衣機最基本的功能出發,可以的到下面的設計方案,回歸簡單,專注洗衣機核心業務,保麻煩留給機器而不是用戶,操作成本和操作都很低,只需要打開電源鍵,放進去衣服和洗衣液,點擊開始讓洗衣機開始工作後,就坐等洗好衣服。

電源鍵,用來控制整個機器的電源的開啟和關閉,控制整個洗衣機的工作狀態,可在位置和形狀上不需要區別於其他按鈕。開始/暫停按鈕,主要是讓洗衣機開始和暫停工作,也是對功能總體控制,可在位置上和其他按鈕區分開。顯示屏幕顯示洗衣機工作的進程和剩餘的時間。

3、轉移

轉移可以指從一個位置到另一個位置,也可以指從一個設備到其他設備,即是指將非核心的低頻次的功能到其他地方,也是達到用戶更加專注核心功能和自己的模板,減少其他選項的幹擾。例如強調物聯網的今天,洗衣機中像童鎖、預約等頻次較低的功能是否可以考慮轉移到APP上操作。

4、隱藏

就是將非核心的、頻次低的功能隱藏起來,不要幹擾到用戶正常的操作流程,通過的方式有多種,一般通過視覺上的不可見來達到此目的,如軟體中將某個功能入口變深,如有的空調遙控器做成下面這個樣子,在物理按鍵可通過加蓋板,摺疊的方式來實現隱藏的功能,洗衣機的改為設計為可掀開蓋板的兩層設計方案,也是值得研究,這裡就不展開討論了。

引起我們的反思:產品在功能疊加換來的用戶體驗的下降,這個是本末倒置的,也會讓自己的產品在市場中失去競爭力,所以傳統廠商也需要在用戶體驗上下功夫,在硬體產品慢慢同質化的今天,可能好的用戶體驗也是一個讓企業擁有市場競爭力的法寶。

引用文獻:

1、科爾伯恩(Giles Colborne). 簡約至上:交互式設計四策略 (圖靈互動設計叢書 1)人民郵電出版社. Kindle 版本。

本文由 @大宋 原創發布於人人都是產品經理。未經許可,禁止轉載。

題圖來自unsplash,基於CC0協議

相關焦點

  • 嵌入式人機互動界面研究與實現
    軟體因素  嵌入式人機互動界面開發的另一個基本要素就是嵌入式軟體作業系統。嵌入式作業系統種類很多,不同的作業系統對於開發者的進入門檻、知識結構的要求有所不同。有了合適的作業系統,開發人員接著應該考慮系統響應時間、用戶求助機制、錯誤信息處理和命令方式等人機互動界面設計的典型問題,以便開發出具備更高抽象化程度和更好可交互性的界面。
  • 交互乾貨必收 | App界面互動設計規範
    在上篇《APP界面設計風格》確定下來後,產品經理(兼互動設計)還不用著急將所有的交互稿扔給設計師進行細緻的界面設計。在細節設計啟動前,拉上設計師和安卓前端開發、ios前端開發一起商議確定設計規範先吧!頁面布局頁面布局和交互規範上建議安卓、ios儘量統一,這樣可以避免安卓和ios分別設計一套稿子。當然土豪公司可以忽略這個建議,安卓和ios分別做專門的設計當然更好。
  • 視聽整合:人機互動界面的新方向
    迄今為止,人機互動界面的發展大致經歷了三個階段:命令行界面(Command-Line Interface,CLI)、圖形用戶界面(Graphical User Interface,GUI)、自然用戶界面(Natural User Interface,NUI)。
  • 抖音播放主頁互動設計分析
    只有結合產品用戶的性質和使用場景,再加上產品本身的特性進行分析,我們才能深入理解為什麼要這麼對產品的交互功能進行這樣的設計,產出的分析文檔才能更加深入。2. 抖音用戶及場景分析如果我們想要深入分析抖音的互動設計,那麼用戶使用場景和產品特性分析就必不可少。
  • 體驗細節分析:Facebook Messenger聊天機器人交互界面淺析
    即將添加的 Discover Tab 則是專屬的聊天機器人尋找區,為用戶所在區域內最好的聊天機器人和商業交互提供露出。在 Discover Tab,用戶能找到最近使用的 chatbot ,瀏覽 chatbot 分類,看到正在流行的 chatbot,以及進行搜索。用戶可在進入對話環節之前,看到 chatbot 的功能介紹。
  • B端UI界面交互基礎組件:會話框
    導語:在前一篇文章《B端UI界面交互基礎組件-表單》中,一起學習了B端「表單」組件UI設計規範,其中包括「基礎表單」、「全頁表單」;並從表單組件的需求場景、內容布局以及交互方式等方面對以上組件進行了詳盡的規範描述;今天我們繼續介紹了B端「會話框」組件的交互規範。一、基礎會話框1.
  • 社會網絡分析與UCINET 學習(一):操作界面
    此外,這學期一門課的課程論文需要運用社會網絡分析,參考徐志平&劉怡對中國社會學博士互聘網絡[1]的分析,做一篇國內公共管理學科博士互聘網絡課程論文。上述兩個任務都需要我加快對於社會網絡分析的學習。上半年,讀了幾本關於SNA的書籍[2],但始終感覺不得要義。純粹方法論的內容看的越多,就越容易暈眩,反而不知道實地裡怎麼操作,於是轉向矛頭,決定從劉軍老師的這本書入手。
  • 人機互動的內容有哪些_人機互動主要研究什麼
    友好人機互動界面的開發離不開好的交互模型與設計方法。因此,研究人機互動界面的表示模型與設計方法,是人機互動的重要研究內容之一。   可用性分析與評估(Usability and Evaluation)   可用性是人機互動系統的重要內容,它關係到人機互動能否達到用戶期待的目標,以及實現這一目標的效率與便捷性。
  • B端交互界面基礎組件——表格
    編輯導語:在我們的日常工作中經常會用到表格,表格的功能可以讓我們很清晰快捷的了解當前情況,設計一個好的表格也能大大的提升我們的工作效率;本文作者分享了關於B端交互界面基礎組件表格的設計,我們一起來看一下。
  • 人機互動新體驗,全新AR界面讓你輕鬆控制畫中物
    增強現實(AR)作為新一代人機互動平臺,或許可以幫你實現這一願望。近日,卡爾加裡大學、Adobe 研究中心和科羅拉多大學博爾德分校的研究人員創建了一個增強現實(AR)界面 RealitySketch,該界面可用於繪製交互式圖形和可視化、可響應的草圖。
  • 下一場革命性的人機互動方式會是什麼?
    還是我們吹個口哨,洗衣機就開始自動運轉?不管是哪種,AR和VR技術主要營造的是一種沉浸感,不僅有交互,還有顯示和移動。未來在AR和VR領域,滑鼠和鍵盤的交互方式將會退出江湖,取而代之可能是手勢交互和體感交互。
  • 超觸覺技術系統:一個交互界面的多部位觸覺感受
    據物理學家組織網10月8日(北京時間)報導,最近,英國布里斯托大學「互動與繪圖」(BIG)項目組研究人員開發出一種系統,能讓用戶在一個交互界面上體驗到多部位的觸覺感受(多點觸覺反饋),而無需碰觸或拿著任何設備。
  • iOS10互動設計啟示
    著名的互動設計專家Jon Kolko在他的《互動設計沉思錄》中指出:「行為是發生在第四個維度(時間維度)上的,而互動設計的目標是試圖隨著時間的推移,逐漸理解並進而塑造人的行為」。舉個例子,iOS10最明顯的細節之一:拿起手機就亮屏。很多人之前會有這樣的困擾:我只是想看個時間,一按Home鍵,duang!一不小心就進入系統界面了。
  • 我眼中的大屏手機單手操作交互理念
    手機屏幕越來越大,單手操作已經越來越困難了,究竟多大的屏幕才是最適合人們使用的一個屏幕尺寸呢?曾經有一段時間,業內專家就這個問題進行了大量 的討論,可是最終還是沒能定下結論。而在使用者當中,對於大屏手機單手操作的使用體驗的看法也是各有不同,下面這篇文章就是來自一個大三學生@懋懋懋啊_愛科技對於這個問題的想法。大屏手機的單手操作交互體驗,你有什麼想法呢?
  • 最濃縮的概念:交互是什麼?交互的本質及如何理解
    也許,我們在工作中很容易的認為交互其實也是界面Interface的事。故然,這個UID就自然的被忽視。更或許,從公司的角度也沒必要再單獨去明確這一職能。直接將這一切要麼歸為產品去考慮,要麼歸為界面去考慮。而有些像BAT的大公司,也直接歸為UED去考慮即可。所以,我們常見到,有些公司,產品來負責了交互。有些公司,則是UI拿下了交互。還有些所畏BAT的大公司。則是將界面與交互歸為了UED。
  • 什麼是設計——交互&UI
    交互與UI的關係UI是交互的外現,交互是UI的內撐,就如皮膚和骨架的關係,交互的結構布局決定了UI思考方向;在常見的產品設計配合中一定是先有交互,後有UI。交互的價值在於: 從業務需求梳理信息結構,從產品場景搭建用戶操作流程,為產品的可用性、易用性負責。
  • 屏幕變大卻更難用 手機界面交互該何去何從
    01 單手操作的困局全面屏操作手勢依然存在諸多問題,比如頂部的下拉懸停,又比如高高在上的返回,對於大尺寸手機來說這些部分都是操作上的死角地帶,用戶基本不可能完成單手操作,一如8年前那樣。類似的例子不勝枚舉,當然動用雙手就能解決部分問題,但目前對於大尺寸的屏幕而言,還沒有全套的交互方案來解決使用時的不便。
  • 交互的學習與應用指南
    以智慧型手機的觸屏和顯示為例,我們需要清楚點擊、雙擊、滑動、縮放、長按等主要交互手勢,以及頁面的跳轉、彈出、彈入、翻轉等界面交互方式,了解淡入淡出、回彈、淡入快出、快入淡出等交互動效的差異與應用;並嘗試產出界面動效Demo,這比口頭描述精準易懂太多(Principle、Flinto、AE都是常見易學的動效軟體)。
  • 從交互文檔的撰寫,看設計的思路
    交互文檔是設計師的輸出物,首先需要明確文檔的用戶和目標,交互文檔面向的受眾主要是下遊同事,包括視覺、動畫、開發、測試等,另外還有自己和PM;文檔的目標就是讓下遊同事清楚地知道是如何設計的,讓他們在進行自己工作時有參考依據;另外文檔還應該能讓自己理清思路
  • 2017智能洗衣機排行榜
    洗衣機智能可分為兩個層次,一個是產品層次的智能,一個是交互層次的智能。產品層次的智能,包括衣物稱重,織物判斷,汙漬判斷,水質判斷,以及一些振動方向控制等等。這個層次的智能,說到底還是傳感器的應用,算法的設計。交互層次的智能,就是儘量減少用戶思考,讓用戶無需一遍一遍看說明書,下意識的就可以進行一步一步的操作。