3分鐘帶你瞭解互動設計

編輯導語:什麼是互動設計?它都包含哪些內容呢?互動設計的價值以及現狀又是怎樣的?本文作者在互動學習的過程中,希望能和大家分享一些基礎的知識,幫助一些學習互動設計的新人,同時歡迎大佬們來一起討論交流~

3分鐘帶你瞭解互動設計

野生互動設計系列01篇,灰機希望透過自己互動學習的總結,讓想學和初入互動設計的同學對互動設計有系統性瞭解。

一、互動設計的內容

大家對互動設計都有自己的理解,上游產品同學說是畫原型做動效,下游UI同學說是畫線框圖,互動同學自嘲是“線框仔”。到底什麼是互動設計,先看看較官方的說法:

互動設計是定義、設計人造系統的行為的設計領域,它定義了兩個或多個互動的個體之間交流的內容和結構,使之互相配合,共同達成某種目的——百度百科

互動設計師是以人的需求為導向,理解使用者的期望和需求的同時,理解商業、技術以及行業內的機會和制約。基於以上的理解,創造出形式、內容、行為有用易用,令使用者滿意且技術可行,具有商業利益的產品——來源網路

這些都是高度概括的解釋,對想入門互動的同學不友好太難啃了,灰機剛開始自學時抓耳撓腮了很久。建議隨著互動設計經驗豐富時再消化。接下來灰機結合自己的野生互動學習經歷聊聊對互動設計的理解,希望對大家有幫助。

互動設計是對行為的設計:比如,吃一個蘋果,行為怎麼設計?

解法:拿起蘋果——放到嘴裡——吃,這就是吃蘋果的行為。這個問題非常簡單根本不需要設計行為,人們下意識都知道怎麼吃。

3分鐘帶你瞭解互動設計

現實生活中實際情況要比這個複雜,比如這個蘋果要兩個人分吃,那怎麼來設計這個行為?

  • 解法一:拿起蘋果——第一個人吃一半——第二個人吃完(第二個人能接受?)
  • 解法二:拿起蘋果——分成兩半——分別給兩個人吃(這樣就合適點)
3分鐘帶你瞭解互動設計

如果問題再進一步複雜,行為設計的解法就有更多種,那就需要互動設計來研究更多行為設計的解法並找出最優解。

在網際網路產品設計中,需要考慮的因素就更復雜,對互動設計的要求就更高,核心是這三個因素的組合:看到什麼(see)、做什麼(do)、完成什麼任務。

1. 看到什麼(see)

操作前看到了什麼資訊,或者操作後看到什麼資訊。比如,介面裡看到的功能、資訊、欄位、元素等。

2. 做什麼(do)

看到資訊後該如何操作,比如,瀏覽商品介紹後可以點選購買、收藏、分享等。

3. 完成什麼任務

就是經過一系列see-do-see-do……後,完成了一個什麼任務。比如,瀏覽商品— 點選購買 — 支付完成,就完成了買這個商品的任務。

3分鐘帶你瞭解互動設計

每個節點和這套流程的設計就是簡單互動設計,比如移動端互動設計:介面原型就是每個節點,節點間的前後關係就是流程,最後完成什麼任務,就是一套互動設計。

3分鐘帶你瞭解互動設計

實際業務場景中,每個節點可能都會有特殊情況,比如購買商品時沒庫存了,使用中突然沒網了等。所以節點和流程就會越來越複雜,互動設計自然更復雜。

3分鐘帶你瞭解互動設計
二、互動設計的價值

互動設計在網際網路產品中的價值主要分為使用者側和業務側。

1. 使用者側

使用者體驗已成為網際網路產品核心競爭力之一,透過互動設計最佳化產品可用性、易用性、愉悅性,可以帶來使用者體驗極大的提升。

提到使用者體驗,那首先繞不開使用者體驗五要素,具體可去查閱相關知識,網路上這塊知識很多。互動設計在使用者體驗五要素中主要負責結構層和框架層設計(其他幾個層面,隨著互動能力的提升需要了解越深入),是產品從抽象概念到具象視覺形態的橋樑。

2. 業務側

互動設計主要體現三個層次業務價值: 協同價值 > 業務增值 > 設計驅動

  1. 協同價值:協同配合產品設計研發。特點是互動設計對業務目標達成沒產生突出價值。
  2. 業務增值:業務目標實現中起到突出價值。特點是互動設計對業務目標達成起到了突出貢獻。
  3. 設計驅動:設計策略指導戰略制定。特點是設計對業務目標達成起到決定作用。

這三個層面對互動設計師複合能力要求越高,大部分互動設計師的都處在第一或第二個層面,希望能看到更多設計師能達到設計驅動層面,共勉,像蘋果設計於蘋果。

三、互動設計現狀1. 需求越來越大

在網際網路+的浪潮下,各行各業都在加速擁抱網際網路進行融合、轉型、創新。從早期資訊網際網路、消費網際網路等,到現在產業網際網路。網際網路影響的行業越來越廣,創造的網際網路產品越來越多,想產品使用者體驗競爭力越強,所需要的互動設計也越多。

2. 要求越來越高

網際網路從早期藍海到現在基本處於紅海,競爭越來越激烈,產品競爭從早期拼長處,到現在比短處,要求產品的每個環節都得強才能在競爭中立於不敗之地。這就倒逼產品的使用者體驗足夠好,互動設計作為影響使用者體驗的重要一環,自然要求互動質量足夠好。

3. 崗位化和技能化

