2020-4-22 資深UI設(shè)計者
目前眾多的網(wǎng)文產(chǎn)品中,設(shè)計同質(zhì)化比較高,無論是產(chǎn)品視覺或是品牌運營視覺大多都缺乏獨創(chuàng)性與統(tǒng)一性。番茄小說想要從眾多產(chǎn)品中脫穎而出就需要走出一條合而不同的設(shè)計道路。因此提升產(chǎn)品的識別度與消費者對品牌的認(rèn)知勢在必行,設(shè)計需探索構(gòu)建一套屬于產(chǎn)品的語言體系。
探索番茄小說的設(shè)計語言,建立產(chǎn)品認(rèn)知
傳統(tǒng)文學(xué)
文學(xué)分為兩類,嚴(yán)肅文學(xué)(看重語言和細(xì)節(jié))、通俗文學(xué)(注重情節(jié)和故事,淺顯易懂)。
周憲《文學(xué)理論導(dǎo)引》里定義「文學(xué)是以精致語言書寫的具有藝術(shù)價值的以文本為中心的文化系統(tǒng)?!雇ㄟ^定義可以概括出文學(xué)的特點就是具有藝術(shù)價值,并且能夠通過文字內(nèi)容帶人用戶反思或者收獲。當(dāng)人們在閱讀文學(xué)書籍時是冷靜的,只有在這樣的心境下讀者才能更好的獨立思考與分析。因此在氛圍上需要給用戶提供一個相對沉浸的空間、安逸的環(huán)境,通過分析可以提煉出的傳統(tǒng)文學(xué)情緒關(guān)鍵詞:沉浸、冷靜、舒適、價值
網(wǎng)絡(luò)文學(xué)
不同于傳統(tǒng)文學(xué),網(wǎng)絡(luò)文學(xué)是順應(yīng)市場價值而誕生,是文學(xué)創(chuàng)作的平民化,讓大家能夠以網(wǎng)絡(luò)為載體而發(fā)表的文字內(nèi)容。廣義來說,網(wǎng)絡(luò)文學(xué)屬于通俗文學(xué)的一類,注重情節(jié)和故事,通過文字傳遞的內(nèi)容更加的樸實、接地氣,在創(chuàng)作分類上也更加的多樣化,作者可以天馬行空的表達自己感受,可以說是在傳統(tǒng)文學(xué)的基礎(chǔ)上,給文字增加了幾分煙火氣息,也多了幾分熱鬧的感受。
因此通過文學(xué)關(guān)鍵詞可擴展出網(wǎng)絡(luò)文學(xué)情緒關(guān)鍵詞:沉浸、愉悅、煙火氣
前期通過對小說用戶群體與市場的走訪調(diào)研,并通過數(shù)據(jù)分析,我們得到了如下結(jié)論:
產(chǎn)品用戶類型
12-50歲青中年人;后GenX時代;一二三線城市有閱讀小說習(xí)慣的人群;目前為對生活充滿向往的學(xué)生與藍(lán)領(lǐng)
產(chǎn)品品牌人格
樂觀愉悅(輕松);品質(zhì)(書好);親民、豐富(書多)
產(chǎn)品視覺風(fēng)格
品牌色貫穿產(chǎn)品,但不過分使用;視覺為產(chǎn)品功能服務(wù),不做多余的設(shè)計;視覺表現(xiàn)多樣化,但需要表達相同的產(chǎn)品氣質(zhì);適度的留白,增強設(shè)計空間感
產(chǎn)品核心詞:「沉浸中的愉悅」
正如我們對文學(xué)的分析,小說閱讀同樣是一種獨立個體的行為方式,在讀書時,我們不希望被人打擾,不希望被瑣事細(xì)節(jié)阻斷,我們希望在一個相對安靜、舒適的環(huán)境下閱讀,這是一種沉浸式的感受。
因此這里我們就根據(jù)用戶的想要的感受,引入「沉浸」的概念——希望能夠給讀者留下一定的空間,并拋除繁雜打擾,讓大家享受閱讀與獨立思考。其核心是圍繞信息內(nèi)容本身而呈現(xiàn),設(shè)計不再作為獨立于內(nèi)容之外的元素存在,而將著眼于內(nèi)容本身,為用戶打造直觀的視覺體驗。拉大層級對比,增加適當(dāng)?shù)牧舭?,在一定程度上增加少許修飾,打破絕對的冷淡。其既能體現(xiàn)出文學(xué)的特點,又能夠在簡約的基礎(chǔ)上增加畫面的構(gòu)成感,給用戶愉悅的感受。
觸感
網(wǎng)絡(luò)小說與傳統(tǒng)文學(xué)另外一個最大的區(qū)別是觸感。
傳統(tǒng)文學(xué)大多以實體書籍紙張為承載,而網(wǎng)絡(luò)文學(xué)來自于互聯(lián)網(wǎng)是虛擬的。我們在閱讀時,觸摸紙張與書本樸實的質(zhì)感,也能夠給讀者帶來額外的舒適感受,因此如果能以視覺的形式還原用戶對書籍的「觸感」,不僅能夠?qū)⒕W(wǎng)絡(luò)與實體相鏈接,也可以幫助用戶增加電子閱讀的樂趣。
根據(jù)歸納出的文學(xué)特征,以及調(diào)研用戶年齡層與喜好,我們可以歸納出番茄小說基礎(chǔ)原生關(guān)鍵詞。
基礎(chǔ)原生關(guān)鍵詞
拓展衍生關(guān)鍵詞
根據(jù)網(wǎng)絡(luò)文學(xué)原生關(guān)鍵詞,我們拓展出衍生詞
圖片搜索、提取情緒版
根據(jù)相關(guān)的衍生關(guān)鍵詞,我們收集大量的視覺圖片并將其匯總,借以分析其視覺特征
色彩提取
視覺映射
通過對情緒版的分析,我們可以得出結(jié)論并整理出番茄小說設(shè)計語言,輕量的色彩、寫意式元素、非對稱布局、紙紋理噪點
將傳統(tǒng)的冷靜沉浸與網(wǎng)絡(luò)文學(xué)的熱鬧向融合是番茄小說設(shè)計語言的重要視覺呈現(xiàn)方式風(fēng)格
多元化的簡約設(shè)計+情感化修飾
Logo
番茄的品牌名稱基于「、優(yōu)質(zhì)」的產(chǎn)品理念,服務(wù)于產(chǎn)品設(shè)計、品牌設(shè)計中。番茄相對于紅果是一個更加具象的表達,不僅可提高用戶對產(chǎn)品的認(rèn)知,也能傳遞小說品牌的理念和態(tài)度。基于此,這個理念框架是講述品牌故事的關(guān)鍵載體。
logo動畫展示
小說相關(guān)產(chǎn)品logo匯總
在logo的設(shè)計上我們將番茄的圖形概念化,保留番茄籽,局部的留白讓標(biāo)志同樣能表達空間與白的概念。我們選擇在白色底上用紅色非對稱性式logo ,既區(qū)別了市面上大多產(chǎn)品logo樣式,又能夠加深用戶對產(chǎn)品的印象,突出了「愉悅」的特性。
選定 logo 并設(shè)計圖形+文字組合:
在文字設(shè)計上,相比正常宋體弱化文字襯線,為了突出空間感,我們擴大了字面拉伸了中宮的占比,這樣做不僅提高文字識別度,整體氣質(zhì)也也能夠與沉浸的定義相耦合。
品牌色
前期通過情緒版的分析,摘取關(guān)鍵詞配色,綜合歸納出符合番茄小說特性的的色彩搭配
通過對情緒版色彩的歸納,我們抽取具有代表性的顏色,作為番茄小說的品牌色
輔助圖形
從logo中番茄圖形的概念出發(fā),提取出以圓、番茄籽、番茄輪廓為基本型的品牌圖形元素
官方字體
考慮到官方字體在沉浸式頁面中的運用,番茄官方字體的選擇與品牌屬性相契合的蘋方體、宋體。
VI 呈現(xiàn):
品牌視覺感受:
品牌體現(xiàn)—產(chǎn)品場景
番茄小說給人的感覺是安靜、平和、友好。因此在顏色使用中以品牌色配合低飽和度背景色做搭配,突出產(chǎn)品的帶給用戶的沉浸、愉悅感。
運營場景—運營設(shè)計對品牌塑造的意義
第一眼的感受,往往決定了用戶對產(chǎn)品的整體印象。目前在番茄小說的產(chǎn)品中,最直觀的品牌視覺展示主要以書單活動banner為載體,其做為活動入口本身就處在一個前置的位置,占用空間大且更能吸引到用戶的注意。因此,需要對運營焦點圖設(shè)計精細(xì)化的打磨,讓用戶在打開產(chǎn)品的瞬間,快速塑造產(chǎn)品在用戶心中的視覺形象。
番茄小說運營設(shè)計——和而不同
運營設(shè)計的基本原則
因此番茄小說的運營視覺需要緊密圍繞在這個大前提下進行設(shè)計,快速傳達信息=保證信息的簡單化、文字有效性,促使用戶行動=畫面內(nèi)容的趣味性、吸引性。
視覺呈現(xiàn)形式
遵循番茄體系,體現(xiàn)小說內(nèi)核的「煙火」氣質(zhì),視覺呈現(xiàn)多元化。以運營文案為中心,畫面設(shè)計貼近內(nèi)容,降低用戶信息識別成本。
品牌運營視覺一期構(gòu)建:手繪元素+非對稱構(gòu)圖+質(zhì)感
設(shè)計規(guī)范
運營視覺與品牌調(diào)性應(yīng)是統(tǒng)一的,因此在運營設(shè)計的色彩選擇需要與品牌配色相呼應(yīng),保證視覺與整個產(chǎn)品的和諧性。
運營插圖案例
在運營活動中,依然要以產(chǎn)品所傳遞的氣質(zhì)來進行畫面設(shè)計,即是保留沉浸的前提下,抽取關(guān)鍵詞的某個方向來表達品牌運營所傳遞的理念。在色彩的使用上可以圍繞關(guān)鍵詞的方向來選擇顏色,以表達內(nèi)容所傳遞的信息,可適當(dāng)使用品牌色作為點綴,但依然需要的保持視覺給人帶來的平和感。
作為一個從 0 到1的品牌,番茄小說的設(shè)計語言依然在不斷的打磨、優(yōu)化。整體清晰的品牌規(guī)劃能夠保證線上、線下、產(chǎn)品與營銷的各個視覺設(shè)計環(huán)節(jié)更加統(tǒng)一,同時也為后續(xù)的設(shè)計指明方向,助力業(yè)務(wù)持續(xù)發(fā)展。
文章來源:優(yōu)設(shè) 作者:今日頭條UED
藍(lán)藍(lán)設(shè)計的小編 http://m.88yangsc.com