項(xiàng)目概況

山東建邦集團(tuán)創(chuàng)立于1995年，經(jīng)過(guò)20多年的探索發(fā)展，逐漸成長(zhǎng)為一家具有較大資產(chǎn)規(guī)模和較強(qiáng)經(jīng)濟(jì)實(shí)力的綜合性產(chǎn)業(yè)投資集團(tuán)，形成了以基礎(chǔ)設(shè)施、金融資本、文旅商業(yè)、地產(chǎn)開(kāi)發(fā)、健康醫(yī)養(yǎng)、科技創(chuàng)新六大板塊為核心的多業(yè)并舉融合發(fā)展的大格局集團(tuán)。

與此同時(shí)，山東建邦集團(tuán)的數(shù)字化形象也須跟上進(jìn)化態(tài)勢(shì)，標(biāo)梵互動(dòng)承此重任，從客觀數(shù)據(jù)支持和市場(chǎng)發(fā)展角度，建設(shè)一個(gè)符合山東建邦集團(tuán)形象，展其硬實(shí)力，實(shí)現(xiàn)山東建邦集團(tuán)新官網(wǎng)的全新升級(jí)。

標(biāo)梵互動(dòng)服務(wù)內(nèi)容：網(wǎng)站現(xiàn)狀評(píng)估，品牌調(diào)性定位，中文/英文官網(wǎng)建設(shè)升級(jí)，官網(wǎng)運(yùn)營(yíng)維護(hù)

標(biāo)梵賦能

標(biāo)梵互動(dòng)首先反復(fù)審視了山東建邦集團(tuán)的舊版網(wǎng)站，對(duì)網(wǎng)站中存在的不合理之處展開(kāi)多次研討。

從品牌傳播上，舊站較少使用Logo和品牌形象強(qiáng)化用戶心智，設(shè)計(jì)風(fēng)格不突出；在用戶使用體驗(yàn)上，網(wǎng)站架構(gòu)不夠科學(xué)，難以快速準(zhǔn)確地找到需求，也極少使用高精度圖片、圖形等視覺(jué)形式來(lái)表達(dá)內(nèi)容。

建邦集團(tuán)舊站

建邦集團(tuán)新站

品牌連接*  01

集團(tuán)化是延伸和多元拓展的思路，但品牌化是一致的行事風(fēng)格。

在解決品牌形象的問(wèn)題上，標(biāo)梵在設(shè)計(jì)新官網(wǎng)時(shí)大量使用了品牌Logo中的元素。這些Icon設(shè)計(jì)將體現(xiàn)官網(wǎng)的品牌感和主題感。

標(biāo)梵互動(dòng)為山東建邦集團(tuán)官網(wǎng)定制新形象

我們談?wù)撔旅襟w，自媒體，流媒體，但終極媒體只有一個(gè)，就是人的大腦。

標(biāo)梵的視覺(jué)藝術(shù)專家靈活運(yùn)用圖形輔助，補(bǔ)充視覺(jué)空白，讓用戶在眾多信息中捕捉到重點(diǎn)，更易理解信息，加之頁(yè)面變得靈動(dòng)，獲得上升的精致感。

標(biāo)梵互動(dòng)為山東建邦集團(tuán)官網(wǎng)定制新形象

以圖形創(chuàng)意表達(dá)主要業(yè)務(wù)，快速傳遞核心內(nèi)容，正確引導(dǎo)來(lái)訪者進(jìn)行接下來(lái)的行動(dòng)。有趣的界面也會(huì)吸引用戶紛紛分享。

標(biāo)梵互動(dòng)為山東建邦集團(tuán)官網(wǎng)定制新形象

情感連接*  02

為增加用戶停留時(shí)間、加深對(duì)網(wǎng)站的初次印象，標(biāo)梵做了兩個(gè)工作。一是重設(shè)網(wǎng)站脈絡(luò)，新架構(gòu)分類明確，讓用戶簡(jiǎn)單快速達(dá)到目的地，二是增加互動(dòng)界面，讓第一眼進(jìn)入全屏沉浸式的動(dòng)態(tài)展示，集團(tuán)氣質(zhì)不容忽視。

