中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

到目前為止，我們已經了解了足夠多的基礎理論，這些內容可以幫助你更好的理解那些決定著產品用戶體驗的設計決策?，F(xiàn)在，我們所面臨的問題是，在實際項目當中，怎樣做出能夠與競爭對手的產品形成鮮明差異化的設計決策？怎樣才能實現(xiàn)具有突破性的產品概念？本章中，我們將對這些話題進行探討。

我們將要介紹的并非是某種能夠立竿見影的快速指南，你無法在看過這部分內容之后就立刻掌握了其中的“秘訣”。要打造出令人驚嘆的應用，我們仍然要進行大量扎實的工作和不懈的思考，以及在這個過程中對于創(chuàng)造力的探索。你必須下決心在這些方面做到必要的付出，才有可能使自己的產品真正脫穎而出，取得成功。

“令人驚嘆”究竟指什么？

本書一直會提到的“令人驚嘆”究竟是指什么呢？很顯然，這個說法并不是一種可執(zhí)行的設計概念，它是用戶對于那些獨特而具有吸引力的產品所表達出的具有贊許色彩的反饋。

具體到iOS應用的設計當中，“令人驚嘆”的設計要素主要是指那些給用戶帶來的體驗感受可以達到其心中某個“情感閥值”的表現(xiàn)層元素。這個閥值的高低取決于用戶自身，因此，如果對產品的目標用戶人格缺乏清晰的認知，便難以對這個閥值進行準確地預估與判斷。以下三個方面的因素將決定著產品帶來的體驗感受能否跨越用戶心中的“情感閥值”：

• 符合直覺：設計方案必須能夠引導用戶做出最符合直覺的反應行為。
• 差異化創(chuàng)新特征：設計方案中要有明顯的創(chuàng)新特征，至少要讓用戶感受到某些不同尋常的產品體驗。
• 積極響應：設計方案本身要能以積極的姿態(tài)去緩解那些由于差異化所導致的與用戶預期或舊有習慣不符的陌生感。

而“令人驚嘆”的體驗效應以及上述三點推動因素又會受到設計方案自身所具有的一些屬性的影響：

• 界面外觀：也就是設計方案所呈現(xiàn)出來的界面布局結構、渲染方式以及所有相關的靜態(tài)視覺組成元素。
• 交互方式：包括人機物理交互、手勢以及其他常規(guī)的用戶界面輸入方式。
• 視覺交互效果：包括那些能夠為設計方案賦予生機的動態(tài)的界面元素及視覺效果。這些交互效果通常與某些特定的響應行為相關，對設計方案的整體質量也會起到重要的影響作用，甚至包括那些與交互行為沒有直接關聯(lián)的臨時狀態(tài)。

可以說，如果我們能夠在這其中的某一方面做到出類拔萃，那么產品體驗就完全有可能達到令人驚嘆的程度。其實現(xiàn)實當中有不少這方面的例子。你會發(fā)現(xiàn)，某些應用在交互方式和視覺交互效果方面缺乏足夠的創(chuàng)新性與吸引力，但它們的界面外觀卻相當出彩，以至于變相地降低了前兩方面因素在用戶感知當中所造成的負面影響。相反，某些應用也許會采用一種幾乎沒有經過任何修飾加工的最小化設計方案，但在交互方式和視覺交互效果方面卻打造的非常到位，這也同樣會給用戶帶來良好的體驗感知。

當然，僅僅依靠其中某個方面的表現(xiàn)來提升產品整體感知效應的做法是相當有風險的。特別是在iOS當中，這三方面屬性所具有的影響力并不是均等的。漂亮的界面外觀對于多數(shù)iOS應用來說幾乎是一個既定命題，用戶已經很難在這方面產生真正具有突破性的體驗感知了。

所以，能夠對產品體驗的提升產生最大推進作用的仍是交互方式及相關的交互響應行為。正像我們在第三章里了解到的，如今的用戶對于那些能夠帶來創(chuàng)新體驗的應用有著強烈的渴望；要在這方面滿足用戶對于差異化的渴求，我們必須在設計階段對產品的交互方式進行更加深入的探索與分析。

構建交互模型的流程概覽

