交互設計 - 用戶體驗【摘】

熟記在心：

用戶體驗的原則

https://www.google.com.hk/search?q=%E7%94%A8%E6%88%B7%E4%BD%93%E9%AA%8C%E7%9A%84%E5%8E%9F%E5%88%99&oq=%E7%94%A8%E6%88%B7%E4%BD%93%E9%AA%8C%E7%9A%84%E5%8E%9F%E5%88%99&aqs=chrome..69i57j69i65l3j69i60j69i61.3347j0j7&sourceid=chrome&espv=210&es_sm=122&ie=UTF-8 

 

 

交互設計

又稱互動設計，(英文Interaction Design, 縮寫 IxD 或者 IaD),是定義、設計人造系統的行爲的設計領域。
人造物，即人工製成物品，例如，軟件、移動設備、人造環境、服務、可佩帶裝置以及系統的組織結構。

交互設計在於定義人造物的行爲方式(the "interaction",即人工製品在特定場景下的反應方式)相關的界面。

交互設計師首先進行用戶研究相關領域，以及潛在用戶，設計人造物的行爲，並從有用性，可用性和情感因素（usefulness, usability and emotional）等方面來評估設計質量。

（關鍵字：有用、可用、易用）

 

交互設計的通常步驟：

1、用戶調研：經過用戶調研的手段（介入觀察、非介入觀察、採訪等），交互設計師調查瞭解用戶及其相關使用的場景，以便對其有深入的認識（主要包括用戶使用時候的心理模式和行爲模式），從而爲後繼設計提供良好的基礎。

2、概念設計：經過綜合考慮用戶調研的結果、技術可行性、以及商業機會，交互設計師爲設計的目標建立概念（目標多是新的軟件、產品、服務或者系統）。整個過程可能來回迭代進行屢次，每一個過程可能包含頭腦風暴、交談（無保留的交談）、細化概念模型等活動。

3、建立用戶模型：基於用戶調研獲得的用戶行爲模式，設計師建立場景或者用戶故事或者storyboard來描繪設計中產品未來可能的形態。一般，設計師設計人物誌(persona)來做爲建立場景的基礎.

4、建立界面流程：一般，交互設計師採用wireframe來描述設計對象的功能和行爲。在wireframe中，採用分頁或者分屏的方式（夾帶相關部分的註解），來描述系統的細節。界面流圖主要用於描述系統的操做流程。

5、開發原型以及用戶測試：交互設計師經過設計原型來測試設計方案。原型大體可分三類：功能測試的原型，感官測試原型以及實現測試原型；總之，這些原型用於測試用戶和設計系統交互的質量。原型的能夠是實物的，也能夠是計算機模擬的；能夠是高度仿真的，也能夠是大體類似的。

 

交互設計的原則:

認知心理學爲交互設計提供基礎的設計原則。這些原則包括心智模型（mental model），感知/現實映射原理（mapping），比喻（metaphor）以及可操做暗示（affordance）。

 

應用領域：

交互設計師一般在以下領域活動：軟件界面設計、信息系統設計、網絡設計、產品設計、環境設計、服務設計以及綜合性的系統設計。

 

 

 

 

人機交互norman模式：

Norman的交互模式是人機交互領域最有影響力的一種模式了，一般被區分紅七個

①　訂立目標

②　組成意圖

③　標明行動順序

④　運行

⑤　觀察系統

⑥　詮釋系統狀態

⑦　評估

其實以電腦而言，電腦交互主要意義是以用戶爲考量，而不是從設計者的概念模型去切入，如何讓用戶能控制系統的順序、速度，怎麼注意信息，都是人機交互中所關心的。人機交互的關鍵在於用戶瞭解了電腦能替咱們作些什麼，及如何處理信息，咱們就可將大部份時間放在「人」的身上，而不是技術領域，因此一個成功的交互係指人們告訴電腦如何去工做，而不是在技術上打轉。

電腦界面的設計不光是單向的，而是設計者必須重視用戶的回饋，而且進行調整，運用適當的設計，好比美工圖案菜單或是簡易的操做，讓用戶能夠輕鬆的知足本身的需求，有效率的運行工做，才能讓機器發揮最大的功能。

 

概念模型 

產品的概念模型 === 用戶的心智模型

設計者或其餘相關工程人員，所共同設計的操做接口稱爲概念模型。用戶並沒有法直接與設計者進行對話，也鮮少經過說明書準確而有效地瞭解設計者的概念；經過與接口的交互，進而對該設計產品的功能及操做所造成的瞭解，則稱爲用戶對於該產品所造成的心智模型。通常而言，用戶的心智模型是在使用中天然逐步造成的，同時，藉由與系統不斷地交互，用戶會不斷修正其心智模型。若是到了最後，用戶的心智模型與設計師的概念模型能一致或至關接近，那麼，接口設計就算是至關成功了。

概念模型可分爲依據活動所設計或對象所設計的兩種導向。想要設計出具備使用性的接口，必需要了解活動的類型，以及人們在目前的工具中發生了什麼問題。

 

