'如何通過設計引導用戶不同的行為?'

設計 設計師 讀書 愛奇藝 騰訊視頻 軟件 寧靜 插畫 人人都是產品經理 2019-07-26
"

設計師通過設計影響用戶的感知力,喚起用戶共情,並引導用戶行為,整個環節都讓用戶跟隨你的預期構思進行,從而把握設計的主動權。那本文就跟大家分析一下,不同的視覺設計是如何引起用戶不同的行為的。

"

設計師通過設計影響用戶的感知力,喚起用戶共情,並引導用戶行為,整個環節都讓用戶跟隨你的預期構思進行,從而把握設計的主動權。那本文就跟大家分析一下,不同的視覺設計是如何引起用戶不同的行為的。

如何通過設計引導用戶不同的行為?

在強調以用戶為導向的今天,許多設計都是圍繞著用戶需求來展開,然而換個角度思考,設計是否可以主動引導用戶行為,讓用戶跟隨你的設計思維最終更好地滿足需求呢?

答案是可以的。設計師通過設計影響用戶的感知力,喚起用戶共情,並引導用戶行為,整個環節都讓用戶跟隨你的預期構思進行,從而把握設計的主動權。

以下我們思考與分析不同的視覺設計,是如何引起用戶不同的行為的:

目錄:

一、決定用戶獲取信息的過程

二、撩撥用戶不同的情緒

三、給予用戶不同的提示

四、正、負反饋的應用

一、決定用戶獲取信息的過程

當畫面信息量過多且混亂時,用戶的第一眼信息和閱讀順序是隨機的,這個時候就需要設計師根據信息的重要程度和相關性,通過改變某些元素的視覺層級,建立不同級別的視覺,從而突出重要信息以及引導用戶的閱讀順序。

"

設計師通過設計影響用戶的感知力,喚起用戶共情,並引導用戶行為,整個環節都讓用戶跟隨你的預期構思進行,從而把握設計的主動權。那本文就跟大家分析一下,不同的視覺設計是如何引起用戶不同的行為的。

如何通過設計引導用戶不同的行為?

在強調以用戶為導向的今天,許多設計都是圍繞著用戶需求來展開,然而換個角度思考,設計是否可以主動引導用戶行為,讓用戶跟隨你的設計思維最終更好地滿足需求呢?

答案是可以的。設計師通過設計影響用戶的感知力,喚起用戶共情,並引導用戶行為,整個環節都讓用戶跟隨你的預期構思進行,從而把握設計的主動權。

以下我們思考與分析不同的視覺設計,是如何引起用戶不同的行為的:

目錄:

一、決定用戶獲取信息的過程

二、撩撥用戶不同的情緒

三、給予用戶不同的提示

四、正、負反饋的應用

一、決定用戶獲取信息的過程

當畫面信息量過多且混亂時,用戶的第一眼信息和閱讀順序是隨機的,這個時候就需要設計師根據信息的重要程度和相關性,通過改變某些元素的視覺層級,建立不同級別的視覺,從而突出重要信息以及引導用戶的閱讀順序。

如何通過設計引導用戶不同的行為?

舉個簡單栗子:比如下方圖a,四個詞並不存在關聯,我們通過親密性、字體樣式、顏色等相同形式使它們分別組合起來,並通過組與組之間的差異對比來區分視覺層級,從而影響詞語的組合和引導用戶的視覺順序。

"

設計師通過設計影響用戶的感知力,喚起用戶共情,並引導用戶行為,整個環節都讓用戶跟隨你的預期構思進行,從而把握設計的主動權。那本文就跟大家分析一下,不同的視覺設計是如何引起用戶不同的行為的。

如何通過設計引導用戶不同的行為?

在強調以用戶為導向的今天,許多設計都是圍繞著用戶需求來展開,然而換個角度思考,設計是否可以主動引導用戶行為,讓用戶跟隨你的設計思維最終更好地滿足需求呢?

答案是可以的。設計師通過設計影響用戶的感知力,喚起用戶共情,並引導用戶行為,整個環節都讓用戶跟隨你的預期構思進行,從而把握設計的主動權。

以下我們思考與分析不同的視覺設計,是如何引起用戶不同的行為的:

目錄:

一、決定用戶獲取信息的過程

二、撩撥用戶不同的情緒

三、給予用戶不同的提示

四、正、負反饋的應用

一、決定用戶獲取信息的過程

當畫面信息量過多且混亂時,用戶的第一眼信息和閱讀順序是隨機的,這個時候就需要設計師根據信息的重要程度和相關性,通過改變某些元素的視覺層級,建立不同級別的視覺,從而突出重要信息以及引導用戶的閱讀順序。

如何通過設計引導用戶不同的行為?

舉個簡單栗子:比如下方圖a,四個詞並不存在關聯,我們通過親密性、字體樣式、顏色等相同形式使它們分別組合起來,並通過組與組之間的差異對比來區分視覺層級,從而影響詞語的組合和引導用戶的視覺順序。

如何通過設計引導用戶不同的行為?

實際應用:下面兩款app首頁,同樣都是翻譯工具類型,當新用戶需要用到翻譯工具時,通過視覺層級劃分:

"

設計師通過設計影響用戶的感知力,喚起用戶共情,並引導用戶行為,整個環節都讓用戶跟隨你的預期構思進行,從而把握設計的主動權。那本文就跟大家分析一下,不同的視覺設計是如何引起用戶不同的行為的。

如何通過設計引導用戶不同的行為?

在強調以用戶為導向的今天,許多設計都是圍繞著用戶需求來展開,然而換個角度思考,設計是否可以主動引導用戶行為,讓用戶跟隨你的設計思維最終更好地滿足需求呢?

答案是可以的。設計師通過設計影響用戶的感知力,喚起用戶共情,並引導用戶行為,整個環節都讓用戶跟隨你的預期構思進行,從而把握設計的主動權。

以下我們思考與分析不同的視覺設計,是如何引起用戶不同的行為的:

目錄:

一、決定用戶獲取信息的過程

二、撩撥用戶不同的情緒

三、給予用戶不同的提示

四、正、負反饋的應用

一、決定用戶獲取信息的過程

當畫面信息量過多且混亂時,用戶的第一眼信息和閱讀順序是隨機的,這個時候就需要設計師根據信息的重要程度和相關性,通過改變某些元素的視覺層級,建立不同級別的視覺,從而突出重要信息以及引導用戶的閱讀順序。

如何通過設計引導用戶不同的行為?

舉個簡單栗子:比如下方圖a,四個詞並不存在關聯,我們通過親密性、字體樣式、顏色等相同形式使它們分別組合起來,並通過組與組之間的差異對比來區分視覺層級,從而影響詞語的組合和引導用戶的視覺順序。

如何通過設計引導用戶不同的行為?

實際應用:下面兩款app首頁,同樣都是翻譯工具類型,當新用戶需要用到翻譯工具時,通過視覺層級劃分:

如何通過設計引導用戶不同的行為?
  • 左邊第一眼視覺從“今日公開課”再到輸入框;
  • 右邊第一眼視覺就在輸入框。

左邊通過色塊弱化輸入框,引導用戶先注意公開課等訊息,再到翻譯輸入框,而右邊則幾乎完全在視覺表現上著重強調輸入框,弱化其他信息。

同樣是翻譯工具app,通過不同的層級設計產生不同的視覺流:一個是強化帶貨能力,一個是強化查詢框。

視覺層級應當符合用戶的瀏覽習慣,合理地引導用戶的視線流,一般視覺層級最好不超過三個,簡單清晰有效的層級能夠讓用戶對頁面內容一目瞭然,快速瞭解內容的組織,找到功能入口。

二、撩撥用戶不同的情緒

功能需求是情感需求的基礎,當功能滿足用戶需求時,我們會開始去思考怎樣通過設計去拉近人們與冰冷頁面的距離,我們會通過引導頁的插畫設計,為用戶在使用產品前提前預熱情緒。

比如:下方的閱讀類app引導頁,當用戶有閱讀需求,引導頁以夜晚冷色調,畫面中獨自一人在窗口閱讀,給用戶獨處寧靜的感覺,從而營造合適閱讀的氛圍,為閱讀醞釀情緒。

"