通過構建交互模型，我們可以對產品的基本交互方式及視覺交互效果進行規(guī)劃。構建交互模型的過程通常包括四個步驟，其中前三步是必要的前期工作，而最后一步則是建模工作本身。聽上去有些費解，不過沒關系，接下來我將對這個流程進行簡要的介紹；在對它們有了大致的了解之后，我們還將對其中每一個步驟進行深入而全面的分析。

1.明確需求

首先，我們要對產品的基本需求有初步的了解。具體的需求內容可以在用戶體驗策略或是正式的需求分析報告當中體現(xiàn)出來。這些信息是所有后續(xù)設計工作的根基，所以我們必須確保需求是足夠明確并且穩(wěn)定的，同時，它還要得到團隊的一致認可。如果你們更加習慣于敏捷開發(fā)，那么需求發(fā)生變動的可能性是相對較大的，不過你至少需要對那些定義了產品基本功能的核心需求進行確認，才可以繼續(xù)接下來的流程。一旦需求確定，我們就可以進入交互建模的下一個環(huán)節(jié)，需求用例與使用場景的構建。

2.定義需求用例與測試腳本

需求用例，特別是那些更具腳本驅動性的需求用例，是整個交互建模過程的重要組成部分。一個好的用例能夠幫助團隊了解到用戶在使用產品時所經歷的大致流程，并對各種需求在這個過程中的實現(xiàn)方式有所認知。有的用例會直接將那些涉及到關鍵交互環(huán)節(jié)的測試腳本敘述出來，并通過這種方式來為我們提供明確的需求指導。不過，無論是否以測試腳本的形式出現(xiàn)，需求用例本身的性質及其在產品概念前期工作當中的作用并不會發(fā)生變化。如果你對自己產品的概念已經有了比較明確的認知，并且清楚它與用戶之間的互動模式，那么你可以在需求用例當中對這些進行詳細地描述，從而為交互建模流程中的其他環(huán)節(jié)提供必要的信息。即便你在當前階段對產品概念的細節(jié)還不能做到心知肚明，那么也不成問題，只要將用戶在使用過程中有可能進行的常見行為描述出來即可。

3.規(guī)劃產品工作流

關于以怎樣的方式規(guī)劃產品工作流的問題，從不同的角度出發(fā)會得到各種不同的答案；其中，每種方式都有各自的目標與價值。站在設計的立場上，我們最關心的是產品的工作流是否符合用戶的決策邏輯，它能否體現(xiàn)出交互過程中的關鍵環(huán)節(jié)，與之相關的功能結構在用戶友好性等方面的表現(xiàn)又如何。這是一種以用戶為中心的規(guī)劃方式，它可以幫助我們通過確立產品的特性與功能這兩者之間的關聯(lián)來定義整個應用的架構。一個經過良好規(guī)劃的產品工作流可以為你的應用提供精準的路線圖，但它不會對任何具體的功能或交互機制做出假設。

4.構建交互模型

這顯然是交互建模流程當中最核心和本質的環(huán)節(jié)。當你明確了應用的基本工作流及各功能之間的關聯(lián)后，就可以進一步去思考應該通過怎樣的交互方式向用戶呈現(xiàn)產品了。

用戶必須通過某些關鍵交互行為，來完成工作流中所定義的典型需求任務，而交互建模正是以這些關鍵交互行為作為基礎，對應用整體的交互模式進行定義的。這其中涉及在不同的用戶界面視覺模態(tài)下對屏幕的實際可用面積進行的管理 (例如應用的布局與功能隨著屏幕方向的調轉而進行相應的調整)、導航結構的呈現(xiàn)方式、基本的操作手勢等等。換句話說，交互建模的過程定義了應用的操作方式，但它不會決定應用具體會做哪些事情。

一套產品工作流往往能衍生出若干數(shù)量的交互模型，它們能夠表現(xiàn)出的交互體驗模式大有不同。關于這一點，我們會在本章后面的內容當中看到一些具體的例子。

對建模流程的深入分析

對建模流程當中的每個環(huán)節(jié)進行了大致的了解之后，我們將要對整個流程進行更加細致和深入的分析，包括對工作流的思考、交互模型的構建方法、相關問題的解決方案，以及怎樣通過具有標志性的交互方式使整個產品的用戶體驗在同類應用當中脫穎而出。

