產品設計務實:產品的最終具象化

2020-12-22 人人都是產品經理

從功能需求分析到核心確認,產品設計的最終具象化是原型設計。它是產品經理日常進行的最多的工作之一,決定了產品的「長相」。進行原型設計需要對信息架構和互動設計展開規劃,文章結合案例,對這兩個模塊展開了分析,與大家分享。

通過產品設計務實系列文章的前兩篇(《產品設計務實:產品為什麼「長」成這個樣子?》和《產品設計務實:抓住產品的真正核心》),我們一起分析了產品「容貌」的決定因素是產品本身,也就是說從一個產品的定位(產品是做什麼的)開始,它的形態基本就已經確認了;

接著,我們從確定了的產品定位和功能出發,抽取了產品的兩個核心:核心元素和核心任務鏈,得以在產品基本形態確認(我們可以稱之為「骨骼」確認)的基礎上,將產品設計繼續延申和擴展,「附之以血肉」;到了第三步,也是最後一步,就是將這「骨骼」和「血肉」的內容映射到「可視化」的「表皮」層面,即原型設計,實現產品的最終具象化。

一、骨肉皮

Groupie, 骨肉皮。在搖滾圈,或者泛娛樂圈裡對一類人的統稱,多半是女生。他們追求和明星(可以是影星,歌星,作家等)發生關係(大多數情況下是肉體,少數情況為精神上的)。不過,在今天的引述裡是為了其他的用意,我們借用這個表達,並且把它做一個拆分,拆分成:骨、肉、皮

作為生命形體構成形式,骨、肉、皮 剛好按照了肌體構成「由內核向外延」的方式進行排列,同時也是按照支撐肌體構成、支撐生命體存續重要程度的「由重向輕」的排列順序。基於此,我們借用這個詞來映射產品的定位和功能,產品的核心元素和核心任務鏈,以及產品的原型設計對於產品本身以及他們之間的相互關係。

1. 產品的定位和功能是產品的骨

一個產品是幹什麼的,從根本上決定了產品最終呈現給用戶的樣子,如果它是一隻霸王龍,那麼它就和翼龍不一樣,它有強壯的大腿,用來快速奔跑追逐獵物,而不是長出一對翅膀。

回到網際網路產品的定位和功能上,我們大致區分的話,可以得到這樣的分類:購物、社交、內容、工具及遊戲,當然手機應用商店的分類會比這個要細緻一些,但實際上都可以歸集到上述五類中的一類或多類(產品功能的跨越性導致的多類型)。

例如,我們前述的例子,微信毫無疑問是社交產品,但同時在不斷的版本迭代帶來的功能的添加之後,它同時也具有了購物的功能(商家小程序等)、內容的功能(公眾號)、工具的功能(各種小程序,比如查詢公交地鐵等到站信息)以及遊戲的功能(微信飛機大戰),但這些都不影響微信作為社交產品的定位,相反地微信通過適度地添加功能不斷強化社交的屬行、誘導社交的行為。

微信_飛機大戰(圖片來自網絡)

2. 核心元素和核心任務鏈是產品的肉

產品向用戶提供那些信息,通過怎麼樣的方式、過程來幫助用戶達到使用產品的目的,實現產品定位和功能的價值,就是依附在「骨」上的「肉」的職責。通過「肉」,「骨」具備了一定的形象,變得豐滿起來,「肉」對「骨」進行了解釋和說明,並受「骨」的約束。

還是以微信來說,需要展示哪些信息是以滿足社交活動這一定位為前提,並服務於社交活動的展開;操作流程的設計也是根據社交活動開展的流程,映射用戶行為並服務於用戶在這個過程中的操作而進行的。因此,核心元素的「肉」決定了產品基本的信息架構,核心任務鏈的「肉」決定了產品基本的交互結構。

3. 原型設計是產品的皮

蒙在「骨肉」之外的,就是產品的「門面」,也正是在映射用戶心智的基礎上,通過符合交互習慣和用戶使用習慣的方式把產品的定位和功能,核心元素和核心任務鏈進行的可視化呈現、可視化傳達。

