張文碩作品集

Information

Communication

Digital Media / Graphic / Brand

Game Design

Animation Design

Dynamic Logo Design

Digital Multimedia & Graphic Design

Magical Flood Protetion 3D Artist & Animation WATER GAMES 遊戲式防 災教育著重在情意學習及 認知學習，以現階段年輕 人喜愛的策略攻防遊戲設 計，來提昇學習者的興趣，

Regression Game 3D Artist & Character 遊戲的插畫、模型、動態、

達到寓樂於教的目的。

P. 13

特效與程式皆由四人合力 完成，遊戲作品於新一代 設計展與 KT 科藝獎皆有獲 得名次。

P. 3

CONTENTS 2007-2015 DESIGN

Public Wlfare Animation 3D Artist

THE DMP STUDIO Web Design Visual Designer

故事主要描述過度開發對 My Brand Graphic Designer

狗奶粉工作室的網頁視覺

P. 34

越來越發達的現代，雖然

Secret Animation 3D Artist & Animation

生活越加便利，卻也造成

不自信與太過重視外表是

環境大量的破壞 ...

Gainhow Dynamic Logo Designer

一個名為張文碩的品牌，

現代年輕人最大的通病，

P. 15

這讓年輕人對於內在培養

靜態的呈現方式已經不能

夠創造一個完全代表我的

缺 乏 認 知。 因 此， 希 望 能

滿足使用者，隨即而來的

身分標誌，這個標誌必需

反映出年輕一代的錯誤價

是動態的呈現方式，動態

與我極度的吻合，並能代

值觀，並加以改善。

化的視覺元素在各種媒體

表我的一切。

環境造成的損害。在科技

P. 16

中更能爭搶觀眾的注意力。

P. 19

也就是我自己。我期望能

P. 29

設計。

Hunting Forest Illustration & Card Design 整個遊戲過程中，必需依 靠思考的能力找出與自身 相同陣營的對友，並透過 團結合作共同對付敵對陣 營，已獲得最後的勝利。

P. 36

SENIOR PROJECT Starting 2011 Accomplish 2013

REGRESSION

01

http://ppt.cc/CDtwr

Regression 為華夏科技大學的畢業專題團隊製作， 遊戲的插畫、模型、動態、特效與程式皆由四人合

力完成，遊戲作品於新一代設計展與 KT 科藝獎皆 有獲得名次。我於專題中負責所有 3D 的建模、骨 架設定與動態調整，並負責部份角色的設計、線稿 繪製與後期製作。 > >> Software

GAME SCREEN LEVEL DISPLAY World View Level 01 高山部落 Level 03 地下洞穴 Level 05 魔王關卡

Level 02 沙漠旱地 Level 04 雪地高原

卡，期望玩家在進行遊戲時，除了 打擊的快感、刺激的機關外，還能 有運用頭腦思考的機會。

REGRESSION TEAM 遊戲進行畫面 Wen Shuo, Chang 3D Character & Scene Game Artist

許多人童年都經過馬力歐的時期， 也因此橫向捲軸的遊戲方式留給我

世界觀

們深刻的印像。遊戲以類似馬力歐

捲軸開啟，上面紀錄著未曾記載的

的玩法與遊戲模式來進行，另外，

歷史世界充滿平樂祥和，沒有災禍

在科技不斷進步的當下，遊戲整體

汙穢 ..........

視覺以 3D 的方式做為呈現，並以 2.5D 的可愛風格為主要畫面展示。

在光明的世界裡，隱入深處的黑暗 悄悄的浮現，暗色將光明象徵的 "

Regression 團 隊 一 直 相 信 好 的 遊

生命石板 " 給破壞，上古前被封印

戲除了注重畫面所帶來的美學愉悅

於 " 生命石板 " 中的大量黑暗剎那

感外，遊戲性亦為最核心的要素之

間侵入世界各處，天空照耀一切的

一，因此於遊戲設計中加入了許多

『光』也被黑暗給壟罩住。

有趣的劇情、設定與小遊戲，期待 在遊戲性上能夠更為獨特。

01

REGRESSION 遊戲團隊介紹 FB粉絲團 http://ppt.cc/CDtwr 圖片：開場動畫畫面呈現

02

遊戲概念與世界觀 圖片：遊戲關卡畫面

02

位在中央空島的平原上的千年樹 幹， 在 世 界 誕 生 的 初 期 就 存 在 於

首先，於遊戲性上加入了大量的動

世，蘊藏了大量的自然力量，維持

畫 表 現 方 式， 使 劇 情 不 僅 僅 透 過

著五座島嶼的浮力。

文 字 的 傳 達 方 式 來 進 行。 其 次， 為 增 加 遊 玩 過 程 中 的 遊 戲 性，

被黑暗穿刺破損後，為了解救即將

Regression 於遊戲中加入了益智關

崩毀的空島，從其中一塊碎片中， 創造了主角。

4

PREAMBLES ANIMATION Screenshot

負責線稿與後置

DESIGN POINTS OF THE GAME LEVEL 01 高山部落

LEVEL 03 地下洞穴

為了結合土之島的特色，第一關的 這關的概念來自於風之島的地下洞 設定是高山原住民部落，其特點在 穴，它的特色在於前面的益智小遊 於 土 著 的 圖 騰 柱 與 危 險 的 尖 刺 機 戲，玩家必須記憶石板閃爍的順序， 關，高山部落通常較城市不發達， 才能往後進行。我們在這裡設計的 因此在整體材質上以木質的色感去 原 因 是 希 望 玩 家 經 過 前 面 的 刺 激 進行設計。

後，可以放松下來，因此在這關卡 並沒有陷阱與怪物的干擾。

LEVEL 02 沙漠旱地 火之島的特色在明顯不過，我們立 LEVEL 04 雪地高原 刻想到了沙漠型氣候與火山地形。 以水之島的概念進行發想，設定彩 我們在這關卡設定了許多陷阱，像 稿與最後的場景有較大的落差，我

ART Painting 3D Matte

03

