數位科技作為促進手作經驗之工具—以手作立體卡片APP “HandiCard”為例 - 政大學術集成

全文

(1)國立政治大學數位內容碩士學位學程 Master’s Program in Digital Content and Technologies National Chengchi University. 碩士論文 Master’s Thesis. 治. 政數位科技作為促進手作經驗之工具—以手作立體卡片大. 立 “HandiCard”為例 APP. ‧ 國. 學. ‧. The Application of Digital Technology as A Tool to Facilitate Handcraft Experience – Using Pop-Up Card APP “HandiCard” as An Example. n. er. io. sit. y. Nat. al. C. i n U. hengchi 撰研究生：賴斯蘋. v. 指導教授：林玲遠博士余能豪博士. 中華民國一〇五年二月 February 2016.

(2) 摘要. 隨著科技不斷進步，改變我們傳遞祝福的方式，數位祝福形式取代傳統紙本卡片，實體卡片不再普及，手作卡片所擁有的觸覺與情感上的獨特價值也被忽略。數位與手作之間，存在某種隔閡，數位的強大虛擬化傾向與實體物件背後的情感價值似乎有著矛盾性。然而人們對數位科技的依賴不代表實體已經失去魅力，手感經濟的被提倡顯示人們對手作價值的重新看重，也顯示出兩者之間需要尋求更. 政治大「HandiCard」，故本研究提出一項幫助手作立體卡片製作的行動應用服務構想立. 好的連結。. ‧ 國. 學. 擁有數位輔具在編輯和製作上的便利性，同時容許製作者融入個人巧思，又保有與紙張的實質接觸，是兼具數位科技長處與實體存在感的設計。. ‧. 透過文獻與案探討，本研究歸納出「客製化、手作、即時性」三大影響因素，. y. Nat. io. sit. 並匯整立體卡片常見結構與規則，作為 HandiCard 設計原型的考量。最後根據受. n. al. er. 訪者的使用意見與回饋，進行整理與討論，探討此原型未來可發展的方向。. Ch. engchi. 關鍵字：手作、手感經濟、立體卡片. II. i n U. v.

(3) Abstract The advance of technology has changed the way we convey blessings. However, these digital methods also diminish the unique value of emotions and the sense of touch which brought by handmade cards. The reflections on advocating Hand-Touch Economy shows that there seems to be a contradiction between the strong tendency of digitalization and the sentimental value of physical objects. Therefore, this study developed “HandiCard”, a prototype for assisting the design and production of pop-up cards by using mobile application. It provides the. 治政大 on the sentimental value convenience of digital tools and focuses simultaneously 立 ‧ 國. 學. given by handmade products. We expect that HandiCard could seek out the possibilities of combining digital technology with handmade products, which could. ‧. provide more real touch and the sense of existence in the digital era.. sit. y. Nat. Through literature review and case study, we summed up that “customized”,. n. al. er. io. “handmade”, and “real-time” are the three major factors. Also, we summarized the. i n U. v. common structures and principles in pop-up cards as the reference for designing the. Ch. engchi. prototype of HandiCard. At last, we discussed interview feedbacks from user testing to explore the possibilities of being commercialized in the future.. Keywords: Handmade, Hand-Touch Economy, Pop-Up Card. III.

(4) 誌謝. 終於到碩士生涯的尾聲，回想這一路走來，實在有太多需要感謝的地方。首先特別要感謝主指導教授林玲遠老師，使我在迷茫之中找到方向，面對各種矛盾與掙扎，可以重新找回自己的熱情，繼續堅持下去。每當陷入瓶頸或感到挫折時，老師總是給予滿滿的正面能量，這對我來說是非常大的鼓勵，也能更有信心地進行自己的研究。透過老師極具耐心且用心的指導，這本論文終於能夠順利成形，. 政治大點出許多未曾思考過的面向，給予實用建議回饋，助於在設計上的改進，讓研究立. 說再多次都不足以表達我心中的感謝。也要謝謝副指導教授余能豪老師，一直提. ‧. ‧ 國. 寶貴意見。. 學. 能夠更加完善。同時感謝抽空擔任口委的李明學老師，提供論文修正方向的各種. 除此之外，謝謝所有曾經幫助我的老師、助教、朋友們。尤其是亦師亦友的. y. Nat. io. sit. 靜媚助教，快速替我解決各種疑難雜症；一起奮鬥過來的好夥伴嘉鼎、馨婷與子. er. 容，彼此互相幫助和提醒，讓寫論文不再是那麼孤單；矯正屋各位室友，聽我抱. al. n. v i n 怨並給予鼓勵；研究所的同學們，帶給我各種難忘的回憶。 Ch engchi U. 最後想要把這本論文獻給愛我的家人，並感謝親愛的爸爸媽媽這些年來對我. 的付出與栽培，是人生中最強、最溫暖的後盾，沒有你們的包容和支持，我不可能走到現在！由衷感謝所有的一切，謝謝各位。. 賴斯蘋謹誌於一〇五年二月二十六日. IV.

(5) 目錄摘要 ..............................................................................................................................II ABSTRACT ............................................................................................................... III 誌謝 ............................................................................................................................ IV 目錄 .............................................................................................................................. V 圖目錄 ....................................................................................................................... VII 表目錄 ........................................................................................................................ IX. 1.2. 政治大研究動機 ....................................................................................................... 10 立研究背景 ....................................................................................................... 11. 1.3. 研究目的 ....................................................................................................... 14. 第一章緒論 ............................................................................................................... 10. 學. ‧ 國. 1.1. 第二章文獻及案例探討 ........................................................................................... 16. ‧. 數位時代中的手感經濟 ............................................................................... 16. 2.2. 手作卡片相關數位輔具案例 ....................................................................... 19. y. Nat. 2.1. 2.2.2. 直接手作體驗 ............................................................................................................... 22. er. al. v i n Ch 小結 ............................................................................................................... 27 engchi U. 製作教學資源 ............................................................................................................... 25. n. 2.2.3 2.3. sit. 客製化卡片製作與分享 ........................................................................................... 19. io. 2.2.1. 第三章《HANDICARD》作品構想 ...................................................................... 28 3.1. 概念說明 ....................................................................................................... 28. 3.1.1. 解決現有數位輔具不足之處 ................................................................................. 28. 3.1.2. 發揮數位社群特性 ..................................................................................................... 29. 3.2. 架構與功能規劃 ........................................................................................... 30. 3.3. 設計考量 ....................................................................................................... 31. 3.3.1. 賀卡文化與介面風格 ................................................................................................ 32. 3.3.2. 立體結構整理 ............................................................................................................... 32. 3.3.3. 卡片版型與立體結構之選擇 ................................................................................. 46. 3.4. 介面與操作流程 ........................................................................................... 51. 3.4.1. 個人化設計 .................................................................................................................... 52 V.

(6) 3.4.2 實際手作參與 ............................................................................................................... 56 3.4.3. 創作分享平台 ............................................................................................................... 60. 3.4.4. 流程介紹影片 ............................................................................................................... 61. 第四章作品評估 ....................................................................................................... 62 4.1. 訪談流程 ....................................................................................................... 62. 4.2. 受測者資訊 ................................................................................................... 63. 4.3. 訪談結果 ....................................................................................................... 64. 4.4. 小結 ............................................................................................................... 71. 第五章結論與未來展望 ........................................................................................... 72 參考文獻 ..................................................................................................................... 75. 政治大. 附錄一使用者訪談問卷 ........................................................................................... 78. 立. ‧. ‧ 國. 學. n. er. io. sit. y. Nat. al. Ch. engchi. VI. i n U. v.

(7) 圖目錄圖 1 資策會 FIND（2015）台灣民眾持有智慧型行動裝置比率 ........................ 13 圖 2 LINE Card（左）與 Personal Wish Tunes（右） .......................................... 20 圖 3 eCards 首頁與其編輯畫面 ............................................................................... 20 圖 4 Martha Stewart CraftStudio 編輯介面與下載頁.............................................. 21 圖 5 Red Stamp 首頁與其編輯畫面 ........................................................................ 22 圖 6 Canon Creative Park 網站畫面 ......................................................................... 23 圖 7 Polaroid 卡片禮物盒 DIY 材料包與教學影片畫面 ....................................... 23 圖 8 由左至右依序為 Foldify 與 Tiny Paper Zoo ................................................... 24. 政治大. 圖 9 Shapes-3D Geomery Learning .......................................................................... 24 圖 10 Robert Sabuda 個人網站 ................................................................................ 25. 立. 圖 11 Make your own Greeting Cards 介面 ............................................................. 26. ‧ 國. 學. 圖 12 Cardmaking & Papercraft Magazine 介面 ...................................................... 26 圖 13 設計概念 ........................................................................................................ 28 圖 14 HandiCard 架構規劃....................................................................................... 31. ‧. 圖 15 立體造型的基本製作法 ................................................................................ 34. y. Nat. 圖 16 彈出式結構基本組成與名稱 ........................................................................ 35. sit. 圖 17 Ｖ型摺疊與平行式摺疊 ................................................................................ 35. er. io. 圖 18 外加新的彈出式結構 .................................................................................... 36. al. n. v i n Ch 圖 20 整體介面風格 ................................................................................................ 51 engchi U 圖 21 主選單之卡片形式選擇 ................................................................................ 52 圖 19 卡片版型分類 ................................................................................................ 46. 圖 22 基本立體結構形式（左）、機關形式之卡片樣式（右） ........................ 52 圖 23 編輯區中紙張大小選擇頁面 ........................................................................ 53 圖 24 編輯畫面各項功能與操作手勢 .................................................................... 54 圖 25 360 度即時預視效果 ...................................................................................... 54 圖 26 匯入素材區各項功能 .................................................................................... 55 圖 27 內建圖庫依據常用節日與場合分類 ............................................................ 55 圖 28 上傳圖片區（左）與輸入文字功能（右）之範例介面 ............................ 56 圖 29 下載功能選項與各列印頁紙型預覽 ............................................................ 57 圖 30 我的卡片集與上傳提醒畫面 ........................................................................ 58 圖 31 製作教學說明 ................................................................................................ 59 VII.