換句話說,原型設計所扮演的是產品最終同用戶接觸點的角色,一個產品的定位和功能是否符合用戶期望,所展示的信息是否足夠,設定的業務流程是否清晰流暢,都將最終由原型設計來進行傳達。

從這個意義上來說,雖然,原型設計是產品設計的「皮毛」,但是如果這個「皮毛」不夠靚麗,再好的「骨」「肉」,用戶也是沒有興趣。

既然直接面向終端用戶的「皮」這麼重要,沒辦法像「骨」和「肉」一樣是可以躲起來,而且更為重要的是——對於「皮」的設計和處理可能是產品經理日常進行的最多的工作之一,不管是一整個APP的設計,一個業務模塊的設計,還是一個功能點的設計。那麼,問題來了:怎樣處理「皮」才是正確的呢?

二、沒有正確答案

這個問題可能真的沒有絕對「正確」的答案。因為,絕對正確這個概念本身並不存在,就原型設計來說,決定原型設計的因素有很多,比如網絡環境、終端設備、用戶群體、主流設計風格、實現成本以及服務系統效能等等。

不同的影響元素對於原型設計都會有自己的「價值」主張,而且有可能互相衝突(比如用戶群體特性的高要求和技術實現成本的低儲備)。另外還要看產品定位上對於某一個方面的目的的側重,比如強化商業轉化、付費轉化的功能,必然會對主業務流程的支持上造成一定的影響。但是產品的商業訴求必須是需要去滿足的,除非是公益性的產品。

所以一個保守但是相當有效的方式就是向成功的前輩學習,俗稱「抄」。這麼做的原因有三:

  1. 通過實踐證明的穩定性、可用性和易用性。在信息架構和交互架構設計領域有著很多經過時間檢驗過的定律及法則來作為設計的指導,它幫助我們還原作為產品使用者的人的認知問題的方式和方法、一些普遍的規律以及不同情境下的行為偏好;
  2. 省去用戶學習的成本。就像我們不認為有正確的答案一樣,信息展示和流程設計的實現方式是多樣的。只不過需要考慮的是,用戶接觸到一個新樣式,新模式的時候,有多大的興趣去接受你的新模式,需要多久的時間去學習,特別是在眾多產品共同搶奪用戶使用時長的這個語境之下。
  3. 良好的微創新的平臺。在穩定、可用、易用的前提下,在保持基本信息架構和交互結構的基礎上,根據產品的需求進行「自定義」的微調整和微創新,從而實現通用向創新的自然過渡。

三、原型設計,最終的具象化

就 原型設計 來說,與產品需求文檔不同,它是一個產品需求的可視化呈現過程,其目的在於產品經理同UI設計師、UE設計師以及開發工程師進行更準確、更有效的溝通,幫助設計師和工程師對於產品需求的可行性和易用性進行更直觀的判斷,最終保證實現效果與需求一致。

從這個意義上說,原型設計解決的雖然不是「產品是什麼的問題」(當然也有團隊直接以原型設計作為產品需求文檔),更多的是「產品長成什麼樣子」的問題。

換句話說,原型設計可能並不是必需,但肯定是可以更好地幫助我們去實現產品。根據前文推演,我們決定了要通過「抄」的方式來指導原型設計,抄什麼,怎麼抄,怎麼樣去呈現「骨」和「肉」?解決這個問題,我們一方面要了解進行原型設計需要規劃的兩個模塊,另一方面那看前輩給我們留下了的可以借鑑的「經驗」和「模板」。

模塊一:信息架構

信息架構,即信息的架構。從語法的角度來說,信息是架構的定語,架構是中心詞。它是按照一定的方式、方法用來組織信息,以使信息有某種或者多種結構化的方式進行展示,從而科學、有序和有效的達成信息傳達的目的。

從視覺直觀的角度說,我們在各種產品中看到的頁面、視頻、圖片、圖標、文案、按鈕、彈窗等等,都屬於信息的範疇。常見的信息架構模式包括 層級式、輻射式、套娃式、標籤視圖、便當盒和篩選視圖;也有按照目的維度去畫分的,包括 分類系統、導航系統、標籤系統、搜索系統、個性化推薦系統。

