魔術師瑀騰,2015年官網全新改版重磅登場!
作者:Yu-Teng Wu / 日期: / 分類:魔術好文
在經過長時間的規劃和製作後,瑀騰魔術工作的官方網站 2.0 終於上線啦!當然,新版網站一定要好好的介紹,所以這篇文章將會跟大家分享改版緣由、設計理念等等。本來想寫一些很狗血的話來當標題,像什麼千萬人見證,震撼亞洲之類的,但我這人比較樸實一點,所以…最後還是很普通的標題來介紹這個堪稱目前台灣魔術師網站中數一數二精緻的網站 XD
網站改版緣由
首先我們來談談為什麼會有這次網站改版的原因。其實網站本來就會因為時間的演變而有所進化,大家看看10年前的網站和現在的網站一定有很大的不一樣,例如以前很紅的蕃薯藤…(不小心透漏年紀 XD ),所以在三四年前官網1.0出現後,我就有思考未來會進行改版。經過幾年的經營,個人風格、表演取向的逐漸穩定後,當然網站也要有所修正,不過最主要加速我進行這個工作的原因是,去年四月時,我發現有疑似同業抄襲、複製我的網站,同時進行黑帽SEO的攻擊。
抄襲的方式就是把我的網站完全複製後,把有「瑀騰」出現的地方都改成對方的工作室名稱,而黑帽SEO的部份,則是故意做一個色情網站,但是當使用者點擊後會自動轉址到我的網站,讓使用者以為我的網站是色情網站。這個部分因為已經進入司法程序,所以我就不多談了,等之後有一個明確的結果後再跟大家報告,不過這是一個很重要的原因,讓我把改版的時程大幅度提前。
舊版網站回顧
首先,讓我們來回味一下官網1.0的樣子吧 !
可以看到舊版官網色調是走紅灰路線,而會選用這個顏色,是因為多數魔術師都是採用黑色為主要色調。雖然說一般人對於魔術師可能第一印象就是黑色的燕尾服,但是我想走出一個不一樣的感覺,所以一般魔術師網站中會大量出現的撲克牌、魔術棒、魔術帽的元素也很少出現,在首頁的地方甚至是我坐在一張椅子上看著在地上的鴿子,而不是多數魔術師手中開扇、拿著鴿子等動作。這個 1.0 版的網站當初上線時,也獲得許多好評,甚至有許多客戶只看到我的網站就邀請我表演 XD
新版網站的設計理念
在官網2.0中,延續之前舊版網站的非典型魔術師網站風格之外,想要更加強調質感這部份。另外因為我擅長的是逗趣的互動魔術,所以在色調上想從偏酷的紅灰色調,轉往比較明亮的色調,變成是以白色為基礎、亮紅和灰色作為點綴,呈現比較活潑的感覺。但是在活潑的同時,也必須帶著質感,所以在首頁的部分,從電影「大夢想家」借鏡,設計出倒影和人的不同這個小亮點。
為什麼會從大夢想家取材呢?雖然說大夢想家這部電影在台灣票房不佳,但湯姆漢克和艾瑪·湯普遜的演技真的令人讚嘆,而電影從名稱 Saving Mr.Bank 到裡面的劇情,許多細節的刻畫都讓我很喜歡,尤其是宣傳海報的設計,讓人看了忍不住讚嘆和會心一笑,所以~就出現了上面這張形象圖了。
除了在設計部分,這次的網站改版的版型中,也使用了量化數據的分析來重新調整。因為我個人算是數據派的人 XD 所以我很重視 GA 的數據,因此從這個數據來了解使用者的動線、使用習慣,進而重新規劃每一個頁面的小細節,我想這也是台灣魔術師唯一一個會這樣做的。
最後是比較技術層面的部份,因為現在是行動裝置的時代,所以為了讓使用手機、平板的人也可以順利流暢的瀏覽網站,所以採用響應適網頁設計。簡單來說,就是不管你是使用什麼裝置的人,都可以很順利的瀏覽網站,而不用還要用手指放大縮小,而這個部分的使用者體驗也獲得 Google 的 99/100 的分數!
網站各頁的小細節
接著,就是來談談每一頁小細節。首先在每一頁的頁尾的部份,有最新消息可以讓大家迅速的知道一些新資訊,而魔術停看聽的部分提供大家一些邀請魔術表演、欣賞魔術表演的小撇步;在魔術師的whisper這邊,就是一個比較人性化的地方,讓大家可以看看我到底在碎念什麼 XD
在關於我這一頁,特地加上時間軸,更清楚的呈現整個脈絡演進,客戶頁則是採用重點列舉的方式,然後加上分類讓大家可以快速切換,最後再下方的連結可以讓大家看到完整的合作客戶對象。
洽詢這一頁其實有一個小亮點,但必須是要用行動裝置才會發現 XD 那就是當你用手機瀏覽這一頁時,會出現一個撥打電話按鈕,直接點選按鈕就可以 call out ,不用先記下電話然後再去打電話,這樣是不是方便很多阿~~~
Logo的再設計
這次網站改版還有一個重點,就是個人 logo 的重新設計。
Logo 可以很明顯的看出是一個小丑的臉譜,用 Yu Teng 的 Y、T 來當做小丑的眼睛,搭配上小丑的紅鼻子。為什麼會是用小丑的形象呢?第一個主要的原因是我個人覺得魔術師用牌、鴿子當做形象真的是很….重複又無聊 = = ,第二個是我的魔術是帶給人歡笑的,跟小丑是一樣的。但真正高竿的小丑,並不是大家路邊看到的小丑,而是像太陽馬戲團中的小丑一樣,帶著質感而且有深度,這和我的魔術呈現給客戶的感覺是一致的。小丑的圓潤紅鼻子則象徵著我們的魔術表演總能讓活動圓滿、順利。下面是這次設計 Logo 的設計師 Bin先生的設計理念:
logo左右眼部份,左眼像是悲傷帶靜,右眼有微笑中帶術,更有情緒。 標準字部份,營造出手工凸板印刷的質感,油墨有些不均。魔術師最重要的就是雙手的技法,所以文字可以像是手工印刷出來的感覺,像是每一次的印刷背後總有一段故事或手法。 顏色部份,深色用的不是純黑/灰,而是帶有霧面金屬感的鐵灰;紅色就是道具常見的絲絨紅。 二者搭配不用純色,而是調色過的標準色,將logo的層次拉高一些。 |
看完,我自己都覺得感動惹~~XD
Logo延伸出的周邊
在 Logo 定調後,其他的周邊當然也就跟著出爐啦 !首先是新版的名片
這次的名片採用卡紙,不管是紙質、摸起來的手感都提升許多,從照片中就可以看出光是厚度就比一般名片厚上許多。在正面就是以 logo 為主,搭配上工作室的名稱和服務,簡潔大方,沒有任何多餘的元素。而在背面則是用比較復古的排版和字型,呈現一種經典的感覺。
另外跟大家偷偷說一下,不知道到大家有沒有覺得背面的排版跟某個經典卡通很愛用的文字排版類似 …… 有猜出是什麼卡通嘛?那個卡通就是「新世紀福音戰士」 XDD
在紙質、設計之外,在印刷上也是下了一番功夫。 Logo 的紅鼻子採用燙紅金,字體的部分用燙白墨,當燈光照射下,會隱約反光。同時因為採用白卡,所以還會有壓痕的效果。
這款設計在印刷上要跑五家印刷廠,每張的單價 > 10NT ,我想應該比劉謙的名片還要高級惹 (雖然說他那種等級是不用名片….)
除了名片之外,信封也是這次的一個重點。信封的設計我只能用大膽來形容,但這個大膽卻又不會過頭,跟絕大多數信封有所區隔,讓人印象深刻。
信封的正片可以看到 Logo 的紅鼻子,但當你打開信封,小丑的眼睛 Y T 就出現了。而當你翻到背面要拆開信封時,一樣可以看到小丑的眼睛和鼻子。
在這次的周邊製作物的最後,是我個人的品牌的撲克牌。
撲克牌是由美國 Bicycle 原廠印製,在背面的圖案有兩種,一個是我的 Logo,另外一個則是 Y 和 T當背景 ,中心點一樣是 Logo。牌的正面一樣有兩種,一種是正常版的,另外一種是花色放大版的,這樣表演時後面的觀眾也可以清楚看到花色。
下面這張圖片,可以讓大家比較清楚看到背面的紋路
寫在最後
這次的官網2.0改版,從去年的四月開始規劃,歷經快一年的製作和優化,終於在今天正式公告,中間的過程可以說是相當的耗時費力。而在網站的設計規劃也由我自己下手,製作優化的部分也邀請了業界的第一把交椅,其中還有業界的第一美少女,最後加上最重要的官網的守護神工程師阿德! Logo 的部分則是再度邀請第一版名片的設計師 Bin 先生操刀,在眾家好手的協助下,官網2.0就這樣誕生了 ~
我相信在台灣的魔術師中,對於自己的官網如此下苦心的應該是沒有(笑),而為什麼會這麼認真的來看待自己的官網?最主要也是希望能讓來瀏覽的朋友們覺得舒服、眼睛一亮,同時也反映了我對於魔術的態度也是如此。
如果大家有什麼看法和想法,也歡迎在下方留言喔 ~ ^__^