(8) 圖 32 分享區主要介面（左）、放大查看他人設計結果（右） ........................ 60 圖 33 個人卡片管理頁面 ........................................................................................ 60 圖 34 舊有的編輯介面設計 .................................................................................... 61 圖 35 使用情境影片畫面 ........................................................................................ 61 圖 36 訪談流程圖 .................................................................................................... 62 圖 37 實際訪談示意圖 ............................................................................................ 63. 立. 政治大. ‧. ‧ 國. 學. n. er. io. sit. y. Nat. al. Ch. engchi. VIII. i n U. v.

(9) 表目錄表 1 過往立體卡片設計與製作過程 ...................................................................... 33 表 2 Duncan Birmingham 分類：Ｖ型摺法（V-folds） ........................................ 36 表 3 Duncan Birmingham 分類：平行摺法（Parallel-folds） ............................... 37 表 4 Duncan Birmingham 分類：由Ｖ型摺法衍生的二次基礎形狀 .................... 37 表 5 Duncan Birmingham 分類：由多重平行摺法所構成 .................................... 38 表 6 Duncan Birmingham 分類：基於Ｖ型摺與平行摺的二次基礎形狀 ............ 38 表 7 Duncan Birmingham 分類：能帶來不尋常與驚奇的機關 ............................ 38 表 8 David A. Carter 分類：平行摺法（Parallel-folds） ....................................... 39. 政治大. 表 9 David A. Carter 分類：角度摺法（Angle-folds） ......................................... 41 表 10 David A. Carter 分類：轉輪（Wheels） ...................................................... 42. 立. 表 11 David A. Carter 分類：拉片（Pull-Tabs） ................................................... 43. ‧ 國. 學. 表 12 Keith Finch 分類：常見立體結構 ................................................................. 44 表 13《HandiCard》基礎立體結構說明................................................................. 47 表 14《HandiCard》機關式結構說明..................................................................... 50. ‧. 表 15 受測者資訊（本研究整理） ........................................................................ 64. n. er. io. sit. y. Nat. al. Ch. engchi. IX. i n U. v.

(10) 第一章. 緒論. 1.1 研究動機回顧過往人生經驗，喜歡手作是自孩提時代以來就未曾改變的事，從基本的自製手工卡片，到刻橡皮擦章、製作熱縮片、絹印、刺繡等，在手作廣闊的範圍中嘗試了不少媒材，而其中最常製作且持續至今的，依然以日常生活中普遍可見的手作卡片為主。猶記得國小時，每當聖誕節班上便興起卡片熱潮，同學間彷彿較勁般人手厚厚一疊市售卡片，自己也十分熱衷與好友相互交換彼此的祝福，然. 政治大. 而總覺得認為商店裡買的、大量生產的卡片不夠獨特，一開始先是替購買來的卡. 立. 片塗鴉加工，後來也開始親自動手製作，國小聖誕卡就也就成為往後喜歡手作的. ‧ 國. 學. 契機。隨著年紀增長，雖然不像當年瘋狂製作、寄送大量卡片，但每逢特別節日. ‧. 或場合時，仍舊會親手製作卡片以表達心意。. sit. y. Nat. 然而對我而言，手作物的魅力不會消失；透過雙手創造出來的東西，具有非. io. al. er. 機器能夠複製的手感，並融入製作者的巧思和心意，顯得獨特且含有人情溫度。. v. n. 因此即使是張簡單的手作卡片，考慮到從構思、製作到完成所付出的心血，其價. Ch. engchi. i n U. 值便不再單只從製作技法難易高下或是精緻程度來評斷，尤其當看到卡片內容是為自己特別設計時，那種感動更賦予了獨一無二的價值，透過飽含真摯情意的卡片能感受到溫暖幸福。平時自己除了會製作卡片之外，同時也有珍藏別人贈與的手作卡片習慣，甚至日後再拿出來重新回味。此外，「紙」之於卡片也扮演不可或缺的重要因素，人類是感覺的動物，觸碰不同材質的手感體驗，能引發各種心理感受，而紙張具備溫潤、樸質的材質特性，則讓收受者在翻閱卡片時更加感受到情感溫度。就好比每次在書局琳琅滿目的架上找尋切合卡片構想的紙張顏色，甚至是實際去觸摸不同紙材紋理再進行挑. 10.

(11) 選，這個前置作業過程總是為自己帶來愉悅與滿足感，我喜歡紙，喜歡不同材質紙張引發的觸、視覺感官體驗，透過手作加工轉換成傳遞祝福與心意的情感媒介，再適合也不過。因此個人認為在製作卡片時親自挑選紙張媒材，是不能省略的重要過程，亦是數位輔助工具盛行時代中無法取代的真實感受，能使得手作卡片越發動人。手作卡片擁有的珍貴價值，不僅來自製作者付出的心血、為特定對象設計的巧思，與紙材可帶來親和的心理溫度外，收到實體物滿足「擁有」的心理實在感，同樣是造成感動的關鍵。隨著科技不斷發展，快速便利的數位工具逐漸取代以往. 治政大祝福方式，淡化人際互動的真誠與溫暖，當生活中的情感聯繫建立於虛擬之上，立實體卡片擁有的觸感、真實存在感，以及傳遞出的那一份情感溫度，都是數位不. ‧ 國. 學. 可取代的靈光。. ‧. 卡片作為人與人之間情感溝通管道之一，隨著數位時代的來臨，逐漸被其他. sit. y. Nat. 方式取代，人們鮮少寄送實體卡片，更不用說親自動手做。然而，我仍然喜歡具. n. al. er. io. 有手感與溫度的手作卡片，並且身邊也不乏喜愛手作的朋友，因此我相信，數位. i n U. v. 與手作不必然是對立的，彼此之間可以有更積極的結合關係，這是本研究的初心. Ch. engchi. 動機，同時也希望藉由本研究，思考如何找回實質接觸，讓感動回到現實世界。. 1.2 研究背景在日常生活中，人們會使用各種方式來滿足與他人間不同情感面向的需求，紙本卡片的出現便與人際互動有很大關聯，用以傳遞祝福、維繫情誼，提供情感溝通有形管道。隨著數位科技不斷進步，人與人之間情感互動變得方便快速，遠距溝通不再是難事，同時也對人們傳遞祝福的方式造成影響。如今比起紙本卡片，. 11.

(12) 我們更習慣使用手機簡訊、電子賀卡、在電子郵件中夾帶圖片或影音檔案等數位方式。近年來，智慧型載具的快速發展與興起，更是加劇這項改變。根據資策會創研所FIND結合Mobile First（2015）研究調查顯示，台灣智慧型行動裝置普及率已超過七成（圖1），通訊軟體與社群網站等各式平台的出現，改變過去傳統人際情感聯繫方式，現在只要透過Facebook即可快速留言，甚至點選一張LINE表情貼圖便能旋即完成，全然簡化傳達祝福的過程。數位化方式確實便利即時，迎合現代人忙碌的生活步調，但若演變成只因為系統例行提醒才留下應付式的生日祝福，或是複製貼上千篇一律的罐頭訊息內容，則使情感溝通顯得速成且缺乏溫度。. 立. 政治大. 對於現今的數位原生世代年輕人（Digital Natives）1，他們成長自充滿數位. ‧ 國. 學. 科技的環境中，現實與虛擬世界皆是日常生活一部分，使用數位形式祝福是再自. ‧. 然也不過的方式。然而太過仰賴虛擬形式，忽略手作所能傳達的細膩感受，對情. n. al. er. io. 的情感價值，從手感經濟之提倡即可見出端倪。. sit. y. Nat. 感經驗的交流勢必有所侷限，因此也有反思出現，人們重新開始思考實體所蘊含. i n U. v. 手作一詞並不新奇，但「手感經濟」卻是近代才出現的詞彙，此概念的浮. Ch. engchi. 現，代表身處數位時代人們再次意識到手作價值，並凸顯其存在，重新定義正在發生的現象趨勢。此外，手感經濟的提倡也可說是依循感官體驗不足的脈絡下產生，數位溝通消弭現實中真實互動，將我們更加困囿在四方框的螢幕載具中，而螢幕所能提供的情感經驗既扁平又疏離，且過分強調和沉浸於視覺感受，忽略其他感官體驗。智威湯遜廣告執行創意總監狄運昌提到「當人與人的接觸，逐漸被手機、電子郵件所取代，實體的相遇反而變得彌足珍貴。」；中研院社會學研究所副研究員鄭陸霖表示「引誘觸碰衝動，將成為數位商品的最終決戰場」（手感 1. 數位原生（Digital Natives）一詞源自於 Marc Prensky（2001）發表的《Digital Natives, Digital Immigrants》文章中，泛指 1980 年代後出生，生活在電腦、網際網路世界的新世代。 12.

