外行人對(duì)交互設(shè)計(jì)的第一印象是什么？繪制線框？起草？

實(shí)際上，每個(gè)人都認(rèn)為交互設(shè)計(jì)師的日常工作是線框，表面上可以理解。

事實(shí)上，交互設(shè)計(jì)師所做的不止于此。更深入的是，信息架構(gòu)，接口和流程都是設(shè)計(jì)師需要考慮的問題。接下來，我想談?wù)勎依斫獾慕换ピO(shè)計(jì)。

/

交互設(shè)計(jì)中最重要的兩個(gè)因素：信息與安全;相互作用

1.信息

人們每天都要面對(duì)如此多的信息，并在雜亂的信息中過濾掉有價(jià)值的信息，呈現(xiàn)給用戶，幫助用戶做出選擇，并引導(dǎo)用戶完成任務(wù)。信息過濾直接影響用戶的使用，當(dāng)用戶需要時(shí)不可能提供有用的信息，這將使任務(wù)變得不可能。因此，信息是交互設(shè)計(jì)者需要關(guān)注的第一個(gè)元素。

2.互動(dòng)

獲得信息后，您需要設(shè)計(jì)用戶如何與此信息進(jìn)行交互。信息的分類和布局將影響用戶和信息之間的交互。在用戶獲得信息后，他會(huì)做出響應(yīng)并采取行動(dòng)。應(yīng)用程序還需要提供足夠的反饋來幫助用戶完成任務(wù)。

/

以上兩個(gè)元素反映在用戶的直觀感受上，這意味著它通常在用戶界面中表達(dá)。我們可以稱之為“可見的交互設(shè)計(jì)”。

具體形式包括：

信息架構(gòu)：對(duì)過濾后的信息進(jìn)行排序，通過頁面?zhèn)鬟f信息，并規(guī)劃信息的級(jí)別（頁面）

界面設(shè)計(jì)：頁面上的布局信息

流程設(shè)計(jì)：連接任務(wù)中涉及的頁面信息，使任務(wù)形成線性流關(guān)系

以上三個(gè)關(guān)鍵點(diǎn)是交互設(shè)計(jì)者的基本要求。在許多情況下，非專業(yè)人士也可以做7788，但仍然有一部分交互設(shè)計(jì)，這是不直觀的。也許用戶會(huì)稍微感受到它。但他總是讓用戶更隨意地使用它。我們可以稱之為“隱形交互設(shè)計(jì)”。這些不可見的交互設(shè)計(jì)也很容易被主要交互設(shè)計(jì)師忽視。

/

移動(dòng)互聯(lián)網(wǎng)如今正在迅速發(fā)展，移動(dòng)產(chǎn)品更專注于這些無形的互動(dòng)設(shè)計(jì)。因?yàn)橐苿?dòng)應(yīng)用程序的使用場景，網(wǎng)絡(luò)環(huán)境和使用心態(tài)與使用Web產(chǎn)品時(shí)的用戶大不相同。因此，在了解這些不可見的交互設(shè)計(jì)之前，您需要對(duì)移動(dòng)應(yīng)用程序場景有所了解。

1.使用場景

使用移動(dòng)產(chǎn)品的用戶可以在有許多戶外用戶的公共場所使用它。此時(shí)，應(yīng)特別注意移動(dòng)應(yīng)用程序設(shè)計(jì)的隱私性。

用戶可以在家中，床上，上廁所，各種姿勢使用本產(chǎn)品，因此要特別注意互動(dòng)的便利性和容錯(cuò)性

2.網(wǎng)絡(luò)環(huán)境

網(wǎng)絡(luò)環(huán)境是“隱形交互設(shè)計(jì)”中非常關(guān)鍵的一點(diǎn)。用戶將在2G，3G，wifi甚至無網(wǎng)絡(luò)中使用該產(chǎn)品，因此針對(duì)各種網(wǎng)絡(luò)環(huán)境的合理交互設(shè)計(jì)是移動(dòng)產(chǎn)品交互設(shè)計(jì)者的首要任務(wù)

3.使用心態(tài)

