編輯也能快速做出漂亮Banner!專題頭圖的秘密武器 這篇文章講的不是技術(shù)類的教程,而是能讓門戶編輯短時間內(nèi)做出漂亮Banner的 3 種方法。編輯同仁們可以通過文章提供的方法先鍛煉自己,為職業(yè)發(fā)展鋪路。設(shè)計(jì)師們也可以借鑒一下,減輕工作量。 前言 sophiya:門戶網(wǎng)站因?yàn)槭袌龈偁幦找婕ち?,各大門戶競相以誰家資訊更多、領(lǐng)域更廣、內(nèi)容更深等等策略來留住用戶的芳心,由此近年來門戶網(wǎng)站被稱為網(wǎng)絡(luò)世界的“百貨商場”或“網(wǎng)絡(luò)超市”。即然是個百貨商場或超市,那么商場與商場之間的競爭又能通過什么方式使自己處于優(yōu)勢呢? 除了擴(kuò)大自己的規(guī)模、增加商品的種類、優(yōu)惠折扣以外還可以通過發(fā)揮我商場的獨(dú)特產(chǎn)品或特色服務(wù)(例如針對不同用戶群體的特色店面,對重要節(jié)日商場做一些活動或特殊布置等),還有非常重要的一點(diǎn)就是對商場及內(nèi)部店面的裝修、樓內(nèi)設(shè)施指示等。這就如同我們門戶網(wǎng)站的各個專題的視覺一樣,每個專題就是“百貨商場”里的一間店鋪,如何讓“客人”在你的“店鋪”中留得更久,買更多的商品除了用你的商品打動客人還有你的風(fēng)格和口味兒是否符合他之外,提升品牌形象也逐漸成為商家相互比拼的一個重要因素。 門戶網(wǎng)站的“店鋪”(專題)一天可以上幾十個而且流動性也很大,時效性一般比較強(qiáng),持續(xù)性也較短,所以針對這種特殊性質(zhì),門戶的視覺秘密武器應(yīng)運(yùn)而生——模版!無論是專題框架還是專題Banner頭部,模版能使成百上千的專題保持一個整體的風(fēng)格,做到形散神聚的視覺呈現(xiàn),這對于網(wǎng)站的長期發(fā)展是個必要條件!因此不僅僅是我們設(shè)計(jì)中心要做到“神”的一致更應(yīng)該將這些理念根植于大量專題的親生父母親們(編輯),因此模版的作用非同小可,從長遠(yuǎn)來看她關(guān)系到一個門戶型網(wǎng)站的長期發(fā)展與品牌持續(xù)發(fā)展。當(dāng)然,凡事都有兩面性,模版化的專題頁面會使得同學(xué)們長期處于一種ctrl+cctrl+v的操作中而缺少創(chuàng)造性的新鮮空氣,因此對模版的靈活運(yùn)用顯得就尤為重要。以下是一些模版范例:
通過對編輯的多次banner設(shè)計(jì)培訓(xùn)和對banner模版使用、更新等監(jiān)控,對于banner模版這塊一些淺薄的認(rèn)識放上來跟大家探討:
Banner模版產(chǎn)生的原因和必要性 隨著v4.0專題模版的上線,專題數(shù)量如雨后春筍數(shù)量急增,因編輯可以不通過提技術(shù)和美術(shù)工單,苦口婆心地講訴求、等設(shè)計(jì)圖、求切圖等等繁雜的過程就可以簡易地搭出一個像樣的、自己想要的專題框架。So,頭部的banner設(shè)計(jì)就成了一個提單主要項(xiàng)目,這是banner單急增的原因之一。 因?yàn)檎w框架基本都是由模版搭建,但每個“親生父母”都希望自己的“孩子”光鮮亮麗地展現(xiàn)在別人面前,所以一個漂亮的banner會如同給他們的“孩子”穿上一件漂亮的衣服或做了一個最Fashion的發(fā)型,由此吸引更多的人去看她(他)的“孩子”。這也是banner單一直都很多的原因。 大多數(shù)編輯只會基本的PS軟件操作或不會操作,少數(shù)人熟練。因此,雖然時間不夠,但banner也只能提交設(shè)計(jì)中心制作。這類banner單的數(shù)量還是占較大的比例。 工單太多,設(shè)計(jì)中心人手告急,因此又無法安排到設(shè)計(jì)人員在第一時間內(nèi)給到頻道相關(guān)的設(shè)計(jì)。 為應(yīng)對以上種種情況并使編輯在自行制作banner時能跟整個網(wǎng)站設(shè)計(jì)風(fēng)格盡量達(dá)成一致,三套方案應(yīng)運(yùn)而生:第一當(dāng)然是領(lǐng)導(dǎo)實(shí)行“計(jì)劃生育”,控制banner單的數(shù)量,盡量減少沒有意義或重復(fù)性的勞作。第二,督促設(shè)計(jì)師們能在最短的時間內(nèi)制作一個漂亮而又適合該專題的banner;第三就是秘密武器——banner模版!第四,PS技能和banner設(shè)計(jì)培訓(xùn)! Banner模版就這么就那么產(chǎn)生了……針對那些時效性較強(qiáng)的、突發(fā)性的專題、設(shè)計(jì)中心無法排開的情況下,無疑給編輯和設(shè)計(jì)師們找到一個好的解決方法,而且還能在一定程度上保證風(fēng)格與質(zhì)量。
Banner模版存在的問題及解決方案 問題: 雖然banner模版從v3.0的時候就開始建立,但用的同學(xué)很少,
原因分析: 1、因?yàn)槌踅0鎺?,只有會議、產(chǎn)品、傷感、生活、喜慶等幾個分區(qū)還不夠全面、內(nèi)容不夠多,所以編輯同學(xué)選擇性會很少。
2、banner模版庫的宣傳力度不夠,鮮為人知因此優(yōu)勢沒有發(fā)揮到位。
3、再者是因?yàn)樯儆芯庉嬆莒`活地運(yùn)用PS軟件,更何況如何應(yīng)用現(xiàn)有的模版改為符合自己專題性質(zhì)的banner了。
4、當(dāng)然除了這些還有一些即使懂如何操作PS的同學(xué)還是對自己不夠自信,覺得設(shè)計(jì)中心做的就是比自己做得好,即使有模版也當(dāng)然不會比專門從事設(shè)計(jì)的同事做得好。所以只要不是特別急的單一般都會提單處理。
解決方案: 1、與v4.0專題模版庫同步更新了v4.0banner模版庫,這次更新是從設(shè)計(jì)中心半年來設(shè)計(jì)的結(jié)晶中挑選的精品,更新數(shù)量達(dá)到70有余,同時還擴(kuò)展了博聯(lián)體、女人、世博、其他等,現(xiàn)在一共是16個分區(qū),分區(qū)盡量做到對應(yīng)頻道化、風(fēng)格類同化以方便編輯查找。更新一直都在進(jìn)行中,每周我們會定期對模版庫進(jìn)行更新,并以郵件和群發(fā)的形式給以通知。
2、擴(kuò)大模版庫的知名度,因?yàn)橐郧熬痛嬖谝恍┯脩舳夷0鎸?shí)用性很強(qiáng),所以還是有很強(qiáng)的粘性的,只要我們夠用心地在做,有更多的好模版上傳,編輯會很愿意應(yīng)用甚至?xí)蕾?。(?dāng)然,太過依賴也是不好的,我們提倡的永遠(yuǎn)是模版加創(chuàng)造,以達(dá)成脫離模版自行創(chuàng)造出符合網(wǎng)易風(fēng)格的設(shè)計(jì),這才是我們的目標(biāo)!只有這樣才能使我們的網(wǎng)站即能保持整體風(fēng)格也不落入古板) 對部分提banner單較多的頻道,有意地增加模版庫中該頻道的模版數(shù)量,同時通過與頻道接口人進(jìn)行配合,加強(qiáng)大家自己動手豐衣足食的意識。 3、培訓(xùn)!視覺規(guī)范的培訓(xùn)、設(shè)計(jì)的培訓(xùn)、PS基礎(chǔ)技能的培訓(xùn)等培訓(xùn)如期地安排開來。通過多次培訓(xùn)的結(jié)果來看,大家對PS基礎(chǔ)技能的培訓(xùn)比較感興趣這部分培訓(xùn)還是能對大家平時工作起到很重要的作用的,所以這種觸手可及的東西總會比設(shè)計(jì)理念的培訓(xùn)來得更深入人心。 每個季度對新員工的培訓(xùn)并與視覺規(guī)范一并納入考核范圍也是至關(guān)重要的一部分。新人永遠(yuǎn)是最大的希望,通過他們將這些理念傳播并執(zhí)行起來,逐次地,banner模版的作用將發(fā)揮得更好,對于現(xiàn)在存在的有些頁面的頭圖根本不跟該頻道的風(fēng)格一致,甚至不堪入目的情況得到改善的那一天指日可待。 通過這些培訓(xùn)不僅讓編輯能了解到一些視覺規(guī)范還能給予到一些實(shí)際的操作方式、方法從而對鼓勵他們自己操刀設(shè)計(jì)banner成為一種可能。字兒太多,再來點(diǎn)兒圖緩解下:)
Banner模版庫的現(xiàn)狀及展望 設(shè)計(jì)方:
1、 對模版的分類方式有待提高,很多都是按照頻道而劃分的,但是有部分模版還是可以通用的,優(yōu)化分類方式也許可以引導(dǎo)編輯更好地運(yùn)用模版。
2、 對模版要有充分的認(rèn)識,模版不僅僅是提供給編輯同學(xué)們的一種快速實(shí)用性操作更是我們自己的優(yōu)秀作品匯集中心,每個人都有義務(wù)和責(zé)任去為她增添一些光彩,而且在這里我們可以學(xué)習(xí)到其它同學(xué)的優(yōu)秀設(shè)計(jì),認(rèn)識到自己有別于他人的設(shè)計(jì)風(fēng)格并或找出自己作品的提高空間。
3、 要使整個網(wǎng)站部長期發(fā)展中能保持自己獨(dú)特的設(shè)計(jì)風(fēng)格(簡潔、直觀、大氣、整體等),banner模版要貫徹到位,做為設(shè)計(jì)方可以多跟蹤自己設(shè)計(jì)的模版或跟頻道方建立起良好的合作方式,加入到他們的一些工作群內(nèi)進(jìn)行溝通與協(xié)調(diào)等。
4、 要有敏銳的洞察力,實(shí)時地對當(dāng)下流行趨勢做很好的前瞻與掌控,必要時對模版進(jìn)行適當(dāng)調(diào)整,以從源頭上掌控整個網(wǎng)站的風(fēng)格方向而不落入俗套或流于世表。
5、 更新、培訓(xùn)與考核工作繼續(xù)做到位,主要從編輯操作能力方面入手,找準(zhǔn)大家的興趣點(diǎn),先教編輯如何使用和操作,再逐步將視覺規(guī)范和設(shè)計(jì)理念傳達(dá)好,起到設(shè)計(jì)風(fēng)格上的把控作用。
頻道方: 1、使用頻率增高并效果漸好 越來越多編輯同學(xué)針對較為時效性的專題運(yùn)用起模版來,而且有些模版不僅用得規(guī)范還能做到舉一反三,甚至是好幾個模版一起加工而成再加入自己的一些設(shè)計(jì)想法,雖然我們看到的效果從設(shè)計(jì)角度來看并不是很好,但這種精神我們應(yīng)給予鼓勵,因?yàn)檫@就是我們的目標(biāo),不過切不能操之過急,要先學(xué)會用再才能用活它。如圖:
以上兩幅,對系列專題模版的運(yùn)用基本規(guī)范。從字體換圖色調(diào)搭配都算較為完整,不過第2稿的字沒有與配圖分開有點(diǎn)兒美中不足。
這是一張由于要臨時改動標(biāo)題而產(chǎn)生變動的設(shè)計(jì)圖,編輯因?yàn)闆]有相同字體造成這種結(jié)果。因此,為避免再出現(xiàn)類似種種情況的發(fā)生,定稿后應(yīng)給到編輯相應(yīng)的字體,以備不時之需。
2、模版運(yùn)用不規(guī)范 這點(diǎn)主要體現(xiàn)在對系列專題模版的運(yùn)用上。包括更換字體部分多樣、更換圖片部分與模版的色彩不能很好的搭配、后臺操作出誤等。根據(jù)調(diào)查,這些情況多數(shù)是由于系列專題一般都不止由某一個或者兩個編輯來完成,所以一系列專題下來,多個編輯操作就至使畫面出現(xiàn)多種不同讓人哭笑不得的畫面。這讓設(shè)計(jì)模板的同學(xué)常常感到很無奈,頻道方給的回饋多種多樣“沒有相應(yīng)的字體,裝了字體后電腦跑不動~~!”“圖片色調(diào)不一致但不知道怎么調(diào)”等等。。如圖:
這套系列專題頭圖模版的應(yīng)用是做得比較差的,圖片的切隔、圖片與背景的融合、圖片色彩等都不合理,更不好的是第一張還出現(xiàn)了后臺操作的嚴(yán)重錯誤以致被生生分成兩半。
3、對模版的認(rèn)識不夠 沒有做到靈活運(yùn)用模板,跟編輯同學(xué)的交流中,我們發(fā)現(xiàn)有一部分人只看屬于自己頻道的模版庫,很少上別的頻道看!實(shí)質(zhì)上很多頻道的東西可以融會貫通的,“模版”不是說一定要是直接在上面只改字或直接嵌套圖片上去就是模版,我們做的模版是將好的設(shè)計(jì)放上去,供大家做參考,至于什么樣的風(fēng)格什么樣的版式能更符合自己的專題,這個就要靠同學(xué)們自己拿捏。
上圖是一張編輯自己制作的頭圖,融合了右下角兩個模版與凡客的設(shè)計(jì)元素,雖然,效果并不佳,但是他的創(chuàng)造力還是應(yīng)該給予鼓勵。 一個專題頁面,banner的視覺效果非常重要,好的banner設(shè)計(jì)不僅能體現(xiàn)該專題的主旨內(nèi)容還能美化專題、提高專題信息的傳遞速度。但往往如果編輯自己操作會出現(xiàn)很多頭圖風(fēng)格與網(wǎng)易頁面自身風(fēng)格的迥異,模版庫的建立旨在改變這種現(xiàn)狀也有益于提高工作效率。靈活運(yùn)用好模版庫的資源,使其不陷入死板硬套的形式里,對整個網(wǎng)站部的長期發(fā)展來說才是有益的!品牌的功能、質(zhì)量和價值、品牌的知名度、美譽(yù)度和普及度是品牌的內(nèi)外三要數(shù),如何鞏固網(wǎng)易品牌,我們要做的還很多很多,只有從點(diǎn)滴做起,不斷總結(jié)不斷發(fā)現(xiàn)問題解決問題不斷地提高,才能將這座“商場”做大做強(qiáng)。