(13) 經濟，天下雜誌，2006）。重視創造獨特意義、生命溫度的手感經濟，將手作從原本單純意指一種製作方式，擴及至心理層面來探討，並反應出藉由實體物件傳達出的情感價值並不全然被數位方式給取代，仍有其重要性。由電子賀卡、社群平台等媒介出現，對使用手作卡片來傳遞祝福之方式造成改變，延伸至手感經濟作為進入數位時代後人們對於實體忽略的反思，勾勒出數位科技與手作之間存在著矛盾性，一種科技發達的強大虛擬化傾向與重視真實物件互動帶來的情感意涵，這兩者之間該如何取決平衡。因此從現象觀察可了解到，在現今社會變動快速、冷漠疏離的時代，我們反而更需要具有存在感的設計，. 治政大重回真實世界給予深刻的實質感動，此外，數位工具也並非是為了加深人們與真立. 實世界之間情感經驗的斷裂，既然身處於數位浪潮中，就應該善加運用數位展現. ‧ 國. 學. 的優點，尋找數位與手作的結合可能，重新搭建起人與人情感溝通的橋樑。. ‧. n. er. io. sit. y. Nat. al. Ch. engchi. i n U. v. 圖 1 資策會 FIND（2015）台灣民眾持有智慧型行動裝置比率資料來源：http://www.find.org.tw/market_info.aspx?n_ID=8482. 13.

(14) 1.3 研究目的在現今這個科技發達的時代，數位與手作之間存在的矛盾，隨著手感經濟的提倡，使我們重新思考兩者間的關係，其中就人們用以傳遞祝福、表達心意方式而言，傳統紙本卡片逐漸被電子賀卡、社群平台等數位祝福形式給取代，即展現出這樣的矛盾性。數位形式替生活步調快速繁忙、未必有願意或能夠投入長時間來製作卡片之人們，提供一個便利即時的管道，然而可被數位輕易大量複製的虛擬產物卻有可能淪為形式上的祝福；手作卡片在製作時，可加入專屬某特定對象. 政治大付出時間與心血的「創造過程」同樣是造就珍貴價值、觸動人心的關鍵，不應該立. 的內容巧思，能讓收受者感到備受重視。此外，製作者親自動手並融入自身心意，. ‧. ‧ 國. 來更多感動。. 學. 輕易被省略或取代。具獨一無二手感的實體卡片，是激發情感的有形觸媒，能帶. 故本研究希望既能夠保有親自動手創造過程中不可取代的情感價值，亦兼顧. y. Nat. sit. 數位時代講求效率與易用性的設計，幫助使用者傳遞真摯祝福。因此，從手作卡. n. al. er. io. 片形式中選擇擁有較為複雜結構的立體卡片為構想主題，立體卡片不論在設計或. Ch. i n U. v. 製作上相較於一般剪貼紙材、照片的平面形式，需要投入更多時間心力，卻能讓. engchi. 收受者帶來更多驚奇感動，而數位科技擁有多重影音媒體呈現、即時互動回饋等各項利於編輯製作上的優點，正可輔助立體卡片需要對空間結構有所概念的製作過程。本研究將尋找兩者結合的可能性，以期利用數位科技促進手作創造經驗。本研究之目的詳列如下：（1）探討手作立體卡片與數位科技結合之可能性。（2）彙整立體卡片常見結構，並歸納可重複應用之設計規則。（3）善用數位社群特性，設計立體卡片創作分享之平台。. 14.

(15) 而為能了解此研究之設計構想是否有實際轉為商品化的可能，將於創作完成後請六位受訪者進行使用者訪談，作為效果測試的評估與參考依據，其評估的標準根據本研究創作目的拆解為下述所列之兩大設計目標：（1）本設計應能引發受訪者的使用興趣，並於使用過後增加親自動手創作立體卡片之動機。（2）對於本設計整體介面與使用流程，受訪者能給予正面的使用回饋。. 立. 政治大. ‧. ‧ 國. 學. n. er. io. sit. y. Nat. al. Ch. engchi. 15. i n U. v.

(16) 第二章. 文獻及案例探討. 本研究認為欲尋找手作立體卡片與數位科技結合的可能性，首先必須對手作價值有所暸解。其次藉由與卡片製作相關案例探討，掌握現今應用服務的設計趨勢，從案例中尋找可供借鏡之處，同時也分析各有什麼不足，以作為本研究切入尋求創新貢獻的立基點。本章從以下兩個方面進行探討：（1）數位時代中的手感經濟；（2）手作卡片相關數位輔具案例。. 2.1 數位時代中的手感經濟. 立. 政治大. 手作一詞，標榜著親自動手做，對比工業文明後利用機器大量且毫無差別製. ‧ 國. 學. 造方式，展現出來自手工製作的那一份溫度，具有真誠、質樸的特質，能夠觸動. ‧. 人們內心情感。在充斥制式量產商品環境下，人們重新追求較為初始的創作方式，. sit. y. Nat. 並重視物品的手感與慢活意識，興起手作風現象，更演變為一種流行的生活形態. io. al. er. （宋佳穎，2006）。近十年來，手作風潮席捲台灣，影響了大眾文化產業與消費. v. n. 價值思維，然而早在人類文明開創之際，利用雙手進行勞動與創造便已是與生俱. Ch. engchi. i n U. 來的本能，但隨著手作製品被機器所取代，大量生產、大量消費成為商業資本社會普世價值，真正單純、原始的自我營造和創作，反倒令人感覺特別可貴（周欣諭、連德仁，2008）。「當複製變愈來愈容易，『不想被複製』或『不能被複製』的商品也就格外珍貴。『手作』商品，逐漸形成另一種風潮。」（王美珍，2013）手作之所以獨特在於其親手製作且無法複製，擁有市售商品不可取代的價值，融入創作者的心血與巧思，具有強烈個人特質。此外在手作過程裡，透過雙手親自與物之間的真實碰觸，感受實體物件擁有的觸感、量感與溫度，手的感知體驗便將「手感」涉及其中。手感源於觸覺感受，. 16.

(17) 更包含觸覺與視覺感受上的雙重意涵，由於人們除藉由觸摸產生對某項物體的質感認知，當日後看見相同或類似物品時亦會憶起其表面紋理帶有的粗糙、光滑等質感特徵（陳秭瑜，2013）。因此手感不單指觸覺回饋，也涵蓋與感官接觸的各項知覺體驗，並隨著人們生活經驗、文化認同的累積，手感一詞在當代詮釋下運用日益廣泛。根據《手感經濟》一書指出，手感是一個集合詞，傳遞出人味、觸感、溫度、專注獨一無二的精神（吳昭怡等，2006）；劉維公（2006）指出手感是一種感受，結合高度原創性與美感價值；陳俊良（2006）表示手感除了展現觸感質地之外，. 治政大也傳遞設計師手心的溫度、沈澱過後的想法。手感出於親自與真誠，不僅用以描立述感官體驗外，更帶給我們具有人情溫度的正面價值。周欣諭（2009）則提及手. ‧ 國. 學. 感與當今人文社會有所連結，傳達出溫暖、富有情感、幸福、自然永續等正面性. ‧. 主張。手感體驗亦成為一種意識，隨著體驗實踐的過程，影響生活風格與當代社. sit. y. Nat. 會趨勢（陳書惠，2012）。. n. al. er. io. 在工業化後大量生產、選擇過多的資本社會，手作與具手感的產品盛行，便. i n U. v. 是在於這些產品擁有來自雙手創造的獨特價值，重新賦予人們存在意義，並在這. Ch. engchi. 個太快、太冰冷的時代給予溫暖和慰藉 (吳昭怡，2006) 。其中，被冠以手感的產品，除了保有手工製品以手製作完成、限量、個人化的特質之外，更重視與消費者的互動體驗、情感連結，貼近人們內心需求（林亮萱，2007）。此外，手感產品雖然不一定全然由手製造，卻把「手」延伸出來的情感、溫度、觸覺等元素帶進設計概念裡（吳昭怡，2006）。由此可見不論是否百分之百由手製造，手感產品背後蘊含的情感價值，具有直抵人心之魅力，傳達溫暖、幸福與歸屬感，而其所帶動的經濟效益便是手感經濟。. 17.

