首頁

UI 設(shè)計(jì)公司教你快速入門 HMI 設(shè)計(jì)

藍(lán)藍(lán)設(shè)計(jì)的小編 系統(tǒng)UI設(shè)計(jì)文章及欣賞

快速入門 HMI 設(shè)計(jì)需要從多個(gè)方面入手,全面理解其概念與范疇,深入研究用戶與場(chǎng)景,精心打造信息架構(gòu)與交互流程,注重視覺設(shè)計(jì)與品牌一致性,并通過原型制作與用戶測(cè)試不斷優(yōu)化完善。希望以上分享能夠?yàn)?UI 設(shè)計(jì)師們開啟 HMI 設(shè)計(jì)的大門,助力大家在這個(gè)充滿挑戰(zhàn)與機(jī)遇的領(lǐng)域中創(chuàng)造出優(yōu)秀的設(shè)計(jì)作品,為用戶帶來更加卓越的人機(jī)交互體驗(yàn)。

UI設(shè)計(jì)公司分享:交互設(shè)計(jì)基礎(chǔ)深度解析

藍(lán)藍(lán)設(shè)計(jì)的小編 系統(tǒng)UI設(shè)計(jì)文章及欣賞

當(dāng)我們談?wù)摻换ピO(shè)計(jì)(Interaction Design)時(shí),可能有人會(huì)疑惑:在體驗(yàn)設(shè)計(jì)(User Experience Design 簡(jiǎn)稱UX Design)為主流的今天,為什么還要關(guān)注交互設(shè)計(jì)?
 
其實(shí),交互有廣義和狹義之分,
廣義的交互不僅僅是指互聯(lián)網(wǎng)企業(yè)中的交互設(shè)計(jì)崗位,也包含從人機(jī)交互、人因工程等發(fā)展而來的大交互學(xué)科
(各大院校的交互設(shè)計(jì)專業(yè))。而用戶體驗(yàn)設(shè)計(jì)和UI設(shè)計(jì)只是互聯(lián)網(wǎng)發(fā)展中形成的職業(yè)類別:
萬字長(zhǎng)文:交互設(shè)計(jì)基礎(chǔ)深度解析(一)
 
 
所以說,無論是體驗(yàn)設(shè)計(jì)、UI設(shè)計(jì)甚至是服務(wù)設(shè)計(jì),它們都建立在交互設(shè)計(jì)的基礎(chǔ)之上。交互設(shè)計(jì)具備的學(xué)術(shù)背景和理論深度,是連接理論與實(shí)踐的橋梁,它幫助我們從執(zhí)行任務(wù)的“匠人”,變成能夠深入理解背后的邏輯和目的的“設(shè)計(jì)師”。
 
很多同學(xué)雖然非常熟悉信息架構(gòu)、任務(wù)流程和頁面搭建等工作,但他們?nèi)匀桓械嚼Щ?,無法將這些內(nèi)容串聯(lián)起來,也不清楚底層邏輯,就是因?yàn)樗麄內(nèi)狈?duì)交互設(shè)計(jì)學(xué)科背景的深入理解。只有掌握了交互設(shè)計(jì)的學(xué)科知識(shí),設(shè)計(jì)師才能在職業(yè)道路上走得更遠(yuǎn),更好地理解和應(yīng)用設(shè)計(jì)原則。
 
今天我們就以“學(xué)科+職業(yè)”的方式,真正系統(tǒng)地介紹一下廣義交互設(shè)計(jì)的基礎(chǔ)知識(shí)。主要包括以下幾部分:
 
第一章  交互設(shè)計(jì)概述
什么是交互設(shè)計(jì),為什么會(huì)有交互設(shè)計(jì);
第二章  交互設(shè)計(jì)依托的學(xué)科理論基礎(chǔ)
這門學(xué)科的背景是什么,理論依據(jù)在哪里;
第三章  交互設(shè)計(jì)的基本流程與方法
介紹最通用的交互設(shè)計(jì)過程與方法;
第四章  交互設(shè)計(jì)基本原則
介紹設(shè)計(jì)中必須遵循的幾大原則;
第五章  交互設(shè)計(jì)常用的方法論
成套的裝備,可直接使用的成體系方法。
 
第一章 交互設(shè)計(jì)概述
1.1 什么是交互?
“交互”這個(gè)詞是從Interaction意譯的,詞義為“相互作用”,從中文來說,即交流、互動(dòng)。在人與人之間,相互的打招呼、交流,就算是最簡(jiǎn)單的交互。那么人和機(jī)器之間的交流互動(dòng)是什么樣的呢?舉個(gè)例子,如果你想給朋友發(fā)一條信息,交互過程可能是:
 
打開微信 → 打開對(duì)話框 → 輸入文字 → 點(diǎn)擊發(fā)送
 
在這個(gè)過程中,每一步的操作,手機(jī)都有所反饋,比如點(diǎn)擊微信icon,就會(huì)進(jìn)入主界面,點(diǎn)擊“發(fā)送”,信息就會(huì)發(fā)到對(duì)方微信,一系列的操作和反饋就構(gòu)成了交互。
 
