◎系所教育目標：
1.培育兼具理論與實務專業能力之數位學習人才。
2.培育兼具統整學科內容與媒體應用能力之分析設計人才。
3.培育兼具管理知能與科技應用技能之教育訓練人才。
4.培育兼具教學變革與學術創新之教育研究人才。 |
| ◎核心能力 | 關聯性 |
| 1.培育兼具統整學科內容與媒體應用能力之分析設計人才。 | 3 關聯性中等 |
| 2.培育兼具管理知能與科技應用技能之教育訓練人才。 | 5 關聯性最強 |
◎本學科內容概述：
探討網頁設計師如何建立需求並利用設計的技巧，創造出具有使用性並且能和使用者有效率溝通和互動的網站。本課程的內容先從了解使用者，建立需求開始製作網站，之後再撰寫完整的論文報告。因此，本課程是以了解使用者需求為主，並輔以網頁設計的教學，以建立兼具使用性與美感的網頁設計。 |
◎本學科教學內容大綱：
1.互動系統設計的基本概念說明。
2.互動系統設計的原則與實作。
3.基本網頁設計軟體教學。
4.網頁設計的原則。 |
◎本學科學習目標：
• 認識互動介面設計相關理論
• 了解互動介面使用者的需求
• 互動介面設計軟體操作與技巧
• 發表和評估互動介面設計產品的能力
（詳見本課程的輔助教學平台之「課程基本資料」） |
| ◎教學進度：(*表業師協同教學) |
| 週次 | 主題 | 教學內容 | 教學方法 |
01
02/13 | Ch01
課程準備周：課程介紹 | 1. 介紹與課程相關資訊
2. 了解全網路課程執行方式
3. 說明課程活動參與方式
4. 認識授課教師與同學 | 操作/實作、討論。
授課方式：遠距(同步) |
02
02/18 | Ch02
建構理論：介紹互動介面設計 | 1. 介紹介面設計與使用者經驗設計的內涵
2. 說明介面設計與使用者經驗設計的應用
3. 了解介面設計設計系統
4. 培養學生實作能力 | 操作/實作、口頭報告、講授。
授課方式：遠距(同步) |
03
02/20 | Ch03
建構理論：互動產品的設計原則 | 1. 介紹互動產品設計的設計原則
2. 了解互動產品設計原則及其研究考量
3. 了解互動產品設計原則在產品上的應用
4. 介紹啟發式介面設計原則 | 作業/習題演練、講授、討論。
授課方式：遠距(非同步) |
04
03/06 | Ch04
建構理論：介面設計定律 | 1. 介紹介面設計定律
2. 了解介面設計定律其研究考量
3. 了解介面設計定律在產品的適用性
4. 介紹介面設計的美學設計 | 作業/習題演練、講授、討論。
授課方式：遠距(非同步) |
05
03/13 | Ch05
建立需求表：資訊架構 | 1. 介紹資訊架構的基本概念
2. 發展精準與模糊的組織系統
3. 了解組織資訊的困難度
4. 介紹資訊架構軟體
5. 解說資訊架構範例 | 作業/習題演練、操作/實作、講授、討論。
授課方式：遠距(非同步) |
06
03/20 | Ch06
建立需求表：標籤系統 | 1. 介紹標籤系統的基本概念
2. 了解常見標籤系統類型
3. 發展標籤系統的範例
4. 了解圖示型標籤系統
5. 建立新的標籤系統 | 作業/習題演練、講授、討論。
授課方式：遠距(非同步) |
07
03/27 | Ch07
建立需求表：導覽系統 | 1. 介紹導覽系統的基本概念
2. 了解輔助導覽系統
3. 介紹區域導覽系統
4. 解說進階導覽系統 | 作業/習題演練、講授、討論。
授課方式：遠距(非同步) |
08
04/03 | 春假 | 無 | 無。 |
09
04/10 | 期中考閱讀 | 1. 評估閱讀英文研究論文的能力
2. 評估撰寫研究論文摘要的能力
3. 評估學生熟悉研究架構的能力 | 講授、期中考。
授課方式：遠距(非同步) |
10
04/17 | 期中考發表與同儕互評 | 1. 評估發表研究論文的能力
2. 評估同學間給予回饋的能力 | 講授、討論、期中考。
授課方式：遠距(非同步) |
*11
04/24 | 業師直播_UX/UI 大哉問 | 1. 了解業界的實際工作狀況
2. 培養學生與業界連結的能力 | 講授。
授課方式：遠距(同步) |
12
05/01 | Ch08
APP實作：Figma 軟體教學_01 | 1. 介紹 Figma 的面板
2. 介紹 Figma 的基本功能
3. 說明 Figma 的形狀工具 | 作業/習題演練、操作/實作、討論。
授課方式：遠距(非同步) |
13
05/08 | Ch09
APP實作：Figma 軟體教學_02 | 1. 了解 Figma 置入圖片的方式
2. 介紹顏色的使用
3. 介紹 Frame 工具的使用
4. 介紹 Auto Layout 的使用 | 作業/習題演練、操作/實作、討論。
授課方式：遠距(非同步) |
14
05/15 | Ch10
APP實作：Figma 軟體教學_03 | 1. 介紹 Component 的應用
2. 介紹 Variant 的應用
3. 介紹 Button 的應用
4. 介紹表單的應用 | 作業/習題演練、操作/實作、討論。
授課方式：遠距(非同步) |
15
05/22 | Ch11
APP實作：Figma 軟體教學_04 | 1. 介紹 Prototype 原型
2. 介紹轉場效果的應用
3. 了解 Overlay 的應用
4. 了解置頂導航的應用
5. 了解原型中加入 GIF 的應用 | 作業/習題演練、操作/實作、討論。
授課方式：遠距(非同步) |
16
05/29 | Ch12
APP實作：Figma 軟體教學_05 | 1. 介紹 APP 設計流程
2. 了解註冊登入頁架構
3. 了解歡迎、註冊、登入畫面的設計流程
4. 培養學生完成原型的能力 | 作業/習題演練、操作/實作、討論。
授課方式：遠距(非同步) |
17
06/05 | 發表與評量：期末作品發表 | 1. 培養學生發表期末作品的能力
2. 培養學生評論作品的能力 | 討論。
授課方式：遠距(非同步) |
18
06/12 | 發表與評量：期末評量 | 1. 培養學生發表期末作品的能力
2. 評估同學間給予回饋的能力 | 口頭報告。
授課方式：遠距(同步) |
◎課程要求：
所有學生需具有中文的基本聽說讀寫之能力以及電腦操作基本之能力，並具有英文基本聽說讀寫之能力。 |
◎成績考核
期末考100% : 作品的優劣與期末口頭報告以及書面報告
補充說明：實際考核類別請詳見本課程的輔助教學平台之「課程成績評量標準配分說明」。 |
◎參考書目與學習資源
Benyon, et al. (2005), Designing interactive systems: people, activates, contexts, technologies. Addison-Wesley.
Morville, et al. (2006), Information architecture for the www, 3rd, O’reilly.
Brinck, et al. (2001), Usability for the Web: Designing Web Sites that Work, 1st, Morgan Kaufmann.
跟Adobe 徹底研究 Dreamweaver 上奇出版社
正確學會Dreamweaver的16堂課 旗標出版社
Dreamweaver CS5 help 中文 Adobe出版
Dreamweaver CS5魔法書 旗標出版社 |
| ◎教材講義 請改以帳號登入校務系統選擇全校課程查詢方能查看教材講義 |
| 適合修習對象：本課程之修課學生為嘉義大學數位學習設計與管理碩士班一年級學生。學生背景包含資工領域、資管領域、教育領域以及設計領域，亦有少部分在職學生。在職學生多從事學校教職或是與公家或私人機構從事教學設計之相關工作。雖然背景較多元，但幾乎未有互動介面設計相關理論、了解使用者需求、介面設計軟體操作與發表和評估互動介面設計產品之經驗，對多數學生而言是第一門互動介面設計之入門課程。 |
| 教學方式：
■提供線上課程主要及補充教材
■提供線上非同步教學
■有線上教師或線上助教
■提供線上同步教學, 次數：17次， 總時數：46小時
■每週上課時數(遠距教學)：2.56小時
■提供線上同步4次，非同步13次。 |
| 學習管理系統：
1、提供給系統管理者進行學習管理系統資料庫管理
■個人資料
■課程資訊
2、提供教師(助教)、學生必要之學習管理系統功能
■最新消息發佈及覽
■教材內容設計、觀看及下載
■成績系統管理及查詢
■進行線上測驗及發佈
■學習資訊
■互動式學習設計(聊天室或討論區)
■各種教學活動之功能呈現 |
| 作業繳交方式：
■提供線上說明作業內容
■作業檔案上傳及下載
■線上測驗
■成績查詢 |
上課注意事項：
無 |