(18) 李芳仁（2006）指出手感經濟就是深度經濟，是對生活有深刻的體驗，提出一種生活主張；陳俊良（2006）則表示手感是一種呼應現代人內心需求的新經濟模式，手感經濟也是一種情感經濟、情感效應。除了是對工業化後大量、無差別產品的反思外，手感經濟一詞會在當代產生，甚至不斷被提倡，也展現人們意識到逐漸被虛擬化取代的數位時代中，對於實質體驗能給予深刻感動的需求依舊存在，如何結合生命體驗與情感以觸動人心將成為重要關鍵。手感經濟持續發酵，使手作有關商機依舊不斷，根據博客來年度報告（2015）顯示，手作類書籍銷售較去年成長逾一成，手工藝用品類百貨以10月來看，也較. 治政大去年同期成長超過六成。手作需求也帶動手作工作坊與手作課程的出現，誠品生立活松菸店手作專櫃、學學文創志業的相關體驗皆持續成長（林佩儀，2015）。. ‧ 國. 學. 手感強調情感訴求、創造獨一無二的個體價值，在這個變遷快速、過於講. ‧. 求效率的時代，給予人們更加人性化、有機、具有生命力的選擇，進而從手感體. sit. y. Nat. 驗中找回生活的溫暖，由於重新對手作與手感的注重，也帶來手感經濟的發生。. n. al. er. io. 手感經濟反應了時代下的情感需求，此需求仍有市場價值存在，並未隨著數位科技的進步完全被取代，而且具有發展潛力。. Ch. engchi. 18. i n U. v.

(19) 2.2 手作卡片相關數位輔具案例科技發展使我們生活更加便利，本研究認為數位科技亦能成為協助手作卡片製作與推廣的工具。目前市面上出現許多與手作卡片相關的應用服務與產品，大致上分為能快速製作客製化卡片、結合手作樂趣、提供教學資源三個面向，以下將針對這三類進行案例探討，瞭解數位輔具對卡片製作方式帶來的影響或改變，並分析其不足之處，作為後續設計上的參考依據。. 2.2.1. 政治大. 客製化卡片製作與分享. 立. 繼紙本卡片之後，電子賀卡成為傳遞祝福的常見數位形式之一，其多半為免. ‧ 國. 學. 費提供的服務，便利即時且可不必受到時空限制，表現方式多元也是結合數位一大特點，除了靜態圖像外，還能以影音等動態方式呈現。. ‧. 智慧行動載具普及，更帶領電子賀卡市場朝向新發展，別於以往使用動畫、. y. Nat. er. io. sit. 固定內容的卡片形式，開始興起提供客製化的行動應用服務，並結合現行主流社群網站如Facebook、Twitter等，能以分享、發布貼文方式傳送給好友，而不再僅. al. n. v i n Ch 透過電子郵件。根據Unity Marketing在2013年全球賀卡市場調查報告，早已指出 engchi U. 從2009年開始對於客製化卡片需求大幅增長，這對卡片製造商而言是強大且具發展空間的新利基點。吳雲中（2015）亦表示隨著簡訊、手機通訊軟體成為主要傳遞祝福方式，罐頭祝福也越來越多，而訂製祝福則能增加人們被重視的感受度，具有收藏價值。因此市面上出現不少相關行動應用，甚至衍伸出可將客製後卡片印成紙本，並幫忙寄送的付費服務。其中在客製化卡片的製作與分享機制，最基本功能便是能讓使用者選擇卡片樣版後進行編輯、提供個人相片上傳、輸入訊息內容，再輔以電子郵件傳送或分享到社群網路平台之功能。如LINE Card（圖2）為即時通訊軟體公司LINE所開 19.

(20) 發的服務，可以選擇旗下角色的卡片樣板傳送訊息；Personal Wish Tunes（圖2）此款行動應用除了提供客製化編輯外，其特別之處在於可選擇一首對應卡片內容的簡短配樂一同傳送給對方；而eCards （圖3）則為全球卡片禮品領導品牌Hallmark 所推出的電子賀卡服務，卡片內容全為動畫形式，並與迪士尼、星際大戰等公司異業合作，但在個人化設定彈性空間相對較少，僅提供色調風格變換與字體大小調整。從上述舉例可見，此類型應用服務除了本身內建卡片版型樣式或素材圖庫有所不同，功能大致上並無顯著差異。. 立. 政治大. ‧. ‧ 國. 學. n. er. io. sit. y. Nat. al. i n U. v. 圖 2 LINE Card（左）與 Personal Wish Tunes（右）. Ch. engchi. 資料來源：研究者手機截圖. 圖 3 eCards 首頁與其編輯畫面資料來源：研究者手機截圖. 20.

(21) 近年來，提供賀卡印刷輸出與寄送成為新的應用服務趨勢，增加電子卡片附加價值。例如美國知名生活風尚與手作品牌Martha Stewart推出CraftStudio（圖 4），是一款能自行挑選不同材質、顏色紙張進行卡片製作的行動應用，其特色在能讓使用者從頭開始創造專屬卡片，編輯完成後除能以電子方式寄送、自行下載列印，亦可以選擇與惠普公司旗下Snapfish合作的印刷服務幫忙輸出；Red Stamp（圖5）同樣是款能讓使用者選擇要以電子郵件傳送，或根據不同付費方案，將卡片以紙本方式寄送給指定對象的應用服務。. 立. 政治大. ‧. ‧ 國. 學. n. er. io. sit. y. Nat. al. Ch. engchi. i n U. v. 圖 4 Martha Stewart CraftStudio 編輯介面與下載頁資料來源：研究者平板電腦截圖. 21.

(22) 政治大. 圖 5 Red Stamp 首頁與其編輯畫面資料來源：研究者手機截圖. 立. 由此小節案例可瞭解提供客製化卡片製作的行動應用趨勢，從中學習客製. ‧ 國. 學. 化服務應有功能，整體使用流程與介面設計。這些功能與介面的設計可以反映使. ‧. 用者習慣的操作方式，為了增加本研究設計的易用性，在這些案例中所觀察到的. sit. y. Nat. 設計模式許多可以稍作調整即加以應用。另方面，從這些案例可發現現有應用服. n. al. er. io. 務乃以製作平面形式電子卡片為主，即便透過代客輸出和寄送服務提升附加價值，. i n U. v. 仍舊是一張平面印刷品，缺乏手作卡片不同材質紙張堆疊的觸感、量感回饋，與親手製作的靈光。. Ch. engchi. 此外，卡片分享機制雖然與主流社群平台結合，其主要目的仍在寄送卡片，無法得到其他使用者對於自己創作結果的看法，未能妥善應用社群平台能夠互相交流、給予回饋的特性，這是本研究可以思考發揮的地方。. 2.2.2. 直接手作體驗. 雖然使用數位輔具生成是現今市面上最常見的卡片製作方式，但仍然有提供能夠讓使用者親自手作卡片的應用服務，由佳能株式會社（Canon）所建立的 22.

(23) Creative Park 網站便是其中一項例子（圖 6）。此網站和不同紙藝設計師合作，提供各式製作版型下載，其中卡片類別包括平面與立體兩種形式，在立體卡片的部分，使用者可以免費下載紙型，依照圖解教學步驟說明完成卡片製作。而拍立得公司（Polaroid）則結合自家相印機產品，在情人節推出的卡片禮物盒（圖 7），如同傳統市售的卡片製作材料包一般，將已設計好的卡片禮物盒樣板所需材料，連同製作的步驟教學販售成套組，使用者可搭配由印相機列印出的照片，親手完成卡片。. 立. 政治大. ‧. ‧ 國. 學 er. io. sit. y. Nat. n. al. i n C 圖 6 Canon hCreative i U e n gPark c h網站畫面. v. 資料來源：http://cp.c-ij.com/en/contents/CNT-0018423/index.html. 圖 7 Polaroid 卡片禮物盒 DIY 材料包與教學影片畫面資料來源：https://www.instagram.com/p/BBXBw_jgIIW/ 23.

(24) 事實上，現有結合手作的行動應用服務，多與製作立體紙公仔有關，或應用在增進立體結構理解的教學展示。前者如 Foldify 或 Tiny Paper Zoo（圖 8）兩款行動應用，使用者可製作出人物或動物造型的立體紙公仔；後者則如 Shapes（圖 9），能幫助孩童學習基本幾何立體結構，以即時互動的 3D 模擬方式呈現。雖然這些行動應用製作內容與卡片較無相關，卻仍可發現皆是透過數位輔助模擬立體結構在不同角度呈現的樣子，並結合下載與列印功能，讓使用者親自動手做。. 學 ‧. ‧ 國. 立. 政治大. 圖 8 由左至右依序為 Foldify 與 Tiny Paper Zoo. y. Nat. Tiny Paper Zoo Plus. n. al. er. io. sit. 資料來源：www.foldifyapp.com、https://itunes.apple.com/tw/app/tiny-paper-zoo-plus/id581773069?mt=8. Ch. engchi. i n U. v. 圖 9 Shapes-3D Geomery Learning 資料來源：http://shapes.learnteachexplore.com/. 24.

(25) 此小節案例全數和使用者手作體驗有關，展現數位編輯與親自動手做的結合可能。在與立體紙藝相關的行動應用案例，可得知數位除了利於編輯製作，還能運用即時互動方式呈現立體結構，補足一般人難以想像立體空間的問題，這項優點可納入本研究之設計規劃。然而，不論是直接從網站下載、購買手作材料包，或製作立體紙藝，這些數位輔具所提供的版型十分有限，可編輯幅度少，甚至缺乏更改彈性，不一定能滿足客製化需求，這卻是本研究可著力改善之處。. 2.2.3. 製作教學資源. 政治大. 在設計卡片時，我們往往會尋求製作教學和參考範例，幫助自己構思，翻閱. 立. 手作卡片教學相關書籍，或參加相關工作坊便是常見的傳統方式。隨著數位時代. ‧ 國. 學. 來臨，網際網路的快速發展，使得卡片教學文章與影片分享如雨後春筍般在各種. ‧. 網路平台出現，如部落格、個人網站、Youtube、Facebook等，甚至有創作者透. sit. y. Nat. 過網路販售自行設計的卡片版型。例如獲得立體書大獎—梅根多佛獎的知名紙藝. n. al. er. io. 工程師Robert Sabuda，即在個人網站分享製作立體卡片的基本知識、提供免費版型下載，並販售卡片紙型（圖10）。. Ch. engchi. i n U. 圖 10 Robert Sabuda 個人網站資料來源：http://wp.robertsabuda.com/ 25. v.

