By accepting you will be accessing a service provided by a third-party external to https://www.incgmedia.com/

玩轉網站動態,打造品牌的行銷利器!專訪版塊設計總監李明

在第 42 期映CG 雜誌中《Brand Up 品牌加值術》,透過這篇專訪,我們與網站設計工作室版塊 Block Studio 創辦人暨設計總監李明坐下聊聊,從動畫領域的背景,他是如何轉換到網頁設計的?以及對於網頁設計的趨勢,又有什麼看法呢?(完整專訪內容都在 映CG 第 42 期雜誌:《Brand Up 品牌加值術》中!)


​​版塊設計​

版塊 Block Studio 位於台北,成立於 2015 年,主力於網站設計與品牌識別。針對品牌風格、品牌核心、網站內容分析後客製設計,期許能在現實框架中找出未知的新可能。設計擅長「動態特效」及「跳脫一般形式」的規劃設計,不使用仿間 的套版版型。除品牌設計以外,「指標設計」也是他們的設計業務重點之一。

官方網站

版塊設計臉書粉絲團

​李明​

版塊設計創辦人/設計總監,1989 年生,實踐大學媒體傳達設計系、台北藝術大學新媒體藝術研究所肄業,現為版塊設計創辦人、流石五金選物共同創辦人。


當初踏入網站設計領域的契機是?

李明:進入實踐大學後,我從大一就開始接第一個案子。實踐是一個跟業界比較 近的學校,不會太強調技術,更多的是要學生有沒有理解、有沒有美感等等。透 過大學學長介紹案子和機會,幾乎整個大學生涯就是在做案子。

當時念動畫的時候,那時候還是在學MAYA的時期,後來會想要踏入網站設計的契機,是覺得已經有太多人在做動畫了;加上UI / UX(使用者介面設計)的概念才剛開始形成,就覺得是可以嘗試的一個領域。慢慢接觸後,才發現到這件事 情集合了平面設計、動畫、互動的範疇,怎麼會沒有人喜歡這件事情呢?剛好隨 著時代的變遷,網站的東西就紅起來了。

我覺得可以把整個動畫概念融到網頁設計去,還蠻棒的!可以大幅度地幫助網站動態這件事情。而且有了動畫的概念後,做網站的動態也會比較容易。

by 李明

有了動畫的背景,怎麼轉換到網頁設計的領域?

李明:在網頁和動畫動態間,可以能夠拿來比擬的是,我常常在調它們的 Transition(轉場效果),這個概念是可以沿用過來的。還有像是 WebGL(不使用外掛程式的情況下,在網頁瀏覽器中呈現互動式 2D 和 3D 圖形),也可以在裡面做 3D 模擬。當中的打光、陰影、材質應用的操作面都是一樣的,雖然沒有辦法像做動畫那樣有一個介面可以操作,但是應用的邏輯還是一樣的。 

這就是我們的路線和風格,就是要夠帥、夠酷、夠新,讓大部分人沒看過,並巧妙地和品牌融合在一起。

by 李明
土地公文化館 ─ 網站動態設計
土地公文化館 ─ 延伸刊物設計
土地公文化館 ─ 品牌識別重塑

你們怎麼去幫客戶評估,要在網站中加入多少動態特效?

李明:我們會先釐清一個品牌的目的性、和網站想要打到的受眾族群。我們在做 網站設計的習慣,經常會幫作品加入動態,但是量多、量少還是會跟客戶討論。有別於較系統化的購物車、資訊系統網站,我們更傾向著重在形象的呈現上。所以在網站設計中,我們會讓首頁的視覺呈現上,擁有較新穎的互動和動態。藉由 一個主視覺動態,再加上後面要認真看的資訊,就可以讓使用者慢慢進入其他的頁面。

對你來說,一個好的網站需要具備哪些關鍵要素?

李明:網站的速度、使用者UI/UX、網站使用邏輯,還有層級的順序。這些細節如果沒抓好,使用者根本不會想用。等到這些都確定好後,下一階段才是談美感, 終極的目標不外乎就是跟品牌做更好的結合。

我們會跟客戶溝通清楚-什麼東西不要先放、還有東西的大小、顏色要怎麼呈現 等等。又或是,用滑鼠滾動網頁時,什麼東西會先出來,或是快要滑完網站時又會有什麼東西出現。


接下來網站設計會有什麼趨勢,是你認為可以關注的?

李明:從 2019 年開始,外框字和實心字的應用,再加上很多字重複地出現;這些東西,許多品牌都已經把這項效果玩到爛了,我想,直到 2021 年還是會運用這個風格。在網站的特效上面,可以預見的是,3D 的元素會越加越多、越玩越大。從去年開始,網站最流行的就是色散,不管是圖像扭曲或字體變化,總覺得還沒 有被玩到極限,所以應該還是會持續下去。利用 Scrolling 滾動搭配 3D 變化,這個東西也才剛玩半年,今年的趨勢應該會更明顯。

你可以先決定好 Model 的樣子,從 C4D 輸出樣子後,再轉換成 Code、套到網站上。有了 webGL 這項技術,讓網頁載入變得不過於消耗效能。以前如果要做動態的話,就要先做成 80 格圖片,然後壓縮成很小的檔案,滾動一格換一張,因此要讓網站載入 80 張是非常耗效能的。

融入新竹市立動物園視覺的站牌設計
新竹市立動物園的延伸刊物設計

你怎麼看目前的網站設計產業?要怎麼樣才能保有競爭力?

李明:雖然目前這個產業的職缺還是很多,但網站設計跟介面設計的市場其實已 經算飽和了。時間回推 2、3年前,網站設計師只要會切版其實就很厲害了;但是現在時代不同,這樣的程度也要有所進化才行。如果是設計師,但是不太懂程式操作邏輯的話,其實會是很可惜的。所以如果能多了解一些程式面的東西,對 於設計師來說會是更大的幫助。最後,若是能進階成同時會介面設計、前端程式 的「兩棲人」,才會是未來炙手可熱的人才。

「設計師」跟「工程師」,其實這兩個詞是很一般的。不妨想看看,可以朝向「特效工程師」,或是專注在某個領域的設計師,才會更有獨特性。

版塊設計團隊合照

以近期來說,有看到什麼有趣的網站設計趨勢嗎?

李明:以行動裝置能夠完成瀏覽的網站會是一個很有趣的趨勢!無論是透過鏡頭也好、鍵盤也好,未來不會再只是單純地用滑鼠去瀏覽網站。之前有在臉書社團 網站趨勢收集Web Trend Collection 裡分享過,有人運用 Xbox 手把替代滑鼠和鍵盤操作網站。可以想見的是,大家會做更多不同的裝置融合到網站上,但這可能會到後年才會變成一股風潮。

更多品牌加值術文章

2020 年 AR 產業的三大趨勢:硬體市場興起、內容需求增加、投資上看百億!
「熊熊」鬧雙胞?印度版《熊麻吉》計畫於 2020 夏季上映
 
還沒有帳號嗎? 點此立即註冊!

登入您的帳號