是滾動的刺球、阻礙視線的風沙、 們認為彩稿中的溫帶氣候並不能很 吐酸液的鮮艷花朵、岩漿冒出的火 好的去體現水之島的特色，因此最 球與地上噴出的熱氣等段。

終以寒帶氣候來做為背景的設定。

03

遊戲關卡設計 圖片：關卡設計草圖

6

GAME SCENE OBJECT 負責物件 3D 美術與造形發想

Object settings

04 TEACHING SCREEN & ROLE OPERATIONS Education

遊戲教學圖片 負責按鍵與動作設置

GAME

INTERFACE PROCESS GAME SCREEN ISLAND INTRODUCTION 中央空島（主島）MAIN ◎由所有自然元素所形成的島嶼。 ◎島嶼的深處封印著邪惡的 " 蛇妖海

重的皮毛或著由水組成的外殼。 ◎島上生物，身上都會配戴著冰晶的 物品，象徵心靈與空島結合為一。

德拉 (Hydra)"。 火之空島 Fire 土之空島 Soil

◎火焰與岩漿包圍的炎熱島嶼，太過

◎島上充斥著許多巨大造型奇特的植

炎熱因此島上生物身上都有融合火

物，於豐富的資源孕育下，島上的

的元素 ( 耐熱 ) 自由行走在岩漿與

生物成長的比其他空島生物來得強

火焰包圍的石頭上。

壯且巨大。 ◎島上生物相信 " 蛇 " 是神靈的象徵， 蘊藏著巨大的能量，但因為 " 蛇妖 "

Hwa Hsia Institute of Technology Department of Digital Media Design

REGRESSION TEAM 遊戲結束畫面 Yu Ling, Li Draw

◎島上生物在誕生那刻起，身上就會 擁有熔岩的刻印，就如同不滅的火， 傳承於世，日益壯大。

的封印未獲解除，所以空島上都無 半點 " 蛇 " 的足跡。

風之空島 Wind ◎島嶼上充滿著大小的風輪，隨著風

水之空島 Water 04

遊戲場景物件 圖片：場景物件設計草圖

05

益智遊戲圖示 圖片：益智遊戲玩法解說教學

◎島上除了有豐富的水以外，所有的 景色都為水的結晶，因此島上氣溫

與風輪的輪轉交替，島上沙塵紛飛。 ◎島上生物因為較為嬌小，所以總會 帶著葉片擋風沙和在空中滑翔。

十分低，因此大部分生物都擁有厚 8

ROLE DESIGN & MONSTER DESIGN

MONSTER

ROLE DESIGN & ANIMATION 設計發想 角色一開始設定的形象為兔子造 型，到開始製作時我們否定了這個 提案，我們認為奇幻世界觀的主要 角色必須要是特別的、被彰顯的， 於是後面決定採用組合生物的方式 進行發想。最終造形結合了龍角、

負責 3D 美術、雕刻與動態調整

鹿的頭、鴕鳥的身體、馬的腳部骨 架、貓科動物的腳掌以及樹藤狀的 尾巴。

Animation

遊戲中的動作 1. 攻擊 : 甩尾。 2. 跳躍。 3. 跑步 ( 配合耐力值 )。

06 MONSTER DESIGN & ANIMATION 設計發想 角色一開始設定的形象為犀牛，當 繪製出這隻角色時，我們很疑惑甚 麼樣的攻擊方式是適合它的，最終 我們決定將它的造型加入袋鼠育兒 袋的特色，並以投擲石頭為攻擊手 段。另外，我們希望它帶給人是笨

3D 美術、骨架設置與動態調整

重、厚實的，因此在其動作的設計 2D Character Painting + 3D Model + UV Map + Bump Map

REGRESSION TEAM 角色設計流程

上，已休憩做為預設的待機動作。

Wen Shuo, Chang 3D Character Model + Bump Map

Animation

07

遊戲中的動作 1. 攻擊 : 丟石塊。 2. 待機 : 坐在地上打呼。 3. 死亡動作 : 向前倒地。

06 主角設計概念發想 圖片：概念草圖、貼圖與動態

07 怪物設計概念發想 圖片：概念草圖、貼圖與動態

10

MONSTER DESIGN & ANIMATION

MONSTER DESIGN & ANIMATION

設計發想

角色特色

蛇怪發想

，只有魔王在進行攻擊動作時，玩

為了增加關卡難度，於沙漠關卡中

頭部都為花苞形狀右手同頭部都為

我們在進行魔王的設定時，本來是

家才可以傷害到魔王。

加入了阻礙玩家的怪物。我們希望

花苞不過略小，且花瓣質地較堅硬

希望以海怪為主要設計方向，但給

找出具有攻擊性、威脅性，但又必

可作為攻擊時的利刃。 圓球狀左手

人的感覺總是不太具有威脅性，因

角色特色

須存在於沙漠中的生物，最終我們

有如戴上拳擊手套一般 , 攻擊方式

此我們打算以龍來做為主要發展方

擁有三隻眼睛的巨型蛇怪。

以仙人掌做為怪物設計的發想。碰

也時如同拳擊一般。

向。但我們同時發現龍的形態太頻

擁有殘破的雙翅、尖銳的獠牙與堅

繁的出現於遊戲中，所以我們在造

硬的腹甲。

到 最 大 的 問 題 是 它 的 移 動 方 式， 它必須藉由扭動身體的力量向前移

遊戲中的動作

形上進行了一些修正。

動，而攻擊方式主要是以拳頭來進

1. 攻擊 : 花苞突刺、錘擊、拳擊。

魔王的所有動作皆參考於蛇的神

行。

2. 移動 : 扭動向前。

態，主要以噴火為攻擊方式。另外， 1. 攻擊：吐火球。

3. 死亡動作 : 枯萎。

我們將魔王移動位置放置於背景中

Animation

角色設計、3D 美術、骨架設置與動態調整

08 UNUSED OBJECTS

MONSTER DESIGN & ANIMATION

遊戲中的動作 2. 移動：邊拍打翅膀邊蛇行向前。

08 魔王設計概念發想 圖片：概念草圖、貼圖與雕刻效果

UNUSED

Screenshot

設計發想

角色特色