對工作流的思考

對于工作流的規(guī)劃與定義，是產品交互設計工作的精髓之一。我們正是在這個過程中制定了用戶與產品的互動規(guī)則的。很多時候，你只需要在抽象的層面對其進行定義，而不必在意功能細節(jié)或是某些特定的交互方式；而在另外一些情況下，你必須對所有的交互方式、行為事件、狀態(tài)變化等方面的邏輯進行詳細地定義，才能為產品的人機交互方式規(guī)劃出一個最清晰的畫面。

交互模型的構建方法

正如我們在前文中提到的，交互建模用來對應用當中的交互模式進行定義，它同時還詮釋了這些交互模式是以怎樣的方式被整合成為具有高度一致性的、容易被用戶理解的交互模型的。我們曾經在第二章里對iOS交互環(huán)境的概念模型和空間模型進行了解析。其中，交互空間及其三個組成層面的概念共同構成了iOS中的基礎交互模型 (見圖 6-1)。這個例子充分地體現(xiàn)出了交互建模的設計思想所具有的強大力量。

圖6-1 ?iOS空間模型及它的三個層面

圖6-2 ?一個典型的列表

從抽象的層面來說，列表到底是什么呢？列表的基本概念，就是一個由若干可選擇對象所組成的隊列。進一步思考，你還會發(fā)現(xiàn)，其實列表項并非一定要以縱向的方式進行排列，而且每一行也未必只能包含一個列表項。所以我們可以問問自己，對于在實際設計方案當中需要解決的具體問題來說，是否有更好的列表形式可以勝任？關于這個問題的答案通常不是顯而易見的，我們需要思考并嘗試一些不同的方案，看看它們能否帶來有一些意思的變化。如果典型的單列縱向列表無法滿足我們的需求，那么橫向的方案又如何呢？(見圖 6-3)

圖6-3 ?橫向列表

看上去很有趣，不過也許你已經注意到了，在這種模式里，屏幕可視區(qū)域當中的列表項數(shù)量是非常有限的，特別是在豎屏狀態(tài)下。如果不考慮任何上下文環(huán)境，那么這也算不上是很大的問題；但在實際使用當中，如果沒辦法一次看到很多列表項，那么要對整個列表進行快速瀏覽的話，用戶必須頻繁的執(zhí)行滾屏操作。很顯然，這種方式在效率方面存在很大問題。在橫屏狀態(tài)下，情況會相對好些，但仍然不是很理想。

讓我們繼續(xù)擴展思路，看看是否還有其他更加合理的差異化解決方案。如果說單列形式的列表無法令人滿意，那么如果我們將其中的每一行擴展為一個隊列，使整個列表變成網(wǎng)格形式，情況又會如何呢？(見圖 6-4)

圖6-4 ?網(wǎng)格狀的列表模式

事情開始變得有趣了。在這種模式下，我們可以同時看到更多的列表項，相比于傳統(tǒng)的單列縱向列表，這確實是一個不錯的改進。但它所帶來的弊端也是很明顯的，那就是每個列表項的實際尺寸都變小了，這給其中的文本對象造成了很大的局限。不過我們還是可以通過控制文本對象的字號來從一定程度上解決這個問題。

在這組小練習當中，我們僅僅對一個簡單的列表進行了差異化的思考與擴展性的嘗試，就幾乎已經徹底改變了這個對象的基本概念及呈現(xiàn)方式。而實際上，對于這個列表來說，我們能做的還遠不止這些。接下來，讓我們換一個角度，對涉及到列表對象的交互行為進行探索。在iOS當中，我們可以通過上下滾屏來瀏覽一個典型的單列縱向列表，那么這種方式同樣適用于網(wǎng)格狀的列表嗎？(見圖 6-5)

圖6-5 ?縱向滾屏的瀏覽方式應用在兩種列表方案中

完全沒問題。不過必須記得，滾屏瀏覽的方式雖然適合于我們當前的這個特定的案例，但它未必在所有的情況下都適用。要在某種新的界面對象模型當中使用現(xiàn)有的交互方式，你必須做好充分的評估工作。

