劉于 瑄 設計作品集
1
CONTENTS ABOUT ME Resume
VISUAL COMMUNICATION 3
衷˙教
7
WORK Experience
集市廣藝 Corartify
OTHERS Experience
臺灣 STEM 築夢女傑知多少？
SOHO Experience
2 visual communication / graphic design
user experience / user interface / exhibition
Sherry Liu
雪莉抵家
sherry0800@gmail.om
GRAPHIC DESIGN UP!ck Banner & Poster
USER INTERFACE / USER EXPERIENCE 31
兒童文學跨界應用展 & 繪本 x STEAM fun 出教與學 Trifold and Poster HUG Poster 就業博覽會 Banner 機器學習 Banner Coding Angels Poster 雞年新春 Poster 篆體瓦當 Logo 創意篆體 Logo 中華民國 ( 台灣 ) 口腔顎面外科協會 Logo
EGGPLANt APP UI Practice WEB UI Practice
61
3
INTRODUCTION 簡介
WORK EXPERIENCE 實務經驗
SHERRY LIU 劉于瑄 2017.06
2016.07-2017.06
臺北市立大學
臺灣微軟 未來生涯體驗計劃
學習與媒材設計學系 畢
開發體驗暨平台推廣事業部 行銷助理
SPECIALITY 擅長
2016.01-2016.09
影像處理 平面設計 教具設計
Broadcasting Corporation of China
用戶體驗設計
課程助理
SKILLS 技能
2015.07-2015.09
University of Taipei
Microsoft Student Program
Department of Learning and Materials Design
Developer Experiences and Evangelism Marketing Assistant
中國廣播公司
Courses Assistant
頤德國際股份有限公司
PS
AI
Id
Pr
Dw
VEDA International Corp
公關行銷助理
Public Relations and Marketing Assistant
HTML W
P
CSS E
Sketch
4 態度決定我的生活 Attitude
OTHERS EXPERIENCE 其他經歷
SOHO EXPERIENCE 接案經驗
2015
2016.01
迎新宿營 美宣長 小樹苗媒體識讀營隊 - 宜蘭萬富國小 We Do 公民實踐獎 - 小樹苗媒體識讀教學
科技部大專生研究計畫補助 集市廣藝桌遊繪本 2017.02
2016 系學會 執行秘書長 聖誕趴 副召及主持人 小樹苗媒體識讀營隊 - 宜蘭大里國小 2017 小樹苗媒體識讀營隊 - 新北平溪國小 畢籌會 執行秘書長 畢籌會 公關執行 中華民國設計學會 - 學術研究成果研討會
臺北青年職涯發展中心 就業博覽會 懶人包視覺設計 2017.05 科技部 - 兒童文學跨界應用展 視覺設計及展覽策劃 2017.09 國立臺灣科學教育館年會 繪本 x STEAM fun 出教與學 視覺設計及展覽策劃 2017.10 內湖妙善幼兒園校園環境 視覺設計 2017.11 Upick 社群聚會 視覺設計 2017.11 國立臺灣科學教育館 臺灣 STEM 築夢女傑知多少？ 桌上遊戲研發設計及繪圖設計
leads my life
VISAUL COMMUNICATION 衷˙教 集市廣藝 Corartify 臺灣 STEM 築夢女傑知多少？
衷˙教 PS
2017.1 Communication Design
思想與宗教的表現往往都會被社會所審視 著，然而，刺青，在現在認知裡雖是一種 次文化的表現，但卻能代表著追隨者的忠 誠與信任，不輕易捨棄也不易改變。
VISUAL COMMUNICATION
2017.04 Communication Design
臺北市立大學 學習與媒材設計學系 畢業專題 - 集市廣藝 Corartify PS
AI
Id
透過對文創市集的研究與體驗，可以身處 其中的感受其中的優缺點，希望可以改善 現今台灣文創市集，並且規劃一個別出心 裁、風格獨特的文創市集規劃。
12
13
VISUAL COMMUNICATION
Logotype | Horizontal arrangment - Grid
LOGO 及標準字 | 橫式排列 -- 方格法
中 文 名 稱 由「 集 思 廣 益 」 一 詞 演 變 而
英 文 名 稱 取 自 三 字 根， 分 別 為
來。 文 創 市 集 可 以 說 是 藝 術 創 作 的 聚
「cor」、「art」及「ify」。「cor」
集地，集市廣藝一詞即是以此為延伸，
作 為 字 首 時， 有 完 全、 一 起 之 意；
代 表 著 廣 納 藝 術 於 市 集 之 中， 並 與 集
「art」 即 是 藝 術 之 意；「ify」 是 動
思 廣 義 之 意 相 作 呼 應， 在 思 考 與 行 動
詞字尾，加在 corart 之後，有使藝術
中作結合，推廣文創市集文化。
聚 集 之 意。「corartify」 一 詞 即 解 釋 為， 使 藝 術 創 作 聚 集 於 一 起 的 現 象， 故以此作為英文名稱。
Corporate typeface
專用字體 中文字體
英文字體
微軟正黑體
Cyclo Trial
文創市集
AaBbCc123
VISUAL COMMUNICATION
Color palette
標準色及輔助色
C 72
C 5
M 40
M 15
Y 0
Y 78
K 0
K 0
#F5D747
#4783C4
視覺的主色調採用黃色（C：5%、M：15%、Y：78%、K：0%）與藍色（C：72%、M： 40%、Y：0%、K：0%）來做設計。藍色，代表天空與市集處於開闊且自由的；黃色，
代表文創市集攤販與顧客互動的活力感。
Logotype
LOGO 及標準字其他排列方式
Logotype ｜ Mono Tone
LOGO 及標準字 | 單色規範
14
15
VISUAL COMMUNICATION
Table Game Design
桌上型遊戲設計
技能牌
原料牌 功能牌
攤位牌
市集牌 規則書
外包裝盒
VISUAL COMMUNICATION
Rule Book
規則書
16
17
VISUAL COMMUNICATION
Board Game Cards
卡牌（市集牌、攤位牌、原料牌、技能牌、功能牌）
VISUAL COMMUNICATION
18
19
VISUAL COMMUNICATION
Dairy of Creative Markets
文創市集一日手札
手札封面
目錄、序
特色市集 介紹
合作夥伴
VISUAL COMMUNICATION
20
21
VISUAL COMMUNICATION
Merchandise
周邊商品
Stickers
貼紙
Paper Tape
紙膠帶
VISUAL COMMUNICATION
22
科學
科技
臺灣 STEM 築夢女傑知多少？ 桌上遊戲出版品 PS
AI
2017.11 Communication Design
以科學家的背景貢獻等基礎知識為概念， 認識女科學家的專業與生平，表彰相關領 域的女性典範，並賦予女孩力量觸動想像， 讓他們朝 STEM（科學，科技，工程，數 學）領域發展與投入興趣。讓所有玩家在 遊戲歷程中，認識臺灣科學女力，可達到 玩中學的目的。
工程
數學
S
N
25
VISUAL COMMUNICATION
Table Game Design
桌上型遊戲設計 Caracter Cards
人物卡
VISUAL COMMUNICATION
26
27
VISUAL COMMUNICATION
Package Design
包裝設計
VISUAL COMMUNICATION
28
GRAPHIC DESIGN UP!ck 2017.12 跨界分享聚 Banner & Poster 兒童文學跨界應用展 & 繪本 x STEAM fun 出教與學 Trifold and Poster HUG Poster 就業博覽會 Banner 機器學習 Banner Coding Angels Poster 雞年新春 Poster 篆體瓦當 Logo 創意篆體 Logo 中華民國 ( 台灣 ) 口腔顎面外科協會 Logo
31
GRAPHIC DESIGN
UP!ck 2017.12 跨界分享聚 AI
2017.11 Poster & Banner
GRAPGIC DESIGN
32
科技部 - 兒童文學跨界應用展 &
國立臺灣科學教育館年會 - 繪本 x STEAM fun 出教與學 AI
2017.5 & 2017.9 Exhibition
展區設有議題繪本區，繪本作家區，和 STEM 繪本區三大系列展區。 議題區介紹不同領域的女性典範生平及貢獻，是性別平等教育學習的好幫 手；繪本作家介紹以李歐．李奧尼和阿諾．羅北兒最受歡迎的繪本為主體， 故事內容傳達豐富的學習訊息，作家的每一本繪本可運用於多領域學習。 STEM 繪本包含了科學、科技、工程和數學等繪本，提供跨領域學習的最佳 材料。相較於傳統教科書，使用繪本作為學習文本，能提升學生的學習興趣 和成效。
35
GRAPHIC DESIGN
GRAPGIC DESIGN
正面
反面
36
37
GRAPHIC DESIGN
HUG PS
AI
2015.09 Poster
現代人不知不覺中，失去了博愛的精神， 逐漸開始追求私利，追尋財富，良心與道 德心漸漸地被現實侵蝕。現實的世界無奇 不有，導致人們的於內心深處一點一滴地 累積不滿，愈積愈多，以至於內心慢慢地 醜化。世界各國之間的競爭力愈來愈激烈， 這樣的狀況造成國與國之間的貧富差距愈 來愈大，像是非洲跟美國，美國人的生活 過得相當奢侈，但是當美國人正在享受資 源的同時，非洲人卻沒有資源可以使用， 饑餓而死、因病而死等等死因極多，想要 改變這樣的狀況，我認為全球的人民必須 攜手努力，一同協助貧窮國家改善種種問 題。
GRAPGIC DESIGN
38
39
GRAPHIC DESIGN
GRAPGIC DESIGN
40
41
GRAPHIC DESIGN
臺北青年職涯發展中心 就業博覽會 懶人包視覺設計 AI
2016.02 Banner
GRAPGIC DESIGN
42
43
GRAPHIC DESIGN
機器學習懶人包 AI
2016.03 Banner
GRAPGIC DESIGN
44
45
GRAPHIC DESIGN
GRAPGIC DESIGN
46
47
GRAPHIC DESIGN
Coding Angels 工作坊 AI
2016.04 Poster
GRAPGIC DESIGN
48
49
GRAPHIC DESIGN
雞年新春 AI
2016.10 Poster
GRAPGIC DESIGN
50
51
GRAPHIC DESIGN
篆體瓦當 AI
2017.11 LOGO
GRAPGIC DESIGN
52
53
GRAPHIC DESIGN
創意篆體 AI
2017.11 LOGO
Design Concept
設計理念 採用「于」的甲骨文字，恰好將我的于與英文名字 Sherry 的 S 融合， 完完全全代表最真實的我。採用漸層灰黑是代表低調謙虛卻又不失莊重 的配色加上亮眼桃紅完全透露出獨有的熱情，不搶眼卻吸引力強。
Primary Color
標誌標準色 C 0
C 76
M 70
M 72
Y 28
Y 70
K 0
K 39
#FF6F8A
#3E3A39
Corporate typeface
專用字體 中文字體
英文字體
華康新篆體
Cyclo Trial
劉于瑄
Sherry
GRAPGIC DESIGN
54
GRAPHIC DESIGN
axillofacial Surg dM eon n a s, T al Or .C) (R.O an aiw
民
國
科
華
學
中
會
Assoc iatio no f
55
口
腔 顎 面
外
中華民國 ( 台灣 ) 口腔顎面外科協會 徽章設計 AI
2017.09 LOGO
Design Concepts
設計理念 本 徽 章 使 用 的 深 藍 色 與 深 度 和 穩 定 相 關， 象 徵 知 識、 權 力、 正 直、 認 真、 虔誠和誠意。深藍色被認為有益身心，可降低人體新陳代謝，產生鎮靜作用。 徽 章 意 象 採 用「 盤 蛇 節 杖 」 標 誌， 源 自 希 臘 神 話 中 醫 藥 神 亞 斯 古 尼 克 的 法 杖，代表治療及痊癒，放置於徽章上方，有著領導本協會的涵義，搭配「桂冠」 象 徵 英 雄 的 最 高 榮 譽， 體 現 本 協 會 的 醫 術 精 明 與 專 業。 另 外， 此 徽 章 的 重 點 口 腔 顎 面 的 意 象， 透 過「 牙 齒 」 簡 潔 的 線 條，「 顎 面 」 曲 線 的 搭 配， 共 同 呈 現 口 腔 顎 面 的 形 象， 其 中「 愛 心 形 狀 的 牙 齒 」， 成 了 畫 龍 點 睛 的 一 環， 帶 出 協 會 的熱情與理想，不僅更凸顯整體想傳達的精神，也使意象明確化。
GRAPGIC DESIGN
Design Materials
設計元素 盤蛇節杖
桂冠
口腔顎面
牙齒
Primary Color
標誌標準色 C 100 M 95 Y 50 K 30 #10234A
Corporate typeface
專用字體 中文字體
英文字體
華康仿宋體
華康仿宋體
劉于瑄
Sherry
牙齒意象
56
USER INTERFACE / USER EXPERIENCE EGGPLANt APP UI Practice WEB UI Practice
61
USER INTERFACE / USER EXPERIENCE
EGGPLANt Sketch
2017.09 UI/UX Design
Zeplin
AI
USER INTERFACE / USER EXPERIENCE
62
USER INTERFACE / USER EXPERIENCE
Persona 人物誌
Concept Development 概念發想
64
65
USER INTERFACE / USER EXPERIENCE
User Journey Map 使用者旅程圖
Functional Map 功能圖
USER INTERFACE / USER EXPERIENCE
Prototype 原型
66
67
USER INTERFACE / USER EXPERIENCE
Zeplin UI Flow
USER INTERFACE / USER EXPERIENCE
68
69
USER INTERFACE / USER EXPERIENCE
UI App Practice Sketch
2017.06 UI Design
USER INTERFACE / USER EXPERIENCE
70
71
USER INTERFACE / USER EXPERIENCE
UI WEB Practice Sketch
2017.06 UI Design
USER INTERFACE / USER EXPERIENCE
Responsive Web Design (RWD) WEB to APP
72
73