出現於水之島的雪地中，我們希望

與自然融合的生物，尾巴與葉片融

設計出不同行為模式的怪物，因此

為一體。四肢連著可在天空滑翔的

我們設計了飛鼠。飛行怪物的優勢

飛膜。出現時，一定會帶著一顆松

在於無法對其進行任何攻擊，但它

果炸彈。

負責 3D 美術設計

卻可以不斷騷擾玩家，而這正是我 們所希望看到的。當怪物經過玩家

遊戲中的動作

上方時，會以丟松果炸彈的攻擊方

1. 攻擊：丟松果炸彈。

式進行騷擾。

2. 移動 : 滑翔。

ART Painting 2D Matte

3. 死亡動作 : 因為主角不會飛翔， 所以飛鼠不會死亡。 負責物件 3D 美術與造形發想

Animation

MONSTER DESIGN & ANIMATION 設計發想

身軀則由無數的藤蔓交雜在一起。

出現於水之島的雪地中，我們希望

由帶刺的藤蔓延伸出的六隻腳，配

它給人的感受是兇殘、暴力、危險

合著藤蔓的身軀，走路時會有大幅

與變態的意象，因此顏色的採用異

度的擺動。

常鮮艷，並於設定角色之初，加入 許多尖刺的造型，也更明顯的去突

遊戲中的動作

顯嘴巴中的利牙。

1. 攻擊 : 葉片拍打。 2. 移動 : 扭動向前。

角色特色

3. 死亡動作 : 枯萎。

花朵為頭，像是惡作劇般的總是帶 著一抹咧嘴的笑。雙臂由葉片形成。 12

02 SENIOR PROJECT Starting 2012 Accomplish 2013

01

MAGICAL FLOOD PROTETION WATER GAME http://water.caece.net/ 負責 3D角色、物件設計製作與動作設置

WATER GAMES 遊戲式防災教育著重在情意

學習及認知學習，以現階段年輕人喜愛的策略 攻防遊戲設計，來提昇學習者的興趣，達到寓 WATER GAME 樂於教的目的。WATER GAMES 系統的遊戲 CONCEPT 構思方式，希望學習者在遊戲中發展解答遊戲 的構思方式，讓學習者腦力激盪出可能的最佳 解，而不侷限公本解答。系統目標主要是建立 一個可以分析，並讓學習者思考水資源防災技 術的系統，可以當作各種防災教育情意認知的 教學策略。 > >>

01

WATER 遊戲概念介紹 官方網站 http://water.caece.net/ 圖片：關卡選擇與任務解說

Software

水資源容易取得之地，通常也伴隨 著河川氾濫的危機，看似水資源充 足的地方，實際可使用的卻也可能 有限。生態保育看似與水資源取得 無關，但卻是河川氾濫和取得乾淨 用水的關鍵。 遊戲以趣味的方式呈現，讓玩家透 過扮演魔法師的角色整頓河道，並 從中探究日常生活所不會接觸到， 卻又和我們息息相關的水土保持的 議題，包括河川整頓方式－抽沙船， 及其最根本的問題解決方式－河川 沿岸植物的種植，以宣導生態保育 的概念。 遊戲亦希望透過基本知識的傳遞， 引發玩家對環境保育的好奇，並進 一步了解自己能為環境所付出的力 量，成為現實生活中保衛生態環境 的魔法師。

本遊戲以生態環境與水土保持的為 主要元素，其中包括了種植深根與 淺根植物的抓地力與河道水源污染 對河道水土保持的影響，以及河川 淨化工作對預防洪水氾濫的重要 性，除知識概念的傳達外，亦以實 際操作遊戲的方式讓學生了解生態 環境對水資源與生活品質的影響， 提升學生環境保育概念。 教學目標： 了解水能載舟亦能覆舟。 了解水資源得來不易。 了解生態環境對水土保持和水資源 的影響。 提升對生態保育的重視度。 提升洪水發生可能的預防概念。 從生活中實踐生態保育行動。 02

WATER 遊戲介面設計 圖片：遊戲畫面與物品設定稿

14

SENIOR PROJECT

PUBLIC WLFARE 01ANIMATION

Starting 2009 Accomplish 2009

S ENIOR PROJECT Starting 2008 Accomplish 2009

01

PUBLIC WLFARE ANIMATION 團隊為四人所組成， 在動畫中分工為角色設計、3D 美術、動畫設置與特

效剪接，而我負責其中的 3D 建模與後置剪接。此

SECRET ANIMATION 團隊由九人所組成，團隊非

動畫曾獲得創新教育 - 數位影片與動畫類的銅牌獎。 > >>

SECRET ANIMATION

常關注於當下的社會狀況與風氣，觀察中我們發現 了一個問題，不自信與太過重視外表是現代年輕人

Software

最大的通病，這讓年輕人對於內在培養缺乏認知。 因此，我們希望能藉由動畫反映出年輕一代的錯誤 價值觀，並加以改善。 > >>

DESIGN POINTS OF THE ANIMATION

Software

故事主要描述過度開發對環境造成 的損害。在科技越來越發達的現代， 雖然生活越加便利，卻也造成環境 大量的破壞，在故事中人類發現石 油與火焰而使科技開始崛起，大樓 排放的廢氣、過度開墾土地等問題 越來越嚴重，使得環境再也經不起 人類大肆的破壞，最終消失在宇宙 的塵埃中。

DESIGN POINTS OF THE ANIMATION 現代社會中「外貌協會」的人佔了

遊玩過程中，女主角並沒有度過愉

大多數，對另一半的外貌要求很高， 快的時光，她非常害怕假胸部露出

這短篇動畫包含了我們當時對環境 的 歉 疚 與 憂 心， 我 們 希 望 能 夠 將 心中的想法藉由動畫的方式表現出 來，除心情的抒發外，亦期望能將 這個想法更具體的傳達出來。

並只對面貌非常帥氣仰或美麗的人

馬腳，因而時時緊張不已。到了傍

動心，隨著這種文化的發展，每個

晚男主角送玫瑰花送給女主角，沒

人都開始在意自己的外表形象，對