兩種分類方式沒有本質上的差別,前面一種分類方式是PC站時代的定義,後面一種主要是APP站時點的定義,而APP站作為PC站的繼承和發揚,在信息架構上並不是一種「原生」的創新,兩種分類方法也就存在著一定的映射關係,比如,從命名上就能看出的一致(標籤視圖與標籤系統、搜索系統和篩選視圖)。既然存在多種的信息架構模式,如何選擇呢?

這就要回歸到我們產品的定位、功能和核心元素和核心任務鏈上。產品定位是一個信息聚合平臺(如某頭條)的話,功能主要是向用戶包括文字、圖片、音頻、視頻等多媒體信息,對應的核心元素就是這些多媒體信息,而核心任務鏈勢必就是圍繞用戶如何獲取、查看信息,輔以定向主動獲取、定向被動推送,以及信息獲取後的反饋機制等。

基於分析,我們就應當選用一種更便於信息組織的信息架構模式來作為產品的主信息架構,比如分類系統,而輔之導航系統、搜索系統和個性化推薦系統。

信息架構示例(圖片來自網絡)

模塊二:互動設計

互動設計(Interaction Design, 縮寫IXD),完整的說應該是「人機互動設計」,在學科上說應該是在工業設計的範疇之內,屬於子學科。

我們還是從語法的角度來說,交互是設計的定語,是設計的約束語。而交互是接觸和反饋的集合體,交即接觸,互即互動和反饋。所以互動設計就是對交互行為、交互過程、交互方式、交互載體等進行的可用、易用和通用的設計。

通過對於交互的設計,創造和建立的是人與人之外的,特別是計算機系統、工業設備等「非人」之間的相互交流、操作交互的方式,實現「人機」的互動。從視覺直觀的角度說,我們在各種產品中看到的界面、輸入框、選擇控制項、確定或者取消按鈕、彈窗、蒙版提示等,包括SIRI的語音助手、華為的骨節敲擊、微信的搖一搖都是互動設計的範疇。

常見的用於互動設計細分包括:交互界面(包括交互反饋)的設計、交互控制項的選擇和交互動作(包括交互方式)的選擇。其中:

(1)交互界面

是交互動作和交互方式的載體,它與信息架構有一定的關聯,但側重點有不同,除了考慮保證交互信息(提示信息、按鈕等)完整性之外,還需要考慮界面布局的合理性,如按鈕的位置,關聯信息的距離等。

關於交互架構模式布局設計的基本理論主要有以下幾種:格式塔原理、網格系統、7±2法則、席克定律、費茨定律、奧卡姆剃刀原理、複雜性守恆定律,網上有很多前輩都做了充分的介紹,大家可參考閱讀。

交互界面(圖片來自網絡)

(2)交互控制項

如果大家留意的話,相比於交互界面的設計,對於交互控制項和交互動作的描述,我們使用了「選擇」。之所以這樣處理是因為交互控制項在不同的系統裡,比如網頁、IOS客戶端或者安卓客戶端都有了比較明確的定義,而且新增也往往是一個系統化定義的過程,新增更新的周期也會比較長(涉及到大量用戶對新交互控制項的普遍認可和接受)。

不同系統定義好的交互控制項都是有公開資料可以查閱的,而且我們的原型設計軟體也會將基本的交互控制項作為基本元素,提供我們進行「拖拽」使用。常見的交互控制項包括:彈窗(Alert_會話彈窗/Alert Dialog)、操作菜單(Action Sheets_控制菜單/Popover、Action views、Sheets_bottom、Dropdown menu等)、浮窗提示(Toast_提示/Snackbars),這部分也有很詳實的公開資料可以查閱和學習。

交互控制項(圖片來自網絡)

(3)交互動作

簡單來說是人,特別是人手 在交互界面對交互控制項進行操作的動作。 在APP站常見的交易動作包括,點擊、長按、划動(上下、左右)、拖拽、拖拉(多觸點、多手指)等。

