前言：小編是個重度的閱讀產品使用者（做編輯這行不讀書怎么行），幾乎用遍了網上的各種閱讀產品，最近在網上發現了一款非常低調的產品上線了，一查竟然是百度出品的，因為經常接觸百度系產品，這個產品的設計體驗和以往的都不同，然后就在網上搜索資料，查到了一位資深設計師對這個產品的評價，寫的非常誠懇（小編可以偷懶了），照搬過來如下： 

（“百度閱讀pro”app首頁）

　　從“形色字構質動”來評價“百度閱讀pro”的視覺設計 

　　By李天真（視覺設計師）：注：本次測評采用的手機為iPhone8，軟件版本為V1.0.1 

寫在前面 

　　“形色字構質”是組成一個app視覺語言最基本的五個維度，而動效設計是UI設計的新趨勢，所以筆者將從形、色、字、構、質、動六個維度對“百度閱讀pro”的視覺設計進行分析和評價。 

　　在此之前，我們需要對這六個維度進行簡單的介紹，明確“百度閱讀pro”app的產品定位與目標用戶。 

　　由《你的閱讀專屬手冊》可知，“百度閱讀pro”的產品定位是“在百度閱讀app上提煉出來的以全場免費讀為主線，提供舒適的沉浸式閱讀體驗，為用戶推薦最為合適的書籍、找到所求，建立自己的私人圖書館”的app。 

　　由“百度閱讀”app在2016年發布的“用戶畫像數據報告”推測，“百度閱讀pro”的用戶年齡集中分布在25-30歲區間，多為學生和白領。 

（《你的閱讀專屬手冊》）

一、形 

　　“百度閱讀pro”有線型和MBE兩種風格的icon。其中TabBar中的四個導航icon采用了MBE風格，豐富了界面細節的同時也與其他icon有效地區分開來，簡約而不簡單，符合目標用戶的主流審美傾向。剩余的icon均采用了線型風格，比起存在感較強的面型風格icon，對用戶的干擾較小，更有利于沉浸式閱讀體驗的打造。 

　　icon的一致性做得很好，描邊控制在兩種尺寸，對描邊的端口、轉折都進行了圓角處理，同一區域各個icon的視覺尺寸統一和諧。這體現了“百度閱讀pro”的專業性，傳達了品牌形象。 

二、色 

　　“百度閱讀pro”的色彩運用十分克制、有序。醒目的品牌藍色作為點睛色突出重點信息，其余信息根據優先級分別采用不同飽和度的黑灰色。這一色彩體系提高了信息的傳遞效率，符合“提供舒適的沉浸式閱讀體驗”的產品目標。過于豐富的色彩體系會分散用戶的注意力，而該app避開了這一陷阱。并且，用戶的閱讀場景既可能是安靜的室內，也可能是喧囂的地鐵，所以簡潔的配色能夠幫助用戶在不確定的閱讀環境下提高閱讀效率。

　　此外，這個app還有一個貼心的小細節。眾所周知，長時間用手機閱讀會引起眼睛不適，為了減輕用戶的壓力，“百度閱讀pro”在閱讀界面采用了色值為#f8f8f8的背景色，避免文字與背景對比過于強烈，更適于長時間閱讀。 

　　該app的字體顏色不是常見的#333333、#666666、#999999搭配，而是帶有藍色的黑灰色，把品牌DNA融入界面設計中，在不干擾用戶的前提下提高品牌認知度。 

三、字 

　　“百度閱讀pro”采用了蘋方字體、方正中粗雅宋簡體、方正細雅宋簡體、Source Serif Pro Semibold四種字體。其中標題使用方正中粗雅宋簡體，閱讀界面正文用方正細雅宋簡體、重要數字用Source Serif Pro Semibold，其余文字用蘋方字體。 

（“百度閱讀pro”所用字體）

　　宋體和襯線體為其增添了人文氣息，讓人聯想起傳統的紙質閱讀，為用戶營造一種閱讀氛圍，而且也提高了“百度閱讀pro”的品質感。當然，對于手機屏幕里長篇的正文采用黑體更好還是宋體更好，目前還沒有定論，但同樣是閱讀類app，“微信讀書”、“網易蝸牛讀書”、“輕芒”、“豆瓣閱讀”、“QQ閱讀”、“網易云閱讀”用的都是黑體，而我個人的體驗也是在屏幕上黑體更適于長時間閱讀。 

