8.0是手機(jī)百度發(fā)展過(guò)程中一個(gè)重要里程碑，它不僅延續(xù)了產(chǎn)品建立以來(lái)的要點(diǎn)，打破歷史包袱，與時(shí)俱進(jìn)地從體驗(yàn)和產(chǎn)品角度進(jìn)行了創(chuàng)新，通過(guò)全新的整體交互框架與視覺(jué)風(fēng)格，將搜索、語(yǔ)音搜索、FEED流信息獲取、多垂類(lèi)服務(wù)等進(jìn)行了再設(shè)計(jì)。

項(xiàng)目背景

手機(jī)百度作為移動(dòng)端的明星搜索工具，一直深受廣大用戶(hù)喜愛(ài)，經(jīng)過(guò)多年的發(fā)展它已經(jīng)成為用戶(hù)獲取信息和服務(wù)的重要途徑。但隨著功能越來(lái)越多，其產(chǎn)品結(jié)構(gòu)也越發(fā)復(fù)雜，原有的結(jié)構(gòu)形式已不能承載產(chǎn)品未來(lái)的發(fā)展，對(duì)產(chǎn)品形態(tài)進(jìn)行重新設(shè)計(jì)勢(shì)在必行。

在設(shè)計(jì)研究階段，團(tuán)隊(duì)內(nèi)部對(duì)收集到的問(wèn)題進(jìn)行分析和整理，歸納出以下幾個(gè)要點(diǎn)：

1. 產(chǎn)品首頁(yè)功能多、結(jié)構(gòu)復(fù)雜，產(chǎn)品定位與重點(diǎn)不明晰。
2. 首頁(yè)結(jié)合信息流的使用效果以及具體內(nèi)容的瀏覽體驗(yàn)不佳。
3. 框架種類(lèi)繁多，同一內(nèi)容在APP內(nèi)不同地方打開(kāi)的框架不一致。
4. 接入和自建的各頻道體驗(yàn)缺乏統(tǒng)一性，存在顯著的體驗(yàn)差異。
5. 視覺(jué)設(shè)計(jì)語(yǔ)言需要進(jìn)一步統(tǒng)一與升級(jí)，使產(chǎn)品整體視覺(jué)調(diào)性感受更為整體，凝煉手百的品牌氣質(zhì)。

設(shè)計(jì)與思考

8.0具有承前啟后的里程碑意義，如何繼承已有的成果和用戶(hù)習(xí)慣，同時(shí)創(chuàng)新性地解決前面提及的問(wèn)題，為后續(xù)發(fā)展打下基礎(chǔ)，是設(shè)計(jì)師在項(xiàng)目開(kāi)展之初就需要解決的問(wèn)題。

回歸用戶(hù)本質(zhì)需求：信息獲取，從減法開(kāi)始設(shè)計(jì)

設(shè)計(jì)團(tuán)隊(duì)經(jīng)過(guò)多次討論和分析，決定回歸用戶(hù)本質(zhì)需求——信息獲取，圍繞它從減法開(kāi)始做設(shè)計(jì)。新設(shè)計(jì)中突出信息獲取的重要功能：搜索和智能、個(gè)性化信息推薦，而其他功能則適度弱化和折疊。目前文本搜索是使用頻度最高的信息獲取方式，而以語(yǔ)音搜索為代表的面向未來(lái)的人機(jī)交互方式已經(jīng)日趨成熟，百度的語(yǔ)音搜索在識(shí)別準(zhǔn)確度與結(jié)果滿(mǎn)足均達(dá)到業(yè)界領(lǐng)先水平。智能的、個(gè)性化的信息推薦則代表著未來(lái)基于大數(shù)據(jù)和人工智能的用戶(hù)獲取信息的方式，百度在技術(shù)上的深厚積累，得以實(shí)現(xiàn)“千人千面”的信息與服務(wù)滿(mǎn)足。