這些基本的交互動作是符合了使用者的認知和直接的條件反射的,也是滿足我們基本的產品功能的操作需求的。我們日常體驗中,幼兒,特別是很多嬰兒可以很自如的操作我們的手機的一些功能就很好的說明了這個現象。

交互動作(圖片來自網絡)

如前述,交互界面、交互控制項的選擇和交互動作選擇所服務的是產品的核心任務鏈,通過必要信息、控制項的組織,配合信息架構引導用戶完成核心任務鏈,即業務流程的操作,最終完成其使用產品的目的。

樣例

我們還是用前文提到的醫療平臺作為樣例,來製作一個簡單的線框結構的原型(再次感謝提供案例的同學)。在上兩篇裡分析的基礎上,作為案例的「移動在線醫療訓練平臺」定位是一個提供給備考考生,或者相關從業者進行「臨床類別實踐技能」訓練的平臺產品,也提取了它的核心元素(訓練內容、相關指導信息、後評價信息)和核心任務鏈【發現(訓練)——選擇(訓練)——進行(訓練)——(訓練)評價——發現(訓練)】。

此外,醫療平臺作為一個獨立的用戶產品,要需要加入一些標準的公共產品模塊(如用戶管理:註冊、登錄、個人信息等)來構建。

原型樣例

以上原型設計僅作為樣例展示,實際的產品原型還是需要根據具體的需求進行設計,包括全業務流程的引導和控制,同時也依賴產品在同業產品中的行業定位、產品策略和競爭策略的不同而有所差別。

結語

產品設計的目標:為用戶帶來價值、為用戶提供舒適的使用體驗、為用戶提供情感的安慰、為用戶提供驚喜

本篇是這個系列的文章的最後一篇,感謝閱讀和支持,產品路上,讓我們一起努力。

#相關閱讀#

《產品設計務實:產品為什麼「長」成這個樣子?》

《產品設計務實:抓住產品的真正核心》

#專欄作家#

大俠,人人都是產品經理專欄作家。混過文青的支付出道的產品人,長期以支付廝混,關注支付、O2O、社交領域,擅長行業、業務需求分析,產品設計和用戶體驗。

本文原創發布於人人都是產品經理,未經許可,不得轉載。

題圖來自Unsplash,基於CC0協議