所以簡(jiǎn)而言之,當(dāng)人和一件事物(無論是人,機(jī)器,系統(tǒng)、環(huán)境等等)發(fā)生
雙向的信息交流和互動(dòng)
,就是一種交互行為。這種交流和互動(dòng)必須是雙向的,如果只有一方的信息輸出,而沒有第二方的參與,就只是信息展示而不是交流互動(dòng)。來而不往非交互。比如我們平時(shí)看到的平面廣告,只是信息呈現(xiàn),沒有交互性,而下面的廣告設(shè)計(jì),就具備了交互的屬性:
有人抽煙就“咳嗽”的廣告牌
有人抽煙就“咳嗽”的廣告牌
 
上圖是一個(gè)戒煙產(chǎn)品廣告,一般狀態(tài)下,畫面中的男士神態(tài)正常,當(dāng)有人在附近吸煙時(shí),畫面中的男士就開始咳嗽。這個(gè)廣告牌會(huì)根據(jù)外界的變化而呈現(xiàn)不同的反饋。
 
1.2 什么是交互設(shè)計(jì)?
既然“交互”是交流、互動(dòng),那么“交互設(shè)計(jì)”簡(jiǎn)單來說,就是設(shè)計(jì)如何交流如何互動(dòng),讓交流和互動(dòng)更加自然更加順暢。
 
交互設(shè)計(jì)有廣義和狹義之分。從廣義上說,人與外物的所有交互都是交互設(shè)計(jì)的范疇,比如一個(gè)人要開門,是用門把手還是直接推,需要鑰匙還是指紋,這屬于廣義的交互設(shè)計(jì)。而狹義的交互設(shè)計(jì),就是特指人與互聯(lián)網(wǎng)產(chǎn)品或智能產(chǎn)品的交互,在這里主要討論后者。所以我們之后所說的“產(chǎn)品”主要就是指運(yùn)行在各種聯(lián)網(wǎng)終端(手機(jī)、電腦、Pad、電視等)上的網(wǎng)站、應(yīng)用等產(chǎn)品,或者是可聯(lián)網(wǎng)并具有交互性的智能設(shè)備,如智能汽車,智能機(jī)器人,智能音響等。
 
另外從職位角度來看,交互設(shè)計(jì)專門指在互聯(lián)網(wǎng)產(chǎn)品設(shè)計(jì)過程中確定了產(chǎn)品功能之后、視覺設(shè)計(jì)之前這一段,主要包括功能架構(gòu)的搭建、用戶流程的設(shè)計(jì)和界面元素的排布等方面,眾多的交互設(shè)計(jì)培訓(xùn)班就是在做這部分的培訓(xùn)。比如一個(gè)APP的登錄注冊(cè),打開登錄頁是開始,登錄成功是結(jié)束,這個(gè)過程如何進(jìn)行,期間遇到各種問題如何解決,就是職業(yè)交互設(shè)計(jì)的范疇。
萬字長(zhǎng)文:交互設(shè)計(jì)基礎(chǔ)深度解析(一)
 
 
而從學(xué)科角度來看,交互設(shè)計(jì)是
定義、設(shè)計(jì)人與人造系統(tǒng)如何關(guān)聯(lián)的設(shè)計(jì)領(lǐng)域
。學(xué)術(shù)角度,對(duì)于交互會(huì)有更多偏研究的內(nèi)容,而不僅僅像職業(yè)交互設(shè)計(jì)師一樣去解決用戶需求,還要考慮很多基礎(chǔ)性的問題,比如人與環(huán)境的關(guān)系、人與人造物的關(guān)系等。
 
1.3 交互設(shè)計(jì)的發(fā)展歷程和價(jià)值
交互設(shè)計(jì)是由IDEO的一位創(chuàng)始人比爾·摩格理吉(Bill Moggridge)在1984年一次設(shè)計(jì)會(huì)議上提出的。后來它逐漸綜合了人機(jī)交互,人因工程,認(rèn)知心理學(xué)等領(lǐng)域的知識(shí),形成了專門用于解決產(chǎn)品在使用和體驗(yàn)方面問題的學(xué)科領(lǐng)域。
 
那么到底為什么會(huì)出現(xiàn)交互設(shè)計(jì)這個(gè)領(lǐng)域呢?
 
以前的產(chǎn)品,其實(shí)并不需要交互設(shè)計(jì),比如較早的洗衣機(jī)(下圖左),只需要一個(gè)開關(guān)就足夠了,但是后來,有了雙桶、半自動(dòng)、全自動(dòng)洗衣機(jī),操作越來越復(fù)雜,這時(shí)就需要交互設(shè)計(jì)師去研究用戶的使用流程與操作方式,
讓用戶能夠與復(fù)雜功能和平相處
萬字長(zhǎng)文:交互設(shè)計(jì)基礎(chǔ)深度解析(一)
 
 
這是實(shí)體產(chǎn)品的例子,計(jì)算機(jī)方面,比如以前的DOS系統(tǒng)(下圖左),一個(gè)命令對(duì)應(yīng)一種結(jié)果,只需要記住就行,也不需要交互設(shè)計(jì),后來有了
圖形界面(下圖右),有了鼠標(biāo),操作就變得復(fù)雜,就需要交互設(shè)計(jì)師和界面設(shè)計(jì)師來定義軟件系統(tǒng)。
萬字長(zhǎng)文:交互設(shè)計(jì)基礎(chǔ)深度解析(一)
 
 
所以說,
交互設(shè)計(jì)是順應(yīng)時(shí)代需求而產(chǎn)生的
,當(dāng)工程師無暇處理人與機(jī)器的交流互動(dòng)問題時(shí),交互設(shè)計(jì)師便應(yīng)運(yùn)而生了。
交互設(shè)計(jì)的發(fā)展歷程
交互設(shè)計(jì)的發(fā)展歷程
 
