第三章 個案分析與專家訪談
第一節 個案分析
五、 介面設計綜合分析
5 Material Design，中譯原質化設計，是 Google 公佈的一套同時適用於 Android、iOS、Web 等各種平 台，同時能適用於手機、平板、電視、電腦螢幕等不同裝置的跨平台的設計規則(仍需為各裝置設 計，但鼓勵共用更多相同元素)。
人可以去摸、去翻閱、去整理，卡片可以折疊簡化內容，也能夠展開呈現詳細資訊 (黃莉庭，2015)。Material Design 在 App 開始發展時就已經存在了，現在我們在許多 App 中都能見到紙和卡片的隱喻概念，使用者習慣已然建立，對從小就在資訊時代 下生長的孩子們來說，紙和卡片的概念已經是日常生活中的一部份了。
圖 6 Google 紙和卡片的圖形隱喻
資料來源：https://material.io/components/cards
表 25 受歡迎學習型 App 之圖形隱喻類型統計
App
排行 紙和卡片 生活中的事物 人體器官
Android free
1. Kahoot! ü
2. LingoDeer ü 3. 多鄰國(Duolingo) ü 4. ㄅㄆㄇ注音學習卡 ü
5. 寶寶巴士科學島 ü
Android pay
1. Stellarium 天文 ü
App
排行 紙和卡片 生活中的事物 人體器官
暢與直覺，進而增強使用者體驗。然而，兒童相較成人更不擅長處理複雜的資訊，
並且缺乏系統化的能力，扁平化設計帶來有效的解決方法。
本研究發現，受歡迎的 App 中有許多 App 將扁平化設計為基礎，加上一些小變 化，例如 Kahoot! 會在扁平化的圖形邊緣疊加少量深色的色塊創造立體感，或是 LingoDeer 的插圖整體也是扁平化，唯獨主角是有漸層的；App 整體上仍是扁平化風 格，擁有扁平化風格的優點，再加上些微的改變更能形塑出自身特色，然而這就不 單純只是扁平化設計了，而是介於扁平化與一般有明暗的向量插畫之間。
圖 20 BANDIMAL App 採用扁平化設計
資料來源：本研究整理
向量插畫(vector)泛指以電腦為創作媒介完成的插畫作品，放大縮小不會有失真 問題，向量插畫在電腦蓬勃發展之下已成為當代的流行(梁又文、伊彬、汪文政，
2008)。其風格多樣，相較扁平化設計是更加廣義的名詞，生活中到處能見到向量插 畫的蹤跡，在本研究中可以發現，向量插畫與扁平化設計同時出現在 8 個 App 裡，
受歡迎的App 中向量插畫與扁平化設計常常是交互運用的。
另外，近年流行的Material Design，在 20 個受歡迎的兒童學習型 App 中數目並 未過半，本研究認為， Material Design 的原則中有限制按鈕大小，對精細動作技能 發展不完全的兒童來說，這些尺寸小的按鈕不完全適合他們，且 Material Design 中 的標誌是極簡設計，其中有許多是抽象的示意圖案，陳思帆(2011)提到對認知仍在 發展中的兒童來說，抽象的、或是抽象加上具象的混合類型標誌較不被他們接受。
因此本研究認為這也是Material Design 不全然適合兒童的原因。
圖 7 Material Design 中的按鈕規範與標誌
資料來源：https://material.io/components/bottom-navigation#specs
表 27 受歡迎學習型 App 之介面風格類型統計
App
排行
Material Design
向量插
Android free1. Kahoot! ü ü ü 2. LingoDeer ü ü ü 3. 多鄰國(Duolingo) ü ü
4. ㄅㄆㄇ注音學習卡 ü ü
5. 寶寶巴士科學島 ü ü
Android pay
1. Stellarium 天文 ü
App
排行
Material Design
向量插
遊戲功能方面，兒童使用產品的目標之一是娛樂，遊戲以很直接的方式滿足 Android free
1. Kahoot! ü ü ü
2. LingoDeer ü ü
3. 多鄰國(Duolingo) ü ü ü ü ü
4. ㄅㄆㄇ注音學習卡 ü ü
5. 寶寶巴士科學島 ü ü ü ü Android pay
1. Stellarium 天文
App
排行 虛擬角
有許多受歡迎的 App 使用文字，其文字量不見得是少量的，現代的兒童已然 習慣於使用電子產品，且由於學習型 App 知識含量較高，很難靠圖像全部呈現，文 字都是較簡單白話的字彙。
表 31 受歡迎學習型 App 之傳達訊息類型統計
App
排行 文字 圖像 動畫 音效 旁白 音樂
Android free
1. Kahoot! ü ü ü ü 2. LingoDeer ü ü ü ü ü 3. 多鄰國(Duolingo) ü ü ü ü ü 4. ㄅㄆㄇ注音學習卡 ü ü ü ü ü 5. 寶寶巴士科學島 ü ü ü ü ü ü Android pay
1. Stellarium 天文 ü ü
資料來源：本研究整理 確需要引導教學幫助兒童操作，例如寶寶巴士科學島和Lingokids 兒童英語、伴魚繪 本等。
表 33 受歡迎學習型 App 之引導類型統計
App
排行 無 一開始有 一直都有
Android free
1. Kahoot! ü
2. LingoDeer ü
3. 多鄰國(Duolingo) ü
4. ㄅㄆㄇ注音學習卡 ü
5. 寶寶巴士科學島 ü
App
排行 無 一開始有 一直都有
表 35 受歡迎學習型 App 之反饋統計
App
排行 動畫 顏色改變 音效 旁白 音樂
Android free
1. Kahoot! ü ü ü 2. LingoDeer ü ü
3. 多鄰國(Duolingo) ü
4. ㄅㄆㄇ注音學習卡 ü ü ü ü 5. 寶寶巴士科學島 ü ü ü Android pay
1. Stellarium 天文 ü
表 36 受歡迎學習型 App 之反饋類型總數
Android free
1. Kahoot! ü ü
2. LingoDeer ü ü 3. 多鄰國(Duolingo) ü ü
4. ㄅㄆㄇ注音學習卡 ü ü ü 5. 寶寶巴士科學島 ü ü ü Android pay
1. Stellarium 天文 ü ü ü
App
排行 點擊 輕掃 拖移 縮放
表 39 受歡迎學習型 App 之其他類型統計
App
排行 情境式 內容牆
Android free 1. Kahoot!
2. LingoDeer
3. 多鄰國(Duolingo) 4. ㄅㄆㄇ注音學習卡
5. 寶寶巴士科學島 ü
Android pay
1. Stellarium 天文 ü
2. Solar Walk 2 ü
3. Star Walk 2 ü
4. 恐龍學習卡 PRO
5. PAW Patrol: Air & Sea ü ü iOS free
1. Lingokids 兒童英語 ü ü 2. Epic!-Kids’ Books and Videos ü 3. 國小數學教學動畫(1~6 年級) 完整版 ü
4. 伴魚繪本-兒童英文繪本故事 5. Seek by iNaturalist
iOS pay
1. Toca Hair Salon 3 ü
表 40 受歡迎學習型 App 之其他類型總數 物品能使他們容易操作產品；Material Design 中卡片的概念已經廣泛被運用在介面設 計當中，孩子在科技時代下生長早已學會運用，因此圖形隱喻採用卡片概念也能幫