我是一個(gè) 95 后 homeschooler,，上過兩個(gè)星期的小學(xué)之后就離開學(xué)校，從此在家自學(xué)至今,。如果你是網(wǎng)頁設(shè)計(jì)師或者學(xué)習(xí)過 Web 前端開發(fā),，那你很有可能看過我的個(gè)人主頁。

在這個(gè)信息大爆炸的時(shí)代,，想在網(wǎng)上和好友分享點(diǎn)東西已經(jīng)有了太多選擇,。各種社交網(wǎng)絡(luò)看起來似乎完全不同，有著不同的功能特色,、滿足著不同的需求,，但實(shí)際上它們都有著一個(gè)共同點(diǎn)。下圖右側(cè)是常見的幾款社交類 App 的界面,，左側(cè)是我將它們抽象化之后的樣子,，不難發(fā)現(xiàn)其實(shí)它們本質(zhì)上其實(shí)都是一樣的：上面是你的頭像和昵稱，然后是文字內(nèi)容,，或許還會有張圖片,。

這些元素組合起來就是一條信息，把很多條這樣的信息從上到下疊在一起就成為了我們熟悉的信息流,。

信息流幾乎是所有社交類 UGC 產(chǎn)品的核心。近十年以來,，互聯(lián)網(wǎng)已經(jīng)發(fā)生了翻天覆地的變化,，信息流卻沒有過多少根本性的改變。這種信息流的優(yōu)勢在于可以讓你在非常短的時(shí)間內(nèi)快速瀏覽大量碎片化的信息,，起初感覺挺爽的,，但現(xiàn)在越來越多人逐漸意識到信息太過碎片化并不是什么好事,。

至于碎片化究竟是好還是壞,，我在這里就不作評判了，不過隨著 Twitter* 和微博相繼放開 140 字符的限制,，相信答案還是顯而易見的,。限制放開之后，尷尬的情況就出現(xiàn)了：傳統(tǒng)的信息流并不適應(yīng)較長的內(nèi)容,。因?yàn)樗且痪S的,，內(nèi)容只能朝著一個(gè)方向擴(kuò)展，所以內(nèi)容太長就會打破整體的瀏覽節(jié)奏,。

對于這個(gè)問題,，通常的解決方法是在信息流里僅顯示少量預(yù)覽內(nèi)容，點(diǎn)擊之后才展開或跳轉(zhuǎn)到新頁面查看全文,。當(dāng)然還有更簡單粗暴的解決方法：把文字都拼到長長的渣畫質(zhì)圖片里發(fā)布,，也就是我們熟悉的長微博。這些處理方法雖然能解決問題,，卻一點(diǎn)也不優(yōu)雅,。在我看來，要完美地解決這個(gè)問題,，唯有完全徹底地重新設(shè)計(jì)一個(gè)信息流,。而這，正是我在過去九個(gè)月時(shí)間里所做的,。

我發(fā)現(xiàn)，信息流的長短是由兩個(gè)維度決定的,，分別是時(shí)間軸和內(nèi)容軸,。傳統(tǒng)信息流將這兩個(gè)維度壓縮進(jìn)一維的空間里，擴(kuò)展能力自然會受到限制,。

畢竟在傳統(tǒng)信息流出現(xiàn)的時(shí)代,，我們與用戶界面交互時(shí)所用的主要設(shè)備還是鼠標(biāo)，而具體到翻閱網(wǎng)頁時(shí),，則是鼠標(biāo)的滾輪——只能上下滾動,。雖然在移動觸屏設(shè)備成為主流的今天,，這個(gè)問題早已不復(fù)存在，無論是上下滑動還是左右滑動都是習(xí)以為常的操作,，但信息流的設(shè)計(jì)卻依然繼承著 PC 時(shí)代遺留下來的傳統(tǒng)操作習(xí)慣,，未能充分利用觸摸屏幕的優(yōu)勢。

現(xiàn)在,，是時(shí)候改變一下了,。