在短短30多年的發(fā)展中,交互設(shè)計(jì)已經(jīng)涉及方方面面,從最初的網(wǎng)頁設(shè)計(jì),app設(shè)計(jì),到智能設(shè)備、自然界面設(shè)計(jì),甚至是服務(wù)體驗(yàn),都可以通過交互設(shè)計(jì)的方法找到解決方案。當(dāng)前交互設(shè)計(jì)的研究重點(diǎn)已經(jīng)放在了多模態(tài)(多通道)、多媒體交互,虛擬交互以及人機(jī)協(xié)同等方面。
萬字長(zhǎng)文:交互設(shè)計(jì)基礎(chǔ)深度解析(一)
 
 
第二章 交互設(shè)計(jì)學(xué)科理論基礎(chǔ)
新學(xué)科基本不會(huì)憑空誕生,一般都是從已有學(xué)科發(fā)展過渡而來,
往往是當(dāng)已有學(xué)科無法解決新出現(xiàn)的問題時(shí),就會(huì)在他們的基礎(chǔ)上誕生新的學(xué)科
。而交互設(shè)計(jì)就是在工業(yè)設(shè)計(jì)、人機(jī)交互等學(xué)科的基礎(chǔ)上,借鑒人因工程,認(rèn)知心理學(xué)等領(lǐng)域研究結(jié)果,逐漸融合而成的一門交叉學(xué)科。下面這幅圖基本展示了交互設(shè)計(jì)的學(xué)科結(jié)構(gòu),但并不全面:
萬字長(zhǎng)文:交互設(shè)計(jì)基礎(chǔ)深度解析(一)
 
 
這里由于篇幅原因,只簡(jiǎn)單介紹與交互相關(guān)性較大的幾個(gè)領(lǐng)域:工業(yè)設(shè)計(jì)、人因工程、人機(jī)交互與認(rèn)知心理學(xué)。
 
2.1 工業(yè)設(shè)計(jì)
對(duì)于工業(yè)設(shè)計(jì)(Industrial Design)大家應(yīng)該相對(duì)比較熟悉,很多大學(xué)都開設(shè)了工業(yè)設(shè)計(jì)專業(yè)。它與交互相關(guān)性很高,所以大量的工設(shè)畢業(yè)的學(xué)生都從事了交互設(shè)計(jì)職位(主要是薪資差別太大哈哈)。
 
從設(shè)計(jì)對(duì)象上來看,交互設(shè)計(jì)的對(duì)象比較偏網(wǎng)站、APP之類的虛擬產(chǎn)品,而工業(yè)設(shè)計(jì)主要針對(duì)實(shí)體產(chǎn)品,比如電腦、吸塵器、交通工具之類的,所以會(huì)更多的考慮產(chǎn)品的外觀、材質(zhì)、內(nèi)部結(jié)構(gòu)設(shè)計(jì)等。當(dāng)然對(duì)于電視、音響等操作較為復(fù)雜的產(chǎn)品,工業(yè)設(shè)計(jì)師也會(huì)考慮很多人與產(chǎn)品交互的問題,比如電視遙控器的設(shè)計(jì)就是一個(gè)經(jīng)典題目。不過交互設(shè)計(jì)的對(duì)象會(huì)更加的集約化、系統(tǒng)化和精細(xì)化,所以對(duì)于設(shè)計(jì)分析和方案實(shí)現(xiàn)方面,有了更高的要求。
工業(yè)設(shè)計(jì)與交互設(shè)計(jì)的融合
工業(yè)設(shè)計(jì)與交互設(shè)計(jì)的融合
 
另外,工業(yè)設(shè)計(jì)與交互設(shè)計(jì)在很多方面都是相通的。特別是當(dāng)前市面上很多智能設(shè)備,都需要工業(yè)設(shè)計(jì)師和交互設(shè)計(jì)師緊密配合才能做出即好用又好看的產(chǎn)品。在漫長(zhǎng)的工業(yè)設(shè)計(jì)發(fā)展史中,涌現(xiàn)的很多設(shè)計(jì)思考和方法,都可以為交互設(shè)計(jì)帶來養(yǎng)分,比如一直以來都在討論的“形式與功能”的問題,是形式追隨功能還是功能追隨形式或是功能形式各自獨(dú)立,其實(shí)跟交互與UI的關(guān)系很像,歷史總是在不斷的重復(fù)。
 
2.2 人因工程
人因工程(Ergonomics)又稱為人機(jī)工程、人體工學(xué)等,主要是探討和應(yīng)用人類行為、能力本能極限和其它的特性等相關(guān)信息來設(shè)計(jì)器具、機(jī)器、設(shè)備、系統(tǒng)、任務(wù)、工作及其相關(guān)所屬的周遭環(huán)境,以增加生產(chǎn)力、安全性、舒適感和效率,進(jìn)而提升人類的生活品質(zhì)。
人因工程對(duì)交互設(shè)計(jì)較大的貢獻(xiàn)主要有兩個(gè)方面:
一是人體測(cè)量。
首先是下圖所示的各種人體尺寸、活動(dòng)范圍的測(cè)量,這些在實(shí)體產(chǎn)品中運(yùn)用很廣泛。除了這些測(cè)量以外,還有對(duì)于記憶極限、注意力極限等的測(cè)量,對(duì)于交互中的可用性易用性提高都有很高的參考價(jià)值。
人因工程中的人體測(cè)量
人因工程中的人體測(cè)量
 