(26) 也專供智慧型載具使用的卡片製作教學，如多媒體出版商 Ashdown Broadcasting推出的Make Your Own Greeting Cards（圖11），結合影音提供手作卡片教學；Cardmaking & Papercraft Magazine（圖12）是英國卡片製作社群網站推出的數位出版雜誌，以月刊方式介紹各種卡片與紙工藝的靈感，並提供簡易製作教學。雖然有智慧載具專用的行動應用服務，這些仍以單向的影音教學為主，與影音網站性質雷同。. 立. 政治大. ‧. ‧ 國. 學 er. io. sit. y. Nat. 圖 11 Make your own Greeting Cards 介面. n. al. Ch. i n U. v. 資料來源：https://itunes.apple.com/us/app/make-your-own-greeting-cards/id1083083707?mt=8. engchi. 圖 12 Cardmaking & Papercraft Magazine 介面資料來源：研究者手機截圖 26.

(27) 從上述案例可得知，使用者能透過各種數位教學資源，找尋符合喜好的卡片樣式、參照教學步驟，將卡片製作完成，不但保留手作美好價值，又能加入個人巧思做出具客製化的卡片。但此種製作卡片方式卻缺乏應用上的立即性，教學內容需要消化，材料準備也較為複雜，沒有辦法讓使用者毫無隔閡地快速了解並開始製作，這是本研究的數位輔具可以改善的地方。. 2.3 小結. 政治大. 近年來，人們重新重視手作價值，和背後所傳遞的那一份溫暖，其不可取代. 立. 的獨特性、融入個人生活經驗特質，影響手感經濟發生。手感經濟不斷被提倡，. ‧ 國. 學. 顯示手作仍有其市場，而根據美國賀卡協會（The Greeting Card Association）於 2015年指出，將寄送紙本賀卡視為具有意義的個人情感表達方式仍舊深植年輕人. ‧. 心中，而這個傳統也可能持續至他們長大成人，並用以經營重要人際關係。可見. y. Nat. er. io. sit. 實體卡片依舊存在價值，在數位發達時代中甚至能成為更具心意的展現。在尋找手作立體卡片與數位科技結合的可能，透過現有與卡片製作相關案例. al. n. v i n Ch 分析，發現目前市面上尚未存在能夠兼具客製化、手作、即時性這三者的產品。 engchi U. 而本研究期望在製作手作立體卡片時，保有親自動手參與創造過程的重要，並結合數位擁有便利與易用性，甚至在3D結構呈現能補足對立體空間想像的優點，設計出兼顧手作與數位兩者的立體卡片製作行動應用服務，這三點將是後續設計考量重點。. 27.

(28) 第三章. 《HandiCard》作品構想. 3.1 概念說明手作立體卡片具有紙本卡片擁有視覺與觸覺感官之回饋，且卡片開闔與彈出式結構設計能帶來豐富的互動性，除了乘載祝福外，也能給予瞬間驚喜，比起市售大量印刷制式卡片，更能帶給人們別出心裁的感受。故本研究提出「HandiCard」，一項幫助手作立體卡片製作的設計原型構想。考量到現今智慧型載具普及，與行動應用服務盛行趨勢，將其開發在行動裝置之. 政治大. 上。其核心價值便是結合數位與手作，讓使用者可以不受時空限制，簡單、方便. 立. 設計出極具個人巧思的立體卡片，並透過親自動手做的過程賦予卡片獨一無二價. ‧ 國. 學. 值，製作出實體卡片，傳達真摯心意和手感溫度給贈予對象。. ‧. n. er. io. sit. y. Nat. al. Ch. engchi. i n U. v. 圖 13 設計概念. 3.1.1. 解決現有數位輔具不足之處. 根據文獻與案例探討歸納重點，本研究認為一個符合現今需求趨勢、結合數位與手作的立體卡片製作應用服務，應對下列三大面向提出見解：. 28.

(29) （1）客製化在客製化製作服務，能讓使用者有足夠發揮空間，不單只從所選卡片樣版進行設計變化，也可以從零開始創造屬於個人的卡片，使編輯上更具有彈性。此外，由於立體卡片在展示時是個動態歷程，含有時間與空間維度變化，需要考量結構配置，使得製作難度大幅提升，因此若結合數位科技在互動回饋、立體空間呈現的優點，則能有效幫助立體卡片製作。（2）手作將版型輸出，搭配步驟教學完成實體卡片是目前既有數位輔助結合手作體驗. 治政大的方式，也是規劃HandiCard使用功能與流程可以學習的地方，讓製作手作卡片立. 變得更加快速簡單。然而若直接彩色輸出完全設計好的版型，使用者只需動手剪. ‧ 國. 學. 裁、黏貼即可完成，將失去製作手作卡片時，挑選個人喜好的紙張、透過不同顏. ‧. 色材質堆疊，帶來的樂趣與視觸感回饋，因此卡片紙型不該取代這項創造的過. y. sit. n. al. er. io. （3）即時性. Nat. 程。. i n U. v. 書籍、網路上的參考與教學資源雖然有助於卡片構思，卻缺乏能夠立刻開始. Ch. engchi. 製作的即時性，因此製作與教學應互相結合，甚至歸納常見立體結構樣式，直接供使用者選擇，免去需要重頭開始學習的困擾。. 3.1.2. 發揮數位社群特性. 在既有案例的卡片分享機制，電子郵件或社群平台均僅作為寄送電子賀卡給單一或多人的用途。同款應用服務使用者之間無法進行彼此的卡片製作成果交流，未能妥善運用數位時代社群平台互相分享、給予回饋的特性，讓使用者亦成為內. 29.

(30) 容共構者。然而此特性卻是提升個人在卡片製作興趣、熱情與技巧進步的一大關鍵，應予以發揮。建立真正能促進交流的社群平台，可解決手作相關書籍，立體卡片教學散於網路各處，資訊完整度不一的問題，也能作為創作者分享或販賣自行設計的卡片版型的統一管道。有鑑於此，應有效發揮社群交流分享的特性，整合製作資源與分享機制在共同平台之中，以充分發揮推廣手作卡片的功能。. 3.2 架構與功能規劃. 立. 政治大. HandiCard作為一項結合數位與手作的設計原型，考量到在概念說明對客製. ‧ 國. 學. 化、手作與即時性，這三點提出回應，並能有效發揮數位社群互相交流與分享的特性，故在整體架構可分為以下三大部份，並說明各部分的功能規劃：. ‧. （1）個人化設計. y. Nat. er. io. sit. 指的是使用者利用HandiCard在智慧型載具上設計立體卡片的階段。其中包含卡片形式、彈出式立體結構的卡片基本構成挑選，讓使用者可以從頭開始創造，. al. n. v i n Ch 再透過上傳個人照片、加入素材庫圖片與輸入文字，三項功能進一步編輯，滿足 engchi U 客製化需求，增加卡片之於贈送對象的獨特性。（2）實際手作參與待卡片設計完成，可預覽列印結果，透過智慧型載具與印表機連線印出紙. 型，或使用電子郵件、Dropbox等雲端服務，以PDF格式下載檔案。使用者依照印出來僅有黑白線稿的紙型，挑選符合個人喜好的紙張顏色與材質，完成實體卡片製作。. 30.

(31) （3）創作分享平台可根據個人意願在分享專區上傳自行設計的立體卡片版型，亦可於專區中下載、列印他人分享內容。此外，未來也希望透過此平台增加HandiCard的商業可能性，如與知名紙藝工程師、出版社等合作，推出需付費購買且較為精緻、複雜之卡片版型。. 政治大. 立. ‧. ‧ 國. 學. n. 圖 14 HandiCard 架構規劃. Ch. engchi. er. io. sit. y. Nat. al. i n U. v. 3.3 設計考量本節針對市面上卡片既有種類與使用場合進行瞭解，並彙整立體卡片常見結構，歸納可重複應用之規則，作為功能設計的參考依據，最後亦列出HandiCard 所採用的卡片版型與立體結構。. 31.