回到這個例子當中。接下來讓我們對這個網(wǎng)格形式的列表進行一些抽象化的分析。標準的iOS單列縱向列表對象通常是支持滾動操作的，而且滾動的方向僅限于y軸上，因為列表項都是縱向排列在同一列當中的。那么對于擁有兩個維度的網(wǎng)格狀列表來說，滾動的方式能否得到相應的擴展呢？

圖6-6 ?多維滾動與行內滾動

如圖所示，我們可以通過多種方式將滾動行為運用到網(wǎng)格狀的列表當中(見圖 6-6)。通過這一系列的實例，我們可以看出，基于已有的對象模型及交互方式來構建新的概念其實并不是非常困難的事情。列表的例子只是一個起點，你還可以對很多模型和元素進行差異化的改造。這種設計思路可以幫助我們在產品當中打造各種豐富的交互方式。

相關問題的解決方案

我們已經大致了解了應該怎樣從現(xiàn)有的基本概念出發(fā)，來定義全新的交互對象。不過在實際項目當中，我們有可能會在這方面遇到一些潛在的問題，這些問題甚至會導致設計開發(fā)工作進入死胡同。在你的設計方案當中，一些高度定制化的交互模型也許很難被準確地實現(xiàn)出來，而另一方面，你也有可能發(fā)現(xiàn)它們無法很好地被用在產品的其他地方。面對這些情況，你必須掌握一些最基本的解決方法，才能讓自己擺脫困境。

我們曾經在前一章當中了解了一些能夠幫助設計師實現(xiàn)設計方案的相關開發(fā)技術。其中，核心動畫 (Core Animation)為開發(fā)者們提供了一系列強大的工具，用于將高度定制化的動畫效果整合到交互元素當中。動畫的概念，不僅僅是隨便為一些元素添加有趣的視覺效果這么簡單；對于交互設計來說，它更是一種用來與用戶進行互動溝通的強大工具。

在最基礎的層面，動畫是一種能夠使交互對象的某種屬性隨著時間而發(fā)生變化的機制?！皶r間”是這個概念當中的核心，它可以幫助我們解決交互設計當中的一些關鍵性的問題。

當你發(fā)現(xiàn)交互環(huán)境當中的空間過于有限的時候，以時間概念為主導的解決方案往往可以發(fā)揮巨大作用。要在狹小的界面當中內呈現(xiàn)大量的信息是很困難的，通常只會出現(xiàn)兩種情況，要么是通過縮減字號來提高單位面積當中的內容密度，要么保持字號不變而對內容進行截斷處理。這兩種方式都是有很大弊端的。高密度的信息很難被用戶良好的閱讀和理解，而經過截斷處理的內容又是不完整的，難以保證信息的準確傳達。

我們可以通過之前列表練習當中的實例來直觀地理解這一點。當我們以網(wǎng)格的形式改造了單列縱向列表之后，如果列表項的標題文字變長，我們就必須對字號進行必要的調整，才能使內容完整地呈現(xiàn)給用戶，正如我們可以在下圖左側屏幕當中看到的。反之，如果不縮減字號，只進行截字處理，那么最終的效果就會是下圖右側屏幕所展示的樣子：

圖6-7 ?縮減字號與截斷文字的效果對比

那么，以時間概念為主導的方案能否幫助我們解決這個問題呢？我們不妨在這里回憶一下，過去那些小屏幕手機在這方面通常是怎么做的，也許我們可以從它們身上找到一些答案。

圖6-8 ?將被截斷的文字以跑馬燈的形式完整的呈現(xiàn)出來

跑馬燈效果在過去的那些設備當中是非常流行的。在這種解決方案里，“時間”扮演著重要的角色，因為文字會以動畫的方式逐步進入可視區(qū)域當中，隨著文字從右向左的行進，用戶最終會閱讀到完整的信息(見圖 6-8)。在這個實例當中，“時間”作為一個額外的維度，可以在某種程度上幫助我們解決問題。