二是以人為中心的設(shè)計(jì)觀念。
現(xiàn)在各個(gè)設(shè)計(jì)領(lǐng)域都在提倡以人為中心,其實(shí)這個(gè)理念最早是由人因工程提出的,這種理念使設(shè)計(jì)師開始關(guān)注人的操作過程、人的感受,使得各種產(chǎn)品都有了巨大的進(jìn)步。
 
2.3 人機(jī)交互
很多人把交互設(shè)計(jì)和人機(jī)交互混為一談,其實(shí)這是不同的兩個(gè)領(lǐng)域。
 
簡(jiǎn)單說來,
人機(jī)交互主要是為交互設(shè)計(jì)提供技術(shù)支持
,比如多點(diǎn)觸控、手勢(shì)交互等,都是人機(jī)交互的學(xué)科范疇。它研究人與機(jī)器之間進(jìn)行信息傳遞的理論、技術(shù)和設(shè)備,既包括技術(shù)研究(包括算法、硬件技術(shù)等),也包括心理學(xué)研究;而
交互設(shè)計(jì)相對(duì)來說,是屬于設(shè)計(jì)中的一個(gè)領(lǐng)域,是一種實(shí)踐方法,
通常為了解決特定使用場(chǎng)景下特定人群的使用過程中,人與機(jī)器(或軟件、網(wǎng)站)如何更方便簡(jiǎn)單地「對(duì)話」的問題。
 
當(dāng)然兩者也有比較大的交匯,比如人機(jī)交互研究中發(fā)現(xiàn)的一般規(guī)律可以指導(dǎo)交互設(shè)計(jì)或提供參照,人機(jī)交互研究中還包括對(duì)交互設(shè)計(jì)方法論的研究,而交互設(shè)計(jì)實(shí)踐中遇到的挑戰(zhàn)和難題也能夠促發(fā)新的人機(jī)交互研究。
 
2.4 認(rèn)知心理學(xué)
在介紹交互設(shè)計(jì)的定義時(shí),我們提到它是“定義、設(shè)計(jì)人與人造系統(tǒng)如何關(guān)聯(lián)的設(shè)計(jì)領(lǐng)域”,如何關(guān)聯(lián)當(dāng)然很重要,但在讓他們更好的關(guān)聯(lián)之前,我們需要深入的了解自身。而在交互設(shè)計(jì)領(lǐng)域,我們不可能專門研究人,所以就可以直接運(yùn)用相關(guān)的研究結(jié)果了。在大量的研究人的領(lǐng)域中,認(rèn)知心理學(xué)是跟我們的設(shè)計(jì)息息相關(guān)的學(xué)科,因?yàn)槿伺c人造系統(tǒng)要很好的關(guān)聯(lián),必須綜合運(yùn)用人的感知系統(tǒng)。下面從幾個(gè)最基礎(chǔ)的方面進(jìn)行簡(jiǎn)單的介紹:
 
2.2.1 感知融合
感知融合是指人對(duì)外界的感知與反饋是系統(tǒng)性的過程,這個(gè)系統(tǒng)由視覺、聽覺、觸覺、前廳感覺(運(yùn)動(dòng)和重力覺)、整體位置及軀體感覺等等一起組成,它們?cè)诜答仚C(jī)制的作用下互相制約,互相協(xié)調(diào),從而使人可以在日常生活中能夠感知事物和適應(yīng)環(huán)境變化。所以
在設(shè)計(jì)過程中,對(duì)于視覺、聽覺、觸覺等感知系統(tǒng)進(jìn)行綜合考慮,不能孤立的看待
。
人的信息處理工作系統(tǒng)(感知融合)
人的信息處理工作系統(tǒng)(感知融合)
 
 
2.2.2 視覺
人類接收信息80%是通過視覺,而交互設(shè)計(jì)產(chǎn)品,整個(gè)交互過程基本都要緊密依賴于人的視覺系統(tǒng),所以了解視覺系統(tǒng)就非常有必要了。視覺系統(tǒng)具有主動(dòng)性、動(dòng)態(tài)建構(gòu)等特點(diǎn)。視覺認(rèn)知分為色彩認(rèn)知、運(yùn)動(dòng)認(rèn)知、形狀認(rèn)知、控件認(rèn)知等方面。這些認(rèn)知特點(diǎn)與界面設(shè)計(jì)都有很大的相關(guān)性,比如其中的形狀認(rèn)知包括相似性、接近性、連續(xù)性、簡(jiǎn)潔性和完整性等特點(diǎn)。而且很多設(shè)計(jì)原則都是從人類視覺特點(diǎn)中來的,在這里不做展開,以后有機(jī)會(huì)專門做介紹。
 
舉個(gè)簡(jiǎn)單的例子:
某平臺(tái)購(gòu)物車改版前后對(duì)比
某平臺(tái)購(gòu)物車改版前后對(duì)比
 
上圖左邊是某購(gòu)物平臺(tái)的舊版購(gòu)物車,右邊是新版,他們?yōu)槭裁匆鲞@樣的改進(jìn)呢?我們可以看到左圖中元素與元素之間間距都差不多,我們無法較快的區(qū)分信息的歸屬,比如滿贈(zèng)的商品是屬于上面的商品還是下面的;而右圖中間距進(jìn)行了調(diào)整,可以一眼就能分辨出贈(zèng)品是屬于上面的產(chǎn)品。
 
