Udemy線上課程 UI 設計入門：畫出有程式邏輯的設計稿 講師:卡斯伯 六角學院 影音教學 中文發音 繁體中文版(DVD版)
這門線上課程將會帶你完整跑過一次設計流程，讓你了解在每個流程當中需要產出什麼樣的文件或內容。
課程還會提供常見的排版版型，並且運用一些設計準則讓排版更加靈活。
此外更透過原子設計與 Google Material Design 等設計規範來介紹 UI 元件的正確繪製觀念，並會對應程式碼的撰寫方式，讓你繪製出有程式邏輯的設計稿，與工程師的協作更加流暢。
這門線上課程最後還規劃了一個電商網站的最終作業，讓你不用擔心只學到理論卻沒有實作作品！
01 介紹
001 六角學院線上學員社團.html
002 課程介紹.mp4
003 免費作業上傳空間.html
02 基本概念
004 先來聊聊什麼是 UI 設計.mp4
005 開發流程與設計思考.mp4
006 介面設計相關的設計師.mp4
007 初學者必看的設計規範.mp4
03 設計流程_IA_Logic flow_Wireframe
008 設計流程簡介.mp4
009 IA 資訊架構.mp4
010 Functional Map 功能地圖.mp4
011 Logic Flow 操作邏輯流程.mp4
012 Wireframe 線框稿.mp4
04 設計流程_設計精稿與標註文件
013 Grid System 網格系統.mp4
014 Atomic Design 原子設計.mp4
05 從原子設計學習介面的常見元件
015 Buttons 按鈕.mp4
016 States 物件狀態.mp4
017 Input 輸入格.mp4
018 Radio Buttons & Checkbox 單選按鈕與複選框.mp4
019 Links 連結.mp4
020 Icon 圖示.mp4
021 Text 文字.mp4
022 Color 色彩.mp4
023 設計師常會忽略的通用設計（Accessibility）.mp4
024 Practice-Accessibility.zip
024 【小練習】挑選達到 AA 級的色彩.html
06 原子設計第二階段：分子
025 Navigation 導覽元件.mp4
026 Accordions 折疊面板.mp4
027 Tooltips 提示工具.mp4
028 Card 卡片.mp4
029 Modal 互動視窗.mp4
030 Alert 警告訊息.mp4
031 Data Table 資料表.mp4
032 Form 表單.mp4
033 C.R.A.P. 四個幫助你優化介面的設計準則.mp4
034 Homework-Form.zip
034 【章節作業】換你試試看：優化表單設計.html
07 原子設計第三階段：組織
035 Header 頁首.mp4
036 Footer 頁尾.mp4
037 運用常見的介面版型排出好設計.mp4
08 原子設計第四階段：模板
001 扭矩與加速性能 Torque and acceleration performance.txt
038 Templates 模板.mp4
039 如何做出高轉換的著陸頁（Landing Page）.mp4
040 行動版的介面優化：響應式排版（RWD）.mp4
041 透過頁面的六種狀態提升使用者體驗.mp4
042 Homework-Sections-Landing-Page.zip
042 【章節作業】透過模板排出一個響應式登陸頁.html
09 原子設計第五階段：頁面
043 Pages 頁面.mp4
044 教你打造最流行的深色模式（Dark Theme）.mp4
045 Practice-Dark-Theme.zip
045 【小練習】套用深色模式.html
10 與工程師協作的必要文件
046 一定要做設計規範嗎？.mp4
047 UI-Kit-Wireframe.zip
047 【免費資源】Wireframe UI Kit.html
048 切圖命名與格式.mp4
049 Spec 設計標注檔.mp4
11 設計流程_Prototype 高擬真原型製作
050 原型設計的種類與技巧.mp4
051 【章節作業】製作你的第一份設計精稿-1.mp4
052 【章節作業】製作你的第一份設計精稿-2.html
12 情境模擬：工程師現身說法（feat. 六角學院校長洧杰）
053 Ｑ1：繪製的設計稿被說功能太難做不出來.mp4
054 Ｑ2：如何協助設計師提供可執行的設計稿.mp4
055 Ｑ3：如何跟工程師溝通有互動效果的介面.mp4
056 Ｑ4：工程師對間距等設計細節不太在意.mp4
057 Ｑ5：設計師需要學前端技術嗎？.mp4
058 Ｑ6：專案協作上的常見問題.mp4
13 實戰演練：電商網站設計專案
001 掌握平台推薦機制與規則，不走彎路不入坑.txt
059 【小提醒】最終作業的設計細節.html
060 電商網站的設計細節.mp4
061 【小練習】主題發想.html
062 步驟_User Story Mapping 使用者故事對照.mp4
063 【小練習】撰寫使用者故事對照.html
064 步驟_Flow Chart 流程圖.mp4
065 flow-chart-example.drawio.zip
065 【小練習】新增功能流程.html
066 步驟_UI Flow 介面流程圖.mp4
067 ui-flow-example.drawio.zip
067 【階段作業】接續完成 UI Flow.html
068 步驟_Wireframe 線框稿.mp4
069 【階段作業】繪製響應式線框稿.html
070 步驟_Mockup 設計精稿.mp4
071 【階段作業】完成設計精稿.html
072 步驟_Prototype 原型設計.mp4
073 【階段作業】製作高擬真原型.html
074 步驟_Behance 作品整理技巧.mp4
075 【最終作業】透過 _Behance 展示你的作品.html
14 前往職場：設計師面試技巧
076 【小提醒】共筆文件.html
077 設計師這樣面試就對了 (上).html
078 設計師這樣面試就對了 (下).html
|
|
您現在的位置：
專業知識教學