相關焦點

  • 營銷具象化的產品研發設計
    優秀的設計在進行產品構思之初就應將消費者訴求點和市場競爭需求融入到產品中,因為家居產品最終是要面向市場進行銷售,設計師們不能閉門造車,在設計之初一定要考慮到產品營銷,只有在設計之初將營銷具象化,這樣的產品才會具有競爭力,這樣的設計師才有可能成為優秀的設計師。我通過多年的實踐總結認為,優秀的產品設計需要基於市場營銷做到以下幾點。
  • 巫小偉:能夠將意象如此具象化的產品蘇州並不多見
    樂居財經訊 蘇州樂居發起的「尋找蘇州住宅好產品——發現2020蘇州房企產品系品牌價值」行動,旨在聯合權威機構與專家學者,從房企產品布局、工藝工法和品牌影響力等多維度進行研究分析,發掘蘇州市場上現有住宅產品的含金量。
  • 產品設計方法論:設計價值觀,產品設計的指南針(一)
    編輯導語:設計師在進行不同的設計需求時,產品設計方法論可為設計師提供明確的步驟與框架;設計師在設計產品時應該如何思考、從哪個方向進行思考才能設計出用戶體驗好的產品;本文作者分享了關於產品設計方法論中的設計價值觀,我們一起來看一下。
  • 優秀Logo設計技巧!標誌具象化
    文/林運豹 一個優秀的標誌設計可以有效的將品牌和產品的內涵表現出來。在標誌的設計中,許多的成功的標誌都是以具象圖形作為原型進行設計的。這種具象圖形的標誌可以清晰的將標誌的意義展示出來,使其在人們的心中留下最深刻的印象。在具象標誌中,會對真實存在的事物進行概念化的升華精煉,去掉其中特殊性的差別,保留其普遍性的特徵,將其中的內涵表現出來。
  • B端產品設計:從產品角度談「軟體模塊化設計」
    軟體模塊化設計是軟體工程領域的概念。本文結合筆者 ToB 產品設計的經驗,從產品經理的角度談談什麼是軟體模塊化設計,以及為何它被奉為產品設計的基本原則之一。02 模塊化設計對產品經理的幫助產品經理在網際網路時代以前,主要歸屬於市場營銷部,職能是快速響應市場需要,對產品盈虧負責;軟體類產品的設計工作直接由開發部門負責。
  • 網紅產品是怎樣煉成的?正昱包裝設計使品牌綻放光彩
    抖音等短視頻平臺的快速興起,使得「網紅」經濟遍地開花,同樣也使得許多商家為了能夠提高產品銷量,透由包裝設計誇張的獨特性,甚至是怪異性以誘發消費者的獵奇心理。然而,消費者對於這類所謂的「網紅產品」卻並不買帳。那麼,同樣都是網紅包裝,為什麼有的產品能夠一夜爆紅,而有的就無人問津呢?
  • 產品設計到底是做什麼的?
    隨著科技的發展,我們的生活方式發生了很大的改變,這些改變有很大一部分功勞來源於產品設計。所以,人們對產品設計也越來越重視,產品設計已成為我們生活中不可缺少的一部分。相信資深的產品設計師都知道,一款產品開發到設計在到一些其他的流程,都需要很多步驟去完成。
  • 產品原型設計的參考步驟
    其實每個產品最終確定下來的一級導航欄裡面的各個欄目就是產品的功能結構。確定產品的布局排版結構確定了之後,就需要對每一個產品頁面進行元素的排版,排版之前,一般都會先對頁面進行布局設計的考慮。這種情況下,即對某一類產品的布局把握不好的時候,可以參照已有成熟產品的內容布局,因為它們已經有運營數據在支撐。確定產品的功能模塊布局排版決定了某個產品功能模塊的放置位置,接著就可以一塊一塊的確定原型設計內容,使其接近於最終產品的展示樣式。
  • 大灣區文創產品設計研發中心落戶順德
    本屆設計周活動將從12月9日持續至14日,集中開展項目籤約、中國原創設計選品暨投融資大會、大灣區文創產品設計研發中心啟動儀式暨主題研討、「有版有顏」工業設計版權季系列活動-設計大爆炸新品發布會第五季、健康產品設計供應鏈大會、「花翩嶺南」廣東鄉村振興創新設計展等系列活動。
  • 產品系列(四):聊聊產品策劃和產品設計
    編輯導語:講了產品經理的核心工作流程、用戶需求分析、可行性分析後,我們對產品經理的業務更加了解;本篇文章作者從產品出發,詳細的介紹了產品策劃和產品設計,我們一起來看一下。一、產品策劃產品策劃是根據市場和用戶的需求,結合公司的戰略規劃,制定產品業務模式的過程。
  • 快速獲得消費者認知,品牌具象化營銷少不了
    具象化營銷之所以越來越受品牌方重視,被消費者不斷叫好,在於具象化營銷能讓用戶真情實感地感受信息的過程,以及獨一無二的場景體驗感,使其輕而易舉的接受它、理解它,甚至記住它,最終促進購買。對大眾來說,具象化營銷的好處,更適合大腦識別、記憶和理解。因為人一般對抽象的東西很無感,但對一個具體化的表達或互動的場景體驗,往往印象深刻。
  • 產品設計是什麼?
    產品設計產品設計是一種有目的的選擇。設計產品需要集中注意力,我們首先要問的是,我們希望人們有什麼感受,可以帶來什麼價值。然後開始圍繞我們的意圖,設計出不同的方案,直到我們碰到的一個最優的方案,能夠給我們帶來價值,提升一種生活,只有這樣,我們的工作才叫產品設計。在我們的生活中產品設計無處不在。
  • 織點Cvpos產品設計師:唯有洞察市場才能做好產品設計
    產品獲獎不是偶然 背後有無數的付出記者發現,近兩年才興起的刷臉支付行業裡,竟然出現了2020 iF產品設計獎的得主,讓人驚喜。本次奪得2020 iF產品設計獎的產品是廣州織點智能有限公司的CVPOS,它是一款帶有商品識別和人臉支付的人工智慧自助收銀設備。
  • 產品結構金字塔如何搭建?詳解引流產品、利潤產品,形象產品的設計...
    2)設計檢測諮詢類產品;人們在工作和生活中會遇到種種問題,心理問題、學習問題、情感問題、職場問題,這些問題和困擾使人們迷茫痛苦,人們希望能有專業人士給予指點迷津。這時可以設計檢測諮詢類的產品,通過檢測讓受眾搞清楚自己面臨的問題,通過諮詢他們能得到針對性的指點。受眾對前端的檢測諮詢類產品有了信任,就極可能消費後端的利潤產品。
  • 洛可可王秋辰:設計賦能產品升級 深挖產品背後市場
    【億邦動力訊】12月18日消息,在今日舉辦的「2020國際電商創新發展峰會」上,洛可可的電商事業部副總王秋辰發表了題為《用戶喜愛的產品才是企業可持續增長力》的演講,他表示洛克在為用戶進行產品設計中,有一套自己的方法論,這個方法論是以用戶為核心,以大產品思維、用戶思維為導向進行的設計創新。「消費升級的本質是商業民主化。」
  • 產品三大法寶:分類、本質、抽象與具象
    因此,我們可以看到在產品設計上,只需一步即可實現視頻錄製,這不同於微信需要兩步、並且在功能面板中有很多其它功能干擾,還需要一直長按才可以實現錄製。並且說話就錄,不說話不錄。同時,有一個大的時代背景——逃離微信!
  • 如何設計出有創意的產品包裝
    ,所以說包裝設計也是非常重要的,能夠給人留下深刻的印象,那麼,如何設計出有創意的產品包裝呢?一、市場調研有很多人廠家都沒有考慮過設計有創意的包裝,大多數都認為只要好看就行,其實並不是這樣,創意的包裝需要你花費時間和心血去思考和調研,定位自己的產品類型,去市場上調查同類型產品的包裝設計情況,做到心中有數,既能發現現存包裝存在的問題,也能在自己設計時避免與其它品牌產生衝突或相撞,此外,如果你不放心的話
  • 2020年度創意設計PC優秀產品&推薦產品獎揭曉
    經過初選、複選和終審的層層角逐,最終選拔出今年的年度卓越產品獎、年度優秀產品獎、年度推薦產品以及年度行業創新獎。其中,在創意設計PC產品線中,惠普ENVY 15高性能創意輕薄本、ROG幻14、微星尊爵Prestige 14榮獲2020年度優秀產品獎,微星創造者Creator 17榮獲年度推薦產品獎。
  • 融創:以產品力的全面升維 引領地產品質消費時代 | 產品力系列實錄
    共識·創新·體系基於共識的產品戰略,創新引領的產品價值觀,高效務實的產品體系能力融創基於共識的產品戰略、創新引領的價值觀、高效務實的產品體系能力構成了融創出色產品力的動力硬核:基於共識的產品戰略堅持做高端精品,是融創上下引為共識的產品戰略。
  • 【吉動·新成果】產品造型學院產品設計專業學生在CUIDC 2020全國...
    近日,由教育部高等學校設計學專業教學指導委員會、教育部高等學校工業設計專業教學指導委員會聯合主辦,廣州美術學院承辦的CUIDC 2020全國大學生工業設計大賽落幕。吉林動畫學院產品造型學院產品設計專業選送的參賽作品經過賽區初評、全國複評、終評環節,斬獲中國新銳設計銀獎1項、中國新銳設計優秀獎1項。產品造型學院2016級產品設計專業學生吳爾強的作品「管道清理機設計」榮獲銀獎,鄭鑫的作品「高速公路安全檢測儀設計」榮獲優秀獎。吉林省高校僅6項作品在國賽中獲獎,我校產品設計專業佔據其中2項。