P O R T FOLIO
CONTENTS
3
G R A P H I C D E S I G N 37-58
C r e a t i o n / I l l u s t r a ti o n
1
A B O U T
M E 01-08
2
I N T E R A C T I V E
D E S I G N 09-36
1
A B O U T
M E
履歷表
03- 04
個人LO G O
05- 06
個性分析
07- 08
基 本 資 料 姓名
陳宣諠
電話
(+886)72916620
性別
女
信箱
origin0875@gmail.com
生日
1999.03.14
地址
新北市八里區中山路一段63號3樓
學 歷 大同大學 媒體設計所 碩一 大同大學 媒體設計系互動組 畢業
關 於 我 目前就讀大同大學媒體設計所碩士一年級，在求學的過程，勇於嘗試不同的領域，讓自己 能夠探索更多職業的選擇，在每一次的專案製作都擔任不同的角色，能夠團隊合作也能夠 獨立作業。興趣是音樂、攝影、繪畫，對使用者經驗與使用者介面領域非常有興趣，是一 位能動能靜、樂於挑戰、適應能力強的人。
3
經 歷 2020 畢籌會 文書長 負責收取、整理資料，及各式活動需求的表格
2018
製作與準備，留意所有競賽時程
翔音擊團 美宣、網管
濱海小學堂 志工
海報設計、經營FB粉絲團
用講故事的方式陪伴偏鄉小朋友
2017
深擊設計 實習生
畫家畫玉山 典藏
數位設計部門實習生
油畫比賽
2019
2016
班級幹部 副班代
青藝盟-紙袋人軍團
協助班代處理班上事務、轉達學校公告事項
協助街頭快閃活動前置作業:議題探討、
婚姻平權聯署 志工
快閃表現方式
協助宣傳聯署，進行街頭對話
戲劇社公演
系學會 機動組組員
負責編劇和燈光設計
負責協助器材租借、搬運、清點，支援各組組別
聖心美展 立體雕塑區布展人 西畫類第二名
技 能
Adobe系列軟體 Ai
Ps
Ae
證照 Dw
．TOEIC TEST 555分
Id
其他軟體 Figma
Unity
Arduino
4
個 人 LOGO
4.4 6.6
3.4 5.4
5.9 0.5
2.4
5.1 4.4 0.7
r=1.1 r=0.5 2.2
4.2
2.8
7
r=3.1
r=1.6 0.5
7
2.8 3.2
1.6 r=0.3
c
0.8 0.8 1.4
5.8
1.4 r=0.5 1.42 r=0.5
1.9 2.8
ab
6.7
0.005 0.07 0.02
4.1
5.6
r=0.3
a 0.3 b 0.4 c 0.5
5.3
5
設計理念 以中文名字的「諠」和英文名字”HSAUN”為主，將這兩個字進行簡化。 整體視覺以圓形為主題，顯現出自己圓滑的個性，眼睛的形象代表我是一個 喜歡觀察與喜愛影像的人。
色彩規劃
L:71 A:31 B:54
L:34 A:13 B:-49
名片設計
6
個性分析
S W OT
勇於挑戰新事物 工作經驗較少
隨和與樂觀
對自己較沒自信
獨立思考和創意
S W O T 有英語與日語能力 還沒找到工作定位
環境適應能力強
比賽經驗較少
團隊合作溝通良好
7
心智圖
8
2
I N T E R A C T I V E D E S I G N 居家微型睡眠治療
11- 22
富甦
23- 36
居家微型睡眠治療 一個對於2030年的想像設計
設計理念
此產品參考催眠治療法的方式，提供患者有效且能在睡覺 時間做的心理治療，希望透過治療的頻率來讓患者不再依 賴藥物，偵測貼片搭配APP可隨時注意自己的睡眠狀況， 並且可傳回給主治醫生，作為下次治療的參考依據。
LOGO/設計語彙 Profession AI psychologist
Home treatment
Avoid drug dependence
L:27 A:7 B:-33
L:72 A:27 B:-6
Quickly fall asleep
13
使用流程 3.進入睡眠狀態後開始治療(腦波
1.貼上偵測貼片
2.開始偵測
4.利用AI人工智慧與潛意識進行
5.結束60分鐘的治療後，利用α波
6.隔天可透過APP確認睡眠狀況和傳
治療
的讓患者進入深睡狀態(腦波在δ波)
送睡眠報告給醫師
在α波和θ波之間
產品構造
植物纖維
材質
海綿
類似電子皮膚貼片，使用天然植物纖維作為貼片材質， 具有良好彈性和韌性，觸碰皮膚也不會造成異物感。
腦波檢測芯 電池 植物纖維
14
獲利模式 提供價值 合作夥伴
居家治療 提升睡眠品質 睡眠即是治療
跨越傳統 醫院
憂鬱症 防治協會
醫療器材販 賣廠商
潛意識治療 治療參考依據
心理諮商 協會
互動藍圖 使用者
貼上貼片
貼片
開始偵測腦波
APP
紀錄腦波變化
進行睡眠治療
醫師
15
結束治療，進入睡眠
Flow Chart Main Page
睡眠報告
預約看診
睡眠日誌
早晨喚醒
個人資料
設定鬧鐘
個人資料
預約或查 詢掛號
常用或自 行預約
寫下自己 睡眠狀況
提供睡 眠建議
預約清單 歷史紀錄
依照日期/ 醫生預約
歷史紀錄
即時傳送 給醫師
取消掛號
睡眠狀 況分析
深淺眠 時間
早上起床，取下貼片
開啟APP
登出
主治醫師 登記
傳送報告給主治醫師
取下貼片 完成紀錄
提醒傳送報告給醫師 收到睡眠報告，將作為下次治療參考依據
16
介面設計
2.0睡眠報告 1.0首頁
3.0-3
3.1自行預約
2.0-1
3.1-1
3.1-2
5.0睡眠日誌
5.0-1
預約看診
掛號成功
王小名 醫師 (身心科) 5月20日 星期四 第312診 下午門診 1:30-17:00 預約號碼 35號 建議報到時間 3點15分
確定
4.2-3
4.2-4
睡眠日誌
睡眠日誌 描述一下今天的心情吧!
描述一下今天的心情吧!
儲存
儲存
歷史日誌 2019/5/14
歷史日誌 2019/5/14
今天睡起來感覺心情... 今天睡起來感覺心情... 2019/5/13
2019/5/13
第一次使用這個產品... 第一次使用這個產品...
2019/5/14 今天睡起來感覺心情... 2019/5/13 第一次使用這個產品...
2019/5/14
今天睡起來 2019/5/13
第一次使用
...
...
3.0-2 3.0預約
3.0-1常用預約
3.1-3
3.1-4
5.0-2
5.0-3 睡眠日誌
3.1-5
3.1-6
睡眠日誌
昨天夢到了......
昨天夢到了......
儲存
歷史日誌
3.0-3
已儲存
歷史日誌
2019/5/14
2019/5/14
今天睡起來感覺心情...
今天睡起來感覺心情...
2019/5/13
2019/5/13
第一次使用這個產品...
第一次使用這個產品...
2019/5/14
2019/5/13
18
看更多功能細節 Marvel APP
根據睡眠狀況客製化提供意見，或提醒該注意事項
可即時傳每日睡眠報告給主治醫師，數據將作為治療依據
19
使用時間軸搭配柱狀圖，讓使用者一目了然
日誌
睡眠 今
一下
描述
!
情吧
心 天的
儲存
/5
2019
誌 史日
歷 5/14
/ 2019
... 心情
感覺
來 睡起
今天
5/13
/ 2019
用
次使
第一
20
品...
產 這個
2019
喚醒功能 淺簡易懂的時間設計
醫師模式 清楚明瞭的掛號系統
21
預約功能 整合全台醫院掛號功能
日期模式
清楚明瞭的掛號系統
個人資料 更換主治醫師，綁定健保卡
22
富
甦 一個結合聲音與燈光的互動裝置
設計團隊 程式設計/
陳宣諠 林采萱
裝置設計/
陳宣諠 林采萱 陳怡靜 洪瑾彤 許致榕
美術設計/
許致榕
主題發想與研究/ 陳宣諠 林采萱 陳怡靜 洪瑾彤 許致榕
設計理念 復甦，亦即再生的意思。 而這個富甦，代表著我們希望富錦街上的樹與人，能夠再次彼此認識與和睦相處。
LOGO設計 L : 3 1 A : 2 3 B : 2 8 L : 3 7 A : -21 B : 2 3
25
26
田野調查
地點:台北市松山區富錦里里辦公室 受訪對象:富錦里里長 時間:108/03/19
富錦街區域
民權東路 敦化北路 塔悠路 民生東路
富錦街樹種
茄冬 榕樹 菩提樹 楓香 少部分的小葉欖仁
浮根問題 因浮根而隆起的地板，兩三年會整修一次。 有些樹浮根嚴重、很危險，颱風來隨時會倒， 里長想把樹移走，但民眾堅持不移，居民覺得 樹也是一個生命。
樹穴 一開始做樹穴是為了要種灌木植物，結果卻種 不起來，後來發現因為種灌木要有陽光才長得 起來。 所以富錦里決定不做樹穴，還有一個原因是有 人會亂丟垃圾在樹穴裡。
富民生態公園 是台北市第一座生態公園 整個公園以前是排水溝，於86年至91年整修完成。 具備生態教育的豐富資源，除了有多種鳥類定居造訪外，更種植 了誘蝶植物吸引蝴蝶來訪，水池則創造了夏季的蛙鳴，還有擁有 豐富水生植物的河川生態，設計手法上是仿河川的上、中、下游 來營造植物的生長環境。
30
技術應用與程式設計
利用RFID感應，數值傳送到Arudin後再與Unity做數值連結，依照感應不 同的RFID與不同的數量，去控制播放不同的Audio與LED燈條的變化。 Arudino
設定LED燈條
設定從Unity接收到的數值要做什麼變化
與Unity做連結 31
Unity
接收Arduino數值，設定做什麼不同的變化
每一個RFID都會不同的聲音播放，同時記錄感應 到多少個RFID
互動流程
01.桌面上有9棵樹
02.使用者自行挑選5顆
03.將樹放進樹洞
32
04.可得到聲光音效回饋
裝置設計 整體裝置呈現富民生態公園的樣貌，使用者透過種植樹木能夠得到生態公園裡生物 的叫聲回饋，也能體會到當初蓋這座生態公園時，物種和水流漸漸復甦的盛況。
33
種植樹木
木製涼亭
花圃區
濕壁生態區
水池生態區
竹林步道區
一共設有五個樹洞，樹木總共有9顆，每一顆都代表不同生物的聲音，使用者可任選五顆放進樹洞，放 置不同的樹也有可能觸發不同區域的LED燈亮起，而水流燈的變化是依照樹木放的總數去做變化，從 放置一顆到放置五顆，水流燈會越流越快，代表生態蓬勃。
使用者種植樹木 34
35
36
3
G R A P H I C D E S I G N L e t ’s g o T a i p e i !
39- 44
OTO網站
45- 58
L e t ’s g o T a i p e i ! 臺北未來捷運路線圖與APP
設計理念 以直線方式呈現每條捷運的路線，不同於現有的路線圖，把每一條線拉直更能清楚找到自己要前往的目的地。背 景顏色採用黑色，讓整體看起來更有未來捷運感，每條線的顏色採用對比顏色較強的視覺手法，而相近或是有關 聯的路線則採用同色系，讓人能更直覺的閱讀。 此路線圖的目標客群為來臺灣旅遊的外國遊客，所以採用全英文的方式呈現，在設計上也考量到外國旅客與本地 人的需求不太一樣，所以在路線上稍作簡化，看起來才不會太複雜。
ICON Light Rail Station Gerneral Station Interchange Station Taoyuan Airport
Railway
Te r m i m a l S t a t i o n
Railway-MRT
41
42
介面設計 1.0規劃路線
1.0-1
1.0-2
2.0-2
1.0-3
3.0-1選擇出發地 3.0路線圖
43
1.0-4 2.0車站資訊
2.0-1
3.0-4選擇目的地 3.0-2
3.0-3
44
路線規劃 以簡易的畫面讓使用者能夠直覺的規劃和查詢路線資訊
捷運地圖 能夠顯示完整捷運路線圖，也可下拉選單，選擇觀看單一路線
45
轉乘資訊 顯示經過之站名與捷運到站時間
車站資訊 可查詢站與站的行車時間與票價、每站的捷運到站時間、 首班車和末班車與出口資訊
46
OTO網站 專案發展過程的統整網站
主題說明 OTO (Our motor) 台灣機車密度是全球第一，但同時造成許多交通亂象及環境污染，這時機車若能效法YouBike這樣方便租借的話，不但 可以減輕城市交通的壓力，也能夠省下自用機車的損耗和保養費用，不用買機車，卻隨時都能有機車用。 並在發展綠能生活的前提下，電動機車將逐步淘汰掉傳統燃油機車，並且加入共享經濟的概念，創造出新型態的移動選 擇，利用以租代買帶來行動的新革命。 期望探索公共化個人綠色交通服務系統的潛力，都市全面綠能交通的可行性。
田野 研究
WIX觀看完整網站
事前準備
招募受訪者
研究採集
訂定研究目標
訂定研究目標
約訪
篩選規劃
尋找受訪者
規劃訪談內容
篩選受訪者
01
02
訪談1-2hr 影音紀錄 答謝
03 原始資料
初步資料整理
洞察與呈現
影音資料處理
確立摘要快照
資料分析
初步訪談摘要
訪談內容摘要
同理心地圖 設立代言人 利害人關係地圖
04
50
05
06
受訪者 篩選圖
group1
Ubike WeMo Goshare
group2
group3
Ubike WeMo
Ubike iRent
51
Ubike WeMo Obike
group4
Ubike WeMo iRent
● ● ●
流程 比較圖
擷取並建構使用情境中的整體脈絡 脈絡中所謂的情境，會隨著時間變化發展其歷程 焦點放在使用者的行為上，而不去假設為什麼沒做的事
租還
註冊
Ubike 我要租車 會員登入
卡片交易 加值服務
故障通報 加入會員
站點資訊
單次租車
無位還車
於機臺點選「我要租車」
點選「加入會員」進行註 冊，依序填寫會員資料
進行租借
WeMo 1.輸入個人資料
身分證 駕照 自拍照
性別: 生日:
於APP選註冊
3.付款方式
2.上傳證件
正
反
正
反
等待審核
V 信用卡 WeMo錢包
上傳所需證件
選擇付款方式
機車資訊及 預定租車
手機APP即 鑰匙
進行還車 騎乘記錄
Ubike ?
?
Card1
我要租車
會員登入
刷卡 取車
嗶!
09XX-XXX-XXX Card3
會員註冊的地方在哪裡? 通常不是都在會員登入裡， 怎麼會在租車裡。
Card2
?
Card4
原來可以一個帳號(手機號 碼)綁定多張卡片，這樣就 不用辦很多個帳號了!
用悠遊卡就可以 解決，真方便!
到底有沒有確實還?車卡 進去就好了嗎?卡進去怎 麼沒有其他反映?
Ubike沒有騎乘限制，對於未成年及沒有駕照的使用者非常便利，在時間及金錢成本的考量下選擇 的交通優先順序為「走路-Ubike-WeMo-公車/捷運」；在公車及捷運到不了的地方，Ubike和 WeMo會相對方便很多，但由於Ubiike有甲租乙還得租借限制，所以訪談者在兩者都有的情況下 會優先選擇WeMo。
WeMo ?! 90%
? 啟動
App地圖誤差找不到車， 明明到了標示處，還是沒 看到!常誤差1~2條街......
儀錶板上啟動成功的提 示好不清楚，感覺可以 多個提示聲。
52
電量
44.5 km
P
還車
里程數，騎乘的 時間及使用費用 都標示得很清楚!
沒有規定特定的地方還車很 方便，雖然會有找不到車位 的可能，但只要不被開單或 被檢舉還是很順利。
● ●
綜合研究員對使用者的觀察，聆聽與溝通技巧以取得資訊 受測者操作指定任務並將心中的想法講出來（放聲思考），
並且帶出過去的使用經驗
WeMo Ubike
WeMo 資料審核時間至少 1-2工作天
費用/付款
開卡時間3-5分鐘
儲值
註冊流程
註冊
註冊
超商繳費/儲值卡機台 儲值不限金額
儲值金額/綁定信用卡
租車
ATM轉帳/超商代碼 繳費單次最低儲值 金額300元
租借流程
騎乘
還車
正常還車流程 服務範圍內，隨處 可停
邀請朋友取得回饋金
正常機台這側流程 正常線上註冊流程 已註冊的卡再次註冊
時間計費，前6分鐘 15元，第7分鐘後 2.5元/分鐘 (每次最低扣款額度 為9元)
甲租乙還
電子票證作為租借
收費
註冊
手機APP作為機車 鑰匙
步驟簡單，初次操作上 較直覺
租還
Ubike
機動性
優惠
步驟繁複，初次操 作上需多摸索
租借
騎乘過程中暫時停車
時間計費，4小時內 每30分鐘10元
租車 正常租借車輛流程 使用流暢，資訊呈 現完整
還車
正常還車流程
53
APP
使用較不流暢，資 訊、按鈕未標示清 楚
創意 發想 說明 HMW 將不同資訊源頭轉換成問題，將其拓展並 釐清
腦力激盪 提出大量與主題關聯的見解並重新分類整 理已提供新觀點和解決方法
６３５ 以紙、筆傳達想法，全程不能說話，使不 擅口語表達或猶豫不決的參與者勇於表達
創新概念
方法介紹與比較 特點
用途
HMW
HMW
把小問題放大拓展，釐清問題 定義核心目標，找出創新突破的機會 讓團隊凝聚共識
尋求新的設計機會
腦力激盪
腦力激盪
短時間有大量構想，讓團隊凝聚共識 不存在任何偏見
集思廣益獲得新想法
６３５
６３５
思維活動可自由奔放 產生高密度的設想 不影響意見的提出
刺激組員快速產生許多構想
55
研究 洞察
原型 設計