該產(chǎn)品用于解決用戶的問題，移動(dòng)產(chǎn)品是用戶的個(gè)人工具。當(dāng)用戶需要它時(shí)，它可以立即開始工作。它需要快速，直接和有效，用戶不喜歡等待。一些研究結(jié)果表明：

/

在移動(dòng)產(chǎn)品的特殊環(huán)境中，“隱形交互設(shè)計(jì)”比網(wǎng)絡(luò)產(chǎn)品更重要，特別是對(duì)于網(wǎng)絡(luò)環(huán)境和用戶等待體驗(yàn)需要特別關(guān)注

以下討論將討論“隱形交互設(shè)計(jì)”

一般來說，它可歸納為三個(gè)主要觀點(diǎn)：

1.加載機(jī)制

2.刷新機(jī)制

3.緩存機(jī)制

/

/

加載機(jī)制

通常，我們使用的大部分內(nèi)容都是網(wǎng)絡(luò)應(yīng)用，他的工作原理就是這樣

用戶在客戶端界面上操作，客戶端向服務(wù)器發(fā)送請求，服務(wù)器處理請求，將數(shù)據(jù)返回給客戶端，并將其顯示給用戶

其中，客戶端無法感知客戶端與服務(wù)器之間的交互過程，他確實(shí)需要時(shí)間。在不同網(wǎng)絡(luò)環(huán)境中花費(fèi)的時(shí)間也將不同。如何在此期間使用戶友好？經(jīng)驗(yàn)？此時(shí)“加載過程”起作用。

/

加載過程的關(guān)鍵可以概括為：

1.讓用戶認(rèn)識(shí)到產(chǎn)品正在為他努力

2.讓用戶有基本的心理期望以及等待需要多長時(shí)間

3.讓用戶在無聊的等待中獲得更多樂趣

/

進(jìn)度條是加載過程的一個(gè)很好的設(shè)計(jì)

動(dòng)態(tài)加載進(jìn)度表明產(chǎn)品正在運(yùn)行，整體進(jìn)度和當(dāng)前進(jìn)度可以讓用戶及時(shí)了解情況，以便用戶可以根據(jù)這些信息預(yù)測時(shí)間，并有心理預(yù)期

有趣的進(jìn)度條設(shè)計(jì)或在加載過程中顯示一些功能介紹技巧（通常用于游戲）可以有效減少用戶等待的焦慮，并能有效提高用戶容忍度

/

進(jìn)度條是Web產(chǎn)品時(shí)代的產(chǎn)物，還有另一個(gè)加載圖標(biāo)的加載設(shè)計(jì)

由于移動(dòng)產(chǎn)品請求的數(shù)據(jù)量不大，因此進(jìn)度條趨于即時(shí)完成。在這種情況下，加載設(shè)計(jì)得到簡化，許多移動(dòng)產(chǎn)品使用加載圖標(biāo)來指示加載過程。 >

以上是兩種常用的加載方法。以下描述了它們與移動(dòng)產(chǎn)品結(jié)合使用

/

頁面加載機(jī)制

移動(dòng)產(chǎn)品的信息由頁面承載，頁面的加載方案設(shè)計(jì)是交互設(shè)計(jì)者面臨的重要問題。

方案一：單頁面整體加載

這種加載相對(duì)簡單，通常在頁面內(nèi)容相對(duì)單一時(shí)使用，因此在直接加載所有數(shù)據(jù)后顯示內(nèi)容。

單頁加載失敗狀態(tài)也可以更好地處理

/

方案二：單頁面分塊加載

該方案的特點(diǎn)是，它允許用戶在這個(gè)漸進(jìn)的過程中逐漸看到內(nèi)容并減少用戶的焦慮

其中，它可以分為相互關(guān)聯(lián)的模塊，首先加載父內(nèi)容，然后加載子內(nèi)容

例如，您可以先加載列，然后加載每列的內(nèi)容

模塊之間沒有絕對(duì)的相關(guān)性，每個(gè)模塊的內(nèi)容可以獨(dú)立加載，并根據(jù)請求的速度單獨(dú)顯示。這種處理有機(jī)會(huì)讓用戶在不完全刷出數(shù)據(jù)的情況下找到他們需要的功能，例如公眾評(píng)論，淘寶客戶端