設計師通過設計影響用戶的感知力,喚起用戶共情,並引導用戶行為,整個環節都讓用戶跟隨你的預期構思進行,從而把握設計的主動權。那本文就跟大家分析一下,不同的視覺設計是如何引起用戶不同的行為的。

如何通過設計引導用戶不同的行為?

在強調以用戶為導向的今天,許多設計都是圍繞著用戶需求來展開,然而換個角度思考,設計是否可以主動引導用戶行為,讓用戶跟隨你的設計思維最終更好地滿足需求呢?

答案是可以的。設計師通過設計影響用戶的感知力,喚起用戶共情,並引導用戶行為,整個環節都讓用戶跟隨你的預期構思進行,從而把握設計的主動權。

以下我們思考與分析不同的視覺設計,是如何引起用戶不同的行為的:

目錄:

一、決定用戶獲取信息的過程

二、撩撥用戶不同的情緒

三、給予用戶不同的提示

四、正、負反饋的應用

一、決定用戶獲取信息的過程

當畫面信息量過多且混亂時,用戶的第一眼信息和閱讀順序是隨機的,這個時候就需要設計師根據信息的重要程度和相關性,通過改變某些元素的視覺層級,建立不同級別的視覺,從而突出重要信息以及引導用戶的閱讀順序。

如何通過設計引導用戶不同的行為?

舉個簡單栗子:比如下方圖a,四個詞並不存在關聯,我們通過親密性、字體樣式、顏色等相同形式使它們分別組合起來,並通過組與組之間的差異對比來區分視覺層級,從而影響詞語的組合和引導用戶的視覺順序。

如何通過設計引導用戶不同的行為?

實際應用:下面兩款app首頁,同樣都是翻譯工具類型,當新用戶需要用到翻譯工具時,通過視覺層級劃分:

如何通過設計引導用戶不同的行為?
  • 左邊第一眼視覺從“今日公開課”再到輸入框;
  • 右邊第一眼視覺就在輸入框。

左邊通過色塊弱化輸入框,引導用戶先注意公開課等訊息,再到翻譯輸入框,而右邊則幾乎完全在視覺表現上著重強調輸入框,弱化其他信息。

同樣是翻譯工具app,通過不同的層級設計產生不同的視覺流:一個是強化帶貨能力,一個是強化查詢框。

視覺層級應當符合用戶的瀏覽習慣,合理地引導用戶的視線流,一般視覺層級最好不超過三個,簡單清晰有效的層級能夠讓用戶對頁面內容一目瞭然,快速瞭解內容的組織,找到功能入口。

二、撩撥用戶不同的情緒

功能需求是情感需求的基礎,當功能滿足用戶需求時,我們會開始去思考怎樣通過設計去拉近人們與冰冷頁面的距離,我們會通過引導頁的插畫設計,為用戶在使用產品前提前預熱情緒。

比如:下方的閱讀類app引導頁,當用戶有閱讀需求,引導頁以夜晚冷色調,畫面中獨自一人在窗口閱讀,給用戶獨處寧靜的感覺,從而營造合適閱讀的氛圍,為閱讀醞釀情緒。

如何通過設計引導用戶不同的行為?

同樣是閱讀app的引導頁,咪咕閱讀app則通過不同的場景展示“閱讀,越快樂”的主題,用戶在閱讀的時候都是有一定的使用場景,畫面根據用戶使用閱讀軟件的常見場景展現快樂情愫,從而影響用戶在閱讀時也誘發快樂情緒。

"

設計師通過設計影響用戶的感知力,喚起用戶共情,並引導用戶行為,整個環節都讓用戶跟隨你的預期構思進行,從而把握設計的主動權。那本文就跟大家分析一下,不同的視覺設計是如何引起用戶不同的行為的。

如何通過設計引導用戶不同的行為?

在強調以用戶為導向的今天,許多設計都是圍繞著用戶需求來展開,然而換個角度思考,設計是否可以主動引導用戶行為,讓用戶跟隨你的設計思維最終更好地滿足需求呢?

答案是可以的。設計師通過設計影響用戶的感知力,喚起用戶共情,並引導用戶行為,整個環節都讓用戶跟隨你的預期構思進行,從而把握設計的主動權。

以下我們思考與分析不同的視覺設計,是如何引起用戶不同的行為的:

目錄:

一、決定用戶獲取信息的過程

二、撩撥用戶不同的情緒

三、給予用戶不同的提示

四、正、負反饋的應用

一、決定用戶獲取信息的過程

當畫面信息量過多且混亂時,用戶的第一眼信息和閱讀順序是隨機的,這個時候就需要設計師根據信息的重要程度和相關性,通過改變某些元素的視覺層級,建立不同級別的視覺,從而突出重要信息以及引導用戶的閱讀順序。

如何通過設計引導用戶不同的行為?

舉個簡單栗子:比如下方圖a,四個詞並不存在關聯,我們通過親密性、字體樣式、顏色等相同形式使它們分別組合起來,並通過組與組之間的差異對比來區分視覺層級,從而影響詞語的組合和引導用戶的視覺順序。

如何通過設計引導用戶不同的行為?

實際應用:下面兩款app首頁,同樣都是翻譯工具類型,當新用戶需要用到翻譯工具時,通過視覺層級劃分:

如何通過設計引導用戶不同的行為?
  • 左邊第一眼視覺從“今日公開課”再到輸入框;
  • 右邊第一眼視覺就在輸入框。

左邊通過色塊弱化輸入框,引導用戶先注意公開課等訊息,再到翻譯輸入框,而右邊則幾乎完全在視覺表現上著重強調輸入框,弱化其他信息。

同樣是翻譯工具app,通過不同的層級設計產生不同的視覺流:一個是強化帶貨能力,一個是強化查詢框。

視覺層級應當符合用戶的瀏覽習慣,合理地引導用戶的視線流,一般視覺層級最好不超過三個,簡單清晰有效的層級能夠讓用戶對頁面內容一目瞭然,快速瞭解內容的組織,找到功能入口。

二、撩撥用戶不同的情緒

功能需求是情感需求的基礎,當功能滿足用戶需求時,我們會開始去思考怎樣通過設計去拉近人們與冰冷頁面的距離,我們會通過引導頁的插畫設計,為用戶在使用產品前提前預熱情緒。

比如:下方的閱讀類app引導頁,當用戶有閱讀需求,引導頁以夜晚冷色調,畫面中獨自一人在窗口閱讀,給用戶獨處寧靜的感覺,從而營造合適閱讀的氛圍,為閱讀醞釀情緒。

如何通過設計引導用戶不同的行為?

同樣是閱讀app的引導頁,咪咕閱讀app則通過不同的場景展示“閱讀,越快樂”的主題,用戶在閱讀的時候都是有一定的使用場景,畫面根據用戶使用閱讀軟件的常見場景展現快樂情愫,從而影響用戶在閱讀時也誘發快樂情緒。

如何通過設計引導用戶不同的行為?

一個渲染寧靜、獨處的氛圍;另一個則是渲染快樂的氛圍,引導頁設計通過撩撥用戶的不同情緒,為產品使用營造良好的使用氛圍。

再舉一個錯誤頁面下情感設計的例子,當用戶斷網或信號不好,頁面圖片無法加載出來時,用戶的情緒可能處於焦慮和即將關閉的臨界點,這個時候需要設計師進行更好的用戶引導來緩解用戶情緒。

"

設計師通過設計影響用戶的感知力,喚起用戶共情,並引導用戶行為,整個環節都讓用戶跟隨你的預期構思進行,從而把握設計的主動權。那本文就跟大家分析一下,不同的視覺設計是如何引起用戶不同的行為的。

如何通過設計引導用戶不同的行為?

在強調以用戶為導向的今天,許多設計都是圍繞著用戶需求來展開,然而換個角度思考,設計是否可以主動引導用戶行為,讓用戶跟隨你的設計思維最終更好地滿足需求呢?

答案是可以的。設計師通過設計影響用戶的感知力,喚起用戶共情,並引導用戶行為,整個環節都讓用戶跟隨你的預期構思進行,從而把握設計的主動權。

以下我們思考與分析不同的視覺設計,是如何引起用戶不同的行為的:

目錄:

一、決定用戶獲取信息的過程

二、撩撥用戶不同的情緒

三、給予用戶不同的提示

四、正、負反饋的應用

一、決定用戶獲取信息的過程

