從2012年成立至今，字節(jié)已經(jīng)發(fā)展十周年了。相信絕大部分人和我一樣，對(duì)這家公司的認(rèn)識(shí)就是頭條、抖音、飛書，然而字節(jié)跳動(dòng)不只是一家創(chuàng)新力十足的互聯(lián)網(wǎng)巨頭，它在社會(huì)責(zé)任方面也默默做了許多。

今年3月，字節(jié)的同學(xué)找到我，他們想通過線上展覽的方式分享字節(jié)在企業(yè)社會(huì)責(zé)任各個(gè)領(lǐng)域所做的努力與嘗試。隨后我們便著手啟動(dòng)了設(shè)計(jì)項(xiàng)目。

此次線上展決定采用微信長(zhǎng)圖文的方式呈現(xiàn)，長(zhǎng)圖文是我們?nèi)粘Ｗ钍煜げ贿^的一種公眾號(hào)推文形式。

看似一張微不足道的微信推文長(zhǎng)圖，真的想花心思做好，它的復(fù)雜程度可能遠(yuǎn)超你的想象。

今天就帶你看看，字節(jié)跳動(dòng)十周年公益線上展的長(zhǎng)圖背后是怎樣的創(chuàng)作過程。

探索

項(xiàng)目啟動(dòng)后，我們和客戶進(jìn)行充分的探討，確定了一個(gè)方向，我們要在推文里營(yíng)造出線下逛藝術(shù)展的氛圍。

根據(jù)這個(gè)大方向，我們開始調(diào)研大量風(fēng)格的作品，構(gòu)思所有可能的創(chuàng)作方向。

我們決定選擇以白色為主，用極簡(jiǎn)性冷淡的風(fēng)格去營(yíng)造展覽氛圍，用盲文、展臺(tái)上圖標(biāo)同色陰影等細(xì)節(jié)去豐富畫面質(zhì)感。很快我們就出了第一稿Demo，經(jīng)客戶確定風(fēng)格初稿之后，開始了接下來的深入創(chuàng)作。

深化

在接下來的深入設(shè)計(jì)過程中，我們和客戶多次視頻會(huì)議溝通，一遍一遍地努力打磨著畫面細(xì)節(jié)，以求達(dá)到完美演繹。

這其中包含著陰影光效是否寫實(shí)，結(jié)構(gòu)設(shè)計(jì)是否合理，元素使用是否符合這次展覽的主題等，各種各樣的細(xì)節(jié)問題在一次次的調(diào)整和磨合中，越來越接近完美。

細(xì)節(jié)

“Less is more（少即是多）” 。我們都聽過這句著名建筑大師密斯·凡·德·羅的名言。

其實(shí)，他還說過另一句話，“魔鬼在細(xì)節(jié)”。

好的作品，不論何種風(fēng)格，都是充滿細(xì)節(jié)與思考。

推文長(zhǎng)圖一屏所展示內(nèi)容，長(zhǎng)度不超過15cm寬度不超過7cm。在這方寸之間的畫面，我們對(duì)每一處設(shè)計(jì)細(xì)節(jié)都充分思考，力求處處考究。

到底有多細(xì)呢？

我們甚至為了畫面內(nèi)容的準(zhǔn)確呈現(xiàn)，精心設(shè)計(jì)了明確的「物理級(jí)展墻結(jié)構(gòu)」以確保內(nèi)容層級(jí)邏輯準(zhǔn)確。

（虛擬展墻的頂視結(jié)構(gòu)圖）

（對(duì)應(yīng)結(jié)構(gòu)呈現(xiàn)的效果）

接下來通過大圖，帶你欣賞一下這琳瑯滿目的精彩細(xì)節(jié)。

真實(shí)的材料質(zhì)感

多樣的畫面結(jié)構(gòu)

豐富的光影細(xì)節(jié)

結(jié)果

歷經(jīng)30個(gè)版本的迭代探索，終于誕生了最終的上線版。

（大版本迭代對(duì)比）

由于疫情等因素的延期，終于在9月5日，全國(guó)第七個(gè)“中華慈善日”，此次線上展推文在「公眾號(hào)：字節(jié)范兒」推送，當(dāng)天閱讀量就達(dá)到了1.5萬+，精選評(píng)論30+。

（最終上線版切圖集合）

歷時(shí)半年，字節(jié)十周年社會(huì)責(zé)任線上展終于畫上了圓滿的句號(hào)，其實(shí)設(shè)計(jì)創(chuàng)作就和公益愛心一樣，每一件小事，每一個(gè)點(diǎn)滴，都值得我們?nèi)橥度搿?/p>

點(diǎn)滴善意可以匯聚成巨大的力量，微小的推文也能設(shè)計(jì)出別樣的精彩！