(32) 3.3.1. 賀卡文化與介面風格為滿足人們在表示祝福與問候的需求，市面上賀卡種類繁多，根據美國賀. 卡協會（The Greeting Card Association）賀卡一般可分為季節性質（Seasonal Cards）與日常性質（Everyday Cards）兩大種類。在季節性質中常見賀卡種類如聖誕節、情人節、父親節、母親節、萬聖節等，其中又以聖誕節為最受歡迎的季節卡片，在美國一年近65億張購買量中佔七成以上；日常性質賀卡則包含生日、慰問、感謝、婚禮、紀念日等，而生日是最常使用的場合。. 政治大並未有統一標準，仍不外乎包含於此。林欣怡、伊彬（2011）表示在台灣賀卡立此種類區分方式廣泛應用在西方賀卡之中，雖然國內在賀卡種類的歸納上. ‧ 國. 學. 收送場合以生日為最，其次則為節日卡片。此外，林欣怡（2013）指出市面販售賀卡可略分為節日、場合與通用賀卡三大項，其中通用賀卡即為俗稱的萬用卡，. ‧. 適用於各種寄送場合。. y. Nat. sit. 因此由上述可知，通常卡片的使用帶有目的性，多半與節日或某些特紀念. n. al. er. io. 場合有關，根據常見的卡片種類與使用情境，將作為HandiCard在提供使用者編. Ch. i n U. v. 輯客製化卡片功能時，內建製作素材的設計參考。而整體介面風格，基於卡片與. engchi. 節慶之關聯，也將定調在能帶給使用者愉悅、溫馨的風格，讓使用者能心情放鬆、愉快地編輯與製作立體卡片。. 3.3.2. 立體結構整理. 研究者以傳統方式設計與製作立體卡片，並在其中了解到，從零開始構思一張卡片，製作者除了要對既有的立體結構表現、立體空間有所認知，也必須經過反覆測試才能確保每項物件的大小、黏貼位置與角度都能讓卡片順利開闔，才可以呈現出最完美的狀態（表 1）。 32.

(33) 表 1 過往立體卡片設計與製作過程設計與製作過程. 步驟示意圖. 1. 發想卡片內容，設計草圖. 2. 繪製立體結構各項物件設計圖/製作草稿. 立. 政治大. ‧ 國. 學. 3. 草稿機關反覆測試. ‧. 並確定草稿. n. er. io. sit. y. Nat. al. 4. 將各物件重新描繪，完成紙型定稿。. Ch. engchi. 5. 根據紙型完成立體卡片的製作. 33. i n U. v.

(34) 不斷反覆測試、修正的過程十分繁瑣，容易降低人們製作意願，而且如欲製作出擁有更多複雜結構的立體卡片，也大幅提高製作門檻。因此考量到 HandiCard提供立體卡片製作時的易用性與便利性，應歸納、整理立體卡片常見結構，作為功能設計參考。經賴淑雅（2004）整理指出紙的立體造型製作，大體上可為「一紙成型」與「外貼型」兩種方式（圖15）。「一紙成型」為同一張紙經由摺疊、切割的技法，將紙本身製作出立體造型來，如頂摺、張合、嚼合、矩形等；「外貼型」則需以另外的紙片或零件作為頁面兩版的連結，如扇行、穿插、拉線與雙足等。. 立. 政治大. ‧. ‧ 國. 學. n. er. io. sit. y. Nat. al. Ch. engchi. i n U. v. 圖 15 立體造型的基本製作法引自賴淑雅，立體書設計與兒童創造力啟發之探討，碩士論文，2004，p28. 利用這些將紙立體化的基本製作方法，可設計出各種不同的彈出式（Pop-Up）立體結構表現，而彈出式設計也被廣泛應用在書籍、卡片、廣告宣傳等印刷製品中。因此立體卡片結合視覺與觸覺感官，體驗到紙的次元變化，以及翻開或摺疊卡片時操作上的互動效果，滿足我們期待驚喜的瞬間。以下將彙整立體卡片中常見的彈出式設計結構。. 34.

(35) 在英國設計師Duncan Birmingham指出，V型摺（V-Fold）和平行摺（Parallel Fold）是兩大基礎結構，並同時遵循以下三種原則： (1) 每個彈出式結構必須橫跨一道紙上摺疊線（Gully）。通常第一道摺線是沿著底紙中間摺出的中心線（Spine-Fold）。其中Gully指的是彈出式結構隨著底紙闔上時閉合或變平坦的摺疊線，而Spine-Fold則是沿著底紙中間所產生的中央摺痕線（圖16）。. 立. 政治大. sit. y. ‧. ‧ 國. 學. Nat. 圖 16 彈出式結構基本組成與名稱. io. Folding Paper Sculpture，p13。. n. al. er. 資料來源：Duncan Birmingham（2011）Pop-Up Design and Paper Mechanics: How to Make. Ch. engchi. i n U. v. (2) 彈出式結構必須保持平衡，或是配合每一側的摺疊線（圖17）。Ｖ型摺結構每側在「角度」上必須保持平衡（A+B=A+B）；平行摺結構則是「長度」必須保持平衡（A+B=A+B）。. 圖 17 Ｖ型摺疊與平行式摺疊資料來源：http://www.duncanbirmingham.co.uk/html/pop-up_theory.html. 35.

(36) (3)每個彈出式結構會創造出新的摺疊線。外加新的彈出式結構時可建構在這些摺疊線上（圖18）。. 立. 政治大. 圖 18 外加新的彈出式結構. 資料來源：Duncan Birmingham（2011）Pop-Up Design and Paper Mechanics: How to Make. ‧. ‧ 國. 學. Folding Paper Sculpture，p19。. Nat. sit. to Make Folding Paper Sculpture》一書整理常見基礎形狀：. y. Duncan Birmingham（2011）並於《Pop-Up Design and Paper Mechanics: How. al. n. 直角V型摺法 Right-angle V-fold. er. io. 表 2 Duncan Birmingham 分類：Ｖ型摺法（V-folds）. Ch. engchi. 尖角V型摺法 Pointed V-fold. v. 銳角V型摺法 Acute-angle V-fold. i n U. 鈍角V型摺法 Obtuse-angle V-fold. 36.

(37) 不對稱V型摺法 Asymmetric V-fold. 表 3 Duncan Birmingham 分類：平行摺法（Parallel-folds）平行四邊形 Parallelogram 平行摺法 Parallel-fold. 立. 政治大. ‧ 國. 學 ‧. 不對稱平行摺法 Asymmetric Parallel-fold. n. er. io. sit. y. Nat. al. Ch. engchi. i n U. v. 表 4 Duncan Birmingham 分類：由Ｖ型摺法衍生的二次基礎形狀 Z字型摺法 Zigzag-fold. M字型摺法 M-fold. 37.

(38) 表 5 Duncan Birmingham 分類：由多重平行摺法所構成浮動平台 Floating planes. 方盒 Box. 表 6 Duncan Birmingham 分類：基於Ｖ型摺與平行摺的二次基礎形狀開頂式形狀 Open-topped shapes. 政治大. 學. ‧ 國. 立. 金字塔 Pyamids. 彎曲形狀 Curved shapes. ‧. n. er. io. sit. y. Nat. al. Ch. engchi. i n U. v. 表 7 Duncan Birmingham 分類：能帶來不尋常與驚奇的機關扭動機關 Twisting mechanism. 自動式拉片 Automatic pull-strip. 38.

(39) 移動式手臂 Moving arms. 拉片 Pull-strips. 轉軸 Pivots. 翻動式拉片 Flaps. 立. 政治大. 資料來源：本研究整理自 Duncan Birmingham（2011）Pop-Up Design and Paper Mechanics: How to Make Folding Paper Sculpture。. ‧ 國. 學. 獲得立體書大獎—梅根多佛大獎的紙藝工程師David A. Carter與James Diaz. ‧. （1999）在《The Elements of Pop-Up: A Pop-Up Book for Aspiring Paper Engineers》. sit. y. Nat. 一書中以基頁中心線為標準，歸納以下四項分類：. n. al. er. io. 表 8 David A. Carter 分類：平行摺法（Parallel-folds）. 90°平行摺法 90°Parallel Folds. v n i 180°Tent. 180°帳篷. Ch. engchi U. 180°不均等帳篷 180°Uneven Tent. 180°平行開盒 180°Parallel Open Box. 39.

(40) 180°管柱銜鐵 180°Tube Post Armature. 180°平行立方體 180°Parallel Cube. 180°船 180°Boat. 180°圓柱體 180°Cylinder. 180°錐體 180°Cone. 立. 政治大. 180°平行金字塔 180°Parallel Pyramid. ‧. ‧ 國. 學 y. Nat. n. er. io. al. 180°盒與平行水平面 180°Box with a Parallel Plane. sit. 180°合攏帳篷 180°Closed Tent. Ch. engchi. 180°製造聲響 180°Noise Maker. i n U. v. 180°帳篷與傾斜延伸 180°Tent with a Tipped-in Extension. 40.

(41) 180°管柱拱起管卡 180°Arch with a Tube Strap. 180°活動平台管柱 180°Movable Platform with a Tube Post. 180°穩固平台帳篷 180°Stable Platform with a Tent. 180°盤繞螺旋 180°Coil. 政治大. 立. 表 9 David A. Carter 分類：角度摺法（Angle-folds） 180°摺法 180°Angle Fold. ‧. ‧ 國. 學. 90°摺法和不相等角度摺法 90°Angle Fold. n. er. io. sit. y. Nat. al. 180°不相等角度摺法 180°Unequal Angle Fold. Ch. engchi. 180°摺盒與平斷水平面 180°Angle Fold Box with Crossing Planes. i n U. v. 180°摺法開盒 180°Angle Fold Open Box. 180°立方體摺法 180°Angle Fold Cube. 41.