當畫面信息量過多且混亂時,用戶的第一眼信息和閱讀順序是隨機的,這個時候就需要設計師根據信息的重要程度和相關性,通過改變某些元素的視覺層級,建立不同級別的視覺,從而突出重要信息以及引導用戶的閱讀順序。

如何通過設計引導用戶不同的行為?

舉個簡單栗子:比如下方圖a,四個詞並不存在關聯,我們通過親密性、字體樣式、顏色等相同形式使它們分別組合起來,並通過組與組之間的差異對比來區分視覺層級,從而影響詞語的組合和引導用戶的視覺順序。

如何通過設計引導用戶不同的行為?

實際應用:下面兩款app首頁,同樣都是翻譯工具類型,當新用戶需要用到翻譯工具時,通過視覺層級劃分:

如何通過設計引導用戶不同的行為?
  • 左邊第一眼視覺從“今日公開課”再到輸入框;
  • 右邊第一眼視覺就在輸入框。

左邊通過色塊弱化輸入框,引導用戶先注意公開課等訊息,再到翻譯輸入框,而右邊則幾乎完全在視覺表現上著重強調輸入框,弱化其他信息。

同樣是翻譯工具app,通過不同的層級設計產生不同的視覺流:一個是強化帶貨能力,一個是強化查詢框。

視覺層級應當符合用戶的瀏覽習慣,合理地引導用戶的視線流,一般視覺層級最好不超過三個,簡單清晰有效的層級能夠讓用戶對頁面內容一目瞭然,快速瞭解內容的組織,找到功能入口。

二、撩撥用戶不同的情緒

功能需求是情感需求的基礎,當功能滿足用戶需求時,我們會開始去思考怎樣通過設計去拉近人們與冰冷頁面的距離,我們會通過引導頁的插畫設計,為用戶在使用產品前提前預熱情緒。

比如:下方的閱讀類app引導頁,當用戶有閱讀需求,引導頁以夜晚冷色調,畫面中獨自一人在窗口閱讀,給用戶獨處寧靜的感覺,從而營造合適閱讀的氛圍,為閱讀醞釀情緒。

如何通過設計引導用戶不同的行為?

同樣是閱讀app的引導頁,咪咕閱讀app則通過不同的場景展示“閱讀,越快樂”的主題,用戶在閱讀的時候都是有一定的使用場景,畫面根據用戶使用閱讀軟件的常見場景展現快樂情愫,從而影響用戶在閱讀時也誘發快樂情緒。

如何通過設計引導用戶不同的行為?

一個渲染寧靜、獨處的氛圍;另一個則是渲染快樂的氛圍,引導頁設計通過撩撥用戶的不同情緒,為產品使用營造良好的使用氛圍。

再舉一個錯誤頁面下情感設計的例子,當用戶斷網或信號不好,頁面圖片無法加載出來時,用戶的情緒可能處於焦慮和即將關閉的臨界點,這個時候需要設計師進行更好的用戶引導來緩解用戶情緒。

如何通過設計引導用戶不同的行為?
  • 比如左邊的頁面出現“那個,可以等我一下嗎”、“今天不是週末嘛”等文案來轉移用戶注意力,從而減輕用戶的負面情緒;
  • 而右邊頁面處斷網狀態下時,出現卡通形象難過的表情,創造與用戶共鳴的情感,與用戶建立是極為親密的情感互動。

同樣是斷網狀態下,通過文案與圖形引起不同的情緒引導。

一個通過轉移注意力減輕用戶負面情緒,一個通過共鳴來與用戶建立情感交流,設計師通過不同的方向在斷網狀態下進行用戶的情緒引導,引起不同的反應,從而減少用戶的流失。

三、給予用戶不同的提示

在給予用戶提示時,如何巧妙地提示尤為重要,比如:下方愛奇藝和騰訊視頻的觀看視頻進度提示。

"

設計師通過設計影響用戶的感知力,喚起用戶共情,並引導用戶行為,整個環節都讓用戶跟隨你的預期構思進行,從而把握設計的主動權。那本文就跟大家分析一下,不同的視覺設計是如何引起用戶不同的行為的。

如何通過設計引導用戶不同的行為?

