V3880 教學大綱表

教學大綱表 (115學年度第1學期)

請遵守智慧財產權，勿使用非法影印教科書，避免觸法。

課程名稱 Course Title	(中文) 直覺式網頁設計 (英文) Vibe Coding For Web Design			開課單位 Departments	數位媒體設計學系
				課程代碼 Course No.	V3880
授課教師 Instructor	李文淵
學分數 Credit	2.0	必/選修 core required/optional	選修	開課年級 Level	大三
先修科目或先備能力(Course Pre-requisites)：無
課程概述與目標(Course Overview and Goals)：在 AI 快速發展的數位時代，設計師不再需要成為專業工程師，即可透過「直覺」的方式快速將創意轉化為可互動的網頁與個人小工具。本課程以 Vibe Coding（氛圍式 / 直覺式程式設計）為核心精神，強調「跟著感覺走、忘記程式碼的壓力」，結合生成式 AI 工具，讓學生用自然語言描述想法，即可快速生成原型。學生將學習如何運用 AI 輔助工具，結合設計思維（UX、視覺互動、氛圍營造），打造兼具美感與功能的數位作品，透過Google Alerts、GitHub、 Google Analytics…等工具幫助設計系學生建立「從idea到上線」的完整直覺創作流程，培養 AI 時代的數位設計競爭力。
教科書(Textbook)	無
參考教材(Reference)	無

課程大綱 Syllabus			學生學習目標 Learning Objectives	單元學習活動 Learning Activities	學習成效評量 Evaluation	備註 Notes
序 No.	單元主題 Unit topic	內容綱要 Content summary	學生學習目標 Learning Objectives	單元學習活動 Learning Activities	學習成效評量 Evaluation	備註 Notes
1	課程準備與直覺開發心態建立	課程介紹、Vibe Coding 概念說明、修課約定	了解課程結構與期待、完成必要工具設定、建立「用AI跟感覺走」的創作心態	講授
2	工具設定與基礎架構	GitHub 帳號與 Repo 建立、GA4 設定、Google Alerts 設定、RSS 基礎、AI 工具快速上手	完成所有必要工具設定，並建立個人網站基本框架		作業其他評量-設定
3	個人網站與 CV 開發	用 AI 生成個人網站、CV 頁面設計與整合	完成具個人風格的 CV 網頁並上傳 GitHub	實作	作業上機測驗
4	RSS 個人閱讀新聞週報	RSS 整合、自動化週報生成、視覺化呈現	做出可自動更新的個人閱讀新聞週報	實作	作業上機測驗
5	小工具開發基礎	小工具 ideation、AI 生成簡單互動工具	完成第 1 個自選小工具	實作	作業
6	小工具開發實戰	遊戲類（簡單互動遊戲）運算式美學工具（色彩和諧、生成圖案） SUS 量表產出工具（可用性測試自動化）其他自選（心情追蹤、靈感收集等）	累積完成 3~5 個小工具，並整合至個人網站	實作	作業
7	中期整合與優化	將 CV、RSS 週報、小工具全部整合到個人網站	網站初步完整化	實作	作業
8	數據應用與迭代	GA 數據分析、根據數據優化網站與工具	用數據改善作品	討論實作	作業
9	氛圍優化與互動加強	視覺氛圍統一、整體體驗精煉	提升網站與工具的使用感受	討論實作	作業
10	最終專案 polish 與反思	專案調整、反思報告撰寫	完成高品質個人網站與工具組合	實作	作業
11	彈性週	最後調整與技術支援成果展示會 + 分享 + 課程回饋	完整個人網站、口頭分享、最終反思報告	實作	作業

彈性教學週活動規劃

序
No.

實施期間
Period

實施方式
Content

教學說明
Teaching instructions

彈性教學評量方式
Evaluation

備註
Notes

教學要點概述：
1.自編教材 Handout by Instructor：
■ 1-1.簡報 Slides
□ 1-2.影音教材 Videos
□ 1-3.教具 Teaching Aids
□ 1-4.教科書 Textbook
□ 1-5.其他 Other
□ 2.自編評量工具/量表 Educational Assessment
□ 3.教科書作者提供 Textbook

成績考核 Performance Evaluation：作業：20% 上機測驗：10% 問答：10% 報告：10% 專題：15% 出席：10% 其他評量：15% 彈性教學：10%

教學資源(Teaching Resources)：
□ 教材電子檔(Soft Copy of the Handout or the Textbook)
□ 課程網站(Website)