想到意外發生了！玫瑰花的尖刺刺

於外表不滿意的去修圖、化膿妝，

破了女主角的充氣胸部。

甚至出國整形，但我們認為應該用 最真實的自己去面對所有的人、事

男主角驚訝不已，但看著女主角準

與物才是最好的。

備跑開，立馬拉下了自己的皮帶， 原來男主角本身肚子也很大，經過

故事中的女主對於自己的小胸部非

皮帶刻意拉緊過。互相坦然的兩人

常自卑、不自信，因此為了過幾天

緊緊相擁，天上也放起了煙花，似

的約會，女主角訂做了充氣胸部，

乎在慶祝一對戀人的誕生。

希望能以欺騙的方式，增添自己的 自信心。 過了幾天約會的日期終於到了，女 主角帶著假胸部閃亮登場，巨大的 胸部立馬成為所有人關注的焦點， 男主角也因為女主角的身材而震驚 不已，女主角因此開始沾沾自喜起 負責角色場景建模、貼圖與後置

01

PUBLIC WLFARE 動畫團隊介紹 圖片：動畫劇情畫面呈現

來。

01

SECRET MIMI 動畫團隊介紹 圖片：開場動畫畫面呈現

16

PREAMBLES ANIMATION Screenshot

負責動畫設置

SCENE INTRODUCTION 芭娜娜樂園 香蕉咖啡杯

芭娜娜樂園 海盜船

男女主角動畫中出現過的咖啡杯，

遊樂園過場畫面出現的娛樂設施，

整個帳篷、座位都已香蕉的造型進

海盜船的船身主要以香蕉為設計概

行設計。在動畫中是個時常故障出

念，整體也以黃與綠為主要配色。

問題的樂園裝置，女主角在此差點

傳說中芭娜娜遊樂園的海盜船可以

因為操做人員的疏失，而讓充氣胸

旋轉到 360 度，是世界上最恐怖的

部露出馬腳。

海盜船之一，但由於沒有很嚴謹的 防範措施，於故事一年後被封閉。

芭娜娜樂園 水球灘 男主角熱衷的水球攤位，也是男主

芭娜娜樂園 雕像

角最強的運動之一，幾乎百發百中。 動畫中男主角出現時的背景，是遊 動畫後期男女主角玩水球投擲的場

樂園裡最值錢的建設。傳說中是芭

地，女主角在這邊曾幻想自己的假

娜娜的創建人雕像，但卻沒人見過

胸部像水球一樣被男主角刺破，因

與知曉此人。整座雕像適用純銀打

而膽戰心驚。

成。

3D

ANIMATION GRAPHIC DISPLAY

02 動畫場景介紹 圖片：動畫場景算圖顯示

03

02

03

動畫海報設計 圖片：海報設計元素展示

負責部份場景建模與海報角色建模

18

GAINHOW http://www.gding.com.tw/

PHOTO BOOK GAINHOW

L DC oy u gn s oa t mo im c i z e d

DYNAMIC LOGO 14.09.01-15.01.30

客 製 化 動 態 商 標

01

PHOTO BOOK LOGO DESIGN

26 件國外動態商標互動案例 圖片：國外動態商標展示

02 企業分析 圖片：使用者需求分析

01 GAINHOW BACKGROUND 26 CASE STUDY 現今越來越資訊化的時代，網路世代之多媒 體潮流已然勢不可擋，商標結合多媒體已經 成為不可或缺的表現方式，靜態的呈現方式 已經逐漸的不能滿足使用者，隨即而來的是 動態的呈現方式，動態化的視覺元素在各種 健豪印刷係一專業科技印刷公司，結合電腦網路、網路印刷、電子商 務、各種自動化轉檔、拼版系統，具線上完稿、直接下訂單等電子商 務機制，精準快速的電腦系統處理客戶下單檔案、快速印刷生產和加 工及快速的交件之物流系統。健豪所追求的，仍是健豪精神指標：速

媒體中更能爭搶觀眾的注意力。而相較於動 態的呈現方式，互動的呈現方式會讓使用者 更容易記得所要傳達的訊息，這亦是傳遞訊 息的最終目的。

度、品質、服務！有達到這些指標，才能讓客戶滿意，因為客戶的滿 意，就是我們最終的使命！

將動態標誌加入互動的概念，能有助於商標 傳達訊息的功用，且使用者在互動的過程中， 更能因著情感與功能上的滿足，進而增進使

(1) 依照黃金三角形作為標誌變化的規則 26 件國外動態商標案例 ·並於黃金三角型中設立格線。

用者使用之動機。

The Uses & Idea

藉著 26 件國外動態商標的個案分析與專家學

者的確認，將動態商標分類為：娛樂性動態 健豪創立於 86 年底，健豪的品牌已

相片書的品牌概念來自健豪官方的

商標、實用性動態商標、客製化動態商標、

经走過了漫長的道路，健豪的核心

企業形象，而品牌的基本策略是：

個人化動態商標。並透過回收的樣本進行分

價值在於印刷過程中的速度、品質

商標不能被更改或加入其餘組織的

析，研究結果發現客製化動態商標對使用者

與服務。商標以太陽（火）的概念

標誌內容。

有較好的情緒經驗與功能經驗。

為主要的設計發想，欲表達其追求 的精神。因此，在健豪相片書的商

帶標語主文字必須用英文的版本。

標設計中，結合了火焰與書本的元

顧客滿意度

素，讓健豪的概念融入相片書的商

所有商標的尺寸需要統一，不能隨

標中，使兩個概念具有一致性。

意擠壓與變形。

相片書的商標設計包含了五片火焰

考慮到相片書個人化的獨特性，一

造型的書頁，下四片書頁（火焰）

般的靜態商標恐以不能表達其特

代表了健豪的四項核心服務（印刷

點，因此採用客製化的呈現方式。

20%

認可與忠誠

30%

相關品項、雲端相簿線上製作工具、 另外，為了更能代表顧客的身分， 查看專車路線、親切專業客服）；

數據輸入採用生日為準則進行變

而最上的書頁（火焰）則代表健豪

化，並以該生日季節的色系，作為