如果框架是固定的并且內(nèi)容更新，則可以首先顯示框架，然后可以加載和顯示每個(gè)模塊的數(shù)據(jù)，例如各種iOS引入應(yīng)用程序，云音樂

這個(gè)子模塊加載需要特別注意加載失敗的狀態(tài)。畢竟，每個(gè)模塊都會(huì)提示加載失敗。單擊并重試是一件非常令人沮喪的事情。它可以根據(jù)信息的優(yōu)先級(jí)決定哪些數(shù)據(jù)失敗。哪些數(shù)據(jù)使用失敗提示

/

方案三：跨頁面加載

父頁面＆amp;子頁面或同一個(gè)應(yīng)用程序中，頁面間字段可以重復(fù)使用，加載子頁面時(shí)無需重新加載新數(shù)據(jù)

/

方案四：預(yù)加載

該加載方法的特征在于在加載頁面內(nèi)容時(shí)預(yù)測用戶的下一行為，并加載他接下來需要使用的頁面的內(nèi)容，以便他可以在不加載的情況下立即獲得下一操作中的信息。等待。

預(yù)加載為用戶提供無縫的產(chǎn)品體驗(yàn)，使用戶在使用產(chǎn)品的過程中更加流暢和不間斷。

具體的例子是：

瀏覽地圖集時(shí)，當(dāng)看到第一張圖片時(shí)，第二張，第三張和第四張圖片會(huì)自動(dòng)加載到后臺(tái)。當(dāng)用戶完成瀏覽第一張圖片并切換到第二張圖片時(shí)，將沒有等待加載。過程

瀏覽新聞列表時(shí)，每個(gè)新聞的內(nèi)容都在后臺(tái)預(yù)先加載，當(dāng)用戶選擇觀看某個(gè)新聞時(shí)，可以立即讀取內(nèi)容

/

但是，這種解決方案需要面對(duì)很多問題。最直接的是流量問題，因?yàn)樗鼤?huì)自動(dòng)耗盡許多用戶可能根本不使用的數(shù)據(jù)流量，因此通常，這種加載模式可以在wifi環(huán)境中設(shè)置?；蛘咴O(shè)置加載規(guī)則，只預(yù)加載主內(nèi)容，并且當(dāng)用戶真正使用它時(shí)可以加載一些輔助內(nèi)容。例如，當(dāng)預(yù)加載新聞主體時(shí)，只能加載文本信息，并等待用戶輸入圖像信息。內(nèi)部頁面已加載。預(yù)加載和塊加載的這種組合也常用于各種場景中。

此外，預(yù)加載也需要時(shí)間。他只是不在客戶端向用戶顯示它，它在后臺(tái)默默運(yùn)行。需要特別考慮用戶在不加載用戶的情況下使用信息的情況。因此，在進(jìn)行預(yù)加載設(shè)計(jì)時(shí)，需要考慮另一種適合這種情況的正常加載方法。

需要根據(jù)具體場景設(shè)置預(yù)加載，設(shè)置信息優(yōu)先級(jí)，綜合考慮各類信息的具體規(guī)模和流量，并考慮整體預(yù)加載方法。這些需要仔細(xì)分析和思考。

隨著網(wǎng)絡(luò)環(huán)境的發(fā)展，預(yù)加載將成為未來產(chǎn)品的通用加載方法，用戶提供的無縫使用體驗(yàn)大大提高了產(chǎn)品的可用性。

/

操作加載機(jī)制

除了需要加載頁面信息外，頁面內(nèi)的操作還需要向服務(wù)器發(fā)送請求記錄

方案一：加載層

執(zhí)行操作后，彈出模態(tài)提示圖層以通知用戶它正在加載。

模態(tài)提示主要是為了防止用戶在進(jìn)程中執(zhí)行其他操作，從而導(dǎo)致當(dāng)前加載錯(cuò)誤。由于模態(tài)提示，并且由于網(wǎng)絡(luò)原因可能會(huì)長時(shí)間加載，因此建議提供“關(guān)閉”操作，中止此加載，并恢復(fù)應(yīng)用程序的可用狀態(tài)。當(dāng)加載失敗時(shí)，可以將當(dāng)前浮動(dòng)層更改為失敗提示。

