線上課程|不小心就學會!用 UI 設計方法製作網站
商品描述
Hahow 好學校|線上課程📖
此商品屬「例外商品類別」,不適用七天鑑賞期法規非以有形媒介提供之數位內容或一經提供即為完成之線上服務,經消費者事先同意始提供
📍課程序號發送及兌換詳情請見賣場介紹
課程資訊
【 課程名稱 】:不小心就學會!用 UI 設計方法製作網站
【 課程簡介 】
這堂線上課程設計給完全無基礎的朋友,一起領略設計的美好,讓設計網站變成下班後的小興趣,並且能透過系列教學熟稔從 0 到 1 的網站設計開發流程,可以藉此展開「Digital Product 數位產品」的設計技能!
【 課程大綱 】
章節一:現代網站的構成
單元 1 - 序:課程使用說明
單元 2 - 網站的誕生與發展簡史
單元 3 - 近代網頁設計的十年趨勢
單元 4 - 設計與開發網站的流程
單元 5 - UI 設計師的角色定位
單元 6 - UI 設計師該點的技能樹分析
單元 7 - UI 設計軟體的選擇與介紹
章節二:Adobe Xd 設計軟體入門
單元 1 - 認識 Adobe Xd 軟體介面(設計篇)
單元 2 - 認識 Adobe Xd 軟體介面(原型、協作篇)
單元 3 - 設計師私藏的素材資源
章節三:用 UI 設計思維設計網頁
單元 1 - 先別急著打開設計軟體
單元 2 - (小作業)網頁的受眾、內容、格式
單元 3 - 關於網頁排版的潛規則|判讀性|
單元 4 - 關於網頁排版的潛規則|視認性|
單元 5 - 關於網頁排版的潛規則|可讀性|
單元 6 - 用 Adobe Xd 設計網頁
章節四:用 Webflow 架設網頁
單元 1 - 初探 Webflow 網站與註冊帳號
單元 2 - Webflow 介面一覽
單元 3 - 關於前端程式語言
單元 4 - 容器(Section, Container, Div)
單元 5 - 文字(Heading, Paragraph, Text Block)
單元 6 - 置入圖片(Image)
單元 7 - 按鈕(Button)
單元 8 - 卡片式設計(Link Block)
單元 9 - 選單(Navbar)
單元 10 - 邊界間距(Padding & Margin)
單元 11 - 內建模組(Prebuilt layouts)
單元 12 - 發佈網站與付費方案
章節五:手把手帶你設計網站與實作
單元 1 - 設計公司品牌形象網頁
單元 2 - 製作設計師作品集網站
單元 3 - 架設個人自媒體部落格
【 老師介紹 】:林育正 Riven
數位遊牧型態的設計師,習慣邊旅行邊工作的生活,逐網路、插座與咖啡而居。
【 需要準備的工具/軟體 】
準備一台電腦(Windows 或 macOS 等作業系統都可)
設計軟體 Adobe Xd(可由 Adobe 網站註冊並下載使用,免費;唯日後需更多專案儲存空間時需付費)
軟體安裝環境需求請見:https://helpx.adobe.com/tw/xd/user-guide.html/tw/xd/system-requirements.ug.html
Webflow 網站帳號(教學過程會引導申請,可免費使用,唯日後若需部分進階功能需付費)
【 需要具備的背景知識 】
不用需要任何設計或開發基礎,沒用過任何電腦繪圖軟體或寫過程式都沒問題;
適合沒有 UI 設計與網站架設基礎的同學。
【 上完課後,學生可以學到並做出的東西 】
- 一次學會 Adobe Xd 與 Webflow 網站設計與開發軟體
- 靠自己的雙手設計網頁 UI 並親自製作成網站
- 在過程中理解 UI 設計流程與基本網站架構觀念
- 藉此培養對於數位產品的世界觀,發展之後在設計與開發上的技能
【 哪些人適合這堂課?】
1. 想轉職成為 UI 設計師卻不知道該怎麼開始。
2. 想學習網頁設計與架設,剛好遇見這堂課。
3. 早就想弄一個自己的網頁,但遲遲還沒出手。
4. 曾經自學過架設網站,但發現太複雜直接放棄。
5. 有上網自學過架站,但做出來的網站不太好看⋯。