行動應用程式App開發時相當注重於使用者體驗。利用原型進行測試以收集使用者回饋，根據回饋改善原型再進行原型測試，此過程稱之為Iterative Design Process。本研究從前測與訪談中得知設計師偏好使用線稿式的設計手法做出紙面原型，經過數次上述的循環後再轉換成互動式原型；在反覆設計/重構原型與進行使用者測試的過程中，累積了許多的資料需要被記錄與分析，但目前尚未有服務能支援Iterative Design Process中各個階段的需求。 本研究提出了一套能加快設計流程的線稿式原型設計工具「Xketch」。在原型設計階段，設計師可透過繪製筆畫指令的方式生成元件與設定頁面、元件間的互動行為；當原型設計完成後可以直接發佈給受測者。在原型測試階段時，系統會同步記錄受測者的操作過程與think-aloud口述資料。最後，將收集到資料透過時間軸介面重現以協助團隊分析與討論。本研究認為Xketch能有效幫助行動應用程式App的開發過程，加速Iterative Design Process的循環。 第一版Xketch的開發目的著重於原型設計階段，設計師可利用筆畫指令生成對應的元件與互動行為，並透過Storyboard設定與檢視原型的使用流程。受測者認為Xketch整體的操作簡易、容易學習，也相當認同使用線稿圖案作為筆畫指令的概念，並認為Xketch能有效幫助設計師快速製作出互動式原型。最後，本研究將分析受測者操作記錄並搭配訪談回饋總結Xketch的實驗結果與討論，探討未來Xketch在原型設計的改善方向。 / Iterative Design Process plays a great role for developing mobile applications with great user experience. Designers create prototypes to collect user feedback and use those feedbacks to improve designs and prototypes for further iterations and testings. From our initial studies, we found out designers tend to use sketch based paper prototypes as their initial prototyping method. Designers go through rounds of paper prototyping, testing and iterations, before moving on to create digital interactive prototypes. During this process, there are a lot of information needs to be recorded and analyzed for the iteration loop. However, no integrated service yet can streamlined designers’ process of creating prototypes, recording testing sessions, and analyzing results. We developed “Xketch”, a sketch-based mobile application development tool for iterative designs and testings. First, designers can use the sketching interface on Xketch to rapidly prototype UI modules and interactions. Designers then can distribute the prototypes through Xketch to testers. During testing sessions, Xketch’s testing environment will record user behavior data and think aloud audios. At last, the collected data will be presented on Xketch’s timeline interface for feedback analysis. We envision Xketch to streamline and optimize the iterative design process when designers design mobile applications. The first version of Xketch contains major features for the prototyping phase. Designers can use simple sketching gestures to generate corresponding on-screen UI modules, and configure interactions of those components. Moreover, designers can also create and review interaction flows through storyboard settings. From our testing for Xketch, participants indicate that Xkecth is easy to use and learn. They also found the concept of using sketching gestures to generate on-screen UI module intuitive. Overall, participants think that Xketch can help them create prototype rapidly and intuitively. To improve for Xketch, we recorded participants’ usage behavior and accompanied with user interviews to give us a holistic view on the future iterative direction for Xketch.