模態(tài)提示層是最安全的方式，但它會(huì)在使用過程中給用戶帶來中斷的感覺。

/

方案二：控件自身加載狀態(tài)

此方法將操作負(fù)載的狀態(tài)與控件的樣式組合在一起。控制操作后，控制轉(zhuǎn)換為加載狀態(tài)，控制不能重復(fù)。

由于此加載模式是控件自身的狀態(tài)而不影響其他操作，因此用戶可以在頁面上執(zhí)行其他操作，這可能會(huì)同時(shí)導(dǎo)致多個(gè)請求，從而增加加載失敗的風(fēng)險(xiǎn)。這也是方式。缺點(diǎn)，但這種極端情況很少發(fā)生。請求失敗后，Toast提示符可用于通知用戶失敗的原因。

/

方案三：后臺(tái)加載

在用戶操作之后，客戶端立即成功地反饋操作，然后將請求放入后臺(tái)以與服務(wù)器交互。用戶不需要理解該過程，也不需要等待。一般情況下，經(jīng)驗(yàn)非常好。

但是，在極端情況下，會(huì)出現(xiàn)一些莫名其妙的情況。由于請求記錄在后臺(tái)并與服務(wù)器交互，因此實(shí)際請求成功。客戶沒有解釋。所有這些都成功顯示。這將使用戶認(rèn)為操作成功。然而，實(shí)際上，下次我看到它時(shí)，我發(fā)現(xiàn)沒有成功。因此，需要根據(jù)具體使用場景對(duì)該加載方法進(jìn)行加權(quán)。對(duì)于某些重要操作，建議使用模態(tài)加載。對(duì)于一些小的操作，例如喜歡，訂閱和注意，可以采用后臺(tái)加載方法。

/

/

刷新機(jī)制

刷新機(jī)制也是設(shè)計(jì)人員可以輕易忽略的問題，合理的刷新機(jī)制可以使產(chǎn)品使用更順暢

通常，有三種刷新機(jī)制：

方案一：手勢刷新

使用手指在屏幕的左側(cè)和右側(cè)繪制筆劃以達(dá)到刷新的目的，包括一些自定義手勢的瀏覽器產(chǎn)品，如水平折疊鉤，以刷新

最常見的下拉刷新也是一種手勢刷新

/

方案二：點(diǎn)擊刷新

通過單擊按鈕可以實(shí)現(xiàn)刷新數(shù)據(jù)的目的，但刷新按鈕的存在已經(jīng)成為過時(shí)的性能。而且，很難為移動(dòng)電話的界面上的刷新按鈕騰出空間。但是為了避免形式主義，只需使用正確的本質(zhì)是設(shè)計(jì)的本質(zhì)，這種刷新方案仍然是按需使用的。

/

方案三：自動(dòng)刷新

根據(jù)設(shè)置的規(guī)則，例如時(shí)間，事件規(guī)則自動(dòng)獲取新數(shù)據(jù)到服務(wù)器并替換舊數(shù)據(jù)。需要根據(jù)場景考慮使用自動(dòng)刷新。

場景1——對(duì)于經(jīng)常更新的內(nèi)容和時(shí)間敏感的內(nèi)容，如果用戶未在設(shè)定的時(shí)間使用它，您可以考慮自動(dòng)刷新下一個(gè)內(nèi)容，并將新內(nèi)容推送給用戶

與微博類似，新聞，如時(shí)間敏感的產(chǎn)品，用戶不會(huì)在24小時(shí)內(nèi)打開產(chǎn)品，然后幫助用戶在下次打開時(shí)自動(dòng)更新時(shí)間線

場景2——對(duì)于相對(duì)穩(wěn)定且不經(jīng)常更改數(shù)據(jù)的頁面，請考慮設(shè)置時(shí)間規(guī)則以靜默更新數(shù)據(jù)并替換后臺(tái)中的舊數(shù)據(jù)

/

/

緩存機(jī)制