這種方式確實適用于一些特定的情況，但出于某些原因，它依然無法徹底解決網(wǎng)格布局當中文字空間限制問題。不妨設想，當這個界面加載完成的時候，每一個格子當中的標題文字都在滾動，這種高度密集的文字動畫效果對于用戶來說是難以接受的。你很難將注意力集中在某個單獨的格子當中，而且必須對時間進行準確的把握，才能在最短的時間內，也就是一個循環(huán)周期當中完整的閱讀一串文字，否則你所能看到的仍然是一些被截斷的內容。我們已經在解決方案里加入了以時間概念為主導的動畫效果，那么這個模型當中還缺少哪些關鍵元素呢？答案就是用戶控制。

用戶控制的概念是很顯而易見的。當前話題的重點在于怎樣創(chuàng)建交互設計解決方案，而所謂“交互”，自然離不開來自用戶的某種控制行為。不過在這里，我們需要從“狀態(tài)”的角度來思考用戶控制這個概念。

對于交互模型來說，“狀態(tài)”是一個非常重要的概念，它同樣可以幫助我們解決在設計過程中遇到的一些棘手的問題。與“時間”類似，以狀態(tài)概念為主導的解決方案通?？梢酝瓿赡切τ陟o態(tài)方案來說幾乎是不可能實現(xiàn)的任務。從某種程度上講，它們都可以從另外一個維度上改變交互模型當中的界面元素及信息內容。

狀態(tài)究竟是什么呢？它所指代的是當某個交互對象正在被用戶觀察或是被某種控制機制管理的時候所體現(xiàn)出來的屬性和特征。

到目前為止，我們所創(chuàng)建出的網(wǎng)格列表交互模型只擁有唯一的一種狀態(tài)。也就是說，它只有一個形態(tài)，目前還不會發(fā)生變化。如果我們可以控制它的狀態(tài)，在必要的時候對交互模型的結構進行調整，那么就可以真正地解決掉我們之前所遇到的問題。

現(xiàn)在可以將狀態(tài)的概念與用戶控制行為聯(lián)系起來了。前文當中之所以會提到要從“狀態(tài)”的角度來思考用戶控制，是因為我們可以通過用戶輸入機制來改變界面交互對象的狀態(tài)。

那么，我們應該怎樣從用戶控制與狀態(tài)調整的角度來解決網(wǎng)格列表交互模型當中的問題呢？當前的狀況是，我們認為網(wǎng)格狀的列表非常符合差異化的交互體驗設計思路，而且在這種模式下，用戶可以同時看到很多列表項；但同時，每個列表項的尺寸都變小了，狹小的空間無法完整地將其中的文本對象呈現(xiàn)出來。我們試著通過以時間概念為主導的方案，即跑馬燈的動畫效果來解決這個問題。雖然這種方法確實使文字內容擺脫了空間的限制，但從界面整體的角度來看，動畫效果的密度過大，視覺體驗非常糟糕。那么接下來，就讓我們一同看一看，當用戶控制及狀態(tài)的概念被整合進當前的交互模型之后，事情又會發(fā)生怎樣的變化。

圖6-9 ?通過輕掃操作，將被遮擋住的文字拖出

如圖所示(圖 6-9)，我們可以保持格子當中的文字靜止不動，由用戶通過輕掃操作將所需的文字對象拖出被遮擋的區(qū)域。這種方式將直接操縱的理念融入到了交互模型當中，我們就不必讓用戶面對著充滿文字動畫效果的界面了。他們可以在覺得需要的時候對任意一個格子進行交互操作，瀏覽其中的完整內容。

在這種解決方案當中，我們?yōu)槲谋緦ο筚x予了一定的交互行為，這是相對簡單的一種方式。我們還可以擴展一下思路，去嘗試一些更具創(chuàng)意的方式。除了文本對象以外，我們其實還可以通過用戶的控制行為使整個格子單元的狀態(tài)發(fā)生變化。

圖6-10 ?通過雙指張開的操作來擴展格子，以獲取完整信息；結束操作后格子自動收回

我們可以讓用戶通過雙指張開的操作將網(wǎng)格單元進行擴展，從而獲取完整的文字信息；當手指離開屏幕之后，格子便會自動恢復到默認的狀態(tài)。只需要一個簡單的手勢，我們就可以人為地創(chuàng)造出更大的空間，這使得整個交互模型具有了高度的動態(tài)性 (見圖 6-10)。通過這種方式，不僅文字內容變得完整可讀，而且由于整個格子的空間都被擴大，我們甚至可以在其中加入更多有價值的信息。