同時(shí)滿足用戶的理性和感性需求，是為情感連結(jié)。

001 網(wǎng)站欄目框架重新規(guī)劃

標(biāo)梵研究山東建邦集團(tuán)的業(yè)務(wù)和商業(yè)規(guī)劃后，推導(dǎo)出最終網(wǎng)站的欄目架構(gòu)，大體分為四大內(nèi)容版塊：集團(tuán)自身——社會(huì)責(zé)任——招標(biāo)采購(gòu)——重視人才。

002 體驗(yàn)的目的是記住

如果不能帶來(lái)情感，用戶很快會(huì)在流動(dòng)的信息中遺忘你。

在標(biāo)梵給出的WVI中，網(wǎng)頁(yè)設(shè)計(jì)用色規(guī)范與Logo色相輔相成，主色彩用藍(lán)色、淺藍(lán)色、淺灰色和大面積留白，營(yíng)造呼吸感與協(xié)調(diào)感；以紅色作為輔色，搭配使用提升畫(huà)面質(zhì)感，使人印象深刻，這是山東建邦集團(tuán)新官網(wǎng)升級(jí)的妙處所在。

標(biāo)梵互動(dòng)為山東建邦集團(tuán)官網(wǎng)定制新形象

當(dāng)然，漂亮的圖形，視頻，大量的Icon指引對(duì)用戶的加載速度要求也高，對(duì)此，標(biāo)梵自有技術(shù)支持，才有山東建邦集團(tuán)新官網(wǎng)的呈現(xiàn)。

技術(shù)連接* 03

001 原生Lazy loading

標(biāo)梵對(duì)第一屏以下的圖片進(jìn)行延遲加載技術(shù)。

它能夠在用戶滾動(dòng)頁(yè)面的時(shí)候自動(dòng)獲取更多的數(shù)據(jù)，而新得到的數(shù)據(jù)不會(huì)影響原有數(shù)據(jù)的顯示，同時(shí)最大程度上減少服務(wù)器端的資源耗用，不必?fù)?dān)心網(wǎng)頁(yè)讀取速度減慢或者SEO情況，搜索引擎完全可以發(fā)現(xiàn)網(wǎng)頁(yè)中包含的圖片。

002 滾動(dòng)視差Parallax Scrolling

滾動(dòng)視差設(shè)計(jì)讓多層背景以不同的速度移動(dòng)，在人眼中，形成立體的運(yùn)動(dòng)效果，特別適合用來(lái)敘述細(xì)膩內(nèi)容。

在山東建邦集團(tuán)的官網(wǎng)中，我們看到隨著鼠標(biāo)滾輪的移動(dòng)，內(nèi)容也在慢慢鋪開(kāi)。讓用戶更加專注于接下來(lái)的呈現(xiàn)。

003 SVG前端矢量圖形語(yǔ)言

SVG矢量圖具有不失真，質(zhì)量?jī)?yōu)，文件尺寸更小，能保證更快的加載速度。同時(shí)，SVG Sprites學(xué)習(xí)成本高，難度大。

標(biāo)梵自主開(kāi)發(fā)標(biāo)準(zhǔn)的矢量圖形語(yǔ)言，直接用代碼來(lái)描繪高質(zhì)量圖像，讓網(wǎng)站更具吸引力。

在與山東建邦集團(tuán)的這次合作中，標(biāo)梵的視覺(jué)藝術(shù)專家與前端工程師共同配合，搭建出符合集團(tuán)身份，以交互觸動(dòng)感官、拉近與用戶距離的新官網(wǎng)，使集團(tuán)門戶在千篇一律的網(wǎng)站里一躍而出，得以用新的面貌迎接新的挑戰(zhàn)！