201 3
Rong ´s port folio
w w w . r o n g . co m . t w
WELCOME TO RONG'S PORTFOLIO
201 3
Ro n g ´s p o r tf o li o
i s s u u .c o m / r o n g r o n g hu
4
Prologue
用 不 同 的 角 度 看 世 界， 會 看 到 更 多 不 同 的 風 景。 用 這 小 小 設 計 本 事 兒， 紀 錄 曾 發 現 這 大 大 世 界 的 可 能 性。 不 知 不 覺， 設 計 已 成 為 我生活中的一部分 .....
2012.12.27 in Osaka
Prologue
5
學歷 Education 南台科技大學 資訊傳播系 高雄高商 綜合高中廣告設計科
設計專長 Design skills HELLO!
產品設計、手繪、視覺設計、多媒體動畫
電腦應用技能 Software skills Alias、Keyshot、Photoshop、Illustrator、Flash、Dreamweaver、 Maya、Premiere、After Effects、InDesign
證照 Certification and License
6
Resume
Resume
Autodesk Alias Studio 國際原廠證書 (certificate of completion)
胡容榕
畢業專題 Final Year Project
rong rong hu
95 年．台南中華店「85 度 C 慈善音樂饗宴活動企劃」 美術設計
0988702660
品牌形象設計 : 活動 DM、舞台布幕、店內佈置…等視覺規劃。
long20031001@hotmail.com
除臭公仔提案 : 結合店家免費提供咖啡渣的服務，設計除臭公仔週邊商品。
廣告設計丙級
工作經歷 Work experience 96-102 年．勝典科技 多媒體設計師 擔任主力多媒體設計師，設計專案風格與品質控管，協助分配工作、掌控進度、指導新人。 專案經歷 : [ 台北大眾捷運股份有限公司 ] 102 年捷運新文化影帶及翻頁電子書串接案 媒體設計 [ 行政院人事行政總處公務人力發展中心 ] 101 年數位教材製作 媒體設計 [ 臺南市政府教育局 ] 101 年度南瀛網路社區大學 數位學習課程增建服務委託案 媒體設計 [ 歐芳 ( 天津 ) 日化有限公司 ] kc.standard 2012 網站暨系統開發 網頁設計 [ 臺北市政府公務人員訓練處 ] 臺北 e 大 100 年度數位教材委外製作暨行銷推廣案 媒體設計 「Hot 剋任務 - 愛地球關鍵行動」教材 - 榮獲 數位典藏與數位學習國家型科技計畫 數位學習品質服務中心 AAA 認證標章 [ 教育部 ] 99 年兒少保護數位課程建置專案 媒體設計 [ 中國文化大學 ] 99 年新產品開發管理師 (NPDP) 課程製作 媒體設計
獲獎經歷 Awards 99 年．復古與創新 台灣原住民文創產品設計競賽博覽會 【守護．HOOK】入圍參展 95 年．中華電信加值軟體大賽 寬頻數位學習應用組 【子宮樂園孕婦數位學習網】佳作 95 年．第 1 屆 年代數位媒體 「I’m TV 創作大賽」入圍影片 3 隻 95 年．第 15 屆時報廣告金犢獎電視廣告類 - 華人廣告網【精采篇】校長獎 + 卡尼爾【儀容篇】入圍 94 年．第 14 屆時報廣告金犢獎電視廣告類 - 教育部【人暖篇】+【微笑篇】入圍 94 年．台灣客家文化發展協會 Flash 動畫甄選比賽 - 客家女性轉變 全國第三名 Resume
7
Contents
8
Contents
Part 1. 01
Part 2.
畢業專題
final year project
85 度 C 慈善音樂饗宴 行銷 & 週邊產品 產品設計 product
10
design
01
守護 ‧ HOOK 鑰匙圈掛勾
26
02
Elephant USB 小象隨身碟
42
03
Tower Night Light 夜燈塔
56
04
ID Holder USB 證件套隨身碟
76
Part 3.
多媒體設計
multimedia design
01
eBook 電子書
86
02
Webpage 網頁
94
03
UI 使用者介面
98
04
Animation 動畫
106
Contents
9
Part 1. 畢業專題 final year project
85 度 C 慈善音樂響宴
行銷企劃 & 週邊產品
小組團隊經與業主討論後，企劃以社會公益行銷活動，舉辦慈善募款音樂晚 會，邀請社區團體共同參與表演，建立良好關係與形象，並以互動性活動與 消費者進一步的接觸。於聖誕節前夕著手規劃佈置台南永康中華店，為 85 度 C 打造溫馨過節的氣氛，創造一個別具意義的非商業性活動。 活動地點：85 度 C 台南永康中華店 贊助單位：大橋教會、YMCA 公園托兒所、快樂兒童美語、大橋國中、南台附設 幼稚園及學生社團、黃鐘葉凌小提琴演奏 受贈單位：高雄市鼎金國民小學、財團法人創世社會福利基金會
10
Final year project / 85 度 C 慈善音樂響宴
Final year project / 85 度 C 慈善音樂響宴
11
12
Final year project / 85 度 C 慈善音樂響宴
1
2
3
1. 大橋國中管樂社 2. 中華店聖誕佈置 3. 工作人員活動前準備
Final year project / 85 度 C 慈善音樂響宴
13
1 2
3
1. 吳致和師傅與創世小朋友製作手工餅乾 2. 媒體記者招待會 3. 趣味闖關遊戲
14
Final year project / 85 度 C 慈善音樂響宴
Final year project / 85 度 C 慈善音樂響宴
15
活動 DM 1
2
3
4
1.2. 夾報 A4 雙面 DM ：活動前，夾報宣傳。 3.4. 活動流程兩折 DM：活動當天現場發送。
16
Final year project / 85 度 C 慈善音樂響宴
Final year project / 85 度 C 慈善音樂響宴
17
心願卡活動文宣 1
2
3 4
5
1. 心願卡宣傳海報：張貼店家。 2.3. 雙面心願卡：供消費者拿取書寫。 4. 心願卡抽獎名單海報：活動當日抽獎張貼。 5. 白色聖誕樹 : 來店消費者懸掛卡片。 18
Final year project / 85 度 C 慈善音樂響宴
Final year project / 85 度 C 慈善音樂響宴
19
活動文宣 1
2
3 4
1. 聖誕變裝秀報名表：發送於社區幼稚園。 2. 感謝狀：寄予參與表演的各社區團體表達謝意。 3. 活動識別證：發給活動當日的工作人員。 4. 邀請卡雙面 : 邀請貴賓參與活動的卡片。 20
Final year project / 85 度 C 慈善音樂響宴
Final year project / 85 度 C 慈善音樂響宴
21
除臭公仔系列週邊產品 尺寸：7.5cm( 長 ) x 7.5cm( 寬 ) x 15cm( 高 ) 材質：陶瓷、塑膠 活動佈置時發現店家所提供的免費咖啡渣，在推廣咖啡渣 的用處與創造商機的前提下，利用咖啡渣的除臭特性發想 公仔造型，設計除臭公仔系列週邊產品與加價購提案。
22
Final year project / 85 度 C 慈善音樂響宴
Final year project / 85 度 C 慈善音樂響宴
23
1
2
1. 煙灰缸：鋪層咖啡渣後使用。 2. 糖罐 & 奶精罐：公仔造型容器。 24
Final year project / 85 度 C 慈善音樂響宴
3
4
3. 攪拌器：頂端為公仔，底端為咖啡豆造型。 4. 馬克杯：杯蓋亦為杯墊。 Final year project / 85 度 C 慈善音樂響宴
25
Part 2. 產品設計 product design
守護‧HOOK
鑰匙圈掛勾
復古與創新 台灣原住民文創產品設計競賽博覽會 入圍參展 尺寸：6.5cm( 長 ) x 2.5cm( 寬 ) x 8cm( 高 ) 材質：檜木 兼具鑰匙圈與掛勾的功能，解決外出時雙手不夠用的困擾。 造型來自於台灣原住民的圖騰 - 百步蛇，菱形則代表眼睛的 意思。將蛇的身體轉化成掛勾的主體，用蜷曲的蛇體懸掛物 品。延伸百步蛇圖騰守護的意義，「守」護的諧音「手」， 隨時保護著我們的東西、祖靈庇佑族人的意思。
26
Product design / 守護 ‧ HOOK
Product design / 守護 ‧ HOOK
27
MIND MAP
設計方針 Design guidelines 1. 針對年輕到中產階級的族群設計。 2. 實用與美觀裝飾兼具。 外觀 : a. 造型利用各族特色發展，使用彷生、彷物的手法設計。 b. 材質使用木、金屬、塑料。 c. 色彩以大地色原主。
how much 價格 300~500 元
Why 為何使用 ★臨時找不到地方掛東西 ★機動性高：方便攜帶與懸掛拿取 ★裝飾性
3. 功能上兼具鑰匙圈與掛勾的特性。 4. 附著於橫桿或物體邊緣，機動性高。
story 故事 5. 價格設定於 300~500 元。 6. 藉由懸掛的小動作延伸祖靈守護的故事。
28
Product design / 守護 ‧ HOOK
排灣族的祖靈化身－百步蛇
how to use 如何使用 蛇頭向上，翹起來的尾巴是掛勾的開合扳手， 可任意夾在橫桿或物體邊緣上固定， 用蜷曲 的蛇體懸掛包包、袋子、衣服等。
When 何時使用 ★掛包包、提袋、衣服等 ★需臨時放置東西，手不方便拿時
who 目標對象 守護 ‧HOOK
★年齡：20~30 ／ 30~40 ／ 40~50 ★性別：不拘 ★職業：學生／上班族／家庭主婦 ( 夫 )
Where 在哪裡使用 ★橫桿類：門把／毛巾架 ★物體邊緣類：桌邊緣／門上緣／包包內的鐵環或線圈
what 外觀．功能 ★彷生：動物（百步蛇） ★色彩：暖色－褐（大地色）/ 金屬色－銀、鐵灰 / 飽和純色－紅、藍、橘…等。 ★材質：木 / 金屬 / 塑料 ★尺寸：6.5cm( 長 ) x 2.5( 寬）cm x 8cm( 高 ) ★功能：鑰匙圈－機動性高，尺寸小，攜帶方便 ; 掛勾－隨意增加支點懸掛東西。 Product design / 守護 ‧ HOOK
29
1 2
3
1 top 2 front 3 right
30
Product design / 守護 ‧ HOOK
Product design / 守護 ‧ HOOK
31
32
Product design / 守護 ‧ HOOK
Product design / 守護 ‧ HOOK
33
收合施力點 懸掛處
菱形紋
外觀細節 Detail 34
Product design / 守護 ‧ HOOK
旋轉栓
Product design / 守護 ‧ HOOK
35
36
Product design / 守護 ‧ HOOK
plastic
mental
wood
Product design / 守護 ‧ HOOK
37
使用說明 How to use 當手提太多東西不便做事時，暫時將提袋等隨身物品勾進鑰匙圈內，掛在門邊的把手上或桌緣 邊等懸掛處。
38
Product design / 守護 ‧ HOOK
Product design / 守護 ‧ HOOK
39
40
Product design / 守護 ‧ HOOK
Product design / 守護 ‧ HOOK
41
Part 2. 產品設計 product design
Elephant usb
小象隨身碟
尺寸：5cm( 長 ) x 3.5cm( 寬 ) x 3.5cm( 高 ) 材質：矽膠、塑膠、金屬、led 燈 為年輕族群設計的小象造型隨身碟，象鼻為 usb 接頭，蓋子則 用矽膠彈性的特質做不掉蓋設計。眼睛為 led 燈，接上 usb 時 會發亮。尾巴為吊飾孔。並以三種色彩作為８G、16G、32G 容量的區別。
42
Product design / Elephant usb
Product design / Elephant usb
43
隨身碟市場分析 ImageBoard for USB 1. 單功能的多於多功能的，造型圓滑的多於幾何的。 2. 材質大多是塑膠類 ( 軟硬皆有 )、其次是金屬，少數 有紙質與木材質。 3. 非自然材質的色彩較單純，人造材質的色彩較豐富 多變。 4. 分離與不掉蓋設計比例相當。不掉蓋包含：無蓋、 一體成型、按壓、旋蓋、組合式。
44
Product design / Elephant usb
ImageBoard for USB
01
ImageBoard for USB
02
Product design / Elephant usb
45
1 2
3
1 top 2 front 3 right
46
Product design / Elephant usb
Product design / Elephant usb
47
48
Product design / Elephant usb
Product design / Elephant usb
49
吊飾孔 LED 燈泡
外觀細節 Detail 50
Product design / Elephant usb
不掉蓋設計 usb 接頭
LOGO / 儲存容量
Product design / Elephant usb
51
使用說明 how to use
step1
52
Product design / Elephant usb
step2
step3
step4
Product design / Elephant usb
53
54
Product design / Elephant usb
Product design / Elephant usb
55
Part 2. 產品設計 product design
Tower Night Light
夜燈塔
尺寸：4.5cm( 長 ) x 4.5cm( 寬 ) x 15cm( 高 ) 材質：陶瓷、塑膠、金屬、led 燈 為習慣熄全燈睡眠族群所設計的感應照明燈，可放置於臥房、 走廊、玄關、樓梯旁、陽台等。當半夜醒來或遇緊急狀況，走 到之處便會自動亮燈，不需摸黑找開關。既是小夜燈也是備用 照明的手電筒。
56
Product design / Tower Night Light
Product design / Tower Night Light
57
小夜燈市場分析 ImageBoard for Night Light 1. 大多以單一照明的功能為主，少數有附加的功能。( 與時鐘、 手電筒、精油檯、喇叭的附加功能結合 ) 2. 偏暖色調及色彩豐富的居多。 3. 整體以塑膠材質製成居多，少部分運用木、布、金屬的材質。 4. 固定插座型的與移動充電型的分佈數量相當，可移動設計有增 加趨勢。 5. 可針對原本不使用小夜燈的族群開發，思考附加功能，創造其 需求而使用。 6. 依不同空間搭配不同的造型特性，設計移動型小夜燈，營造特 殊氛圍。(ex: 門口、陽台、旅館 )
58
Product design / Tower Night Light
ImageBoard for Nightlight
01
ImageBoard for Nightlight
02
Product design / Tower Night Light
59
設計方針 Design guidelines 1. 使用對象男女不拘、年齡 20-50 的上班族，針對原本不使用小夜燈的 族群開發設計。 2. 室內使用。 3. 成本設定 400-600 元。 4. 使用 LED 燈。 5. 造型與材質皆以自然風格發展，使用木、布、竹、陶瓷等自然的材質。 6. 照明功能為主，可充電分離式電池，遇緊急狀況可充當手電筒使用。 7. 機動性或對使用環境有加分效果的造型。
60
Product design / Tower Night Light
MIND MAP
Product design / Tower Night Light
61
1
2
1 front 2 back 3 right
62
Product design / Tower Night Light
3
Product design / Tower Night Light
63
64
Product design / Tower Night Light
Product design / Tower Night Light
65
產品外觀功能說明 Product appearance Function 塔頂燈罩 內含二組 led 燈，具小夜燈、 手電筒與備用照明燈功能。
亮燈模式旋轉鈕 on 恆亮
66
Product design / Tower Night Light
auto 自動感應
off 關閉
紅外線感應窗 感應移動物體所熱能而亮 燈，並在離開後關燈。
塔身燈罩 霧面 PC 材質，內 含 led 燈。
底座 粗糙表面增加 旋轉磨擦力。
Product design / Tower Night Light
67
。旋轉插頭 90 插頭式充電，插頭旋轉收合不佔空間。少了電源線的限制可隨意放置，也可當手電筒攜帶使用。
1
2
3
1 側面：插頭旋開 2 背面：插頭收合 3 斜背面：插頭旋轉收合 68
Product design / Tower Night Light
亮燈模式設定 1
1 2 3
2
3
恆亮 : 旋鈕轉左 自動感應 : 旋鈕置中 電源關閉 : 旋鈕轉右 Product design / Tower Night Light
69
使用環境 1
2
1 小夜燈 : 樓梯旁 2 手電筒 : 室內走廊
70
Product design / Tower Night Light
Product design / Tower Night Light
71
72
Product design / Tower Night Light
Which
one
is
your
taste?
Product design / Tower Night Light
73
Tower Night Light recyclable
74
Product design / Tower Night Light
charging
夜燈塔 led
save
Product design / Tower Night Light
75
Part 2. 產品設計 product design
ID Holder USB
證件套隨身碟
尺寸：14cm( 長 ) x 1.5cm( 寬 ) x 13cm( 高 ) 材質：皮、塑膠、金屬、布 為減少隨身碟的遺失率，結合上班族常用的證件套，外加拉 鍊袋可放零錢或鑰匙，設計一體成形的證件套隨身碟。以掛 頸的方式貼身攜帶，使用隨身碟時將金屬釦解開分離皮繩， 使用完畢後，掛在身上的皮繩可提醒將它收回。萬一遺失， 名片上的資訊也能提高被尋回的可能性。
76
Product design / ID Holder USB
Product design / Product design / ID Holder USB
77
1 2
3
1 top 2 front 3 back
78
Product design / ID Holder USB
Product design / Product design / ID Holder USB
79
80
Product design / ID Holder USB
Front
back
left
ĺ‘ą Product design / Product design / ID Holder USB
81
拉鍊袋
USB
82
Product design / ID Holder USB
卡片插入孔
皮繩
卡片放置處
金屬鈕釦
Product design / Product design / ID Holder USB
83
84
Product design / ID Holder USB
你的 隨身 好幫手! ID Holder USB 證件套隨身碟
16G USB 2.0 Flash Drive ID Holder / USB / Pocket
Product design / Product design / ID Holder USB
85
Part 3. 多媒體設計 multimedia design eBook
2013 台北大眾捷運股份有限公司
［捷運新文化影帶及翻頁電子書］ 主視覺 : 捷運路線圖 封面標題文字以捷運路線圖繪製，搭配主題意涵，排列的簡易人形表示關懷各種捷運乘客。封面 與封底背景是台北城市風景。前言的視覺編排，以路線圖顏色與簡單圓球帶出活潑感。目錄與內 頁的章節名稱也都延伸路線圖的站點與顏色來設計。
86
Multimedia design / eBook
封面 + 封底 Multimedia design / eBook
87
前言 88
Multimedia design / eBook
目錄 Multimedia design / eBook
89
影片 + 圖文編排 90
Multimedia design / eBook
點按播放鈕立即切換至大尺寸影片 Multimedia design / eBook
91
測驗題 92
Multimedia design / eBook
設計教案表 Multimedia design / eBook
93
Part 3. 多媒體設計 multimedia design Webpage
2012 歐芳 ( 天津 ) 日化有限公司
［ kc.standard 網站暨系統開發 ］網頁設計 主視覺 : 自然、大幅風景圖 搭配客戶的芳療產品，以自然生機、四季結合節慶的主題製作網頁樣版首頁設計，供不同時節 替換使用。
94
Multimedia design / webpage
［自然療法專頁］ Multimedia design / webpage
95
［春櫻。春節］
96
Multimedia design / webpage
［夏。母親節］
［秋豐收。中秋節］
［冬雪。聖誕節］
Multimedia design / webpage
97
Part 3. 多媒體設計 multimedia design UI
2011-2013 各大專案
［UI 使用者介面設計］ 主視覺 : 依各門的課程內容與客戶風格喜好而設計 課程 UI 為整門課的使用介面，在成品製作前先製作完成並需經客戶確認。而 demo UI 則是前期 標案用的 UI，專案得標後依此風格製作各門課程 UI。
98
Multimedia design / UI
2013 李長榮化學工業股份有限公司［三乙基鋁卸程序］課程 UI Multimedia design / UI
99
2013 高雄市政府公務人力發展中心［高雄特色 easy talk］課程 UI 100
Multimedia design / UI
2013 臺北市政府公務人員訓練處 臺北 e 大 demo UI Multimedia design / UI
101
2011 國民健康局 demo UI 102
Multimedia design / UI
2011 台灣大哥大［資安停看聽］課程 UI Multimedia design / UI
103
2011 行政院人事行政總處公務人力發展中心 ［媒體溝通］課程 UI 104
Multimedia design / UI
2011 行政院人事行政總處公務人力發展中心 ［職場女強人的兩難］ 教學影片 UI Multimedia design / UI
105
Part 3. 多媒體設計 multimedia design Animation
2012 臺北市政府公務人員訓練處
［Hot 剋任務 - 愛地球關鍵行動］ 以星球科技風呈現課程包裝，用情境動畫描寫未來地球升溫不再適合人類居住。主題人物－蓋 婭教授找到拯救暖化問題的方法，搭乘時光機回到過去，尋找更多的線索，並陸續將他的發現 傳遞給學習者，以六項關鍵任務的方式傳遞給大家，必須完成任務後才能具備有拯救地球的知 識和能力。 榮獲「數位典藏與數位學習國家型科技計畫 數位學習品質服務中心」- 數位教材 AAA 認證標章 年度【最佳數位教材品質】獎 : 教學策略具創意且教學媒體製作精緻，促進學習者理解。 年度【數位學習全方位品質精進】獎 : 挑戰 Epprobate 國際數位學習品質認證，皆獲得佳績。 http://www.elq.org.tw/news_detail.php?info_id=104 106
Multimedia design / Animation
UI 設計
Multimedia design / Animation
107
108
Multimedia design / Animation
角色設計 1
2
1 蓋婭教授 2 努特小北極熊
Multimedia design / Animation
109
功能鈕版型 / 開場動畫 / 情境動畫 110
Multimedia design / Animation
課中測驗版型 / 單元目標版型 / 圖說動畫 Multimedia design / Animation
111
單元小試 : 關鍵任務 112
Multimedia design / Animation
總測驗 : 關鍵行動大考驗 Multimedia design / Animation
113
Part 3. 多媒體設計 multimedia design Animation
2012 行政院人事行政總處公務人力發展中心
［希望與導向 - CEDAW 公約介紹］ 主要場景 : 希島 法條教材以主題樂園呈現，每個單元皆設計為島上的景點，並以導向性的纜車作為 循序漸進閱讀的方向。此場景也設計為 UI 上的功能鈕「課程目錄」選單供點按， 藉由樂園包裝引發學習動機、加深閱讀印象與樂趣。
114
Multimedia design / Animation
Multimedia design / Animation
115
2 1 116
Multimedia design / Animation
3
4
6 5 各單元場景畫面 Multimedia design / Animation
117
右上角小手提示點按「課程目錄」功能鈕 / 課程目錄選單 / 圖文動畫 118
Multimedia design / Animation
圖文動畫 Multimedia design / Animation
119
課中互動測驗題 120
Multimedia design / Animation
單元小試 Multimedia design / Animation
121
201 3
R o n g ´s p o r t f o li o
i s s u u . c om /r on gr o n ghu