從Web到App:多終端設計中如何實現全場景滿足用戶需求?

9 評論 58630 瀏覽 287 收藏 8 分鐘

互聯網產品的基本特征之一是通過多終端的無縫連接、全場景滿足用戶需求,從而搶占用戶的時間和心智以達到商業目的。不同終端所具有的特征各異,因此同一產品在開展多終端設計會存在一定差異,這種差異往往決定了用戶的需求是否得到滿足。本文將試著從App、Web兩個終端給出一些設計思考。

一、App和Web的區別是什么

App和Web之間的區別,回歸到兩者最本質的區別,可以從操作方式、屏幕尺寸、網絡等基礎硬件及其屬性進行比較。我們可以發現:Web的特點有“定時”、“固定地點”等;App的特點有“碎片化”、“任意使用場景”等。
從Web到App:多終端設計思考

APP和Web的基礎屬性

二、App設計與Web設計的區別是什么

通過對App和Web的基礎屬性之間的比較,在設計層面上,不同的屬性所采取的設計策略是不一致的,兩個終端之間的差別在設計師群體中也是仁者見仁智者見智。

有的設計師從屏幕大小上去區分設計差異:app你需要思考怎么去除才能讓塞不下的屏幕能塞下必要的東西,web你需要思考怎么才能增加些東西讓空蕩的屏幕不會顯得太空蕩”。

也有的設計師試著從菜鳥和老手的技藝去區分設計方式:對新手來說一個界面大一個界面小,對中手來說設計范式和使用場景不一樣,對高手來說都一樣;還有的設計師從發展趨勢上認為:發展到最后應該都是一樣的,現在就是大腦延伸操作媒介的不同。

從Web到App:多終端設計思考

App端設計 VS Web端設計

三、對于同一個產品,App設計和Web設計的主要區別是什么

通過對比基本屬性和設計觀點,App和Web的一些特性與設計產生了關聯,可以進一步發掘:對于同一個產品,App和Web的設計區別是什么?

從Web到App:多終端設計思考

產品App端 VS 產品Web端

以蘇寧易購為例,在App和Web兩端的設計存在很大差異:App端更多的是提供清晰快捷的入口;Web端不僅提供入口,還要采用絢麗多彩的視覺元素吸引用戶進入。

同一個產品在App和Web出現設計差異,從商業訴求上追蹤,決定了這種設計差異來源于用戶需求,而需求決定了產品功能,功能衍生出設計形式。

引用現代主義建筑大師路易斯·沙里文的一句名言:形式追隨功能。

因此,針對App和Web的設計差異可以從用戶需求角度繼續深入發掘。

移動互聯網時代,用戶的時間被碎片化分割,導致用戶需求出現“場景化”這一典型特征。時間、地點、人物、事件構成場景的必要元素,在特定的時間,特定的用戶群體在特定的地點發生特定的行為事件。針對產品的設計,場景賦予其意義。

一杯咖啡,在星巴克,賦予以商務;在書店,賦予以閑暇;在陽光明媚的清晨,賦予以元氣;在連綿陰雨的窗邊,賦予以溫暖;

……
從Web到App:多終端設計思考

一杯咖啡在不同場景下的意義

追本溯源,兩個終端在本質上是用戶所處“環境”的不同——即“場景不同”造成了App端和Web端的設計差異。

例如:OA產品,在辦公室、出差途中、家里這三種典型場景中,用戶對于OA產品的期望是不一樣的,這種期望由用戶心理與用戶需求交織產生。

因此,對于同一產品的多終端設計形態,可以分三部分來思考其差異:用戶心理、用戶需求、設計側重點。

四、用戶心理

不同場景下,用戶心理是不同的:

  1. 畫圖正嗨的時候,產品經理跑過來說有個需求要改。
  2. 訪談過程中,開發和測試提出了很多獨到的見解。
  3. 晚上加班到12點,終于把明天要提交的圖改好了。
  4. 評審的時候,大佬們紛紛對你的設計豎起大拇指。

出現以上四種場景,用戶的內心活動是什么?

面對不同的場景,用戶的心理會產生一系列的變化,從用戶心理狀態切入,可以針對App和Web的產品定位、架構、功能等方面定義設計差異。

從Web到App:多終端設計思考

關注用戶心理

五、用戶需求

不同場景下,用戶需求是不同的:

  1. 連續一個禮拜天天加班到12點,禮拜五下班。
  2. 20號收到工資卡的短信。
  3. 宅家里打游戲,中午肚子餓了。
  4. 夜深人靜,在床上輾轉反側睡不著。

在以上四種場景下,用戶的真實想法是什么?

在不同的場景中,用戶的需求是不一致的,可以從這種場景下特定的用戶需求入手,去區分App和Web需要解決用戶的什么問題。

從Web到App:多終端設計思考

關注用戶需求

六、設計側重點

不同場景下,產品設計的側重點是不同的:

  1. 在家用的水杯和在公司用的水杯。
  2. 臥室的被套和酒店的被套。
  3. 線上的商品展示和線下的商品展示。
  4. 航空公司的飛機和私人飛機。

經歷以上四種對比場景,用戶的體驗差異是什么?

這要求設計師具備強烈的同理心,從用戶心理和實際需求出發思考:如何平衡用戶需求和現實情況?同種需求在不同場景中最合適的實現方式是什么?都需要設計師去找出差異并重新定義。

#專欄作家#

胡欣欣,人人都是產品經理專欄作家,蘇寧易購·云產品·交互設計師。公眾號:吹拉彈唱大師(ID:cltcds)

本文原創發布于人人都是產品經理。未經許可,禁止轉載

題圖來自Unsplash,基于CC0協議

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 不太明白續航和迭代速度的比較,為什么app會比web高或快

    回復
    1. web也能很快迭代,只要加班跟得上

      回復
    2. 哈哈哈真實

      回復
  2. 感謝分享學習 更多學習情境化設計的我覺得有本書特別系統《情境化設計——為生活而設計》

    回復
  3. 不錯,尤其是對場景化的定義。

    回復
  4. 醍醐灌頂!

    回復
  5. 視角很棒,正是我困惑的地方。希望大師有空能夠展開一下,可能是一篇專業性很強的爆款文章呢!

    來自上海 回復
    1. 好的,最近剛剛完成一款Web產品的移動端設計,抽空寫一下

      來自江蘇 回復
    2. 期待,你會寫得非常棒得!

      來自上海 回復