(42) 180°金字塔摺法 180°Angle Fold Pyramid. 180°平台摺法 180°Angle Fold Platform. 180°相對角度與縮緊技法 180°Opposing Angles with Pinched Tips. 180°相對角度帳篷 180°Opposing Angle with a Tent. 政治大. 180°摺法與90°摺法、平行水平面、開槽水平面 180°Angle Fold with a 90°Parallel Fold, Parallel Plane, and a Slotted Plane. 立. 180°摺法傾斜延展和開槽 180°Angle Fold with a Tipped-in Angle Fold Extension and a Slotted Angle Fold. ‧. ‧ 國. 學 sit. y. Nat. io. er. 表 10 David A. Carter 分類：轉輪（Wheels）. 莫列波紋轉輪 Wheel with a Moire Pattern. 指示轉輪 Wheel with a Tip-On. n. al. Ch. engchi. 往復式手臂轉輪 Wheel with a Cam and a Reciprocating Arm. i n U. v. 雙層轉輪 Double Wheel. 42.

(43) 表 11 David A. Carter 分類：拉片（Pull-Tabs）撬動拉片 Pull-Tab with a Lever. 平行移動拉片 Pull-Tab with Parallel Movement. 莫列波紋拉片 Pull-Tab with a Moire Pattern. 換圖拉片 Pull-Tab with a Changing Picture. 政治大. 立. 軌道拉片 Pull-Tab with a Spinner. ‧. ‧ 國. 學. 搖壁拉片 Pull-Tab with a Rocker Arm. io. sit. y. Nat. n. al. 滑輪拉片 Pull-Tab with Tracks. er. 旋轉拉片 Pull-Tab with a Pulley. Ch. engchi. i n U. v. 資料來源：本研究整理自 David A./ Diaz, James（1999）The Elements of Pop-Up: A Pop-Up Book for Aspiring Paper Engineers。. 此外，Keith Finch（2013）在《Paper Engineering for Designers：Pop-Up Skills and Techniques》則將常見之立體結構分為下列七大項，並列舉各種類中含有之結構展開圖：. 43.

(44) 表 12 Keith Finch 分類：常見立體結構. V型摺 V-Folds. 立. 政治大. ‧ 國. 學. 平行摺. Parallel Folds. ‧. n. er. io. sit. y. Nat. al. 拉片. Ch. engchi. Pull-Tabs. 轉軸 Pivots. 44. i n U. v.

(45) 轉輪 Wheels. 消融窗 Dissolving Window. 立. 政治大. ‧. ‧ 國. 學 sit. y. Nat. 卡接球體. io. n. al. er. The Globe. Ch. engchi. i n U. v. 資料來源：本研究整理自Keith Finch（2013）Paper Engineering for Designers Pop-Up Skills and Techniques。. 綜合以上分類方式，可發現基礎的彈出式設計，多半依據基底頁的中心線建立主體結構，擁有兩個以上、較為複雜的立體結構是接續主體做延伸發展，而基底頁展開呈現角度也會影響結構設計，主要分為雙頁面平行狀態的180度，及兩頁面成垂直狀態的90度，兩者能使用的立體構造不盡相同。. 45.

(46) 90度展開可利用多層附加增加造型，其結構在立體造型製作方法上「一紙成型」與「外貼型」兩者並用；180度展開的結構則是使用「外貼型」技法，另外黏貼紙型與零件，其構造也會隨著底頁開闔有不同角度的立體型態展開。此外在彈出式設計中，翻頁、轉輪、拉卡等屬於機關形式的設計較為特殊，雖然並未產生3D的彈出構造，而是在平面狀態下透過人手動或卡片開闔製造出的動能變化，卻能帶給使用者一種操作上的驚奇，且構造設計時通常會有明顯圖示暗示使用者觸動機關。. 3.3.3. 治政大卡片版型與立體結構之選擇立 ‧ 國. 學. 根據前一小節歸納與彙整的結果得知，基礎彈出式結構大多數是建立在卡片底紙的中軸線，而依據卡片底紙展開的角度也會影響結構設計，可分為「180. ‧. 度」整張紙平開與紙呈現直角的「90度」展開方式，此亦為市售立體卡片常見形. y. Nat. n. al. Ch. engchi. 圖 19 卡片版型分類. 46. er. io. 是垂直或水平狀態，共分為四種形式（圖19）。. sit. 式，因此在HandiCard卡片版型挑選的設計上，將180度與90度分開，並根據中軸. i n U. v.

(47) 在彈出式的立體結構挑選亦可發現，V型摺與平行摺為最常見的立體結構兩大形式，兩者可再細分為不同形狀結構，並依據卡片底紙為180度或90度，有不同表現方式。此外，轉輪與拉卡為機關式彈出設計中，較為基礎且常見形式，其建構於180度水平底紙上，也將納入HandiCard可製作的立體結構選項。以下將列出經挑選後運用在HandiCard之常見立體結構：. 表 13《HandiCard》基礎立體結構說明. 政治大. 立. ‧ 國. 學. V型摺法. ‧ sit. n. al. er. io 中軸線垂直. y. Nat 180度展開. Ch. Z字型摺法. engchi. （由V型摺延伸之摺法）. 平行摺法. 幾何形狀. 47. i n U. v.

(48) 平行摺法. 政治大. 立. ‧ 國. ‧. io. sit. y. Nat. 中軸線水平. 學. 180度展開. n. al. er. 幾何形狀. 90度展開中軸線垂直. Ch. engchi. i n U. v. 平行摺法. 註：一紙成型技法，於卡片裁切一刀. 48.

(49) 註：一紙成型技法，於卡片裁切兩刀. 政治大. 立. ‧. ‧ 國. 學. n. er. io. sit. y. Nat. al. Ch. engchi. i n U. v. V型摺法. 90度展開中軸線水平平行摺法. 註：一紙成型技法，於卡片裁切兩刀. 49.

(50) 政治大. 立. sit. y. Nat. n. al. er. io. 轉輪. Ch. 180度展開中軸線垂直. engchi. 拉片（軌道拉片與撬動拉片）. 180度展開中軸線水平. ‧. ‧ 國. 學表 14《HandiCard》機關式結構說明. 轉輪. 50. i n U. v.

(51) 拉片（軌道拉片與撬動拉片）. 3.4 介面與操作流程. 立. 政治大. HandiCard 整體介面規劃以乾淨、溫馨活潑的風格為主，期望藉此傳達親自. ‧ 國. 學. 動手製作卡片是一件有趣、開心的事情；在編輯區介面，為能夠幫助使用者聚焦. ‧. 在卡片設計上，因此把畫面干擾降到最低，沒有多於花俏裝飾。. sit. y. Nat. 根據整體架構 HandiCard 可分為個人化設計、實際手作參與、創作分享平台. io. n. al. er. 三大部份，以下各小節將對此三部分操作流程進行逐一說明。. Ch. engchi. 圖 20 整體介面風格. 51. i n U. v.

(52) 3.4.1. 個人化設計. 使用者從首頁進入主畫面，可於選單選擇欲製作的立體卡片形式，由上而下分為基本立體結構形式與機關形式兩種（圖 21）。基本立體結構又依據卡片底紙 180 度或 90 度展開、中軸線垂直或水平與否，提供四種樣式選擇；機關形式則於 180 度展開，挑選中軸線方向，共分為兩種樣式（圖 22）。. 立. 政治大. ‧. ‧ 國. 學. n. er. io. sit. y. Nat. al. Ch. i n U. 圖 21 主選單之卡片形式選擇. engchi. v. 圖 22 基本立體結構形式（左）、機關形式之卡片樣式（右）. 52.

(53) 當確定卡片形式後，便正式進入製作立體卡片的編輯區。編輯區右上角選單為其主要三大功能：紙張大小（Paper）、立體結構（Shapes）、匯入素材（Import）。使用者可以從預設選項中點選所需卡片尺寸，及個人偏好的立體結構樣式。事先規劃好的立體常見結構樣式，透過有限度自由給予，免去過往製作時必須經過反覆測試才能確立合適卡片尺寸的結構設計問題。. 立. 政治大. ‧. ‧ 國. 學. n. er. io. sit. y. Nat. al. Ch. engchi. i n U. v. 圖 23 編輯區中紙張大小選擇頁面. 立體結構選單畫面將以 3D 方式呈現，搭配使用者操作手勢之運用，當滑動畫面中的卡片紙張能即時互動，提供 360 度預視效果，給予立體模擬回饋，幫助使用者了解不同結構樣式間的差異。依照手勢亦能直覺式放大縮小、移動立體結構在卡片上依中線生成的位置，調整到使用者心目中理想結果。. 53.

(54) 立. 政治大. 圖 24 編輯畫面各項功能與操作手勢. ‧. ‧ 國. 學. n. er. io. sit. y. Nat. al. Ch. engchi. i n U. 圖 25 360 度即時預視效果. 54. v.