可能有的同學(xué)這時(shí)會(huì)說:“這不是很基礎(chǔ)的UI原則嘛,跟人的視覺有啥關(guān)系?”,其實(shí)主要就是因?yàn)槿说囊曈X有之前提到的接近性的特點(diǎn),所以才會(huì)有這樣的原則。什么是接近性呢?請(qǐng)看下面這張圖:
視覺接近性原則
視覺接近性原則
 
左邊的九個(gè)菱形,橫向間距小,豎向間距大,所以人眼會(huì)認(rèn)為每一排是一個(gè)整體;右邊圖里,橫向間距大,豎向間距小,所以人眼會(huì)認(rèn)為每一列是一個(gè)整體。這就是人眼睛看事物做判斷的特點(diǎn),各種設(shè)計(jì)都需要遵循這些特點(diǎn)。所以去學(xué)習(xí)那些別人總結(jié)出來的設(shè)計(jì)原則,不如直達(dá)根本,了解認(rèn)知學(xué)理論,你也可以創(chuàng)造出自己的設(shè)計(jì)原則!
 
2.2.3 注意
除了視覺之外,認(rèn)知學(xué)里還有一塊非常重要,就是注意。有句話說,
現(xiàn)代互聯(lián)網(wǎng)之戰(zhàn)基本上就是注意力之戰(zhàn)
,那打好這場(chǎng)仗,必然得了解人的注意是怎么回事。
 
簡(jiǎn)單說來,人的注意有三個(gè)特點(diǎn):
一是選擇性:
注意是主動(dòng)選擇的過程,也就是說,人要是把注意力集中在某個(gè)地方,需要主動(dòng)做出選擇,不像聽覺和嗅覺,可以被動(dòng)接受。所以,在設(shè)計(jì)過程中,需要通過一些方法,讓重點(diǎn)內(nèi)容成為被注意對(duì)象。比如在新消息到達(dá)時(shí),通過彈窗、小紅點(diǎn)等形式提示用戶,就是典型的影響用戶注意選擇的方法。
二是集中性:
正在集中精力所在的最多只能有一個(gè)實(shí)體,無論它是一個(gè)對(duì)象、一個(gè)特征、一個(gè)記憶還是一個(gè)概念。因?yàn)檫@個(gè)特點(diǎn),在設(shè)計(jì)中就應(yīng)該避免過多干擾注意的內(nèi)容,盡量讓用戶集中注意在重點(diǎn)內(nèi)容、重點(diǎn)任務(wù)上。
三是注意分配:
雖然集中精力所在只能有一個(gè),但整體的注意資源還是可以得到有限度的分配。但也取決于并行活動(dòng)的性質(zhì)、復(fù)雜程度以及熟練程度。比如左手畫圓右手畫方,是很難做到的,但是同時(shí)走路并看手機(jī),就沒有問題,主要就是因?yàn)樽呗愤@個(gè)動(dòng)作我們非常熟練,只需要分配很少的注意力資源。所以在設(shè)計(jì)過程中,需要關(guān)注用戶同時(shí)進(jìn)行的任務(wù),是不是會(huì)對(duì)注意造成壓力,合理進(jìn)行注意管理。
萬字長(zhǎng)文:交互設(shè)計(jì)基礎(chǔ)深度解析(一)
 
 
上圖是Evernote從2008年到2020年的UI設(shè)計(jì)變化史,這里我們可以很明顯的看出一個(gè)趨勢(shì),就是簡(jiǎn)單化和扁平化,那為什么會(huì)有這種趨勢(shì)呢,只是因?yàn)槿藗兊膶徝腊l(fā)生了變化嗎,肯定不是這么簡(jiǎn)單。
 
早年間,蘋果手機(jī)將屏幕分辨率一下子提升了不少,這讓眾多手癢的設(shè)計(jì)師們終于有了發(fā)揮余地(以前那種可以看到一個(gè)個(gè)像素的屏幕實(shí)在沒啥可做的),所以他們對(duì)于圖標(biāo)和界面無所不用其極,描繪的美輪美奐。當(dāng)然,一開始之所以這樣,另外一個(gè)原因也是為了沿用現(xiàn)實(shí)中的心智模式,讓用戶可以在屏幕上迅速理解,但是這兩者之間的成分,我覺得還是前者更多。然后到了一定的階段,人們發(fā)現(xiàn)這些精美的圖標(biāo)和控件很大程度上吸引了用戶的注意力,真正重要的東西反而不容易看到,當(dāng)然也是物極必反吧,終于在iOS7當(dāng)中,蘋果徹底做了大革新,全部扁平化,提出內(nèi)容至上的原則,其實(shí)就是對(duì)于注意力資源的重新考慮。
 
 
2.2.4 記憶
在人的認(rèn)知系統(tǒng)中,記憶也是一個(gè)神奇的東西。
 