的顧客，因為健豪永遠將顧客擺在

其商標之 標準色與輔助色。

50%

第一位（最上位）！

客製化概念 此類動態商標讓單位每一位成員都可以擁有屬於自己的專屬身份。可用 於會員資料的身份圖像名片、名牌、信封信紙、紙膠帶、衣架吊牌、馬 識別元素之構成

Your best choice

GAINHOW

PHOTO BOOK

克杯、旗幟、傢具等個人商品。

Recollect ?

Memorial ?

Record ?

02 GAINHOW CHARACTERISTIC USER DEMAND Gainhow...

Why choose ?

Gainhow... Characteristic

1. 高上傳空間 4p 存放像片書資料，保存半年發

健豪永遠以人為出發點，並極為注重顧客之感

印檔案。

受，因此商品多以客製化的方式呈現，包含：客

2. 欲達到目標 - 所印及所要。

製化衣服、畫框、手機殼、人字拖、客製化邀請

3. 提供取貨方便性。

卡、明信片、貼紙、筆記本、桌月曆、明信片、

4. 精神指標 - 速度、品質、服務。

精裝證書夾、簽名簿、資料夾、客製化識別證、 扇子、學生墊板等。

最初名為巨鼎印刷，負責大型海報、電子分色、 電腦化網片。最先成立網片輸出、電子分色，用

User demand

以幫助手工拼版的印刷公司。

1. 多板型選擇。 2. 包裝質感（圓角書本）。

Target

3. 印刷品質。

顧客滿意度：

4. 上傳檔案空間。

利用保存檔案、快速上傳檔案（足夠頻寬）、成

5. 離線編輯系統（不用先把照片上傳到網站，省

立客戶部門、北中南三區皆可以配送。

下上傳照片的時間，這樣可以隨時從自己電腦 的檔案庫裡選照片，很方便）。

認可、忠誠（客戶會先想到健豪）： GAINHOW A OW W

PHOTO BOOK

6. 必須要上傳照片後，仍然可以編輯。

期望利用貼心的設備與設施及速度、品質、服務 來讓健豪成為客戶的最佳夥伴。

20

PROCESS

03 GAINHOW DYNAMIC LOGO DESIGN PROCESS

DESIGN CREATIVITY

PHOTO BOOK DYNAMIC LOGO

LOGO SHAPE