近年互動設計、產品設計、設計思考等學門，無不重視原型設計，透過使用者快速的測試回饋，反覆修正，使產品更符合使用者的需求。如今科技產品不斷推陳出新，與無所不在運算的普及，科技產品以及感知互動的服務與日俱增；設計團隊須了解電子電機相關技術，以完成各種測試原型。但對於一般的設計師而言，必須額外費時學習電路設計、焊接與程式設計等專業技術，已成為原型製作的一項門檻。 許多研究學者注意到這樣的需求，針對不同的使用族群發展各種電子電路創作工具，希望降低互動產品的創作門檻，舉凡Arduino、Phidgets與Gadgeteer等，但使用者仍須具備基本電路知識或參與訓練課程；近兩年推出的Littlebits與Atoms選擇捨去電路設計、焊接與程式設計的過程，讓沒有電子電路經驗的使用者也可輕易使用，卻降低了創作時的彈性，侷限了原型製作的變化性。 本研究將針對非電子相關背景的設計師，設計一套電子電路創作工具 「Rapid Prototype」，藉由分析過去電子電路創作工具的使用族群與設計思維，結合電子電路物件與智慧型載具，設計一套圖型化編輯器，透過物件順序的編排，及物件行為的選擇，快速製作出原型產品，降低設計師學習門檻及提昇創作自由度。 本研究原型設計工具，有以下功能： • 增加智慧型載具的支援：智慧型載具提供圖型化的編輯器與電子電路互動模組結合增加製作彈性。 • 降低學習門檻：降低電子電路相關知識需求，且透過圖形化編輯比傳統程式語言更容易學習。 • 擴展創作空間：核心物件與行動載具無線溝通，減少距離限制。 • 分析使用經驗：分析使用者在電子電路互動模組的使用經驗與操作，作為未來電子電路原型製作工具的參考。 / As the demands for interaction design with electronics increase, it is necessary for design groups to understand the technology related to electronic and electrical engineering in order to produce different kinds of prototypes. However, there is a large gap between concept design and prototyping. Designers have to spend a lot of time to learn electrical circuit design, welding, programming, and other professional skills. More researchers have noticed the aforementioned demands and have thus developed various creative tools for use by different groups working in this field in the hopes of lowering the degree of creativity required for interactive products. This has already been seen in Arduino, Phidgets, Gadgeteer products and so on. These toolkits are target on developers that have basic knowledge on electronics and programming. In the last two years, meanwhile, Littlebits and Atoms have decided to abandon the need for designing electrical circuits, welding, programming, and other sophisticated processes. Instead, they have opened the way for young people to be able to use their tools easily, despite the fact that doing so has also limited flexibility in terms of the creativity and variability of prototypes. In this thesis, we present RapidPrototype: a tool for designers without electronic engineering backgrounds and programming skill. By using RapidPrototype, users can transform their creative ideas into a workable prototype easily and quickly. In addition, the study sought to determine how RapidPrototype combines with electronic and electrical circuit objects, visual programming toolkit, and tools that practically meet designers’ demands to enhance the degree of freedom in terms of creativity and lowering the basic skills demanded.

過去，感知物件的互動方式大多發展於大型互動桌上，其技術主要是採用影像辨識來進行互動偵測，隨著平板的普及，我們希望能將大型互動桌的實體互動體驗帶到平板世界，然而現今平板使用之電容式觸控技術有別於大型互動桌之影像偵測技術，無法直接應用影像式的物件辨識方法，因此設計出一套結合平板電腦與感知物件的開發工具，目的是要讓互動設計的開發者能夠快速開發感知物件的互動模式。 而電容式實體互動物件設計較為複雜，對於互動設計的開發者而言，要去製作、開發這些互動物件不論是在電路或是實體物件都是有一定的難度，並不是所有的開發者都擁有相關的背景或是資源。而為了讓原型製作更加的簡單在軟體上我們設計了一套SDK，在硬體上結合了樂高積木和導電的膠帶，不僅製作快速、成本低，在組裝上也能擁有一致的規格以減少誤差的發生。藉由其底座組合方式的差異也就代表著不同的感知物件。因此開發者只需套用我們所設計的SDK就可以將原有的作品加上實體互動物件的互動模式。 / The Tangible User Interface (TUI) has been widely adopted on interactive tabletops by using optical sensing techniques and fiducial markers. With the huge growth of smartphone and tablet market, we hope to expand the tangible interaction experience to the off-the-shelf touch devices. However, most touch devices use capacitive sensing techniques that can only detect human fingers. We create a tangible hardware toolkit base on capacitive touch devices so developers can use it to build tangible interactions in a fast way. We put conductive adhesive tape on LEGO blocks to form an identifiable footprint. The footprint could be attached onto a tangible object. And the pattern of the footprint could be easily arranged to represent different identities. We also provide a flash SDK that can be quickly integrated into a developer’s project and then enable tangible interactions. We expect our hardware toolkit and software SDK can benefit more developers to create tangible UI applications on the capacitive touch devices.