圍繞如何讓用戶(hù)更便捷地使用各種搜索和智能信息推薦，我們嘗試了幾十版方案。并在方案雛形基本確定后，便開(kāi)始自主開(kāi)發(fā)高保真可交互Demo，團(tuán)隊(duì)內(nèi)各個(gè)角色一起試用，發(fā)現(xiàn)問(wèn)題與不足，不斷研討和完善對(duì)細(xì)節(jié)的打磨，快速地收斂了共識(shí)，并在這個(gè)過(guò)程中收獲了許多來(lái)自多種角色的優(yōu)質(zhì)建議。

功能分級(jí)和服務(wù)個(gè)性化，滿(mǎn)足不同用戶(hù)群體需要

手機(jī)百度的用戶(hù)群覆蓋面很廣，幾乎涵蓋了各個(gè)年齡段的全體網(wǎng)民用戶(hù)。結(jié)合使用數(shù)據(jù)來(lái)看，單個(gè)用戶(hù)高頻使用的功能除搜索外，還呈現(xiàn)個(gè)性化和多樣化的特點(diǎn)。如何滿(mǎn)足好共同的搜索需求，還能更好地提供個(gè)性化服務(wù)是設(shè)計(jì)中需考慮的一個(gè)要點(diǎn)。

經(jīng)過(guò)分析，我們將目標(biāo)用戶(hù)劃分為三大類(lèi)：

1. 僅使用搜索的用戶(hù)，他們進(jìn)入手百希望快速完成搜索，獲取所需要的信息。
2. 輕度定制化的用戶(hù)，他們除了使用搜索外，還經(jīng)常使用百度的貼吧、新聞、小說(shuō)等服務(wù)，他們希望功能的布局能更加符合自己的使用習(xí)慣，操作更加便捷。
3. 深度使用各種百度功能用戶(hù)，他們不僅要求精還要求全，希望在手百上實(shí)現(xiàn)一站式體驗(yàn)。

針對(duì)不同用戶(hù)，我們進(jìn)行了功能分級(jí)和服務(wù)個(gè)性化設(shè)計(jì)，用戶(hù)可以按需定制所需要的模塊，同時(shí)還對(duì)各種功能重分類(lèi)和聚合，使界面結(jié)構(gòu)與功能分區(qū)明確且純粹，便于用戶(hù)能快速找到所需。

化繁為簡(jiǎn)，統(tǒng)一內(nèi)容框架和內(nèi)容形態(tài)

首頁(yè)是一款產(chǎn)品的核心，其框架結(jié)構(gòu)、布局的設(shè)計(jì)重要性不言而喻，在8.0中我們對(duì)首頁(yè)的設(shè)計(jì)進(jìn)行了探索和重新定義。

1. 以“流式”和“精煉”為核心理念的布局形式

• 流式：Feed、搜索、第三方頁(yè)面等主體界面均為“流式”為主的交互布局，使產(chǎn)品在整體體驗(yàn)上保持一致。
• 精煉：歸納整合了首頁(yè)的功能模塊，確保單一模塊功能單純，降低用戶(hù)的理解成本，提升易了用性。

2. 以“極簡(jiǎn)、清晰、舒適”為核心理念的視覺(jué)風(fēng)格

• 構(gòu)圖：極簡(jiǎn)構(gòu)圖，去除所有裝飾元素，通過(guò)嚴(yán)謹(jǐn)排版調(diào)整各部分的比例關(guān)系，使頁(yè)面干凈，清晰和美觀，以黃金分割進(jìn)行版面結(jié)構(gòu)的縱向劃分，使頁(yè)面布局舒適、耐看、經(jīng)得起時(shí)間的考驗(yàn)。
• 品牌：通過(guò)對(duì)“留白、紅藍(lán)”“左右平衡構(gòu)圖”的進(jìn)一步優(yōu)化，強(qiáng)化品牌感受；并使PC和移動(dòng)多端首頁(yè)形成品牌氣質(zhì)的一致性。

精簡(jiǎn)內(nèi)容框架：將原有的5種框架縮減為3種，對(duì)類(lèi)似功能的框架進(jìn)行了合并，這不僅提升了統(tǒng)一性，而且減少了技術(shù)架構(gòu)的復(fù)雜度。在合并框架的同時(shí)，我們還保留了框架元素的靈活性，為具體場(chǎng)景和服務(wù)下的拓展預(yù)留了空間。