人的記憶分為短期記憶和長(zhǎng)期記憶。短期記憶也稱工作記憶,是為了完成任務(wù)而臨時(shí)儲(chǔ)存的信息。工作記憶的容量有限,大約是7±2,即我們能夠同時(shí)記住的互不相關(guān)的東西的數(shù)量在5~9之間。此外,工作記憶還非常不穩(wěn)定,如果我們將注意轉(zhuǎn)移到新事物上,之前工作記憶中的內(nèi)容就可能遺失。所以在設(shè)計(jì)中,需要考慮用戶的記憶壓力,盡量避免過多過長(zhǎng)的記憶。
 
 
2.2.5 習(xí)慣
《上癮》中關(guān)于習(xí)慣是這么說的:“所謂習(xí)慣,就是’在情境暗示下產(chǎn)生的無意識(shí)行為’,使我們幾乎不假思索就做出的舉動(dòng)。如今,我們習(xí)以為常的那些產(chǎn)品和服務(wù)正在改變我們的一舉一動(dòng),而這,真是產(chǎn)品設(shè)計(jì)者的初衷。”
 
產(chǎn)品設(shè)計(jì)者的初衷一定是要改變用戶的習(xí)慣嗎?到底應(yīng)該引導(dǎo)用戶習(xí)慣還是順從用戶習(xí)慣呢?其實(shí)都不一定,要視情況而定。比如手機(jī)設(shè)計(jì)從物理鍵盤到觸摸屏,大勢(shì)所趨,需要引導(dǎo)習(xí)慣;而觸摸屏上鍵盤的字母排布,就需要順從用戶習(xí)慣了。
萬字長(zhǎng)文:交互設(shè)計(jì)基礎(chǔ)深度解析(一)
 
 
 
 
小結(jié):
第一部分和第二部分介紹了什么是交互設(shè)計(jì),以及這門學(xué)科出現(xiàn)的原因和發(fā)展歷程,然后介紹了它的一些學(xué)科理論基礎(chǔ),因?yàn)槠颍@里只是點(diǎn)到為止。要是想深入了解,還是需要自己深入到相關(guān)學(xué)科中,不但可以拓寬視野,也能夠?qū)换ビ懈由钊氲睦斫狻?/span>


作者:覺之設(shè)計(jì)
鏈接:https://www.zcool.com.cn/article/ZMTY0MTU0OA==.html
來源:站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