在強調以用戶為導向的今天,許多設計都是圍繞著用戶需求來展開,然而換個角度思考,設計是否可以主動引導用戶行為,讓用戶跟隨你的設計思維最終更好地滿足需求呢?

答案是可以的。設計師通過設計影響用戶的感知力,喚起用戶共情,並引導用戶行為,整個環節都讓用戶跟隨你的預期構思進行,從而把握設計的主動權。

以下我們思考與分析不同的視覺設計,是如何引起用戶不同的行為的:

目錄:

一、決定用戶獲取信息的過程

二、撩撥用戶不同的情緒

三、給予用戶不同的提示

四、正、負反饋的應用

一、決定用戶獲取信息的過程

當畫面信息量過多且混亂時,用戶的第一眼信息和閱讀順序是隨機的,這個時候就需要設計師根據信息的重要程度和相關性,通過改變某些元素的視覺層級,建立不同級別的視覺,從而突出重要信息以及引導用戶的閱讀順序。

如何通過設計引導用戶不同的行為?

舉個簡單栗子:比如下方圖a,四個詞並不存在關聯,我們通過親密性、字體樣式、顏色等相同形式使它們分別組合起來,並通過組與組之間的差異對比來區分視覺層級,從而影響詞語的組合和引導用戶的視覺順序。

如何通過設計引導用戶不同的行為?

實際應用:下面兩款app首頁,同樣都是翻譯工具類型,當新用戶需要用到翻譯工具時,通過視覺層級劃分:

如何通過設計引導用戶不同的行為?
  • 左邊第一眼視覺從“今日公開課”再到輸入框;
  • 右邊第一眼視覺就在輸入框。

左邊通過色塊弱化輸入框,引導用戶先注意公開課等訊息,再到翻譯輸入框,而右邊則幾乎完全在視覺表現上著重強調輸入框,弱化其他信息。

同樣是翻譯工具app,通過不同的層級設計產生不同的視覺流:一個是強化帶貨能力,一個是強化查詢框。

視覺層級應當符合用戶的瀏覽習慣,合理地引導用戶的視線流,一般視覺層級最好不超過三個,簡單清晰有效的層級能夠讓用戶對頁面內容一目瞭然,快速瞭解內容的組織,找到功能入口。

二、撩撥用戶不同的情緒

功能需求是情感需求的基礎,當功能滿足用戶需求時,我們會開始去思考怎樣通過設計去拉近人們與冰冷頁面的距離,我們會通過引導頁的插畫設計,為用戶在使用產品前提前預熱情緒。

比如:下方的閱讀類app引導頁,當用戶有閱讀需求,引導頁以夜晚冷色調,畫面中獨自一人在窗口閱讀,給用戶獨處寧靜的感覺,從而營造合適閱讀的氛圍,為閱讀醞釀情緒。

如何通過設計引導用戶不同的行為?

同樣是閱讀app的引導頁,咪咕閱讀app則通過不同的場景展示“閱讀,越快樂”的主題,用戶在閱讀的時候都是有一定的使用場景,畫面根據用戶使用閱讀軟件的常見場景展現快樂情愫,從而影響用戶在閱讀時也誘發快樂情緒。

如何通過設計引導用戶不同的行為?

一個渲染寧靜、獨處的氛圍;另一個則是渲染快樂的氛圍,引導頁設計通過撩撥用戶的不同情緒,為產品使用營造良好的使用氛圍。

再舉一個錯誤頁面下情感設計的例子,當用戶斷網或信號不好,頁面圖片無法加載出來時,用戶的情緒可能處於焦慮和即將關閉的臨界點,這個時候需要設計師進行更好的用戶引導來緩解用戶情緒。

如何通過設計引導用戶不同的行為?
  • 比如左邊的頁面出現“那個,可以等我一下嗎”、“今天不是週末嘛”等文案來轉移用戶注意力,從而減輕用戶的負面情緒;
  • 而右邊頁面處斷網狀態下時,出現卡通形象難過的表情,創造與用戶共鳴的情感,與用戶建立是極為親密的情感互動。

同樣是斷網狀態下,通過文案與圖形引起不同的情緒引導。

一個通過轉移注意力減輕用戶負面情緒,一個通過共鳴來與用戶建立情感交流,設計師通過不同的方向在斷網狀態下進行用戶的情緒引導,引起不同的反應,從而減少用戶的流失。