互動設計在產品設計研發過程中被高頻提起,目前互動設計主要分為兩種方式在網際網路團隊中。

  1. 互動設計崗位化,在中大型團隊中設立互動設計師崗位,聚焦互動設計,上游對接產品經理,下游對接UI設計師,好處是提升產品互動設計質量,減少下游因為互動問題的高成本返稿提升效率。
  2. 互動設計技能化,互動設計被分給產品經理或UI設計師,需要產品經理或UI設計師輸出互動稿,或者這兩個角色一起共創互動設計。尤其當下網際網路行業崗位競爭激烈,UI設計師和產品經理複合型發展具備互動技能的越來越多。
三、互動設計歷史(選讀)

此結選讀比較難啃,灰機這節花了很多時間整理,也糾正了一些自己錯誤的認知。

人與人、物與物、人與物都存在互動行為。“人與人”比如你在路上巧遇一個老友,你會喊住老友“喲,這麼巧”並“招手”,老友回“喲,這麼巧”並“微笑”,這樣透過語言、手勢或表情的相互行為就是互動,但這主要是社會學領域咋暫不討論,本次主要聊人與物的互動。

1. 互動由來

石器時代,人使用石斧等石器,都和“物”產生了互動行為。石斧的大小、木頭的長短、捆綁的方式、手握的方式都可以納入互動設計的範疇。這時候人類還處在生存需求階段,對工具核心訴求是“可用”。隨著人類社會的進步,人類可以互動的“物”從簡單的工具到複雜的機器。

工業時代,工業革命新技術極大的提升了社會生產力,標準化、同質化產品源源不斷的滿足人類需求。

豐富的產品為人們提供了更多選擇的可能性,“可用”不再是是人類選擇產品的唯一考量,產品好不好用,也就是“易用”也成為了人類選擇產品的考量標準。這時候,互動設計開始作為一個獨立的流程和角色提到產品開發流程中了。

1984年比爾·摩格理吉第一次提出“互動設計”,對產品與使用者之間的互動機制進行設計,讓使用者能夠更加簡單和輕鬆去使用、體驗產品,最終感受其價值。在“互動設計”這個概念被正式提出後,互動設計被越來越多公司和行業重視並加入到產品開發流程中。

2. 互動設計突飛猛進

隨著資訊革命中網際網路技術的發展,人類互動的“物”越來越複雜,從傳統工業設計中借用的互動設計這個概念,在2000年之後越來越被重視,互動設計所帶來的產品易用性和使用者體驗被各大公司重視。

這個時期互動設計經歷了三個階段:命令列介面 CLI、圖形使用者介面 GUI、自然使用者介面NUI。

3. 命令列介面 CLI

資訊革命初期,個人電腦剛被髮明時候,電腦沒有滑鼠,人們透過鍵盤和電腦互動,使用者在命令列輸入區輸入指令後回車,電腦再根據使用者指令給出相應反饋,這種互動就要求使用者熟記各種指令,使用者記憶成本和操作成本都很高,導致易用性和使用者體驗非常差。

4. 圖形使用者介面 GUI

1979 年冬天喬布斯的施樂-帕洛阿爾託研究中心(Xerox PARC)之行,喬布斯被施樂的圖形化使用者介面和螢幕二維定位操作輸入裝置—滑鼠震驚,接下來將這兩項技術並應用於自己的個人PC裝置,這就是GUI初步被大眾使用的開端,直到今天個人PC裝置,我們主要都是使用鍵盤滑鼠方式與電腦進行互動。

2007年1月9日,又一次劃時代的人機互動方式改變發生在蘋果推出了首款iPhone時。介面、控制元件作為真實物理世界的投射,使用觸控方式與圖形化介面互動讓終端裝置的易用性得到了極大突破。

雖然觸控互動開啟了人機互動方式的新的時代,但它並沒有完全替代滑鼠互動,基於滑鼠畫素級別的精準定位等互動特性,在日常辦公等場景下還是處於支配地位。

透過觸控、鍵盤、滑鼠點選拖動等行為對圖形化使用者介面進行互動操作,相比 CLI 的優點顯而易見。

使用者只需透過點選就能夠完成之前透過複雜的命令列才能夠完成的任務。但不代表就完全替代CLI ,在特定場景CLI互動方式還是處在支配地位,如密碼輸入、開發程式設計等。

5. 自然使用者介面 NUI

自然使用者介面只需要使用者透過最自然的方式(語言、表情、眼神、動作、觸控等)和計算機進行交流,擺脫了GUI階段所需要的鍵盤、滑鼠、介面等。

如近年來出現了語音互動、虛擬現實(AR、VR、全息投影)、生物識別(指紋、掌紋、聲紋、面部識別、虹膜、筆跡、步態等)、體感技術(識別手勢、表情、眼動追蹤、熱量、肢體動作等)、資訊識別技術(圖片識別、文字識別、物品識別、語言等)等新互動方式,感興趣的同學可以研究研究。

這篇主要聊什麼是互動,記住核心“see-do-see-do-完成任務”。

後面將繼續聊怎麼學習互動?怎麼分析需求?怎麼思考互動策略?怎麼設計原型?怎麼設計互動文件?怎麼落地設計方案?怎麼驗證方案?……希望系列寫完後讓大家對互動設計有一個系統性瞭解。

作者:灰機;公眾號:灰機的設計筆記

本文由 @灰機 原創釋出於人人都是產品經理,未經許可,禁止轉載

題圖來自 Unsplash,基於 CC0 協議

版權宣告:本文源自 網路, 於,由 楠木軒 整理釋出,共 3764 字。

轉載請註明: 3分鐘帶你瞭解互動設計 - 楠木軒