曾經一個最普通的單列縱向列表，到目前儼然已經成為在用戶體驗方面具有高度潛力的交互模型了。交互模型在這方面所體現(xiàn)出的擴展性具有很高的實際運用價值。那么，除了能夠在某種特定的需求上下文當中提升對象的交互體驗以外，這種擴展性如何幫助我們實現(xiàn)更高層次的設計目標呢？

首先我們需要知道一點，在打造交互模型的過程中，我們不能對其進行子虛烏有的構想。交互模型永遠是一個完整系統(tǒng)當中的一部分，產品最終帶給用戶的交互體驗必然是一種整體效應的體現(xiàn)。如果你相信設計方案當中的某個交互模型所具有的強健性足以驅動一款產品，那么你考慮清楚應該以怎樣的方式將它整合到產品的其它地方，才能在整體層面上實現(xiàn)最佳的體驗效應。這也正是我們在前文當中提到交互模型的彈性與擴展性時所要表達的意思。如果你所打造的各種交互模型確實只能適用于各自的功能情景，而無法很好的運用在產品當中的其他地方，那么你至少要在頭腦中建立一個更龐大完整的產品級別的交互模型，其中包含著局部當中的各個獨立的交互模型；這個大模型必須為用戶提供清晰并且一致的交互體驗。然而另一方面，一個擁有太多獨特交互模型的應用最終只會導致用戶產生迷惑和挫敗的感覺，這更是完全地背離了我們的初衷。在這種情況下，其實談不上任何模型的概念了，整個產品只是一堆怪異交互模式的組合。

要避免這種情況的發(fā)生，我們在設計工作中必須始終站在全局的角度對每一個交互模型的適應能力進行考慮。這是一種系統(tǒng)化的設計思路，你需要讓自己的思維模式上升到抽象的層面，才能對某個交互模型在上下文環(huán)境當中的適應能力進行充分地認知。不要只看某個交互模型能夠解決眼下的哪些局部問題，而是要判斷它所勾畫出的交互模式能否在應用中的其他地方同樣適用，有沒有可能成為某種具有普遍適用性的多用途交互行為模板。

一款應用產品當中使用到的交互類型越少，其交互模型的健壯性就越強。少即是多的原則在移動應用的設計工作當中是絕對適用的。要以降低用戶的認知負荷為目標，盡可能使用那些用戶已經在你的產品中接觸過并理解了的交互模式。

當然，你也不必為了減少交互類型而將某些模式強加在那些確實不適用的地方。簡單一致的交互方式固然是我們所追求的，但同時，你也要了解產品中的哪些地方的確需要相對獨特的解決方案，否則在這些地方嘗試通過具有普遍性的交互模式進行處理的話只能是浪費時間?？梢哉f，如果某種交互方案在你看來并不是非常明確和易用的，那么在用戶看來多半也會如此。

也許你已經注意到了，我們一直在不同的地方反復使用著“交互”、“行為”和“模式”這三個概念。在本書所討論的話題當中，這些概念各自包含哪些含義，它們之間又具有怎樣的關聯(lián)呢？我們在這里簡要地了解一下：

• 交互：單元級的人機互動行為，例如點擊一個按鈕或是輕掃屏幕當中的某個區(qū)域。它的本質是用戶在系統(tǒng)的某種提示下所做出的輸入操作。
• 行為：包括用戶的輸入操作以及相應的系統(tǒng)回饋方式。它是“交互”的一種整體化可感知效應，由系統(tǒng)環(huán)境呈現(xiàn)出來。
• 模式：若干“行為”在某種特定的組織方式下共同作用所產生的累加效應。

你可以在其中任意一個層面上對交互模型的一致性進行規(guī)劃。你可以從宏觀的角度出發(fā)，首先思考具有全局性的交互模式，也可以從細處入手，定義那些相對獨立的局部交互模型，并對它們的交互體驗一致性進行持續(xù)的考量。你在交互模型相關工作當中所做的規(guī)劃，將決定著最終的產品能否以正確的方式解決某些特定的需求。

本章未完待續(xù)，博主C7210出去溜達幾日先。