-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
503 lines (429 loc) · 34 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>HsiehYiShan</title>
<link rel="icon" href="img/favicon.ico" type="image/x-icon">
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="ionicons/css/ionicons.min.css" rel="stylesheet">
<link href="css/animate.min.css" rel="stylesheet">
<link href="css/aos.css" rel="stylesheet">
<!-- main style -->
<link href="css/style.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<!-- Preloader -->
<div id="preloader">
<div id="status">
<div class="preloader" aria-busy="true" aria-label="Loading, please wait." role="progressbar">
</div>
</div>
</div>
<!-- ./Preloader -->
<!-- header -->
<header class="navbar-fixed-top">
<nav>
<ul>
<li><a href="#projects">Projects</a></li>
<li><a href="#experience">Experience</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</nav>
</header>
<!-- ./header -->
<!-- home -->
<div class="section" id="home" data-stellar-background-ratio="0.5">
<div class="container">
<div class="disply-table">
<div class="table-cell" data-aos="fade-up" data-aos-delay="0"align="center">
<h1>Hi, I'm Sandy</h1><br />
<h2>A UX researcher and designer<br>on the way towards excellence<br> </h2><br /></div>
</div>
</div>
</div>
<!-- ./home -->
<!-- projects -->
<div class="section" id="projects">
<div class="container">
<div class="col-md-12">
<h4>01</h4>
<h1 class="size-50">My Projects</h1>
<div class="h-50"></div>
</div>
<!-- main container -->
<div class="main-container portfolio-inner clearfix">
<!-- portfolio div -->
<div class="portfolio-div">
<div class="portfolio">
<!--portfolio_filter-->
<div class="categories-grid wow fadeInLeft">
<!-- <nav class="categories">
<ul class="portfolio_filter">
<li><a href="" class="active" data-filter="*">All</a></li> -->
<!--<li><a href="" data-filter=".photography">Mixed method</a></li>
<li><a href="" data-filter=".graphics">Qualitative method</a></li> --> </ul>
</nav>
</div>
<!-- portfolio_filter -->
<!-- portfolio_container
<div class="no-padding portfolio_container clearfix" data-aos="fade-up"> -->
<!-- single work -->
<div class="col-md-4 col-sm-6 photography">
<p>AR rare book-New life for rare books</p>
<a id="demo01" href="#animatedModal" class="portfolio_item"> <img src="img/portfolio/project1/smallcover.jpg" alt="image" class="img-responsive" />
<div class="portfolio_item_hover">
<div class="portfolio-border clearfix">
<div class="item_info"> <span>擴增實境再現古書</span> <em>Education / UX research</em> </div>
</div>
</div>
</a>
</div>
<!-- end single work -->
<!-- single work -->
<div class="col-md-4 col-sm-6 photography">
<p>Mentorship platform for UX practitioners</p>
<a id="demo02" href="#animatedModal2" class="portfolio_item"> <img src="img/portfolio/project2/smallcover.jpg" alt="image" class="img-responsive" />
<div class="portfolio_item_hover">
<div class="portfolio-border clearfix">
<div class="item_info"> <span>使用者體驗工作者業師媒合平台</span> <em>Career / UX research</em> </div>
</div>
</div>
</a>
</div>
<!-- end single work -->
<!-- single work
<div class="col-md-4 col-sm-6 graphics">
<a id="demo03" href="#animatedModal" class="portfolio_item"> <img src="img/portfolio/project1/02.jpg" alt="image" class="img-responsive" />
<div class="portfolio_item_hover">
<div class="portfolio-border clearfix">
<div class="item_info"> <span>Photorealistic smartwatch</span> <em>Photography</em> </div>
</div>
</div>
</a>
</div>
--><!-- end single work -->
<!-- single work
<div class="col-md-4 col-sm-6 graphics">
<a id="demo04" href="#animatedModal" class="portfolio_item"> <img src="img/portfolio/04.jpg" alt="image" class="img-responsive" />
<div class="portfolio_item_hover">
<div class="portfolio-border clearfix">
<div class="item_info"> <span>Held by hands</span> <em>Fashion / Ads</em> </div>
</div>
</div>
</a>
</div>
--><!-- end single work -->
</div>
<!-- end portfolio_container -->
</div>
<!-- portfolio -->
</div>
<!-- end portfolio div -->
</div>
<!-- end main container -->
</div>
</div>
<!-- ./projects -->
<!-- experience -->
<div class="section" id="experience">
<div class="container">
<div class="col-md-12">
<h4>02</h4>
<h1 class="size-50">My Experience</h1>
<div class="h-50"></div>
</div>
<div class="col-md-12">
<ul class="timeline">
<li class="timeline-event" data-aos="fade-up">
<label class="timeline-event-icon"></label>
<div class="timeline-event-copy">
<p class="timeline-event-thumbnail">September 2017 - Present</p>
<h3>研究生兼任研究助理</h3>
<h4>臺灣大學圖書資訊學系</h4>
<p>＃聘任於「擴增實境用於圖書館與博物館」計畫，透過文獻回顧發想子題「擴增實境用於古書策展」，設計結合量化與質化研究方法、主持實驗與分析。<br>＃擔任大學部課程助教，協助學生完成專案，主題包括視障讀者服務、台北車站需求探索，主要協助釐清邏輯、聚焦創意。
</p>
</div>
</li>
<li class="timeline-event" data-aos="fade-up" data-aos-delay=".2">
<label class="timeline-event-icon"></label>
<div class="timeline-event-copy">
<p class="timeline-event-thumbnail">January 2018 - January 2019</p>
<h3>國際青年創業領袖計畫(Young Entrepreneur of the Future)</h3>
<h4>時代基金會</h4>
<p>＃擔任七人小隊的組長，在六個月內與跨農、工、商的大學生/研究生
及兩位業師共同創業。<br>＃發想加速中價位餐廳點餐效率的「智慧點餐」，以及透過安全帽打廣告的「騎士廣告」兩項專案。<br>＃以「史丹佛銀髮設計競賽」--「混齡合作」為題，與七位跨系同學及三位60歲以上長者共同組隊。負責引導團隊開會，分配文獻資料蒐集的工作。<br>＃通過英文口試，從130位學生中入選為17位海外參訪代表之一。<br>＃擔任2019YEF招募人員，負責主視覺設計、文案撰寫、大型口頭分享會。</p>
</div>
</li>
<li class="timeline-event" data-aos="fade-up" data-aos-delay=".4">
<label class="timeline-event-icon"></label>
<div class="timeline-event-copy">
<p class="timeline-event-thumbnail">February 2018-January 2019</p>
<h3>「學術英文寫作與發表」助教</h3>
<h4>臺灣大學寫作教學中心</h4>
<p>＃協助老師帶領來自不同學院的研究生整理論文寫作邏輯。<br>＃協助指導學生參加「3分鐘英語學術簡報比賽」，將繁複艱深的論文轉化成一般大眾可理解的簡短報告。<br>＃自己也參加比賽，後成為一百多位參賽者中的前12名，公開演講給400多位觀眾。
</p>
</div>
</li>
<li class="timeline-event" data-aos="fade-up" data-aos-delay=".4">
<label class="timeline-event-icon"></label>
<div class="timeline-event-copy">
<p class="timeline-event-thumbnail">July 2017</p>
<h3>舊金山市立圖書館實習</h3>
<h4>San Francisco Public Library</h4>
<p>＃圖書館因應舊金山多元族群(多語言、高輟學率的青少年、流浪漢...)而設計許多創新服務，與設計這些服務的館員問答過程中，體驗到就連公部門也可透過UX人本思維加上創新，以減緩社會問題。<br>＃拜訪Google總部，與UX research部門做語音辨識的同仁淺談工作情況，開啟對UX的好奇。<br>＃此次參訪結束後，開始加入UX讀書會、跑專案，更理解UX領域的眉角。</p>
</div>
</li>
</ul>
</div>
</div>
</div>
<!-- ./experience -->
<!-- about -->
<div class="section" id="about">
<div class="container">
<div class="col-md-6" data-aos="fade-up">
<h4>03</h4>
<h1 class="size-50"> About me</h1>
<div class="h-50"></div>
<p>大學讀三年半結束，直升碩班開始研究教育科技領域中的使用者體驗。喜歡在日常生活與家教工作中「佈置實驗」，施予不同刺激物，觀察自然場域中各個受試者的反應。</p>
<div class="h-50"></div>
</div>
<div class="col-md-6 about-img-div">
<!--<div class="about-border" data-aos="fade-up" data-aos-delay=".5"></div>-->
<div class="h-50"></div>
<img src="img/about-img.png" width="800" class="img-responsive" alt="" align="right" data-aos="fade-right" data-aos-delay="0" />
</div>
</div>
</div>
<!-- ./about -->
<!-- contact -->
<div class="section" id="contact">
<div class="container">
<div class="col-md-12">
<h4>04</h4>
<h1 class="size-50">Contact Me</h1>
<div class="h-50"></div>
</div>
<div class="col-md-4" data-aos="fade-up">
<h3> Mobile Number</h3>
<p>0916-845-010</p>
<h3>Email</h3>
<p>yishanhsieh419@gmail.com</p>
<div class="clearfix"></div>
<div class="h-50"></div>
</div>
<!-- <div class="col-md-8" data-aos="fade-up">
<form class="contact-bg" id="contact-form" name="contact" method="post" novalidate="novalidate">
<input type="text" name="name" class="form-control" placeholder="Your Name" />
<input type="email" name="email" class="form-control" placeholder="Your E-mail" />
<input type="text" name="phone" class="form-control" placeholder="Phone Number" />
<textarea name="message" class="form-control" placeholder="Your Message" style="height:120px"></textarea>
<button id="submit" type="submit" name="submit" class="btn btn-glance">Send</button>
<div id="success">
<p class="green textcenter"> Your message was sent successfully! I will be in touch as soon as I can. </p>
</div>
<div id="error">
<p> Something went wrong, try refreshing and submitting the form again. </p>
</div>
</form>
</div> -->
</div>
</div>
<!-- ./contact -->
<!--DEMO01-->
<div id="animatedModal" class="popup-modal">
<!--THIS IS IMPORTANT! to close the modal, the class name has to match the name given on the ID -->
<div id="btn-close-modal" class="close-animatedModal close-popup-modal"> <i class="ion-close-round"></i> </div>
<div class="clearfix"></div>
<div class="modal-content">
<div class="container">
<div class="portfolio-padding">
<div class="col-md-8 col-md-offset-2">
<h2>擴增實境再現古書</h2>
<br/>
<p>“When a book is strapped open in an exhibition, visitors are often seeing only a tiny fraction of the content.” -- 蘇格蘭國家圖書館館員Vincent (2012). </p>
<br>
<img src="img/portfolio/project1/cover.png" width="700" align="center">
<div class="h-50"></div>
<h4>為什麼做這專案?</h4>
<p>圖書館或博物館內不乏可見到珍貴古書的展示，然而<b>古書通常是翻開在固定一頁、陳列在玻璃櫃內，簡短的解說牌難以充分表達古書的內容與價值，觀眾多半快速瀏覽過去，不覺得有趣、也難留下深刻印象</b>。這樣的情景，在大學圖書館內更加明顯，靜態的古書展示難吸引學生駐足，更無法了解這些古書的學術價值。</p>
<br>
<h4>專案核心價值</h4>
<p>創造能吸引大學生駐足的古書展示設計，增加他們對圖書館特藏資源以及歷史人文的理解與興趣。</p>
<br>
<h4>Storyboard</h4>
<p>具象化產品被使用的情境，有助於從人因工程角度(e.g.AR裝置的移動性)、介面設計角度(
e.g.內容必須短時間可汲取、不可造成過多認知負荷)、行銷角度(e.g.如何讓經過展區的觀眾願意走過來)等多面思考，亦有助團隊對產品的認知相同。
</p>
<table width="900" border="0">
<tr>
<td>
<h3>1</h3><img src="img/portfolio/project1/storyboard1.jpg" width="300" height="300"><br>
</td>
<td>
<h3>2</h3><img src="img/portfolio/project1/storyboard2.jpg" width="300" height="300" align="left"><br>
</td>
<td>
<h3>3</h3><img src="img/portfolio/project1/storyboard3.jpg" width="300" height="300" align="left"><br>
</td>
</tr>
<tr>
<td>
<h3>4</h3><img src="img/portfolio/project1/storyboard4.jpg" width="300" height="300"><br>
</td>
<td>
<h3>5</h3><img src="img/portfolio/project1/storyboard5.jpg" width="300" height="300" ><br>
</td>
<td>
<h3>6</h3><img src="img/portfolio/project1/storyboard6.jpg" width="300" height="300" ><br>
</td>
</tr>
<tr>
<td>
<h3>7</h3><img src="img/portfolio/project1/storyboard7.jpg" width="300" height="300"><br>
</td>
</tr>
</table>
<br />
<br />
<h4>Persona</h4>
<p>大學圖書館展覽中最主主要的觀眾是大學生，透過文獻回顧與訪談製作persona，了解使用者想在展覽中達成的目標、困難、行為，使設計更貼近主要任務。</p>
<table width="700" border="1">
<tr>
<td><img src="img/portfolio/project1/persona1.jpg" width="150" align="left"><br>
</td>
<td>
<p><h3>郝其南 機械系大三/20歲/男</h3><b>「我根本看不懂古書在寫什麼，但我還是想讀讀看」</b><br>
<b>＃個性：</b>充滿好奇心、喜歡交朋友、願意接受跨領域的新知</br><b>＃動機：</b>來圖書館借書，走經過大廳看到有展覽，順便停留看一下。<br><b>＃需求與目標：</b><br> 1.滿足好奇心: 想知道展示的古書有甚麼重要價值? 為什麼挑選這本來展示? 這本書對我有什麼意義? <br> 2.被娛樂:甚麼有趣的? 有什麼讓我驚豔的特色嗎?<br><b>＃看古書展覽的障礙：</b><br> 1.因為語言或頁面破損，看不懂古書的文字。<br> 2.無法將古書的價值連結自身(這本古書是歐洲第一本印刷書，so what?)<br> <b>＃觀展習慣：</b>每個月至少會去逛一次展覽，最常去華山、松菸看免費的展覽，展覽主題無特別偏好。喜歡體驗式觀展，實體接觸展品、或有科技輔助的教具。享受與同學一起逛展，沒有預約團體導覽的經驗。<br>
</p>
</td>
</tr>
</table>
<br>
<br>
<br>
<h4>為什麼用AR展示古書?</h4>
<p>透過文獻案例分析及實地田野觀察，現有輔助古書展示的教具最常見的是附上解說牌，部分展覽會提供翻印的部分頁面，也有研究人員製作VR古書，但不普及。三種方式的優缺點如下:</p>
<img width="700" align="center" src="img/portfolio/project1/current.png">
<br><br><p><b>使用擴增實境AR將有關古書珍籍的介紹、中文翻譯呈現在紙本複製古書上</b>，大學生可體驗紙本書籍的翻閱手感，同時能讀懂古書內容；站在圖書館立場，AR為非侵入式增添資訊，能不傷及古書又達到行銷目的。<br><img src="img/portfolio/project1/whyar.png" width="700"align="center"></p>
<br>
<br>
<br>
<h4>AR古書功能設計</h4>
<p>透過文獻回顧發想AR古書需要具備的功能，將功能與Persona的目標對應，有助聚焦開發能回應主要任務的功能。</p>
<img src="img/portfolio/project1/ARfunction.PNG" width="700">
<br>
<br>
<br>
<h4>AR古書版面設計研究</h4>
<p><b>＃目的：</b>確認如何設計AR古書的資訊排版，才能使學生認知負荷最小、學習成效最高，故先舉行AR版面的測試。<br><b>＃實驗素材:</b> 15世紀出版的歐洲草藥圖鑑《草的性能》(內文為拉丁文)。根據注意力理論，設計分散式及覆蓋式兩種排版，素材以電腦模擬呈現。<br><b>＃受試者：</b>35位大學生/研究生。有鑑於實驗素材的主題為藥草，分別找對草藥學有高度和低度理解的學生。<br><b>＃研究方法:</b> 準實驗法+訪談+眼動儀</p>
<br /> <img src="img/portfolio/project1/experimentproceedure.png" width="700" align="center">
<br>
<br>
<br>
<h4>結果Insight</h4>
<p>1.眼動儀顯示學生即便讀不懂拉丁文，仍會停留閱覽，但學生放聲思考眼動軌跡時，不知道為何自已會看拉丁文，<b>顯示即使是無意義的資訊，也會分散讀者注意力</b>，而此種內隱注意力(covert attention)會在讀者無意識的情況下，讓工作記憶區超載資訊，此情況尤其發生在缺乏藥草知識的學生。從此可推論，<b>AR資訊呈現若為直接覆蓋在原文上，會比分散式排版更適合低知識背景的學生。</b><br>
<img src="img/portfolio/project1/herb2.PNG" width="400"><p>註:缺乏學科知識的學生，適合覆蓋式排版，有助聚焦重點。</p>
<br> 2.<b>有藥草知識的學生閱讀古書的速度比沒有先備知識者顯著快速</b>，推測是因為高知識學生訪談時提到，許多藥草內容已經是常識，看一次就能理解；低背景知識學生則要對照比較多次，但由於欠缺知識，對照行為缺乏學習策略，閱讀理解表現並沒有比較突出。<b>高背景知識者看覆蓋式排版的記憶表現並沒有顯著優於看分散式排版的組別，但分散式排版也不會特別讓高背景知識者分心。</b></p>
<img src="img/portfolio/project1/herb1.PNG" width="400"><p>註:背景知識高的學生，即便是第一次見到的草藥，也能運用學習策略閱讀，不太會受到分散式排版影響而分心。</p><br>
<h4>高擬真AR古書usability test</h4>
<p><b>＃目的：</b>由於真實AR情境與觸覺操作、眼睛-書籍的閱讀距離有關，需要設計出真實AR蒐集讀者的整體經驗，包含學生的閱讀方式、是否提升為圖書館特藏的興趣。</p>
<p><b>＃高擬真AR古書prototyping：</b>
<br>Software:Adobe AI、Axure</p>
<video width="700" align="center" controls><source src="video/ARbook.mp4" type="video/mp4"></video>
<br />
<br /> </div>
</div>
</div>
</div>
</div>
<!--DEMO01 end-->
<div id="animatedModal2" class="popup-modal">
<!--THIS IS IMPORTANT! to close the modal, the class name has to match the name given on the ID -->
<div id="btn-close-modal" class="close-animatedModal2 close-popup-modal"> <i class="ion-close-round"></i> </div>
<div class="clearfix"></div>
<div class="modal-content">
<div class="container">
<div class="portfolio-padding">
<div class="col-md-8 col-md-offset-2">
<h2>使用者體驗工作者導師媒合平台</h2>
<div class="h-50"></div>
<img src="img/portfolio/project2/cover.png" width="700"><br> <br>
<h4>為什麼做這專案?</h4>
<p>2017台灣使用者經驗設計產業與工作調查指出，<b>UX相關工作者最依賴的學習管道是工作學習(86%)，次之是網路資訊(86%)</b>、書籍(69%)，學校課程、實體課程、線上課程則分別佔20%~36%不等。然而在此調查中並未探討<b>這些工作者是因為什麼學習需求，而分別去尋求上述管道</b>，因此本專案進一步在需求探索訪問10位年資介於1~5年的UX工作者，訪問他們在工作中遇到的問題、如何解決。他們最常問的問題，本案整理有三:<br><br><b>1. 方法論與策略</b>, e.g.如何產出洞見、研究方法的執行細節<br><b>2. 工具使用</b>, e.g.特定軟體、特定功能的使用，尤其在製作prototype階段會遇到<br><b>3. 職涯工作</b>, e.g.如何在UX道路上繼續發展、發現不適合UX怎麼選擇轉行、作品集怎麼整理<br><br>由訪問結果可知，UX工作者面臨三類主要問題時，<b>多半會尋求網路資源以及重要他人的協助</b>。現在網路資源豐富，然而人的資源多半靠關係才能找到，即便網路上有私人開班授課、或是國外線上課程有導師配對的服務，UX工作者需要投資大量時間，才能找到適合自己的諮詢對象。</p>
<br>
<h4>專案核心價值</h4>
<p>將UX工作者連結到適合的導師，幫助他們更有效率找到對的人解決工作與職涯問題。</p>
<br>
<br />
<h4>現有方法分析</h4>
<p>經過訪談及查詢網路上較為知名的UX學習網站，整理出以下四種UX工作者尋求導師的方式。從比較結果中可發現，<b>目前市場上缺乏導師多元、可深度諮詢的服務。</b><img src="img/portfolio/project2/current.png" width="700"></p>
<br />
<br />
<h4>Persona</h4>
<p>概念確認階段我們訪問曾經有尋求導師協助的UX工作者，針對他們詢問導師的經驗(為什麼詢問、尋找導師的標準、如何覺得得到解惑)，以確認提案符合需求、鎖定早期使用者。</p>
<table width="750" border="1">
<tr>
<td><img src="img/portfolio/project2/persona1.jpg" width="150"><br>
</td>
<td>
<p><h3> Elisa/30歲/UX designer設計顧問公司3年</h3><b>「UX領域很多，不知道領域的知識，就不知道要提供什麼UX。」</b><br>
<b>＃個性：</b>對工作盡善盡美、平常喜歡自己看書、參加活動主動學習。</br><b>＃動機：</b><br>1.特定領域專案遇到問題，想找熟習該領域的UX前輩指教。<br>2. 想規劃職涯發展<br><b>＃需求與目標：</b><br>1.希望能短時間內、找到做過類似專案的前輩協助檢視設計提案<br>2.認識多元領域的UX前輩、培養人脈<br>3.得到客製化的職涯規劃建議<br><b>＃困難與障礙：</b><br>1.覺得自己無法提出有洞見的設計建議<br>2.時間緊迫，找不到曾經做過相似專案的人可以問<br><b>＃常用的解決方式：</b><br>1.在FB上發問一般消費者的經驗<br>2.自己上網找資料 e.g.調查相似競品如何設計，使用逆向工程拆解<br>3.請教UX同仁、詢問有經驗的PM
</p>
</td>
</tr>
<tr>
<td><img src="img/portfolio/project2/persona2.jpg" width="150"><br>
</td>
<td>
<p><h3> Wendy/22歲/工業設計系/半年UX實習經驗</h3><b>「好想要得到工作，但就是不知道為何被拒絕」</b><br>
<b>＃個性：</b>拼命三郎，但一直覺得自己ux專案不足而沒自信</br><b>＃動機：</b>為了申請實習和正職，正在準備作品集。<br><b>＃需求與目標：</b><br>1.得到實習或正職機會 <br>2.希望有面試經驗的前輩幫忙檢視作品集<br>3.過去失敗的面試經驗，希望知道當時為什麼被拒絕<br><b>＃困難與障礙：</b><br>1.收到面試感謝函但不知道為什麼，懷疑是作品集不夠好<br>2.不太擅於表現專案邏輯<br>3.不太想麻煩前同事，怕被批評作品集失了面子。<br><b>＃取代的解決方式：</b><br>1.自己多看幾次、上網看分享文章<br>2.線上請益前實習單位的同事
</p>
</td>
</tr>
</table>
<br>
<br>
<h4>平台功能設計</h4>
<p>目的: 根據persona的需求「找到適合的導師解決問題」發展網站主要功能、需要的頁面。在本平台中，最核心的功能是「篩選導師」、「導師與學生事前交流」兩項。</p> <img src="img/portfolio/project2/functional map.PNG" width="700">
<br>
<br>
<br>
<h4>Wireframe網站測試</h4>
<p><b>第一階段</b><br><b>＃測試功能</b> 篩選導師~找到喜歡的導師。<br><b>＃研究方法:</b>任務測試、card-sorting篩選條件優先序、think aloud<br><b>＃腳色情境:</b> 設想遇到 1)專案問題 or 2)作品集準備問題 or 3)職涯規畫問題<br><b>＃任務:</b> 找到一位適合解決該問題的導師。<br><b>＃測試目標:</b> 驗證資訊架構、篩選條件、資訊呈現、用字是否能幫助user判斷導師<br><b>＃主要更改:</b><br><b>1.篩選導師的條件:</b> 根據用戶回饋，刪除年資、評價兩項篩選機制。<br><img src="img/portfolio/project2/filterchange.png" width="700" ><br><br><b>2.約時間與付款的先後順序:</b> 原版設計是考量避免學生爽約，故設計學生確認購買後，才開始與導師約時間；但測試時發現，學生在尚未確認服務細節，如諮詢時間、地點，不會放心點選付款。因此第二版調整學生與導師先約時間，若48小時內未付款，則取消預約。<br><br><img src="img/portfolio/project2/contact.png" width="700">
</p>
<br>
<p><b>第二階段</b><br><b>＃測試功能</b>：篩選導師~找到導師~確認導師~付款<br><b>＃研究方法：</b>任務測試、think aloud<br><b>＃腳色情境：</b> 設想遇到 1)專案問題 or 2)作品集準備問題 or 3)職涯規畫問題，今天第一次使用本網站。<br><b>＃任務:</b> 1)找到一位適合解決該問題的導師、2)與導師確認諮詢服務、3)完成付款<br><b>＃測試目標:</b>尋找使用者操作中會遇到哪些疑惑<br><b>＃完整prototype: </b><a href="https://invis.io/C7JKB0F6S9T">https://invis.io/C7JKB0F6S9T</a> (supported by inVision)
</p>
<br>
<h4>結果insight</h4>
<p> 1)對話框的師生交流方式雖然多了彈性、為雙方製造親合感，但<b>重要的細節，如時間、地點、時段、費用，應該獨立於對話框，當這些資訊越清楚，可安撫使用者購買前的不確定。</b><br><br>2)使用者傾向先多和不同導師聊天，即便非與當下問題有關的導師，只要看到職稱、擅長領域吸引自己，也會想與他們交談，<b>目的是拓展對導師資源的掌握、讓自己接近嚮往目標的方式。</b><br><br>3)平台腳色不僅是提供給帶有疑問的使用者，也可做為<b>「人才展示架」，使用者看到「導師商品」後，引發好奇、驚豔、甚至崇拜，繼而創造「疑問」</b>，思考可以問這位人才什麼問題，故除了篩選，瀏覽也是此網站重要功能。</p>
<br />
<br />
</div>
</div>
</div>
</div>
</div>
<!-- jQuery -->
<script src="js/jquery.js"></script>
<!-- plugins -->
<script src="js/bootstrap.min.js"></script>
<script src="js/plugins.js"></script>
<script src="js/aos.js"></script>
<script src="js/jquery.form.js"></script>
<script src="js/jquery.validate.min.js"></script>
<!-- main script -->
<script src="js/custom.js"></script>
</body>
</html>