　　界面里不同層級的信息字號對比也比較清晰明確，用戶能夠快速獲取自己想要的信息。 

四、構 

　　“百度閱讀pro”采用了大面積留白、去灰底、去分割線的布局方式，利用舒適的間距劃分信息，去掉一切不必要的元素，使用戶瀏覽盡可能的流暢無阻。這種布局方式比較新穎獨特，給人留下深刻印象，貼合目標用戶的審美趨勢。并且欄目內容排版也比較簡潔大氣，內容層次分明，瀏覽節奏舒適。與“QQ閱讀”密集多變的布局風格相比，“百度閱讀pro”顯然更有呼吸感、通透感，而沒有壓迫感。 

五、質 

　　“百度閱讀pro”在扁平風格的基礎上加入了微投影。和“豆瓣閱讀”的投影比起來，“百度閱讀pro”的投影自然舒適，過渡流暢，突出重要內容、增強空間感的同時，又避免過于搶眼。并且微投影僅用于突出書籍封面，使用原則明確，易于掌握。除此之外并無更多材質，圖標、組件都是干凈清爽的扁平風格。這樣能最大限度地減少界面元素對用戶的干擾，讓其注意力集中在內容本身，體現了“提供舒適的沉浸式閱讀體驗”的初心。 

　　當然然，像“微信讀書”一樣再特色頁面添加一點微材質，可以給用戶更多驚喜。 

六、動 

　　動效設計應該是“百度閱讀pro”最明顯的視覺瑕疵。平心而論，設計師在動效上花費的心思也不少，在過渡、加載等方面都設計了動效，但是還是有讓人遺憾的地方。 

　　比如，首頁書籍切換時有明顯的卡頓現象，個人認為是因為被切換的書籍是在最后一刻突然轉換狀態，而不是逐漸改變不透明度；又比如，TabBar的圖標點擊動效只是簡單的縮放，實際上可以像QQ一樣增加一點趣味性；還有，閱讀界面的時間動效非常搶眼，對我的閱讀和操作造成了干擾。 

　　當然，還是有不錯的動效，比如進入閱讀界面時的翻書加載動效。可見設計師還是非常注重細節的，剛剛提到的瑕疵可能是技術、時間、產品需求的原因。相信在以后的版本里會逐步完善。 

結論： 

　　綜上所述，“百度閱讀pro”實現了“提供舒適的沉浸式閱讀體驗”這一產品目標，也符合目標用戶的審美情趣，是一款在視覺設計上非常出色的app。對于普通用戶，可以去暢游書海，對于設計師，可以去欣賞和學習其視覺細節。總而言之非常推薦！ 

　　當然以上就是小編照搬而來的，以上版權歸原作者所有哈，這款產品上線一個多月，在Apple Store上成功的被蘋果大大推薦了，蘋果大大推薦的都是設計非常優美的產品，這款產品也收到的非常多的好評。 

　　小編比較好奇的是什么樣的一個UX團隊做的這個產品，小編作為設計圈的小達人，進行了多方打聽，最后找到了這個團隊的負責人：狄濤老師。 

　　經過狄濤老師介紹，原來這個是一個非常低調的團隊，團隊名稱：百度教育UE團隊，簡稱：EDUX。 

　　團隊是在2017年才成立不久的，是百度非常專業的UX團隊之一，旗下擁有多款優秀的產品，常年在Apple Store教育類，圖書類排名前幾，每日服務的用戶也多達千萬級別，狄濤老師說：“我們做的設計是一個體系，有靈魂的設計（產品思維），有感官溫度的設計（體驗為先），注重細節的設計（設計本質），這些是我們團隊設計體系的基礎構成，然后加以用戶精準人群分析，需求場景再現，數據論證驗證，延伸觸達共鳴，來不斷的完善這個體系，打造成功的產品。” 

　　百度EDUX團隊的作品視頻： 

https://v.youku.com/v_show/id_XMzkwNTAzMjkwOA==.html?spm=a2h3j.8428770.3416059.1

　　作品視頻的展示很震撼，后續小編也會繼續關注這個低調的設計團隊哦，歡迎大家繼續關注。 

　　（編輯：徐姝琦）