(55) 匯入素材選項，提供使用者能以自行上傳照片或圖片（Picture）、從圖庫中選擇圖示（Icons），與輸入文字（Text）三種功能，設計出獨一無二的客製化立體卡片。此時編輯畫面同樣以 360 度預視呈現，可隨著不同視角切換利於編排。. 立. 政治大. ‧. ‧ 國. 學圖 26 匯入素材區各項功能. sit. y. Nat. n. al. er. io. 內建圖庫根據先前對賀卡文化的了解，將其按照最常使用場合與節日進行選. i n U. v. 單分類，幫助使用者能快速找到卡片製作情境的對應素材。. Ch. engchi. 圖 27 內建圖庫依據常用節日與場合分類. 55.

(56) 在使用者自行上傳圖片、相片功能，可替匯入進來的影像進行簡單去背，並增加外框線或白邊，以凸顯與其他物件之差別，而打字功能則可選擇字型與字級大小。匯入素材選項中的所有功能皆可依照使用者需求選擇用與不用，編輯過程若有不需要的物件，只需長按後將其拖曳至視窗外，便可輕易刪除。. 立. 政治大. ‧ 國. 學. 圖 28 上傳圖片區（左）與輸入文字功能（右）之範例介面. ‧. 3.4.2. 實際手作參與. sit. y. Nat. io. al. er. 使用者必須親手完成立體卡片為 HandiCard 設計初衷，亦是數位科技浪潮下. v. n. 將手作與數位結合的嘗試，因此當卡片編輯完成，點選編輯區右上方列印圖示，. Ch. engchi. i n U. 會進入預覽列印畫面，呈現方才製作立體卡片所選擇之紙張尺寸、立體機關結構，與個人化素材的各頁面列印內容。考量到印列便利性，在編輯區選擇紙張大小功能，即參照國際列印標準常見規格，且最大尺寸以以 A4 為限設計而成。使用者可利用一般家用印表機與普通列印紙輸出，無需更換列印紙規格，亦能將設計檔案以電子郵件、Dropbox 等方式匯出儲存，前往便利商店或影印店快速列印出版型。. 56.

(57) 此外，HandiCard 輸出版型結果規劃，紙張與立體機關會放置在同一頁，其餘素材呈現在另一頁面中。除了區別作用外，若素材多為個人上傳照片或圖片的結果，則此頁亦可選用材質較好的相片紙輸出。. 立. 政治大. ‧. ‧ 國. 學. n. er. io. sit. y. Nat. al. Ch. engchi. i n U. v. 圖 29 下載功能選項與各列印頁紙型預覽. 57.

(58) 編輯完成的卡片結果，系統會自動儲存並顯示於「我的卡片集」（My Cards），使用者可於此區進行管理，對已完成之卡片重新編輯或刪除。我的卡片集亦有將個人卡片版型分享到社群之功能，點選卡片右上方上傳圖示，將會跳出提醒。. 立. 政治大. 圖 30 我的卡片集與上傳提醒畫面. ‧. ‧ 國. 學 y. Nat. io. sit. 列印出紙型後，可依照個人喜好挑選不同材質、顏色紙張，同時參照. n. al. er. HandiCard 教學功能的製作工具與基本製作步驟說明，完成實體卡片製作。在手. Ch. i n U. v. 作立體卡片過程中，亦可加入個人巧思，搭配紙膠帶、貼紙，或手繪塗鴉等方式，. engchi. 自由地對卡片進行加工，並寫上祝福訊息，使卡片更具獨特性，並贈送給欲表達祝福之對象。. 58.

(59) 立. 政治大. ‧. ‧ 國. 學. n. er. io. sit. y. Nat. al. Ch. engchi. 圖 31 製作教學說明. 59. i n U. v.

(60) 3.4.3. 創作分享平台. 使用者可依照個人意願，分享自行設計的卡片紙型至創作分享專區；參考他人的設計與排版，於中意的卡片按星號留下標記，方便日後快速查看；或點選下載功能，將版型儲存至我的卡片集，列印、製作別人分享的立體卡片。此外，未來也希望透過分享平台為 HandiCard 帶來商業價值，提供較為精緻、複雜的付費紙型結構，甚至與其他公司合作推出專屬卡片，需付費購買的項目右下角會出現提示。. 立. 政治大. ‧. ‧ 國. 學 y. Nat. n. al. er. io. sit. 圖 32 分享區主要介面（左）、放大查看他人設計結果（右）. Ch. i n U. v. 右上功能為管理個人上傳結果，在管理頁面能將欲修改之卡片暫時鎖住，待. engchi. 編輯完成再重新開放，若不再想分享，可以直接從此區中直接刪除。. 圖 33 個人卡片管理頁面. 60.

(61) 3.4.4. 流程介紹影片. 在 HandiCard 初期介面構想，拖曳至編輯區內之立體結構，僅能以單一視角觀看編輯狀態,且以點選按鈕方式，採大、中、小三種固定尺寸供使用者選擇。考量到立體卡片呈現方式，會影響對立體結構的理解，再加上受到相關立體紙藝行動應用案例啟發，故將編輯畫面更改為 360 度即時預視呈現，拿掉過多按鈕選項，讓使用者能以更加有機、直觀的手勢操作方式，對卡片進行編輯。. 立. 政治大. ‧. ‧ 國. 學. al. y er. io. sit. Nat. 圖 34 舊有的編輯介面設計. v. n. 本研究目標乃設計具有易用性及良好使用體驗的介面，並製作出設計原型，. Ch. engchi. i n U. 因此研究重點乃在於功能規劃、整體介面與使用流程設計，而不是解決 3D 立體呈現的程式技術問題。影片中以動畫模擬實際產品具有的 3D 預視效果，同時拍攝使用情境與操作功能介紹，以作為設計原型的補充說明。. 圖 35 使用情境影片畫面. 61.

(62) 第四章. 作品評估. 設計原型完成後，本研究蒐集六位受訪者的回饋以了解 HandiCard 此設計原型未來轉化為實際商品的可能性。評估重點放在（1）是否能引發受訪者的使用興趣、增加親自動手創作立體卡片之動機；（2）受訪者是否能給予介面設計與整體使用流程正面的回饋。本章第一節為訪談流程，將說明各階段進行方式。第二節為受訪者資訊說明，整理製作手作卡片與使用數位祝福形式的經驗。第三節彙整訪談結果的建議與發. 政治大. 現。第四節進行總結，提供後續改進方向。. 立. ‧ 國. 學. 4.1 訪談流程. ‧. 由於考量到立體卡片需要較大的編輯區範圍以便操作，因此選擇平板電腦. sit. y. Nat. iPad 作為本次訪談測試之工具。本研究使用者訪談流程主要分為五個階段（圖. io. al. er. 36）。首先透過創作概念說明、介紹影片播放與實體卡片展示，讓使用者對. v. n. HandiCard 有基本認識；其次，透過協助設計師將紙面原型，轉換為互動原型的. Ch. engchi. i n U. 應用服務「POP」之輔助，讓受訪者能親自體驗實際操作流程；待一切介紹完成後，針對卡片製作與使用經驗、HandiCard 使用動機、介面設計回饋、整體回饋四大內容，正式進行問卷與訪談。. 圖 36 訪談流程圖. 62.

(63) 政治大. 圖 37 實際訪談示意圖. 立. ‧ 國. 學 ‧. 4.2 受測者資訊. sit. y. Nat. 故本研究以數位原生世代年輕人作為受訪對象，邀請男女人數各半，共計六. io. al. er. 位受訪者。數位原生世代，雖然生活在虛擬與現實之間，卻習慣使用數位方式與. v. n. 他人進行溝通，重視即時與互動性，並對新數位科技產品有較高的接受度。而. Ch. engchi. i n U. HandiCard 是一項在情感溝通方式中，結合數位與手作的嘗試，此世代年輕人便是主要目標族群。問卷內容除了受試者對 HandiCard 設計本身的意見回饋，也包含受試者有關手作卡片與數位科技使用經驗之背景資訊。. 63.

(64) 表 15 受測者資訊（本研究整理）. 代號. 性別年齡職業. 是否有手作. 手作卡. 是否有使用數. 平常以. 卡片經驗，與片頻率. 位祝福之經驗. 何種方. 開始時間. 式為主. 女. 24. 老師. 有，國小. 偶爾. P2. 女. 25. 出版業. 有，國小. 偶爾. P3. 女. 25. 科技業. 有，國小. 男. 偶爾. 29. 科技業. 有，國小. 很少. 有，國中. 偶爾. 25. 學生. io. n. al. 4.3 訪談結果. 數位. 數位. 數位. 數位. er. P6. 有，高中. ‧ 國. 男. 學生. 數位. ‧. P5. 27. 學. 男. Nat. P4. sit. 立. 政治偶爾大. 數位. y. P1. 有 Facebook、 Line、簡訊有 Facebook、 Line 有 Facebook、 Line、E-mail、簡訊有 Facebook、 Line、E-mail 有 Facebook、 Line、E-mail 有 Facebook、 Line、簡訊. Ch. engchi. i n U. v. （1）卡片製作與使用經驗在過往手作卡片製作經驗中，六位受訪者皆表示平時以平面形式（手繪、不同紙張剪貼、照片輸出後加工等）卡片為主。其中四位受訪者表示，當想製作較為複雜的卡片時，會尋求參考或教學，其來源以網路為主。而贈送卡片的對象與場合以生日為大宗，共有五位受訪者表示，會在生日贈送手作卡片給親人與交情較好的朋友；其次依序為聖誕節（三位）、父親節或母親節（兩位）。. 64.