活動型概念模型

根據活動所設計的概念模型可分爲四類:

①　指令型（Instructing） 一個指令一個動做，簡單有效率，例如DOS操做系統及word。

②　對話型（Conversing） 系統與用戶進行對話，雙向交互，但容易發生系統誤解用戶的情況，或是形成電話語音系統單向交互的問題。

③　操做導航型（Manipulating & Navigating） 讓用戶用最天然的直覺去操做接口，如蘋果開創的圖形化操做系統，還有電腦輔助設計系統都屬此類型的設計。

④　搜索瀏覽型（Exploring & Browsing） 用戶依此係統搜索信息，如google等搜索引擎及門戶網站。

 

對象型概念模型

面向對象的概念模型將重點放在處於某些特定背景情境下使用的特定對象，它每每與其在現實生活中的原型極爲相似。

 

 

用戶體驗（英語：User experience Design簡寫爲UX Design） 是一個測試產品滿意度與使用度的詞語，多是基於西方產品設計理論中發展出來的。

此流程完整的包括了有目標用戶設定，滿意度的範圍和主題設定，用戶需求的功能，交互研究，系統反饋和最終的報告與成果。

 

 

 

參考維基的關鍵詞條：

交互設計：

http://zh.wikipedia.org/wiki/%E4%BA%A4%E4%BA%92%E8%AE%BE%E8%AE%A1
設計心理學：http://zh.wikipedia.org/wiki/The_Design_of_Everyday_Things

人機交互：

http://zh.wikipedia.org/wiki/%E4%BA%BA%E6%9C%BA%E4%BA%A4%E4%BA%92

 

 

 

 

 

 

 

 

 

 

 

側邊欄：

運用側邊欄導航來輔助瀏覽頁面，方便用戶到達想關注的區域。不過使用這些側邊欄，須要注意頁面的狀況，避免其淹沒在繁雜的頁面元素之中，成爲用戶眼中的「牛皮癬」。

圖形化導航:
研究導航設計。愈來愈多的導航採用了圖標，代替了原有的文字鏈，而且擴大了單個標籤的點擊區域，這是在手機、平板電腦愈來愈普及的狀況下，採起的優化設計。

Hover交互
鼠標移到元素上時，會有流暢的動態效果，而不是僅僅改變顏色。關注細節，爲用戶打造更流暢的交互動做。

Hover展示更多
它達到了視覺效果美觀跟功能實用的微妙平衡，設計師爲了視覺效果能夠先把內容優先級較低的內容隱藏，等鼠標移入時再將其顯示出來。

仿真展現
取材於現實生活，拉近了網絡跟現實的距離，流暢的交互、豐富的細節讓用戶有實物的感受。

時間指示
在某些按時間切換圖片的模塊，可採用此方式,給用戶心理預期，這樣切換的時候用戶會比較容易接受，一樣的設計能夠應用到焦點圖切換、頁面切換、頁面加載等模塊。

Loading
對一成不變的loading的樣式稍做改進，就能超出用戶的預期，從而得到用戶的好感，而跟網站主題相關的設計，會提高用戶對網站的忠誠度。

信息預覽
針對同等級的大批量信息，能夠採用這種縮略模式，利用hover狀態呈現信息的主要內容，由用戶決定下一步操做，達到空間的合理利用。

轉場動畫

 

錯誤提示

優點概述：除了給用戶提供必要的信息外，用一點小小的幽默幫用戶消除一些錯誤帶來的負面情緒

應用環境：網頁出現錯誤時，如：404錯誤（針對這版設計的特色，比較適合一淘UX網站等相似的設計站點）

咱們設計了一個很牛X的網站，但還沒牛X到保證不會出現錯誤，但這並不影響咱們的用戶體驗，即便錯了，咱們也會盡可能保證這是個有趣的錯誤，看看咱們的錯誤提示吧。

錯誤提示頁面須要提供給用戶的必要信息，主要有兩點，
一：告訴用戶怎麼了。
二：告訴用戶下一步該怎麼作。

參考資料：http://www.uisdc.com/24-kinds-of-new-way-of-interaction

 

2013-08-25更新

交互：
交互真正革命性的意義在於，它把時間這一魔幻般的屬性帶入靜態的產品之中，經過對動做、速度、顯現等等的定義，讓產品的操做體現出真實感。

真實感：
交互效果作到和生活中的動做類似，用戶不須要其餘提示就知道這樣的動做所表明的含義。（例如手機屏幕上的滑動、拖拽、loading進度提示）若是一個動做在現實生活中不存在，用戶就難以理解它所表明的含義。乾脆利索而又邏輯性強的動畫對於改善用戶體驗大有裨益。

動做化界面的設計原則：
① 動畫乾淨利落
② 節奏一致、過渡天然
（注意：時間軸、關鍵幀等動畫基礎）

參考資料：http://www.36kr.com/p/203418.html