萬盛學電腦網

 萬盛學電腦網 >> 網頁制作 >> 交互設計 >> 檢索換新裝 視頻圖片檢索端統一化分享

檢索換新裝 視頻圖片檢索端統一化分享

   起初浏覽圖片和視頻的檢索頁面,發現頁面有很多可以改進的地方,

  如:布局結構、間距、字色、篩選、TAB、縮略圖大小、行數、列數,RS樣式等。

檢索換新裝 視頻圖片檢索端統一化分享 三聯

  接著參看了大量的競品,討論,溝通,獲得了不少收獲和啟發,並產出一些最初的設計想法。

  在結構布局、縮略圖排列、篩選區域、交互效果、顏色樣式等方面都作出不同嘗試,通過產出、討論,拋出問題。

  拋出的問題:

  產品頁面多年的沉澱,用戶習慣不容忽視,圖片和視頻的用戶在浏覽須有上有所差異。

  共同的特點:

  相同的都是檢索端,結構布局大致相同。

  當搜索人物類query時會出現多需求分類tab,同時都擁有篩選,相關搜索及底部搜索框等。可作出視覺統一化設計。

  差異化及特殊性:

  主要集中在中間縮略圖排列區域,圖片采用自適應排列縮略圖分寬高比例,但視頻采用的是定寬,縮略圖同等大小排列。

  注釋的內容也有差異。不適合作統一化。

  確定設計思路:

  基於以上的問題,形成了設計思路,第一步是統一化視覺設計,原則是不改變用戶浏覽習慣,頁面功能構架不做變動。

  主要針對圖片視頻中間頁共同特點部分做統一化設計和樣式調整,即:布局、間距、文字、顏色、控件元素、廣告位置,RS位置等方面做統一化的視覺設計。頁面整體做減法設計,減去不必要的元素,使得頁面更為簡潔、易用。

  最終要達到,頁面降噪,統一化,提升視覺效果和產品品質的目的。

  最終產出:

  經過了以上種種,最終產出了視頻圖片檢索端統一化改版的設計,並開發完成,現已全流量上線。

  圖片和視頻的檢索端統一化部分告一段落,

  一次次的討論,溝通,產出,項目中體會到過程的重要和團體的力量。

  下一步我們會默默努力,一步一步創新,敬請期待!

copyright © 萬盛學電腦網 all rights reserved