三、給予用戶不同的提示

在給予用戶提示時,如何巧妙地提示尤為重要,比如:下方愛奇藝和騰訊視頻的觀看視頻進度提示。

如何通過設計引導用戶不同的行為?
  • 愛奇藝從剩餘時間給予用戶提示,告知用戶剩餘視頻準確到需要多少分鐘多少秒看完,可以讓用戶合理安排時間進行觀看;
  • 而騰訊視頻則從已觀看的進度給予用戶提示,告知用戶這個視頻你已經觀看了佔整個視頻的比例是多少,幫助用戶對整個視頻的長度有個預期,並且瞭解自己當前的位置。

同樣是視頻app,一個準確提示用戶視頻剩餘進度,一個大概提示視頻已看比例,從不同方向滿足用戶瞭解當前觀看視頻進度的需求。

四、正、負反饋的應用

當用戶進行操作時,我們應當及時給予用戶反饋,反饋可分為正反饋和負反饋,簡單理解,正反饋即促進或加強接收到信息;而負反饋抑制或減弱接收到信息。

以下我們列舉兩個簡單的動效(做了誇張處理),兩個動效從起點到終點的時間是相同的,一個是起步緩慢,另一個是結束緩慢。

"

設計師通過設計影響用戶的感知力,喚起用戶共情,並引導用戶行為,整個環節都讓用戶跟隨你的預期構思進行,從而把握設計的主動權。那本文就跟大家分析一下,不同的視覺設計是如何引起用戶不同的行為的。

如何通過設計引導用戶不同的行為?

在強調以用戶為導向的今天,許多設計都是圍繞著用戶需求來展開,然而換個角度思考,設計是否可以主動引導用戶行為,讓用戶跟隨你的設計思維最終更好地滿足需求呢?

答案是可以的。設計師通過設計影響用戶的感知力,喚起用戶共情,並引導用戶行為,整個環節都讓用戶跟隨你的預期構思進行,從而把握設計的主動權。

以下我們思考與分析不同的視覺設計,是如何引起用戶不同的行為的:

目錄:

一、決定用戶獲取信息的過程

二、撩撥用戶不同的情緒

三、給予用戶不同的提示

四、正、負反饋的應用

一、決定用戶獲取信息的過程

當畫面信息量過多且混亂時,用戶的第一眼信息和閱讀順序是隨機的,這個時候就需要設計師根據信息的重要程度和相關性,通過改變某些元素的視覺層級,建立不同級別的視覺,從而突出重要信息以及引導用戶的閱讀順序。

如何通過設計引導用戶不同的行為?

舉個簡單栗子:比如下方圖a,四個詞並不存在關聯,我們通過親密性、字體樣式、顏色等相同形式使它們分別組合起來,並通過組與組之間的差異對比來區分視覺層級,從而影響詞語的組合和引導用戶的視覺順序。

如何通過設計引導用戶不同的行為?

實際應用:下面兩款app首頁,同樣都是翻譯工具類型,當新用戶需要用到翻譯工具時,通過視覺層級劃分:

如何通過設計引導用戶不同的行為?
  • 左邊第一眼視覺從“今日公開課”再到輸入框;
  • 右邊第一眼視覺就在輸入框。

左邊通過色塊弱化輸入框,引導用戶先注意公開課等訊息,再到翻譯輸入框,而右邊則幾乎完全在視覺表現上著重強調輸入框,弱化其他信息。

同樣是翻譯工具app,通過不同的層級設計產生不同的視覺流:一個是強化帶貨能力,一個是強化查詢框。

視覺層級應當符合用戶的瀏覽習慣,合理地引導用戶的視線流,一般視覺層級最好不超過三個,簡單清晰有效的層級能夠讓用戶對頁面內容一目瞭然,快速瞭解內容的組織,找到功能入口。

二、撩撥用戶不同的情緒

功能需求是情感需求的基礎,當功能滿足用戶需求時,我們會開始去思考怎樣通過設計去拉近人們與冰冷頁面的距離,我們會通過引導頁的插畫設計,為用戶在使用產品前提前預熱情緒。