我應(yīng)用了一種全新的二維信息流，它可以往水平和垂直兩個(gè)維度擴(kuò)展,，橫向是時(shí)間,，縱向是內(nèi)容。這種經(jīng)過“升維”的設(shè)計(jì)完全突破了內(nèi)容長度的限制,。用戶的發(fā)布內(nèi)容顯示在長度可變的卡片里,，左右滑動瀏覽不同的卡片，上下滑動查看單張卡片的內(nèi)容,。

既然有理論上可以承載無限長度內(nèi)容的信息流，如何充分利用它,？這就要說到我的第二大創(chuàng)新——模塊化內(nèi)容,。也就是說，卡片里的所有內(nèi)容都是由模塊組成的,，每種模塊都有特定的功能,，比如想發(fā)一段文字，就用文字模塊,；要分享一組照片,，則可以用圖片模塊。

我目前已經(jīng)開發(fā)了文字,、圖片,、語音和位置模塊，還有更多模塊正在設(shè)計(jì)和開發(fā)中,，包括視頻和涂鴉板等等,。這些模塊可以任意添加、排序及組合,。每個(gè)模塊也有許多可自定義的細(xì)節(jié),，比如文字的字體、字號和對齊方式,，或者圖片的形狀和排列方式等等,；當(dāng)你分享所在位置時(shí)，甚至連地圖的縮放比例都可以調(diào)節(jié)。

不過,，要是有些時(shí)候懶得調(diào)整那么多細(xì)節(jié),，只想簡單快速地分享些東西呢？沒問題,。我開發(fā)了一個(gè)自動排版引擎,，它會分析每張卡片的內(nèi)容與模塊組合情況，動態(tài)計(jì)算與調(diào)整各個(gè)模塊的樣式,、尺寸和間距等幾十項(xiàng)參數(shù),。因此，無論你輸入的是短短幾個(gè)字,，還是包含許多模塊的復(fù)雜內(nèi)容,，都能自動為你生成一張好看的卡片。

智能的排版渲染配合高度個(gè)性化的模塊化設(shè)計(jì)徹底擺脫了固定格式的束縛,，讓你充分發(fā)揮自己的想象力,，分享不拘一格,。

“變化”是這個(gè) App 的核心,，所以我給它起的名字就是：Vary。

Vary 是一個(gè)定位于在熟識好友間分享生活的社交網(wǎng)絡(luò),，重點(diǎn)是私密和清凈。在這里,，沒有網(wǎng)站鏈接,，沒有廣告和軟文，沒有代購和營銷,，沒有無謂的雞湯,，也沒有繁重的人際關(guān)系。只是在喧鬧紛亂的網(wǎng)絡(luò)世界里,，一個(gè)可以安安靜靜地與你在乎的,、真正關(guān)心你的人分享和記錄自己生活的地方。

如今的互聯(lián)網(wǎng)世界,，已經(jīng)有了太多助你結(jié)識陌生人的社交產(chǎn)品,，但專為私密好友間交流的卻寥寥可數(shù)。在我看來,，這很大程度上是因?yàn)槠毡橛^點(diǎn)認(rèn)為這種產(chǎn)品難以大量聚攏用戶和維持活躍度,，若從商業(yè)角度出發(fā)，無論是大型互聯(lián)網(wǎng)公司還是創(chuàng)業(yè)公司都不太會優(yōu)先考慮這種產(chǎn)品,。

然而 Vary 是我出于興趣愛好而制作的個(gè)人作品,，商業(yè)利益并不是我的首要考慮，因此在這里你會看到許多與主流互聯(lián)網(wǎng)產(chǎn)品“反其道而行”的設(shè)計(jì)：使用純數(shù)字賬號體系，只有知道這個(gè)賬號的人才能向你發(fā)送好友請求,，除此之外無法通過其他途徑搜索到你,；只有你同意與對方成為好友后，對方才能看到你發(fā)布的卡片,；不會通過匹配手機(jī)或郵箱向你推薦那些你可能認(rèn)識（但永遠(yuǎn)不想加為好友）的人,；你發(fā)出的評論和點(diǎn)贊也只有接收者可見。

總而言之,，一切盡在你的掌控之中,。

