所屬行業(yè)：服務(wù)行業(yè),、文化創(chuàng)意
所用產(chǎn)品：凡科建站
功能亮點(diǎn)：二級(jí)菜單導(dǎo)航,、hover動(dòng)效
企業(yè)的官網(wǎng)是一家企業(yè)的前臺(tái)門(mén)戶(hù)。在互聯(lián)網(wǎng)時(shí)代,，很多客戶(hù)在確定合作前常常會(huì)在網(wǎng)上搜索該公司,，如搜索不到，信任度往往大打折扣,。
不管是大公司,，還是小工作室，搭建一個(gè)企業(yè)官網(wǎng)都是必不可少的,。很多公司在剛開(kāi)始建站時(shí),，常會(huì)覺(jué)得無(wú)從下手：
· 如何打造符合公司屬性的個(gè)性化網(wǎng)站；
· 怎么選擇主色調(diào),；
· 布局,、交互怎么設(shè)置才突出,；
今天帶來(lái)由「田木文創(chuàng)」自建“古風(fēng)”官網(wǎng),，看看小小工作室，如何借助凡科建站，簡(jiǎn)單,、快速打造一個(gè)抓人眼球的官網(wǎng),，文創(chuàng)產(chǎn)品又是如何和數(shù)字化巧妙融合。
明確定位,，打造個(gè)性化官網(wǎng)
隨著互聯(lián)網(wǎng)迅速發(fā)展,，越來(lái)越多企業(yè)開(kāi)始數(shù)字化轉(zhuǎn)型，每天都有上千百個(gè)網(wǎng)站展露面孔,。想要在其中脫穎而出,，企業(yè)需根據(jù)自身產(chǎn)品、服務(wù)屬性,，塑造出與眾不同的個(gè)性“門(mén)面”,。
只有先明確官網(wǎng)定位，對(duì)自身品牌網(wǎng)站有清晰認(rèn)識(shí),，才能有針對(duì)性地搭建內(nèi)容,。開(kāi)始建站之前，首先要選對(duì)工具,。在建站產(chǎn)品的選擇上,，田木文創(chuàng)創(chuàng)始人采訪時(shí)說(shuō)到：
“做一個(gè)網(wǎng)站要找到適合自己的土壤，文創(chuàng)工作室人手有限,，大部分集中于創(chuàng)作作品,，于是我們選擇用自助建站，使用模板就能簡(jiǎn)單搭建一個(gè)網(wǎng)站,，再慢慢播撒種子填充內(nèi)容,，慢慢生根發(fā)芽，開(kāi)花結(jié)果,?！?/section>
確認(rèn)工具后，田木文創(chuàng)開(kāi)始明確自身網(wǎng)站定位——綜合性門(mén)戶(hù)網(wǎng)站,。
田木文創(chuàng)創(chuàng)始人介紹到,，團(tuán)隊(duì)根據(jù)自身業(yè)務(wù)梳理所需功能點(diǎn)，網(wǎng)站需承擔(dān)品牌宣傳,、業(yè)務(wù)介紹,、溝通客戶(hù)的功能，同時(shí)我們會(huì)承辦大賽類(lèi),，網(wǎng)站需提供空間為參賽選手下載相關(guān)資料,，綜合性門(mén)戶(hù)便很好地容納了這些功能。
梳理功能點(diǎn)后,，田木文創(chuàng)將功能點(diǎn)分別設(shè)置在導(dǎo)航中,，導(dǎo)航是最能清晰呈現(xiàn)整個(gè)網(wǎng)站框架結(jié)構(gòu)的位置,，好的導(dǎo)航能有效減少網(wǎng)站的跳出率。
田木文創(chuàng)將導(dǎo)航分為5大部分,，主營(yíng)業(yè)務(wù),、合作案例、公司動(dòng)態(tài),、關(guān)于我們,、設(shè)計(jì)大賽，再在合作案例類(lèi)設(shè)置二級(jí)菜單,，將以往精選案例羅列,，讓用戶(hù)通過(guò)導(dǎo)航第一眼就能找到自己想要了解的信息。
在客戶(hù)案例的作品展示中,，田木文創(chuàng)在每個(gè)案例頭部采用統(tǒng)一首圖,。
好的網(wǎng)頁(yè)設(shè)計(jì)中，核心因素就是重復(fù),。在網(wǎng)站的每一個(gè)頁(yè)面重復(fù)某些視覺(jué)元素,，不僅能讓訪問(wèn)者知道他們還在該網(wǎng)頁(yè)中瀏覽，還可以提供統(tǒng)一性和連續(xù)性,，同時(shí),，底圖上統(tǒng)一的的品牌標(biāo)識(shí)更能達(dá)到品宣效果。
化繁為簡(jiǎn),，突出主色的魅力
在所有的視覺(jué)創(chuàng)作的形式中,，色彩都是基礎(chǔ)。網(wǎng)站核心之一便在于主色,，主色可以決定整個(gè)網(wǎng)站的風(fēng)格,，確保正確傳達(dá)信息。
田木文創(chuàng)選用自身VI色作為主色,，綠色給人感覺(jué)自然,、新鮮、和平,，十分貼合創(chuàng)作類(lèi)工作室屬性,。
“品牌logo是一個(gè)認(rèn)知符號(hào)，客戶(hù)第一眼記住的便是他的顏色,，我們建立官網(wǎng)主色調(diào),，便是從VI色開(kāi)始?！?/section>
確定主色后,，當(dāng)糾結(jié)頁(yè)面的輔助色時(shí)，黑色,、白色,、灰色就是不錯(cuò)的選擇,。黑白灰可以讓網(wǎng)頁(yè)更穩(wěn)定，更豐富,，他們是天生的調(diào)和色，安全色,。搭配時(shí),，往往會(huì)有意想不到的效果。
田木文創(chuàng)便在不同的頁(yè)面便使用了這三種輔助色,。在面對(duì)客戶(hù)那里這種配圖多,，顏色多的情況下，田木文創(chuàng)選用黑色,，它可以統(tǒng)一凌亂的色彩分布,，讓頁(yè)面有秩序、有重心,。
灰色同樣是網(wǎng)頁(yè)的搭配師,，當(dāng)使用灰色作為底色，面對(duì)與灰色差異很大的色彩,，更適合突出主體,，而面對(duì)差異小的色彩，更容易體現(xiàn)出高雅的氛圍,。
再搭配白色,，調(diào)節(jié)頁(yè)面的呼吸感。無(wú)論大板塊還是小板塊,，灰白都成為整體優(yōu)美調(diào)性不可或缺的一部分,。如此綠灰白的搭配讓田木文創(chuàng)官網(wǎng)頁(yè)面更有質(zhì)感、更有氛圍,。
大膽使用對(duì)比原則,，做出搶眼網(wǎng)頁(yè)
田木文創(chuàng)結(jié)合自身作品的古風(fēng)特色，頁(yè)面采用橫版與豎版結(jié)合,。重點(diǎn)鮮明,，錯(cuò)落有致，整個(gè)排版富有呼吸感,。
尤其Banner上再加上隨意分布的國(guó)潮元素,，讓視覺(jué)落腳處?kù)`動(dòng)趣味。
除此之外,，在每個(gè)頁(yè)面的排版中,，田木文創(chuàng)善于使用「對(duì)比原則」。對(duì)比是為頁(yè)面增加視覺(jué)效果的最有效途徑之一,。
Robin Williams對(duì)比原則就指出“如果兩個(gè)項(xiàng)不完全相同,，就應(yīng)當(dāng)使之不同,，而且應(yīng)當(dāng)是截然不同?！?/p>
田木文創(chuàng)在文案大小,、顏色、字體以及圖片分布上均使用對(duì)比原則,。標(biāo)題類(lèi)使用更大更粗的字體,，正文使用思源黑體類(lèi)的常規(guī)字體，有助于突出對(duì)比效果,。
隨著視線下移,，會(huì)發(fā)現(xiàn)信息點(diǎn)和關(guān)鍵點(diǎn)扼要突出，在不同元素之間建立一種有組織的層級(jí)結(jié)構(gòu),，快速地為目標(biāo)客戶(hù)傳達(dá)賣(mài)點(diǎn),。
跟PPT放映一樣，網(wǎng)頁(yè)沒(méi)有動(dòng)畫(huà)往往給人感覺(jué)稍顯單調(diào),。當(dāng)用戶(hù)進(jìn)入頁(yè)面,，通過(guò)鼠標(biāo)不斷點(diǎn)擊，頁(yè)面不斷給出動(dòng)畫(huà)效果,，讓用戶(hù)收獲驚喜的同時(shí),，更能促使用戶(hù)進(jìn)行更多的嘗試。
以往的網(wǎng)頁(yè)交互聽(tīng)著很困難,，要懂HTML,、JavaScripr等等，但田木文創(chuàng)通過(guò)凡科網(wǎng)自助建站,，即輕松實(shí)現(xiàn),。
為突出頁(yè)面不同板塊，田木文創(chuàng)在首頁(yè)同一版面使用不同的進(jìn)場(chǎng)動(dòng)畫(huà)：
前半部分首先使用最簡(jiǎn)單的放大特效,，輕松開(kāi)場(chǎng),。緊接著，對(duì)需強(qiáng)調(diào)的合作案例展示板塊,，采用翻轉(zhuǎn)特效,。
緩解客戶(hù)視覺(jué)疲勞的同時(shí)，局部板塊的動(dòng)態(tài)改變也會(huì)吸引到用戶(hù)的注意力,，使其修飾的內(nèi)容更易被瀏覽,。
總結(jié)
近年來(lái)，IP受到的關(guān)注越來(lái)越高,，IP形象既是品牌文化理念的直觀展示,，又是文創(chuàng)作品設(shè)計(jì)的延續(xù)。IP現(xiàn)象設(shè)計(jì)漸趨流行，成為企業(yè)品牌必備元素之一,。
“想要設(shè)計(jì)好客戶(hù)的IP形象,，就要先做好自己的'IP'?！睆呐渖?、布局到排版、交互,，田木文創(chuàng)結(jié)合自身產(chǎn)品特色打造了一個(gè)古風(fēng)國(guó)潮感的官網(wǎng),。
文創(chuàng)產(chǎn)品讓濃厚的歷史文化不再只是停留在史書(shū)、影像中,，而隨著數(shù)字化的發(fā)展,，田木文創(chuàng)借力凡科網(wǎng),，提升了自身品牌影響力,，并讓文創(chuàng)業(yè)務(wù)得以更廣泛的傳播。
不管是什么類(lèi)型的企業(yè),，都可以通過(guò)凡科網(wǎng)（http://ynlmjz.com/?_ta=2891）輕松自建品牌官網(wǎng),，打造出屬于自己的形象。
案例鏈接：