知乎自創(chuàng)始以來，已逐步成長(zhǎng)為中國(guó)互聯(lián)網(wǎng)一只不可忽視的力量。與老師傅Quora和同門師兄果殼不同，知乎走出了一條媒體化、社交化的道路，并借助知識(shí)這一人類精神食糧，成功的從屌絲氣息濃重的中國(guó)互聯(lián)網(wǎng)中脫引而出，出落的俊秀挺拔。

知乎的官方客戶端只有iOS和Android兩個(gè)平臺(tái)，且兩個(gè)平臺(tái)均只有小尺寸的移動(dòng)版本（知乎iPad版現(xiàn)已推出，但基本是iPhone版的拉伸版），而Windows平臺(tái)則只有SunfungApp的“愛知乎”和Rick Zhao的“之乎”兩個(gè)第三方應(yīng)用暫時(shí)解渴，不過前者已長(zhǎng)時(shí)間沒有再更新，后者則因不厭其煩的“買設(shè)備”而備受指責(zé)，甚至連知乎都出現(xiàn)了相應(yīng)的提問。

筆者并非程序員，無法獨(dú)立開發(fā)出并發(fā)布應(yīng)用，因而只得略盡綿力，草草構(gòu)思一款UWP知乎客戶端，希望借此能概覽Windows 10的全新Metro設(shè)計(jì)語言并為其他開發(fā)者提供一些設(shè)計(jì)上的思路。

功能架構(gòu)

在iOS客戶端中，知乎將其底部的Tab分為首頁(yè)、發(fā)現(xiàn)、消息和設(shè)置四項(xiàng)，前兩者為主要閱讀入口，且首頁(yè)整合了搜索和提問入口，發(fā)現(xiàn)入口內(nèi)還有熱門、推薦和收藏三個(gè)子Tab，消息則為提醒類入口，設(shè)置內(nèi)分為個(gè)人中心和應(yīng)用設(shè)置兩大類。

總結(jié)的說，知乎最核心的入口依然是首頁(yè)的信息流，同時(shí)提供一個(gè)與用戶無關(guān)的系統(tǒng)推薦閱讀，而消息則是一個(gè)需要第一時(shí)間顯示并快速進(jìn)入的入口，同時(shí)也是后續(xù)社交化發(fā)展的重要媒介，設(shè)置和個(gè)人中心使用頻率較低，因而可以適當(dāng)弱化。

相較于iOS客戶端，Android客戶端雖然在整體設(shè)計(jì)和細(xì)節(jié)交互優(yōu)化上均不如意，但卻更符合知乎的業(yè)務(wù)邏輯：被強(qiáng)調(diào)的消息流置于首頁(yè)，消息至于導(dǎo)航欄，明顯且快捷（無視屏幕尺寸的條件下），個(gè)人中心和設(shè)置均隱藏于漢堡菜單中，不足之處在于發(fā)現(xiàn)入口也置于漢堡菜單中，考慮到Android平臺(tái)對(duì)于漢堡菜單的利用方式，這將極大的弱化該入口的重要性。

對(duì)于Windows 10平臺(tái)，漢堡菜單和操作欄的引入，使其交互語言非常接近Android平臺(tái)。

通用版知乎客戶端首頁(yè)頂端為導(dǎo)航欄+操作欄，其余區(qū)域均留給內(nèi)容展示。操作欄有消息入口，搜索（提問）入口和菜單(夜間模式和無圖模式)。

在字體選擇上也遵循標(biāo)準(zhǔn)，暫時(shí)選擇微軟雅黑作為主體字體，字號(hào)為13pt（考慮到桌面版拉伸的問題，14pt更為合適，該問題將在后續(xù)推進(jìn)中改進(jìn)）和16pt。

桌面端在遵循移動(dòng)端的設(shè)計(jì)語言的同時(shí)，在消息流卡片中引入了圖片，保證閱讀時(shí)的豐富性和趣味性。

通用和漢堡

Windows 10的通用平臺(tái)引入了漢堡菜單和操作欄（command bar），但使用方式與iOS和Android卻不盡相同。

