感謝您提交詢問!我們的一位團隊成員將在短時間內與您聯繫。
感謝您提交預訂!我們的一位團隊成員將在短時間內與您聯繫。
課程時長 14 時間:
課程簡介
前端生成式 AI 簡介
- 軟體開發中的生成式 AI 是什麼?
- 工具概覽:ChatGPT、GitHub Copilot、Codeium 等。
- AI 在 UI 開發中的優勢與限制
基於提示詞的 UI 生成
- 撰寫用於 HTML 結構與元件的提示詞
- 使用 AI 生成與修改 CSS 樣式
- 利用 AI 在 JavaScript 中搭建互動元素框架
使用生成式工具進行版面原型設計
- 建構登陸頁面與多區塊版面配置
- 響應式設計提示詞(Flexbox、Grid)
- 在 CodePen 或類似工具中預覽與測試
元件化與重用性
- 生成可重用的 UI 元件(按鈕、卡片、表單)
- 借助 AI 創建元件庫與設計系統
- 在流行框架中使用 AI(React、Vue、Tailwind)
AI 輔助的程式碼審查與除錯
- 使用大型語言模型(LLMs)修復版面佈局錯誤與無障礙性問題
- 最佳化 HTML/CSS/JS 程式碼效能
- 透過 AI 提示詞解釋錯誤並建議修復方案
協作設計與內容生成
- 使用 AI 生成虛擬內容、文案與佔位符
- 與設計師合作共同創建線框圖與樣式
- 將 AI 生成的構想輸出為可用的 HTML 範本
專案:建立 AI 輔助架構的網頁應用
- 基於業務提示詞設計 UI
- 使用 AI 建構元件與互動功能
- 潤飾、測試並展示原型
總結與後續步驟
最低要求
- 對 HTML、CSS 和 JavaScript 具備基礎理解
- 熟悉前端框架或設計系統
- 有興趣將 AI 應用於加速 UI/UX 工作流程
目標受眾
- 前端開發人員
- UX 工程師
- 網頁設計師與創意技術專家
客戶評論 (1)
我獲得了關於Python中Streamlit庫的知識,我肯定會嘗試使用它來改進我們團隊中基於R Shiny開發的apps。
Michal Maj - XL Catlin Services SE (AXA XL)
課程 - GitHub Copilot for Developers
機器翻譯