在框架統(tǒng)一的諸多方案中，經(jīng)過(guò)調(diào)研和測(cè)試，我們最終選擇了底部返回的基礎(chǔ)框架形態(tài)，并將主要功能整合其上，不僅使框架形式更加統(tǒng)一，而且在在大屏手機(jī)成為主流的背景下，用戶(hù)也能更方便地操作界面底部常用功能。

精簡(jiǎn)內(nèi)容形態(tài)：信息流Feed 是本次設(shè)計(jì)的一個(gè)重點(diǎn)，它不僅提供了一種快速獲取信息的方式，而且是后續(xù)智能化推薦的承載體。在設(shè)計(jì)中我們從單體模板的角度對(duì)可能接入的內(nèi)容形式進(jìn)行了分類(lèi)和抽離統(tǒng)一，有效地保證了內(nèi)容形式的精簡(jiǎn)和高延展性。使豐富的各類(lèi)資訊內(nèi)容的排版與布局舒適合理，提升閱讀的沉浸感與流暢性。

建立統(tǒng)一標(biāo)準(zhǔn)，打造平臺(tái)化體驗(yàn)

手機(jī)百度作為一款平臺(tái)性產(chǎn)品，接入了很多由合作團(tuán)隊(duì)開(kāi)發(fā)的產(chǎn)品。為了保證用戶(hù)在使用手百時(shí)能有統(tǒng)一的使用體驗(yàn)，在8.0項(xiàng)目設(shè)計(jì)的伊始，我們分析各內(nèi)外部服務(wù)的特點(diǎn)，總結(jié)歸納共性制定出一套統(tǒng)一的平臺(tái)化設(shè)計(jì)標(biāo)準(zhǔn)。

從接入內(nèi)容的架構(gòu)、產(chǎn)品界面布局、控件元素、品牌等多維度進(jìn)行規(guī)范，有效地保證了最終的用戶(hù)體驗(yàn)。

簡(jiǎn)潔靈動(dòng)的細(xì)節(jié)設(shè)計(jì)，構(gòu)建產(chǎn)品的品牌特征

傳統(tǒng)工具類(lèi)產(chǎn)品給用戶(hù)的印象更多是冷冰冰和機(jī)械化。為了突破這種印象，在本次設(shè)計(jì)中，我們嘗試通過(guò)簡(jiǎn)潔靈動(dòng)的細(xì)節(jié)設(shè)計(jì)來(lái)構(gòu)建產(chǎn)品的品牌特征，以平面化的幾何形態(tài)為基礎(chǔ)，輔以典型的色彩和動(dòng)畫(huà)效果來(lái)構(gòu)建自己的特征，加深在用戶(hù)心目中的印象。

例如語(yǔ)言搜索靈動(dòng)的細(xì)節(jié)設(shè)計(jì)不僅展現(xiàn)了人工智能的強(qiáng)大和靈敏，而且形成了典型的品牌特征，這套設(shè)計(jì)語(yǔ)言也貫穿了手百的各個(gè)模塊設(shè)計(jì)中。

總結(jié)

8.0是手機(jī)百度發(fā)展過(guò)程中一個(gè)重要里程碑，它不僅延續(xù)了產(chǎn)品建立以來(lái)的要點(diǎn)，打破歷史包袱，與時(shí)俱進(jìn)地從體驗(yàn)和產(chǎn)品角度進(jìn)行了創(chuàng)新，通過(guò)全新的整體交互框架與視覺(jué)風(fēng)格，將搜索、語(yǔ)音搜索、FEED流信息獲取、多垂類(lèi)服務(wù)等進(jìn)行了再設(shè)計(jì)。在設(shè)計(jì)過(guò)程中，我們也深刻認(rèn)識(shí)到把握用戶(hù)需求，結(jié)合技術(shù)和商業(yè)模式進(jìn)行分析和研究是設(shè)計(jì)工作的要點(diǎn)。只有不斷地探索，才能從諸多可能性中找到最適合的方案，為用戶(hù)提供更好的服務(wù)。

本文由 @百度MUX?原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。