蘭亭妙微(sillybuy.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計(jì)、B端界面設(shè)計(jì)、桌面端界面設(shè)計(jì)APP界面設(shè)計(jì)、圖標(biāo)定制用戶體驗(yàn)設(shè)計(jì)、交互設(shè)計(jì)、UI咨詢、高端網(wǎng)站設(shè)計(jì)平面設(shè)計(jì),以及相關(guān)的軟件開發(fā)服務(wù),咨詢電話:01063334945。我們建立了一個(gè)微信群,每天分享國(guó)內(nèi)外優(yōu)秀的設(shè)計(jì),有興趣請(qǐng)加入一起學(xué)習(xí)成長(zhǎng),咨詢及進(jìn)群請(qǐng)加藍(lán)小助微信ben_lanlan。

未來車載 HMI 設(shè)計(jì):虛擬現(xiàn)實(shí)與增強(qiáng)現(xiàn)實(shí)技術(shù)的融合應(yīng)用前景展望

藍(lán)藍(lán)設(shè)計(jì)的小編 系統(tǒng)UI設(shè)計(jì)文章及欣賞

虛擬現(xiàn)實(shí)與增強(qiáng)現(xiàn)實(shí)技術(shù)在車載 HMI 設(shè)計(jì)中的融合應(yīng)用具有廣闊的前景。雖然目前還面臨一些技術(shù)和成本方面的挑戰(zhàn),但隨著技術(shù)的不斷突破和市場(chǎng)的逐步成熟,這一創(chuàng)新的人機(jī)交互設(shè)計(jì)理念有望為汽車行業(yè)帶來革命性的變革,為駕駛者創(chuàng)造更加安全、便捷、智能和沉浸式的駕駛體驗(yàn),同時(shí)也將為汽車產(chǎn)業(yè)的轉(zhuǎn)型升級(jí)和可持續(xù)發(fā)展注入新的動(dòng)力。在未來的發(fā)展中,汽車制造商、科技企業(yè)以及相關(guān)研究機(jī)構(gòu)應(yīng)加強(qiáng)合作,共同攻克技術(shù)難題,推動(dòng)車載 VR/AR HMI 技術(shù)的商業(yè)化應(yīng)用進(jìn)程,讓這一創(chuàng)新技術(shù)早日走進(jìn)千家萬戶

UI 設(shè)計(jì)和交互設(shè)計(jì)的區(qū)別是什么?

藍(lán)藍(lán)設(shè)計(jì)的小編 設(shè)計(jì)管理與成長(zhǎng)

在當(dāng)今數(shù)字化產(chǎn)品蓬勃發(fā)展的時(shí)代,UI 設(shè)計(jì)(用戶界面設(shè)計(jì))和交互設(shè)計(jì)在打造優(yōu)質(zhì)用戶體驗(yàn)方面都扮演著極為關(guān)鍵的角色,但它們卻有著明顯的區(qū)別。

UI設(shè)計(jì)公司設(shè)計(jì)分享:如何學(xué)會(huì)情感化設(shè)計(jì)?

藍(lán)藍(lán)設(shè)計(jì)的小編 系統(tǒng)UI設(shè)計(jì)文章及欣賞

設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
品牌氣質(zhì)的塑造不僅依賴于產(chǎn)品功能,還需要
通過情感化設(shè)計(jì)來展示品牌價(jià)值觀
。情感化設(shè)計(jì)可以讓用戶在使用產(chǎn)品時(shí)與品牌建立情感連接,從而增強(qiáng)品牌形象。設(shè)計(jì)師可以利用色彩、圖形、動(dòng)效和字體等元素,甚至預(yù)測(cè)用戶行為來實(shí)現(xiàn)這一點(diǎn)。
情感化設(shè)計(jì)越細(xì)致,用戶對(duì)品牌的印象越好,滿意度和忠誠(chéng)度也越高。
 
「支付寶」和「菜鳥裹裹」通過情感化設(shè)計(jì)
在圖標(biāo)、下拉刷新動(dòng)畫、文案和插畫等方面,增強(qiáng)與用戶的情感連接,帶來令人驚喜的體驗(yàn)
。為了在用戶心中塑造“安全、快速、專屬”的品牌形象,設(shè)計(jì)上強(qiáng)調(diào)“全程保障”和“專屬快遞員”等關(guān)鍵點(diǎn),突出寄件流程中的專屬特權(quán)。通過地圖聯(lián)動(dòng)和寄件卡片,為用戶提供“快速、省心”的寄件體驗(yàn)。
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
產(chǎn)品的呈現(xiàn)往往是商業(yè)目的和用戶需求的綜合結(jié)果。除了滿足用戶的痛點(diǎn)和提供良好的用戶體驗(yàn)外,產(chǎn)品還需要引導(dǎo)用戶去做一些期望用戶做的事情,這些事情可能并不是用戶當(dāng)前狀態(tài)下會(huì)主動(dòng)去做的。
情感設(shè)計(jì)能夠調(diào)動(dòng)用戶的情緒,設(shè)計(jì)賦能產(chǎn)品,提升用戶體驗(yàn)。
 
「淘寶/天貓」七天無理由和正品保障;刮免單卡:
電商類產(chǎn)品通常會(huì)在商品頁面打上“7 天無理由退換貨”的標(biāo)簽,以構(gòu)建“零風(fēng)險(xiǎn)承諾”的心理預(yù)期。用戶心理會(huì)認(rèn)為,反正可以隨時(shí)退貨,所以可以放心購(gòu)買并試用。這也是為什么現(xiàn)在網(wǎng)上購(gòu)物可以有退貨包運(yùn)費(fèi)、無效果可退貨退款等服務(wù)。下單后可以刮免單卡,引導(dǎo)用戶再次下單;此外,底部高亮的橙色按鈕「立即購(gòu)買」、「加入購(gòu)物車」,以及其他吸引用戶注意力的文案元素,引導(dǎo)用戶完成所需的操作,建立起用戶與產(chǎn)品之間的情感聯(lián)系。
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
當(dāng)用戶的基本需求得到滿足后,情感價(jià)值變得尤為重要。生活在快節(jié)奏城市中的年輕人需要釋放情緒,尋找安慰和共鳴。他們不僅關(guān)注產(chǎn)品的功能,更期待產(chǎn)品和消費(fèi)場(chǎng)景帶來的情感體驗(yàn)。
抓住年輕人的情緒敏感點(diǎn),提供情感價(jià)值,通過人文關(guān)懷與用戶建立共鳴,可以顯著提升產(chǎn)品的競(jìng)爭(zhēng)力。
 
例如,小米的性價(jià)比、李寧的民族自豪感、特斯拉的創(chuàng)新極客精神,這些都是極致情感價(jià)值的案例。人們的情緒通過品牌得到表達(dá),品牌作為情感價(jià)值的載體,將這些情緒傳遞給每個(gè)人,從而讓產(chǎn)品超越了其本身的功能,變得更有意義。
 
「抖音」的情感陪伴型娛樂:
抖音吸引用戶的重要原因在于其豐富多樣的內(nèi)容和輕松愉快的社區(qū)氛圍。對(duì)用戶來說,抖音不僅提供了娛樂和資訊,還充當(dāng)了情感陪伴的角色。與其他平臺(tái)的單向信息傳遞不同,抖音的社交屬性使創(chuàng)作者和用戶之間的互動(dòng)更加緊密,模糊了彼此的界限。這種互動(dòng)構(gòu)成了天然的吸引力,形成了“情緒價(jià)值-內(nèi)容消費(fèi)-情緒價(jià)值”的商業(yè)體驗(yàn)閉環(huán)。通過這種閉環(huán),抖音不僅是一個(gè)娛樂工具,更是一個(gè)情感價(jià)值的傳遞平臺(tái)。
 
總結(jié)
產(chǎn)品要獲得用戶的青睞,不僅需要滿足用戶需求和提供出色的體驗(yàn),還需要與用戶建立情感聯(lián)系。巧妙的設(shè)計(jì)細(xì)節(jié)可以顯著增強(qiáng)用戶對(duì)產(chǎn)品的感知,拉近產(chǎn)品與用戶之間的情感距離,讓產(chǎn)品不再只是冷冰冰的應(yīng)用程序,而是充滿溫度和關(guān)懷的存在。
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?
 
 
設(shè)計(jì)賦能:如何打造情感化設(shè)計(jì)?


作者:贏贏醬
鏈接:https://www.zcool.com.cn/article/ZMTYyNTE2NA==.html
來源:站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

亭妙微(sillybuy.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計(jì)B端界面設(shè)計(jì)、桌面端界面設(shè)計(jì)APP界面設(shè)計(jì)、圖標(biāo)定制用戶體驗(yàn)設(shè)計(jì)、交互設(shè)計(jì)UI咨詢、高端網(wǎng)站設(shè)計(jì)平面設(shè)計(jì),以及相關(guān)的軟件開發(fā)服務(wù),咨詢電話:01063334945。我們建立了一個(gè)微信群,每天分享國(guó)內(nèi)外優(yōu)秀的設(shè)計(jì),有興趣請(qǐng)加入一起學(xué)習(xí)成長(zhǎng),咨詢及進(jìn)群請(qǐng)加藍(lán)小助微信ben_lanlan。

UI 設(shè)計(jì)公司分享:界面設(shè)計(jì)排版全方位指南

藍(lán)藍(lán)設(shè)計(jì)的小編 設(shè)計(jì)管理與成長(zhǎng)

界面設(shè)計(jì)排版是一個(gè)綜合性的藝術(shù)與技術(shù)過程,需要設(shè)計(jì)師深入理解用戶需求、遵循設(shè)計(jì)原則,并不斷實(shí)踐與創(chuàng)新。通過合理運(yùn)用上述的排版要素與技巧,您能夠打造出具有出色用戶體驗(yàn)、美觀且高效的界面設(shè)計(jì)作品,使您的產(chǎn)品在激烈的市場(chǎng)競(jìng)爭(zhēng)中脫穎而出。希望這篇指南能夠?yàn)槟诮缑嬖O(shè)計(jì)排版的探索之路上提供有益的參考與啟發(fā)。

醫(yī)療 UI 設(shè)計(jì)中怎樣的色彩搭配最能舒緩患者情緒?

藍(lán)藍(lán)設(shè)計(jì)的小編 系統(tǒng)UI設(shè)計(jì)文章及欣賞

醫(yī)療 UI 設(shè)計(jì)中的色彩搭配應(yīng)以患者的情緒舒緩為導(dǎo)向,綜合考慮不同色彩的心理暗示和情感共鳴,通過巧妙的組合與運(yùn)用,為患者打造一個(gè)溫馨、寧靜、充滿希望的數(shù)字化醫(yī)療界面環(huán)境,助力他們?cè)卺t(yī)療過程中保持積極的心態(tài),更好地接受治療與康復(fù)。