此外，在 Vary 上可添加的好友數(shù)量是有限的,，這個(gè)上限數(shù)量會隨著你的使用情況逐漸增加,。如果你想讓更多人看到你創(chuàng)作的卡片，可以用內(nèi)置的分享功能將卡片微博,、微信或者其他社交網(wǎng)絡(luò),，也可以生成分享鏈接直接發(fā)送給別人。

我是一個(gè)極簡主義者,，相信這點(diǎn)已在 Vary 的設(shè)計(jì)上體現(xiàn)得淋漓盡致。

通常簡化設(shè)計(jì)的思維方式是做減法,，即思考現(xiàn)有的東西里哪些是可以去除的,；而我則喜歡從零開始做加法：徹底放下成見，從根本上思考每一個(gè)元素存在的必要性,。這種思維方式在 Vary 的界面,、交互和功能上都有所體現(xiàn)。

比如注冊賬號時(shí),，你需要填寫的東西精簡到了極致：不需要任何個(gè)人信息,，也不用驗(yàn)證激活，只要設(shè)置一個(gè)登錄密碼——沒錯(cuò),，只填個(gè)密碼就能完成注冊并開始使用,，比第三方賬號登錄還方便。

同時(shí)我也在不斷研究如何通過技術(shù)手段來引導(dǎo)交互層面的創(chuàng)新,，例如 Vary 的 iOS App 可以檢測手指接觸屏幕的面積,，并以此來調(diào)整卡片的滾動速度：用指尖滑動時(shí)，一次只會滾動一張卡片,；整個(gè)手指貼在屏幕上滑動時(shí),，則會根據(jù)你滑動速度的慣性來連續(xù)滾動多張卡片。

界面設(shè)計(jì)方面,，自然是我代表性的簡約風(fēng)格,，并采用以高冷暗色系為主的純黑白設(shè)計(jì),，除極少數(shù) UI 元素外再無任何顏色，層次感由灰度,、透明度與模糊效果來體現(xiàn),。

我一向注重細(xì)節(jié)，Vary 的界面細(xì)節(jié)更是以藝術(shù)品的標(biāo)準(zhǔn)來要求的,，每一個(gè)圖標(biāo),、每一幀動畫都由我親手繪制并在程序中實(shí)現(xiàn)，處處細(xì)節(jié)都經(jīng)過反復(fù)打磨,，盡可能追求完美,。若從理性的商業(yè)角度出發(fā)，這種程度的追求幾乎是不可理喻的,，因?yàn)樗耐度氘a(chǎn)出比簡直慘不忍睹,，但我并不在乎。

看過我個(gè)人網(wǎng)站的朋友們應(yīng)該都知道,，設(shè)計(jì)和編程是我的兩大愛好，我也一直在探索如何將它們更好地結(jié)合起來,。

過去幾年里,，我每年都會徹底重新設(shè)計(jì)和開發(fā)一次我的個(gè)人主頁（翁天信 · Dandy Weng），以展示我在過去的一年里所學(xué)會的新東西,。然而 Vary 的開發(fā),，則是將過去這些經(jīng)驗(yàn)全部整合在一起，再閉關(guān)修煉了一年多之后,，才得以協(xié)調(diào)使用六種計(jì)算機(jī)語言和十余種開源框架來實(shí)現(xiàn)的。

目前 Vary 的 iOS 版本已經(jīng)上架 App Store,，初版仍有些不足之處,，我會在后續(xù)迭代中逐漸完善，希望大家多提些建議,。同時(shí) Android 版本正在開發(fā)中,，爭取在六月份上線。

最后,，我開通了一個(gè)微信公眾號,，任何與 Vary 相關(guān)的事情都可以在這里和我交流、提交建議和 bug 反饋等等,，有問必答,。我也會將 Vary 的最新動態(tài)通過這個(gè)公眾號推送給大家。如果你是一位 iOS / Android / Web 開發(fā)者,，有意愿參與 Vary 的開發(fā),，也可以和我談?wù)劇？偠灾?，如果你?Vary 感興趣,，就在微信搜索 VaryApp 或者掃描下方的二維碼關(guān)注一下吧。期待你的反饋,。

* Twitter 曾傳言放開至 10,000 個(gè)字符,，但目前依然限制在 140 字符