在網(wǎng)絡(luò)時(shí)代經(jīng)常聽到“緩存”這個(gè)詞，但他的重要性在移動(dòng)產(chǎn)品中得到了很好的重視

解釋緩存和緩存的作用的圖片

“Cache”是保存已經(jīng)加載的數(shù)據(jù)，當(dāng)下次需要重用時(shí)，它不需要加載服務(wù)器并直接獲取本地?cái)?shù)據(jù)

我理解的“緩存”可以分類如下

臨時(shí)緩存通常在功能頁面中用于保存每列的緩存。在同一個(gè)函數(shù)中，子函數(shù)被分成多列，每個(gè)選項(xiàng)卡列下的內(nèi)容可以保存為此用途中的臨時(shí)緩存。在此函數(shù)中，列被切換，無需重新加載數(shù)據(jù)，使用緩存。顯示。對(duì)于用戶，用戶已實(shí)現(xiàn)無縫切換瀏覽。對(duì)于服務(wù)器，數(shù)據(jù)很少在短時(shí)間內(nèi)更新，因此一般來說，它可以滿足用戶的正常需求并獲得出色的體驗(yàn)

臨時(shí)緩存清理機(jī)制是：退出功能模塊將清除以前的緩存。換句話說，下次進(jìn)入功能模塊時(shí)，需要再次檢索數(shù)據(jù)

很多時(shí)候我們使用臨時(shí)緩存，因?yàn)樾畔⒄娴牟荒敲粗匾?，我們不需要一遍又一遍地檢查它。對(duì)于我們經(jīng)常使用且經(jīng)常需要反復(fù)查看的信息，我們將使用固定緩存在本地保存。下次瀏覽時(shí)，無需再次從服務(wù)器請求數(shù)據(jù)。

它被細(xì)分為可手動(dòng)清理的緩存和無法手動(dòng)清理的緩存

第一個(gè)是我們最常用的緩存，幾乎所有產(chǎn)品都使用它。通常，用戶瀏覽文章，并且?guī)熘屑虞d的數(shù)據(jù)以此形式在本地緩存?；仡櫛疚暮蛨D庫時(shí)，您無需加載它。用戶還可以手動(dòng)清理這些緩存并釋放空間。

對(duì)于某些特殊情況，例如一些相對(duì)固定的數(shù)據(jù)，我們不希望從一開始就將其打包到應(yīng)用程序中，這將占用太多容量，從而導(dǎo)致大包，并且我們不想加載這些每次進(jìn)入頁面進(jìn)入服務(wù)器。信息，我該怎么辦？解決方案是我們總是只能加載本地一次，因此安裝包不會(huì)很大，以后也不會(huì)加載。

例如，一些頁面的背景圖像相對(duì)不經(jīng)常被替換，因此當(dāng)用戶首次進(jìn)入頁面時(shí)，加載背景圖像并在本地保存。此緩存不可清除。下次進(jìn)入頁面時(shí)，將讀取本地緩存顯示。正好。

這種緩存方案被謹(jǐn)慎使用，因?yàn)閳鼍疤俣疫€沒有開發(fā)具體的使用場景。

/

對(duì)于本地存儲(chǔ)的這些緩存，它將占用空間。手機(jī)的容量有限。產(chǎn)品如何清理緩存？

大家都知道有手動(dòng)清潔。通常，應(yīng)用程序?qū)⑻峁┣宄霸O(shè)置”中的緩存的功能，并通過單擊釋放空間。此外，該應(yīng)用程序最好設(shè)計(jì)一個(gè)自動(dòng)清理機(jī)制。

該機(jī)制可以在兩個(gè)維度上設(shè)計(jì)。

時(shí)間

通過設(shè)置固定時(shí)間或根據(jù)用戶的使用期靈活設(shè)置時(shí)間來清除緩存。每個(gè)產(chǎn)品的場景都不同，用戶的頻率也不同。設(shè)置此機(jī)制時(shí)，需要結(jié)合實(shí)際情況加以考慮。

容量

通常，設(shè)置容量上限，堆棧設(shè)計(jì)原則用于緩存清理，溢出堆棧的舊數(shù)據(jù)自動(dòng)清除

/