火星網校
人氣最高的百度首頁，背後的設計過程原來是這樣？
發布時間：2018-11-17 19:57:24
編者按：作為國內訪問量第一的百度首頁，每個細節的改變都會引起一片嘩然，在這麼大的壓力下，設計師是如何思考做到商業和用戶體驗的平衡呢？
在正式開始之前，我們首先來思考幾個問題：
1、在眾多的產品中，我們設計的產品在體驗層麵是怎麼樣脫引而出的？作為設計師應該想什麼，做什麼，怎麼做？
2、一個產品在多端的體驗中，又是怎麼樣保持統一的體驗效果。
3、如何較多層麵的洞見用戶訴求，提煉和總結成一個具體的、可衡量的標準，創造更極致的用戶體驗。
百度三端首頁每天數億人使用，作為設計團隊我們經過不斷實踐和反思，提煉整合確立了自己的設計觀，通過以下一些案例分享其中一些經驗，希望以此作為設計師工作思考的模板與參考。
一、“精確”——帶來多端統一的設計
隨著智能設備的普及，瀏覽方式的多樣化，百度首頁也麵臨著多終端的挑戰。如果缺少設計原則，就像走在鋼索上的人，步步都可能是陷阱。因此在多終端的快速改版和保證品牌一致性並存的路上，我們一直遵循以下幾項原則：統一設計來源、統一布局方式、統一視覺圖形。
統一的設計來源可以使多端擁有一致化的體驗。黃金分割是最普遍也是最能引起人美感的，我們所熟知的蒙娜麗莎的臉、雅典的帕台農神廟等都應用了該比例設計。百度三端首頁的排版設計也不例外。黃金分割點約等於0．618：1，百度PC首頁的搜索區距頁麵底部是474px，整體版麵的高度是768px，兩者之間的比例是0.618，非常接近黃金分割。Wise首頁及Padweb同樣都是運用了黃金分割來規範搜索框的位置，讓有規則的美嚴謹的融入其中。
統一的布局可以使品牌的一致性發揮的淋漓盡致。我們需要為用戶營造良好的搜索體驗，去掉其他的幹擾因素。比如在端的設計中為保證搜索框的簡潔，搜索框周圍的留白，給用戶更好的搜索體驗。在產品形態上，從用戶的使用場景出發，提供多種搜索方式，語音搜索和圖片搜索，可以讓更多的人平等的得到所求。
統一的視覺感受是首因效應。百度三端首頁統一的品牌色“百度藍”的出現，利用色彩增強了對品牌的記憶，讓用戶記憶猶新。百度一下是近因效應，他引導用戶在每一次使用的時候都對百度的品牌發起重複記憶，在用戶的腦海中形成一種強勢的語言。
二、“精準”——需求前期的用戶分析
唐.諾曼曾經說過，如果用戶界麵設計中有任何神聖的原則，那必然是“了解你的用戶”。遵循這一點，我們在設計初期，對用戶畫像進行“庖丁解牛”似的分析，不但可以幫助設計師更好的理解用戶和產品，更指導和定位了產品的設計格局。
在百度Wise首頁改版設計的前期，我們使用問卷調查和用戶訪談的方法去做全方位的用戶畫像分析。
百度Wise首頁作為日均Pv1億以上的綜合性平台，細化用戶畫像，對其進行屬性分割就顯得更為重要。用戶的基本需求，除了滿足搜索以外，年輕用戶對於新聞娛樂信息有較強的閱讀，而大齡用戶則對NS等信息入口依賴性強。
針對用戶的需求劃分，我們大致歸納為信息導向、搜索導向。同時結合問卷調查中的各領域偏好，建立個性化推薦機製，增加用戶粘性，為產品創造更大的價值。我們對頁麵的整體風格設計方向的定位是個性、簡約。個性——讓用戶更有效的把注意力集中在內容上，在期間不斷的進行對設計的探索和研究，簡約——讓用戶在使用我們產品時能夠跟輕便和舒適的獲取所需。最終呈現出了全新的百度Wise產品體驗。
信息導向-feed提供個性化、多維度閱讀體驗。wise首頁從一開始的卡片聚合形式經過兩個全量版本，和無數個小版本的實驗，一步步走向feed瀑布的信息聚合形式。注重更精準的個性化信息推薦，為用戶提供更加契合的信息。
信息流由右圖模式改為左圖模式，看似一點的改變，其實卻有效的優化了用戶體驗，從眼動實驗中得到結論，人的瀏覽路線為“之”字型，圖片在左側更可以在第一時間吸引用戶的關注度，圖片的閱讀速度大於文字很多倍，可以在同樣的時間，訴求更快的得到滿足。
搜索導向-搜索入口的更好展現。搜索框作為發起搜索最直接的途徑，對它一點點的改變都是非常慎重的，在用戶對信息量需求激增的前提下，調整搜索區域與信息區域的占比變得尤為重要。運用黃金比例，將搜索框定位在一個最優的比例上，同時保證信息展現的最大化。搜索框區域提升，內容區域展現更多，滿足資訊需求。
三、“精細”——設計中細節決定成敗
精細的細節可以可以讓產品散發氣質、加強用戶對產品印象和關注度。在首頁的產品設計中我們不斷為視覺細節體驗進一步打磨。在細節中我們對圖標、文字、顏色都進行了細節的嚴格把控。
圖標在界麵設計中被廣泛的應用，圖標會延續對真實世界的認知，用圖說話，用圖溝通。百度三端首頁在圖標的設計上遵循了一直一來堅持的線型設計風格，在原型的基礎上進行精雕細琢。
讓搜索幹幹淨淨，清晰的視覺風格，去掉搜索框的效果修飾，背景顏色更加清爽。
這是我們百度首頁UE團隊的工作理念和設計觀，這是我們團隊元思考和組織建設的基礎。經過不斷的磨煉與反思，我們充分認識到了工作理念和設計觀對於一個團隊的重要性，我們時刻在提醒自己，要不斷對已有的經驗和結論進行反思，要從更多的視角對它進行觀察和思考。隻有與時俱進，才能生生不息。
最後，借用一句名言送給所有還在設計之路上的人：持之以恒的學習是設計的來源，責任感是設計的原則，而靈感是設計的升華。與大家共勉！
（本文的原文地址：http://uxc.baidu.com/51）
分享
华体会hth体育网
賞析
-
2101期學員李思庭作品
-
2104期學員林雪茹作品
-
2107期學員趙淩作品
-
2107期學員趙燃作品
-
2106期學員徐正浩作品
-
2106期學員弓莉作品
-
2105期學員白羽新作品
-
2107期學員王佳蕊作品
相關文章
多種教程 總有一個適合自己專業問題谘詢
你擔心的問題，火星幫你解答-
想要製作自己的手機遊戲嗎？火星時代教育讓您實現此目標！理論學習與實戰操作相結合，我們的專業課程將帶您逐步掌握手機遊戲製作的精髓。
-
了解影視後期技能培訓學校的重要性，以及火星時代教育如何幫助你成為創意工業的精英。
-
詳解影視概念培訓的收費模式與注意事項，以及火星時代教育在此領域的優勢和服務介紹。
-
火星時代教育為您詳盡介紹UI設計課程培訓價格，助你快速掌握UI設計技能，提升職場競爭力
-
揭示UE界麵設計的關鍵技術與實踐應用，探究如何運用設計思維和工具提升產品用戶體驗。火星時代，引領教育創新。
-
若你想浸入影視動畫行業，挑選一所優質的專業培訓機構至關重要。從專業設施、師資力量到畢業生就業，火星時代教育與眾不同，是靠譜的影......