醫(yī)療 UI 設(shè)計(jì)如何精準(zhǔn)傳達(dá)復(fù)雜的健康數(shù)據(jù)?

藍(lán)藍(lán)設(shè)計(jì)的小編 系統(tǒng)UI設(shè)計(jì)文章及欣賞

用戶測(cè)試與反饋是優(yōu)化醫(yī)療 UI 設(shè)計(jì)中數(shù)據(jù)傳達(dá)效果的重要環(huán)節(jié)。在設(shè)計(jì)過程中,邀請(qǐng)醫(yī)療專業(yè)人員和患者代表進(jìn)行試用,收集他們對(duì)于數(shù)據(jù)理解的困難點(diǎn)和改進(jìn)建議。根據(jù)反饋對(duì)設(shè)計(jì)進(jìn)行反復(fù)調(diào)整,確保不同背景、不同知識(shí)水平的用戶都能夠準(zhǔn)確無誤地接收和理解復(fù)雜的健康數(shù)據(jù)。只有這樣,醫(yī)療 UI 設(shè)計(jì)才能真正發(fā)揮其在醫(yī)療領(lǐng)域中的橋梁作用,提升醫(yī)療服務(wù)的效率和質(zhì)量,為患者的健康保駕護(hù)航。

UI設(shè)計(jì)公司分享:設(shè)計(jì)師為什么也要有產(chǎn)品思維?

藍(lán)藍(lán)設(shè)計(jì)的小編 設(shè)計(jì)思維

產(chǎn)品設(shè)計(jì)師的核心能力已遠(yuǎn)遠(yuǎn)超出了傳統(tǒng)UI/UX設(shè)計(jì)的范疇,它要求設(shè)計(jì)師成為具備綜合設(shè)計(jì)思維、產(chǎn)品思維、全鏈路參與能力、數(shù)據(jù)分析與迭代優(yōu)化能力,以及商業(yè)意識(shí)與項(xiàng)目管理能力的復(fù)合型人才。這一轉(zhuǎn)變不僅是對(duì)設(shè)計(jì)師個(gè)人能力的挑戰(zhàn)與提升,更是推動(dòng)產(chǎn)品創(chuàng)新與市場(chǎng)競(jìng)爭(zhēng)力的關(guān)鍵所在,這也就是我們的核心能力和不可替代性。

UI 色彩與排版秘籍:提升視覺吸引力與信息傳達(dá)效率

藍(lán)藍(lán)設(shè)計(jì)的小編 設(shè)計(jì)管理與成長(zhǎng)

掌握 UI 色彩與排版的秘籍,設(shè)計(jì)師能夠在提升界面視覺吸引力的同時(shí),更精準(zhǔn)地傳達(dá)信息,為用戶打造出優(yōu)質(zhì)的交互體驗(yàn),使產(chǎn)品在競(jìng)爭(zhēng)激烈的市場(chǎng)中脫穎而出。不斷地學(xué)習(xí)、實(shí)踐和探索色彩與排版的創(chuàng)新組合,將為 UI 設(shè)計(jì)注入源源不斷的活力與魅力。

日歷

鏈接

個(gè)人資料

存檔