根據企業的分析與使用者對相片書的潛在需求， 找出其特色，並進行歸納。健豪事業股份有限公 司商品包羅萬象，從常見的文宣品（名片貼紙、 海報傳單、菜單 型錄、信封信紙、書籍、紙袋 等）、客製化禮品 ( 相片書、貼紙、桌月曆、明 信片、扇子、 油畫噴印等 )、室內外大型宣傳廣 告輸出、宣傳行銷用品組 ( 活動旗幟、各式展架、 燈箱等）到大型立體紙製品（紙製展架展台、桌 椅、室內佈置造型商品）都能在健豪生產印製。 本創作為了與其它印刷公司與書本商店之商標有 所差異，因此蒐集與研究其餘印刷廠之商標。 針對健豪的相片書品牌進行商標設計，由於健豪 品牌本身的概念是以火為主，因此本創作將以火 焰結合書本的方向進行概念發想。本創作於發想 階段，以色彩疊加 ( 減法混色 )、油墨與書本的 概念進行發想，再從中挑選出較為合適的標誌進 行後續製作。

04 GAINHOW DYNAMIC LOGO DESIGN CONCEPT

04

03 動態商標設計流程 圖片：設計過程與參考資料

動態商標元素設計概念 圖片：動態商標設計概念（比例關係）

a : b : c = a : 0.7 a : 0.05 a

在基本元素構成中，元素採用等比例的圓形將之 重疊，標誌的書頁且透過兩個大圓進行疊合所構 成，標誌共以五個單位來組成，下面四個單位代 表了健豪的四項核心服務 ( 印刷相關品項、雲端 相簿線上製作工具、查看專車路線、親切專業客 服 )；而最上的單位則代表健豪的顧客，象徵著 健豪永遠將顧客擺在最上位。另外將火焰的概念

a b C

加入書頁的型態中，欲表達其企業所追求的精 神；書頁的排序則依據鸚鵡螺殼的結構比例（黃 金三角形）來做為邊界。 客製化意在提供每一位顧客量身訂做的產品與服 務，藉此確實符合每位顧客的獨特需求；以客製 化動態商標來說，其是藉由造型、顏色或材質的 改變，生產多樣化的身份以滿足使用者所需。客 製化極為注重每一位個人，因此客製化動態商標 的目的在於讓群體中的每一個單位擁有屬於自己 的身份識別，可用於個人的名片、信封、信紙等。

客製化動態商標介紹

A Chih - Hsiang Ma

B Wen - Shuo Chang

C Tsz - Ting Chung

Position Engineer

Position Designers

Position Planners

Phone 0930-920-414

Phone 0973-226-320

Phone 0974-336-540

E-mail d199152@gmail.com.tw

E-mail d199152@gmail.com.tw

E-mail d199152@gmail.com.tw

22

Spot Colour

Spot Colour

PANTONE 144 EC

PANTONE 1595 EC

Spot Colour

Spot Colour

PANTONE Red 032 EC

PANTONE 1788 EC

PANTONE 1785 EC

RGB Value

RGB Value

RGB Value

RGB Value

RGB Value

R:241

G:135

B:0

Process Colour

0% Cyan 100% Yellow

58% Magenta 0% Black

R:232

G:100

B:0

R:232

Process Colour

0% Cyan 100% Yellow

73% Magenta 3% Black

G:65

R:232

B:75

G:62

Spot Colour

B:52

R:234

G:94

B:96

Process Colour

Process Colour

Process Colour

0% Cyan 60% Yellow

0% Cyan 77% Yellow

0% Cyan 50% Yellow

87% Magenta 0% Black

88% Magenta 0% Black

75% Magenta 0% Black

05 GAINHOW ARRANGEMENT RULE & COLOR 為了運用與使用上的需求，標誌語言分為英文、 中文與雙語版本；使用上分為直式與橫式；標語 亦可選擇是否加入標誌當中。另外，為增加標誌 使用的廣泛程度，因而於標誌設計上必需能夠轉 為黑白兩色，並以不影響識別性為原則。 健豪極為重視顧客族群，對於顧客總是充滿熱情、 熱忱並且具有活力，因此標誌採用紅色與橙色， 紅色具有熱情的、熱忱的、豪華、具有活力之意 象，而橙色則具有活潑、活力、積極、精力與年 輕之意象，兩者皆能代表健豪對待顧客的經營理 念。

Colour Multiply (Spot Colour)

Full-Colour Version (Spot Colour)

85% Black

85% Black

PANTONE Red 032 EC

PANTONE 1785 EC

PANTONE 1788 EC

PANTONE 144 EC

PANTONE 1595 EC

PANTONE 185 EC

85% Black

100% Book Red A, B and C 100%Book yello A and B

85% Black

100% Book Red A, B and C

85% Black

100%Book yello A and B

100% Black

05

100% Black

動態商標色彩計畫 圖片：動態商標版本與色彩數值

24

GAINHOW

06 DYNAMIC LOGO FONTS DESIGN GAINHOW

http://www.gding.com.tw/

春天配色

PHOTO BOOK LOGO DESIGN

08

09

商標客製化顏色 圖片：春夏秋冬四季配色

夏天配色

商標客製化造形 圖片：商標客製化規則

秋天配色

08 GAINHOW CUSTOMIZED COLOR PROGRAM

冬天配色

為搭配健豪相片書的標誌造型，創作依照現有字 體進行重新設計。在字體搭配上有主副之分，主 要的字體是以 Antipasto 為基準，並經過重新設 計的字體，即較為窄長的空間、圓角的設計與現 代型的風格較符合相片書標誌之特色。二級字體 是 Arial，用於商標客製化後的英文文字。而重 新設計後的 Heiti TC 則為中文的主要字體。

Primary Typeface

Antipasto ExtraLight

Antipasto Regular

AB CD EF GHIJKLMNOP QR ST UVWXYZ ab cd efgh ij kl mn op qr stuv wxyz 1234567890@#$%^&*!?/:;.”{ }[ ]( )

AB CD EF GHIJKLMNOP QR ST UVWXYZ ab cd efgh ij kl mn op qr stuv wxyz 1234567890@#$%^&*!?/:;.”{ }[ ]( )

(1) 春天的色彩搭配

為什麼要對商標的顏色作客製化？很多人會很好

(2) 夏天的色彩搭配

奇，光是造型上的客製化難道不夠嗎？會這樣做 的原因在於，人類對色彩的視覺感知是最強的， 強過造形與形態，並人類於色彩中能夠感受到的 情感亦是非常明顯的。因此，在色彩上依然採用 客製化的方式進行。

Secondary Typeface

Arial Bold

Arial Regular ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 1234567890@#$%^&*!?/:;.”{ }[ ]( )

ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 1234567890@#$%^&*!?/:;.”{ }[ ]( )

(3) 秋天的色彩搭配

為了讓標誌更符合每一位個人，於色彩應用上採

(4) 冬天的色彩搭配

用出生的季節作為主要配色的依據，分為春夏秋

ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 1234567890@#$%^&*!?/:;.”{ }[ ]( )

冬四種配色方式。春季的色彩主要使用綠、紅紫 與黃色；夏季色彩主要使用橘、紅、藍與黃；秋 季的色彩主要使用帶些微黃的綠、咖啡、帶紅的 咖啡與藍綠；冬季的色彩主要使用紫紅、藍紫與 靛色。

Logo Shape Process

09 GAINHOW CUSTOMIZED INTERACTIVE

於商標的造型上進行過多次的修改，主要是調整 商標元素整體的弧度比例、角度與方向。顏色上 也套用過多種配色，最後因應健豪印刷有限股份

k .tw oo om otob Ph ct/

07 GAINHOW DYNAMIC LOGO SHAPE DESIGN

(1) 依照黃金三角形作為標誌變化的規則並於黃 金三角型中設立格線。 a : b = a : 0.06 a

公司的品牌，採用橘紅色的配色。 Logo Colour Process

客製化動態商標最特別的地方在哪理？企業不是

商標的標準字上，也嘗試了多種表現方式，從弧

只需要一個身份的識別嗎？許多人對於商標設計

形的文字、手寫風格文字到雙圓角的文字等，最

的概念仍然存留於傳統的基點上，但近年來使用

後採用的是從新設計後的 Antipasto 雙圓角字

者經驗的崛起，使得企業必需更加注重使用者經

體，來做為商標的標準字。

驗的發展。客製化特色在於重視使用者的感受，

36

36

72

a

b 36

72

36 36

b

為所有參與者設計出獨一無二的商標，這種設計

Text Design Process

PHOTO BOOK

36

方式已不單是滿足企業傳達訊息的目的，更是能

PHOTO BOOK

夠讓使用者在使用時，產生良好的體驗。

的規則，標誌中心點偏左的使用紅色區域； 偏右的採用紫色區域。

a k .tw oo Ch om ob o 20 ail.c hot hu -3 P - S -226 gm uct/ en 0973 152@ /Prod W 99 .tw e d1 ow on Ph ail ainh m E- p://g htt

PHOTO BOOK

(2) 其中，以兩個小的黃金三角型作為位置變化

客製化動態商標的發展必需具備一套規則，這套 規則會控制商標造形的變化，使設計出的造形雖

ng

是不同個體但皆具有一致性。商標整個互動規則 的概念來自翻閱的書本，並按照黃金比例的規章 進行位移，藉此產生出無數多組的個人身份。

Life

Right

祥 芝

線的頂端必須停留在網格的交叉點。

.tw k om oo il.c tob ma Pho

06 商標標準字設計 圖片：文字雙圓角設計

(3) 標誌頂端的變化根據原點向上延伸的線，而

20

(4) 標誌的位置會依據格線隨機進行水平移動， 其尖端始終頂至邊界，並進行角度的變化。

07 商標與標準字的確立 圖片：商標圖形與文字演化過程

26 鍾 0 話 郵 電 子 電 htt

GAINHOW http://www.gding.com.tw/

PHOTO BOOK LOGO DESIGN

10 客製化動態商標系統 圖片：系統開場動畫與輸入介面

10 GAINHOW DYNAMIC LOGO SYSTEM 整個動態商標的系統分為四個部份，分別為開始 頁面、開頭影片、資料輸入頁面與商標呈現畫 面。開頭影片部分，採用設計的過程來進行詮 釋，欲傳達設計概念的發想過程。 由於最後的結果需經由讀取資料數據後作變化， 來作為創作的互動呈現方式，第一階段會索取使 用者姓名與出生日期，以便進行色彩的搭配，第 二階段動畫的呈現後，第三階段會產生使用者的 個人標誌身份。

28

01 WEN SHUO MY BRAND DYNAMIC LOGO 一個名為張文碩的品牌，也就是我自己。我期望能 夠創造一個完全代表我的身分標誌，這個標誌必需 與我極度的吻合，並能代表我的一切。我的目標是 當觀眾第一眼接觸到此識別時，能夠藉由識別很清 楚的瞭解我的人格特質、能力與專長等。

DYNAMIC LOGO INTRODUCTION 在整體的設計流程上，主要 以靜態多樣性的動態商標為 設計方向，很多人會問「難 道你有那麼多的身份，這麼 多身份的意義為何？」會選 擇採用此種設計形式的原因

計相關工作，因此主要將目

在於，我需要多樣性的表現

標族群定睛於設計師上，並

手法來展現我在不同領域上

期望展現出的能力包含：繪

的專長。

畫、 平 面 設 計、 遊 戲 設 計 (3DART)、動畫設計與品牌

靜態多樣性的商標最重要的

設計，此訊息希望傳達的意

是必需保有一致性，也就是

義是我於設計領域上所涉及

每個商標都必需看起來是一

的領域極為廣泛，可以因應

系列的、是統一的，而這也

各種不同的問題與狀況。

是整個商標設計碰到最大的 癥結點。

於整體的設計上，發展成一 套完整的品牌識別，包含商

整個標誌的構造發想來自於

標 的 設 計、 重 新 設 計 的 字

自我品牌問卷，藉由問卷填

體、名片、信封、信紙與履

寫的方式，瞭解自身在業界

歷的設計，並對商標不同的

中的定位與方向，再加以進

表現形式會有相應的信封信

行發展。我未來希望從事設

紙與名片的設計。

30

02 WEN SHUO DYNAMIC LOGOS CONCEPT

DYNAMIC LOGO DESIGN

最後未採用的造型發想

靜態多樣性的表達方式，完全彰顯了我個人

04 WEN SHUO SIGNATURE COLORS 色彩上主要都以鮮艷的顏色為主，因為我認

特質的所在。灰白造形的商標主要是代表我

WEN SHUO CHANG

於動畫上的能力，切割方式採用動畫軟體所

為我的個性外向與活潑的，而各商標採用顏 色的原因如下：

用的四角面，並在顏色上使用模型未加材質 表現於 3D 能力上的商標採用橘紅色的顏色

的原始顏色。

Pantone 1475EC C:0 M:51 Y:75 K:0 R:242 G:151 B:68

Pantone 173EC C:0 M:73 Y:87 K:0 R:236 G:102 B:38

Pantone 1675EC C:5 M:84 Y:100 K:27 R:184 G:58 B:3

Pantone 174EC C:8 M:86 Y:100 K:36 R:165 G:47 B:1

Pantone 158EC C:0 M:65 Y:95 K:0 R:238 G:120 B:12

Pantone 173EC C:0 M:82 Y:94 K:2 R:231 G:79 B:23

Pantone 175EC C:18 M:79 Y:75 K:56 R:119 G:41 B:25

Pantone 1545EC C:20 M:76 Y:100 K:79 R:74 G:17 B:0

Pantone 3242EC C:21 M:0 Y:9 K:0 R:210 G:235 B:236

Pantone 3255EC C:31 M:0 Y:16 K:0 R:236 G:102 B:38

Pantone 3265EC C:68 M:0 Y:38 K:0 R:60 G:184 B:174

Pantone 3285EC C:98 M:0 Y:57 K:0 R:0 G:158 B:138

Pantone 3245EC C:44 M:0 Y:23 K:0 R:151 G:210 B:206

Pantone 325EC C:54 M:0 Y:22 K:0 R:118 G:200 B:205

Pantone 3292EC C:69 M:10 Y:42 K:36 R:45 G:130 B:121

Pantone 3292EC C:99 M:14 Y:60 K:52 R:0 G:90 B:78

設定，我希望表現出活潑、活力、積極、明 橘紅色造形的商標主要是代表我在遊戲 (3D

朗、年輕、精力充沛的感覺，明度彩度則會

ART) 上的能力，因此在設計時用遊戲引擎中

依據光源照射產生的明暗面來使用顏色。

的三角面進行切割，並切割出柱狀的造型。 表現於平面設計能力得商標採用的是黑白的 黑白造形的商標主要是代表我平面設計的能

顏色設定，我希望觀看者能把注意力集中於

力，利用平面的線條勾勒出標誌的凹凸感，

線條的變化與走向上，所以採用無彩色來做

展現出用線構成塊面的設計方式。而藍綠色

為主要顏色，並藉由無彩色表現出高雅、穩

鑽面造形的商標主要是代表我 2D 平面與 3D

重、純潔與高級的感覺。

能力的結合。 為表現 3D 與 2D 結合的鑽面商標採用的事藍 綠色調，我希望表現出年輕、有生命力、新 鮮的、速度與自由的感覺。另外，因為使用 鑽面的切割，明暗面的顏色反差會比較大。

03 WEN SHUO SHAPE CONCEPT

Primary Typeface

Regulation

造形概念主要來自於我英文名字的 WEN 的

Golden angle

137.51

05 WEN SHUO FONT DESIGN CONCEPT

222.49

W，因為我希望表達的是一種 2D 與 3D 結合

自己重新設計過的字體，主要的特色在於字

的概念，所以我一開始的造型發想採用幾何

母的每個倒角都採用黃金角 137.51 度，字母

形狀的組裝，而組裝的形狀皆是具有 Z 軸空

的粗細亦根據商標高度的比例結構來設計。

間的，因此組合出的 W 亦是具有立體透視的 圖案。

Building block concept

另外，因為商標中不會運用到小寫的字母，

Sketch design

所以沒有進行設計。

在利用立體組成的剪影做為基礎造形，並依 據黃金角度 137.51 度的美學規則，使圖形的

數字設計的部份基本上與英文字母一樣，粗

每個角度都加以符合，藉此發展出了兩種造

細皆依照商標高度的比例結構，但考量到基

形表現，其中一種表現形式因為反轉後與墨

本造形因素，只有部份的角度採黃金角的設

爾本知名商標造形太過於接近，因此採用第

計方式。

二種造形做為衍生。 商標的顏色是多變且鮮艷的，若文字的顏色 使用 100% 黑色，會讓整體不太容易結合也 略顯死板，因此再文字的採用上使用 85% 的 黑色。

02

MY BRAND 品牌設計概念 DYNAMIC LOGO 設計呈現 圖片：動態商標完整呈現

03

MY BRAND 自我品牌造形 商標造形衍生與設定 圖片：商標設計概念

04

MY BRAND 自我品牌設計 商標色彩設定 圖片：顏色數值

05

MY BRAND 自我品牌設計 字體設計 圖片：字體設計規章

32

06 WEN SHUO DYNAMIC LOGO PATTERN DESIGN 為了有更多的表現形式，我利用了 Pattern 的 設計方式，使之具有多樣性的變化。 Pattern 的好處主要是能夠紀錄任何東西，包 含我今天去過的地點、我吃過的食物與我所 做的任何事情，我都可以把這些 Pattern 的商 標用在明信片、信封、信封上。 但其缺點就是很難長期去使用，比如我在一 個景點拍照並將之做為 Pattern，利用這個 Pattern 設計成明信片寄出，但此設計只能用 此一次。另外，並不是每一張照片都適合做 為 Pattern ，尤其在商標外型的限制下，就 更加困難。 這一系列的 Pattern 設計其主要圖片來自於芝 加哥，我認為這塊地是我所走過的，亦是我 的個人經歷，所以它足以做為我的 Pattern 商

THE DMP STUDIO

WEB DESIGN 14.01.22-14.01.24

標。

07 WEN SHUO ARRANGEMENT RULE 商標的排列方式主要分為橫式與直式，橫式 的排列方式分為兩種，一種將字拆成兩部份， 另一種是直條的表現形式。 直式主要於網路平台使用，像是網站、網路 廣告等；文字拆成兩部份的橫式商標主要是 用於名片的設計上；直條的表現形式則用於 信封與信紙的設計上。 在不同的組合上文字大小亦有些為變化，為 了讓整體上看起來具有美感，直式排列方式 的文字會略為縮小一些。

狗奶粉工作室網站 http://140.138.147.42/dmp/webui.aspx

06

MY BRAND 品牌設計表現形式 商標 PATTERN 設計 圖片：PATTERN 呈現

Wen Shuo, Chang Interface Design

Hsaing Chih, Ma Information Architecture & Web Program

07

MY BRAND 品牌設計表現形式 商標排列方式 圖片：商標橫直式排列組合

34

02 HUNTING FOREST STORY OF THE GAME

HUNTING FOREST GAME BOARD GAME 15.01.12-15.01.15

芙蕾雅與家人住在與世無爭、世外桃源的小 村莊－西雅村。芙蕾雅的妹妹霏緹，擁有特 殊體質，能夠在滿月時，駕馭皮拉之笛，召 喚達爾黯龍的能力，達爾黯龍能夠使用毀滅 之火，將一座城市瞬間化為廢墟。由於達爾 黯龍只會服從召喚它的主人的命令，為了避 免被有心人士操縱，芙蕾雅一家人都很保護 霏緹。 直 到有一天，黑暗衛兵入侵西雅村，並將霏

Game Description

緹綁架。為了拯救妹妹，芙蕾雅與村莊裡的

在狩獵森林桌遊中，將分為兩大對立的陣營（聖騎士與黑暗衛兵），遊戲

好友們一同踏上旅程⋯⋯

開始時，每位玩家手上都會分發一定數量的手牌，這些手牌就是你手裡掌 握的地圖格。位玩家每回合開始時，會補充一張手牌，然後就要想辦法將 有利於自身陣營的地圖格放到正確的位置。 整個遊戲過程中，必需依靠思考的能力找出與自身相同陣營的對友，並透 過團結合作共同對付敵對陣營，最終獲得勝利。

01 HUNTING FOREST RULES OF THE GAME 1. 所有玩家都有 12 滴的初始血量，當血量為 0 時即淘汰。遊戲開始所有玩家抽取陣營 派別，不可讓其他玩家看到自己所屬派別。 玩家可自行設定出發點，並以順時針方式 進行遊玩。 2. 隨機抽選 30 張地圖卡，圖案朝下放置在地 圖中的空地中，當有玩家走到該格時可以 翻開，並進行對應的事件。 3. 每位玩家在自己的回合可以從地圖牌庫中 抽取一張地圖卡作為手牌，玩家可以選擇 手牌（地圖卡）覆蓋在地圖中與自身可攻 擊範圍內的任何格子內。 4. 每位玩家的手牌以 5 張上限，多的地圖卡 必須拋棄。 5. 玩家在自己的回合中必須擲兩顆骰子，兩 數相減即為可前進之步數。另外，在回合

Wen Shuo, Chang Illustration, Card Design

Hsaing Chih, Ma Map Design, Manual Design, Interactive

中最多可進行一次的攻擊， 以自身所裝備 的可攻擊範圍為上限，攻擊對手。我方攻 擊 力（武器）與對方防禦力（防具）相減， 即為對方必須扣 的血量。 36

38

Tel 0973-226320 E-mail d199152@gmail.com, d199152@yahoo.com.tw