比如:下方的閱讀類app引導頁,當用戶有閱讀需求,引導頁以夜晚冷色調,畫面中獨自一人在窗口閱讀,給用戶獨處寧靜的感覺,從而營造合適閱讀的氛圍,為閱讀醞釀情緒。

如何通過設計引導用戶不同的行為?

同樣是閱讀app的引導頁,咪咕閱讀app則通過不同的場景展示“閱讀,越快樂”的主題,用戶在閱讀的時候都是有一定的使用場景,畫面根據用戶使用閱讀軟件的常見場景展現快樂情愫,從而影響用戶在閱讀時也誘發快樂情緒。

如何通過設計引導用戶不同的行為?

一個渲染寧靜、獨處的氛圍;另一個則是渲染快樂的氛圍,引導頁設計通過撩撥用戶的不同情緒,為產品使用營造良好的使用氛圍。

再舉一個錯誤頁面下情感設計的例子,當用戶斷網或信號不好,頁面圖片無法加載出來時,用戶的情緒可能處於焦慮和即將關閉的臨界點,這個時候需要設計師進行更好的用戶引導來緩解用戶情緒。

如何通過設計引導用戶不同的行為?
  • 比如左邊的頁面出現“那個,可以等我一下嗎”、“今天不是週末嘛”等文案來轉移用戶注意力,從而減輕用戶的負面情緒;
  • 而右邊頁面處斷網狀態下時,出現卡通形象難過的表情,創造與用戶共鳴的情感,與用戶建立是極為親密的情感互動。

同樣是斷網狀態下,通過文案與圖形引起不同的情緒引導。

一個通過轉移注意力減輕用戶負面情緒,一個通過共鳴來與用戶建立情感交流,設計師通過不同的方向在斷網狀態下進行用戶的情緒引導,引起不同的反應,從而減少用戶的流失。

三、給予用戶不同的提示

在給予用戶提示時,如何巧妙地提示尤為重要,比如:下方愛奇藝和騰訊視頻的觀看視頻進度提示。

如何通過設計引導用戶不同的行為?
  • 愛奇藝從剩餘時間給予用戶提示,告知用戶剩餘視頻準確到需要多少分鐘多少秒看完,可以讓用戶合理安排時間進行觀看;
  • 而騰訊視頻則從已觀看的進度給予用戶提示,告知用戶這個視頻你已經觀看了佔整個視頻的比例是多少,幫助用戶對整個視頻的長度有個預期,並且瞭解自己當前的位置。

同樣是視頻app,一個準確提示用戶視頻剩餘進度,一個大概提示視頻已看比例,從不同方向滿足用戶瞭解當前觀看視頻進度的需求。

四、正、負反饋的應用

當用戶進行操作時,我們應當及時給予用戶反饋,反饋可分為正反饋和負反饋,簡單理解,正反饋即促進或加強接收到信息;而負反饋抑制或減弱接收到信息。

以下我們列舉兩個簡單的動效(做了誇張處理),兩個動效從起點到終點的時間是相同的,一個是起步緩慢,另一個是結束緩慢。

如何通過設計引導用戶不同的行為?

儘管這兩種動效跟系統反應並無關係,但卻常常被應用在下載和卸載時顯示的動效。假設下載和卸載所需時間都相同,藍色進度條動效往往會運用在下載時的狀態,而紅色進度條動效會運用在卸載時的狀態。

用戶在下載時會希望速度越快越好,我們用左邊的動效,通過一開始就加速,來給用戶一種下載即將完成的假象,從而減少用戶等待的焦慮感。

用戶在卸載時,為了給用戶更多反悔的時間,我們會在一開始就減速,給予用戶取消卸載的動機。

五、後言

用戶其實很懶,不會做過多的思考,所以更加需要我們根據產品自身定位與發展情況在每一步操作上思考如何更好的引導用戶,也許一個很小的改動,就能收穫意外的驚喜。

以用戶為導向的產品千篇一律,但只有在充分做好用戶需求調查分析後再引導用戶行為,才能在用戶價值與商業價值之間取得平衡。

本文由 @溜滑冰 原創發佈於人人都是產品經理。未經許可,禁止轉載

題圖來自Unsplash,基於CC0協議

"

相關推薦

推薦中...