以人人都是產品經理為例——如何升級交互/UI?

8 評論 6323 瀏覽 65 收藏 10 分鐘

編輯導讀:一個成熟的產品,即使已經形成了自己的風格,也會在日后不斷進行優化迭代,適應用戶行為的變化,提高用戶體驗。本文作者以人人都是產品經理為例,對其交互設計展開分析,希望對你有幫助。

人人都是產品經理屬于我常年存在手機但是卻很少打開,但也不會卸載的一款應用。

雖然集結了眾多頭部大佬的文思泉涌,但這么多年來APP端的UI風格和交互體驗始終“停留初心”。

(可能由于大家工作or摸魚瀏覽的場景都是在PC端,所以把APP端放養了哈哈(亂猜))

選擇這個APP做改版練習,一方面是考慮到有比較大的優化空間,第二也是很久沒出作品了鍛煉一下動手能力。有不同的觀點歡迎在評論區留言。

一、前期調研

1. 產品是什么?

人人都是產品經理是一個專注于產品、運營、設計的多方位交流學習平臺,以高質量行業文章為主要載體吸引用戶,以工作問答為交流媒介留存用戶。同時附帶課程、職場招聘等功能。

2. 什么樣的用戶在使用?

各類PM、運營、交互設計等對產品設計感興趣的群體,用戶年齡集中在20-35歲區間,男性用戶遠多于女性。

3. 用戶想要達到什么目的?

通過瀏覽文章和相關行業資訊來拓寬視野,與同行們相互交流探討答疑解惑,提升自己。

二、分析現有功能

首先第一步先去全方位的體驗和了解這款產品,分析現有的頁面框架、功能流程、視覺UI方面存在的問題,以便于為后續的改版方向提供切實依據。

1. 首頁

框架結構問題:

頂部總切換title是【文章】,可下面卻包含問答、課程和圈子等范疇,框架結構劃分不夠恰當。

流量分發效率低:

首頁的主要目的是為各個功能模塊進行流量分發,目前的頁面布局(以文章縱向流為主,中間穿插各種其他功能)圖片占比過大,導致首屏只能展示4篇文章,用戶觸達信息十分受限,屏效比低下。且大量的圖片占據視覺重心,對比之下文字標題過于弱化,不利于用戶抓住信息點。

Icon表意不當:

右上角更多icon常用于分類的全部展開,這里放在和大title同級別,但內容包含的卻不是同一類型,而是專題、作者和早報等不同的功能集合。

2. 問答頁

【提問】按鈕引導弱:

問答本身是一個帶有社區屬性的功能,利用用戶好奇、學習、答疑解惑的心理、通過用戶之間自發的互動產生活躍和留存。這種場景下【提問】是一個非常重要的交互按鈕,現在放在右上角不明顯且不易觸達,影響了用戶提問的主動性。

瀏覽順序受阻:

【回答亮了】板塊是對于問答下的優秀回答單獨拎出來一個tab,但這里的瀏覽行為就有點反人類。正常應該是有問才有答,但這里的瀏覽順序目前是:先瞄到回答,然后看看問題,再回頭來看回答。這是比較不太合理的。

3. 個人中心

生產者 or 消費者?

用戶可以大致分類兩類:內容生產者和內容消費者。當前個人中心將發表的文章、參與的問答、點贊粉絲優先展示,可以看出來是側重于內容生產者,對于絕大多數內容消費者而言并不友好。

關注 or 訂閱

【我的關注】和【訂閱作者】從字義上理解很容易混淆,這里的產品邏輯是:通過文章可以對作者進行【訂閱】,點進作者個人主頁則顯示為關注。訂閱了不代表關注,但是關注了這個人你的訂閱則會出現(這里的兩種叫法和特意區分個人看來實無必要,沒搞懂)。

功能劃分混亂:

下方的功能列表劃分混亂,粉絲區和上方數據重復。

三、交互細節思考

1. 個人中心用什么布局

個人中心承載的功能比較雜,既包含了各種用戶數據、設置,還有付費內容。如何去排布功能的優先級、劃分結構層級是重點。

  1. 方案一:將收藏和課程收到二級頁面中,讓個人中心有更多其他內容的展示空間,優勢在于內容的分發效率比較高,但是對于收藏的內容展示空間受限,不夠直觀
  2. 方案二:收藏的內容作為吸引用戶二次進入和留存的關鍵,具有較大的長尾價值,相比于發表的內容來說,普通用戶對于收藏的查看需求更大,方案二的優勢在于直接鋪開了收藏,但缺點在于功能的拓展型較差。
  3. 最后的方案:保留了收藏內容的鋪開形式,增加金剛區圖標對重要板塊進行靈活放置,滿足核心收藏、課程足夠突出的同時也兼顧了內容的可拓展性

2. 是否需要【最新】板塊 ?

什么時候需要放【最新】呢?我的想法是:這關系到內容本身。

比如知乎就沒有【最新】板塊,因為知乎更注重內容是否專業權威有說服力,時間這個緯度對內容偏好的影響不大,有價值的內容過個幾年再去看仍然有價值。而豆瓣小組就相反,甚至【最新】的優先級還要高于【推薦】,因為時間影響到了小組成員對內容的判斷和采納,最新的內容更能滿足成員對于信息的需求。

對于人人問答這個場景來說,用戶期望關注的是熱議問題和有價值的答案,那最新的吸引力顯然要弱于參與度高的問答,所以單獨給一個tab去讓用戶切換查看的成本是比較高的。所以將頂部切換中的最新拿掉,最新的問答將以權重占比在推薦中展示。

3. 【賞金】按鈕跟隨鍵盤還是頁面

在原版提問的頁面中有一個懸賞紅包的按鈕,原版是跟隨鍵盤出現,點擊開啟后頁面中會彈起選擇框,選擇紅包類型后才會出現金額選擇模塊。

原版:

改版后:

四、視覺風格

 

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

題圖來自 Pexels,基于 CC0 協議

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 不太清楚你大面積使用綠色的依據是什么呢

    來自上海 回復
  2. 說實話,綠色和藍色來回跳根本沒辦法靜,還是用單色好些

    來自上海 回復
  3. 大佬,真的帥!

    來自北京 回復
  4. 真好看,不知道其他設計在哪里看呀

    來自貴州 回復
  5. 挺好看的

    來自四川 回復
  6. 真不錯,又看到你了

    回復
  7. 優秀,我也下載了人人很久,第一次了解的這么詳細哈哈

    回復
  8. 大佬們有UI的坑請聯系我??

    回復