小設計細思考—消息詳情導航條設計

0 評論 12044 瀏覽 1 收藏 4 分鐘

作為設計師我們試圖做一個符合用戶操作習慣的頁面，然而不深入挖掘用戶的習慣，很容易讓人陷入到自己的操作流中，找不到用戶真正的操作流。

先瀏覽還是先操作？

充值中心的用戶閱讀消息詳情頁的方式很類似于郵件；從列表中選擇一條進行詳細閱讀：

在信息大爆炸的今天，用戶每天都會收到大量郵件，籠統(tǒng)的講用戶閱讀郵件的方式有：

A、選擇式閱讀，過濾不重要郵件，查看標題閱讀重要信息。（多數(shù)用戶）

B、逐條閱讀。按照順序讀完所有郵件。（少數(shù)用戶）

按照上述習慣，我們不難發(fā)現(xiàn)郵件工具欄中的兩個基本操作控件：返回和翻頁。

2

設計表達要符合用戶的心智模型，返回按鈕設置在左上角，就如用戶在閱讀圖片，圖片切換方式是舊圖從左邊飛走，右邊飛入，用戶很簡單就明白點左邊是看上一張，不需思考。

3

同樣，返回表示用戶要返回到上一步。用戶的心智模型中剛剛頁面從左側駛出，用戶需要從左側返回。由此我進行了一下設計：

4

然而我們區(qū)別于郵件的關鍵點是我們的空間有限，操作區(qū)和文字標題在一起，這個展示方式就將操作區(qū)和瀏覽區(qū)混淆在一起，用戶不能不假思索的進行操作，將頁面進行重置之后：

5

用戶進入詳情頁后，用戶瀏覽內(nèi)容，可清晰了解可進行的操作。考慮問題需要綜合實際的情況。

?

讓用戶知道身處何處

通過tips將信息傳達給用戶是現(xiàn)在常見的手法之一。然后面對每天彈出的大量tips，如何讓用戶知道tips的來源？品牌logo必不可少。

下面是起初tips消息彈出的樣式：

 

6

用戶看條這條消息后，有兩個問題需要思考：①這則消息來自于哪個業(yè)務？②個人中心是指哪個賬戶的個人中心（據(jù)調(diào)查有很大一部分用戶會同時登錄2個以上QQ）

將導航條重新設計后，用戶會清晰的明白①這條消息來自QQ網(wǎng)購充值中心②我登錄的賬戶名是sonia③我可以鏈接到sonia賬戶的個人中心④除了這則消息外，我還有20則未讀消息。

7

總結

用戶的注意力是有限的，我們把信息分類展示，可以減輕用戶的理解負擔，讓用戶短時間內(nèi)可以了解內(nèi)容并不假思索的進行下一步操作。

via?http://www.lins.im

更多精彩內(nèi)容，請關注人人都是產(chǎn)品經(jīng)理微信公眾號或下載App
旺旺旺旺旺仔
一直很尊重奶茶，沒去冰，沒少糖，沒少喝。
4319篇作品 34184101總閱讀量
10-252722 瀏覽
喊話李佳琦，是京東雙十一的一場碰瓷營銷
04-197034 瀏覽
普通人轉(zhuǎn)型創(chuàng)業(yè)做電商，在運營端會踩的10個坑
07-211273 瀏覽
Apple GPT明年上iPhone！蘋果被爆秘密研發(fā)Ajax框架，Siri大升級，市值幾秒暴增千億
08-311430 瀏覽
后新消費時代：卷出來的情緒賽道，玩瘋了的對話價值（中）
10-201918 瀏覽
零售行業(yè)看企業(yè)數(shù)字化轉(zhuǎn)型落地實踐與經(jīng)驗
評論
評論請登錄
  1. 目前還沒評論，等你發(fā)揮！