UWP對(duì)于漢堡的定義并不廣，基本局限于根目錄級(jí)Tab的切換，同時(shí)在底部整合個(gè)人中心和設(shè)置，桌面端利用鼠標(biāo)和漢堡的懸停可以保證切換的便利性，而移動(dòng)端則需要喚出漢堡菜單才能實(shí)現(xiàn)切換，這會(huì)極大的減弱用戶的切換熱情，雖然歷經(jīng)多年，漢堡菜單已被大眾消費(fèi)者所熟悉和適應(yīng)，但依然并非入口切換的最佳選擇。

UWP選擇漢堡菜單更多是為了遷就桌面端應(yīng)用的體驗(yàn)。對(duì)于桌面端應(yīng)用來說，漢堡菜單已經(jīng)證明了自己的優(yōu)勢(shì)所在，而移動(dòng)端則只能犧牲切換上的便利性換取全平臺(tái)的一致性。

消息

將消息置于首頁(yè)操作欄，其實(shí)一開始我是拒絕的。畢竟那是command bar而不是入口，消息更應(yīng)該置于漢堡菜單中與iOS端一致，但考慮到提示的明顯性和便捷性，最終還是選擇妥協(xié)。

消息界面最大的變化在于引入了“標(biāo)記為已讀”選項(xiàng)，尤其在“贊與感謝”標(biāo)簽內(nèi)，標(biāo)記為已讀是很有必要的一個(gè)設(shè)計(jì)，畢竟，贊和感謝這種消息，看一看既可，點(diǎn)進(jìn)去作甚？

問題和回答

問題和回答界面變動(dòng)不大，不過將邀請(qǐng)和回答從閱讀區(qū)域轉(zhuǎn)移到了操作欄中，同時(shí)在回答詳情界面，原問題也單設(shè)卡片列出，這在用戶從消息流入口進(jìn)入回答界面時(shí)，將發(fā)揮著導(dǎo)入和了解原題的作用。

而桌面端的問題主頁(yè)則略有不同，在內(nèi)容區(qū)的右側(cè)增加了相關(guān)問題選項(xiàng)，回答詳情頁(yè)取消，點(diǎn)擊回答即刻查看回答詳情，長(zhǎng)按或右擊便可進(jìn)行點(diǎn)贊評(píng)論等操作。

搜索和提問

搜索和提問界面基本遵循iOS和Android的設(shè)計(jì)邏輯，最大的不同在于，提問選項(xiàng)隱藏于而搜索頁(yè)面中，而非像iOS客戶端一樣直接展示于首頁(yè)，換句話說，這就是為了讓用戶先搜索，保證提問尚未提出再正式提問。

而另一個(gè)不同在于搜索子標(biāo)簽?，F(xiàn)有搜索界面中，僅有內(nèi)容和用戶兩個(gè)子標(biāo)簽，話題是被列入內(nèi)容一欄，這本無可厚非，但考慮到話題在搜索中的實(shí)用性和對(duì)其他內(nèi)容展示的干擾，單獨(dú)提出作為子標(biāo)簽之一或許是最好的選擇，希望之后知乎還可以進(jìn)一步加入專欄文章的子標(biāo)簽選項(xiàng)，從而拓寬子標(biāo)簽的廣度，減少深度，方便用戶在最短的時(shí)間里精準(zhǔn)的找到自己的目標(biāo)。

設(shè)置和個(gè)人中心

設(shè)置界面基本遵循Windows 10的系統(tǒng)設(shè)置界面。

最大的區(qū)別在于將消息通知的設(shè)置方式進(jìn)行了重新整理，從單個(gè)項(xiàng)目一一設(shè)置轉(zhuǎn)為通知門類一一選擇，減少用戶往返于上下兩冊(cè)的切換。

而個(gè)人中心則是改動(dòng)最大的地方，將原本雜亂的個(gè)人中心內(nèi)容整合為：個(gè)人信息、個(gè)人成就和個(gè)人動(dòng)態(tài)三個(gè)門類，他人中心和個(gè)人中心僅有關(guān)注按鍵和操作欄的區(qū)別。

至此，通用版知乎客戶端已大致預(yù)覽完畢，整款軟件尚處于概念階段，還不成熟，設(shè)計(jì)中并沒有過多涉及到細(xì)節(jié)交互，且很多地方略顯稚嫩，還希望各位海涵，多多指出并給予寶貴意見。

附上原文地址：

通用版知乎客戶端概念設(shè)計(jì) – Metro.X – 知乎專欄

http://zhuanlan.zhihu.com/metrox/20205769

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