Contents
使用線框圖、樣式指南、Photoshop、Zeplin 和 Invision 應用程式,讓您的網頁設計流程簡單有效
要求
對 Adobe Photoshop CC 有很好的基礎
從這 7.5 小時的課程,你會學到
- 學習響應式網頁 ( RWD,Responsive Web Design ) 設計專案的專業過程
- 了解要從客戶端獲取專案詳細資料要問什麼問題
- 設計簡介 ( Design Brief ) 應該包含哪些內容?
- 學習所有在專案中建立和使用心情板 ( Mood Boards ) 的一切須知
- 了解創想 ( IDEATION ) 過程(早期草圖)
- 設計和開發不同螢幕(如PC、平板電腦或智能手機)的網格 (Grid ) 系統
- 使用 Balsamiq Mockups 設計線框圖 ( Wireframes )
- 如何設置響應式網頁設計的網格 (Grids ) 和指南 ( Guides )
- 了解開發人員的思維-“開發人員如何將你的設計編寫為程式碼?”
- 如何為開發人員設計和發展程式設計的風格指南 (Style Guide )
- 建構原型以顯示網站流量和互動
- 使用 Zeplin 創建線上風格指南
- 如何為開發人員做設計
- 了解設計框架 ( frameworks ),如原子設計 (Atomic Design ) 或內容 (Content ) 首要方法
- 學習如 Zeplin、Balsamiq Mockups 和 Invision App 等工具
說明
更新 ► 2020 年 10 月(添加了關於 Figma 和 Adobe XD 的新講座)
通過此網頁設計課程,使您的網頁設計過程變得簡單、有效且輕鬆
過去幾年來,傳統 Web 設計師的工作發生了巨大變化。為每個螢幕設計(響應式網頁設計)並不容易。像這樣的問題會讓每位年輕的網頁設計師一直思考,像如何改變佈局?如何為響應式網頁設計設置網格?哪些內容要隱藏和顯示?
現在於每個 Web 設計專案中,我們的設計師
- 收集專案需求(來自客戶和用戶)
- 草繪早期的想法
- 把那些想法以線框圖 (wireframes )表現
- 將線框圖轉換為模型 ( Mockup )
- 為開發人員準備規格和風格指南
- 創建原型以展示流程和互動
- 如何在 Photoshop 中設計網站的響應式視圖
- 通過改進您的網頁設計工作流程來節省時間
每個現代設計師在 Web 設計過程中使用超過 2 到 3 個工具。設計人員還需要經常與開發人員合作,解決所有遇到的問題。
所以在這個課程中,我將向你展示創建響應式網頁設計的現代流程,從收集客戶的信息和設計簡介到製作草圖、線框圖和原型,甚至開發人員的風格指南。
本課程將學習的工具包括
- Adobe Photoshop
- Balsamiq Mockups
- Figma
- Adobe XD
- Zeplin App
你將在本課程中觸及的設計框架
- Atomic Design framework
- 8-Point Grid System
最後我將向網頁設計師展示其他類似的線上應用程式,並比較其優缺點。
現在,如果你準備好學習現代網頁設計,並成為頂尖的 Web 設計師
現在就參加這課程吧 !
目標受眾
- Web 設技師
- UI 設技師
- Web 開發者
- 圖像設計師
- 創意總監
- 專案經理
- 前端開發者
關於講師
Ahsan Pervaiz UI/UX 互動設計專家 + 自由工作者 ( 更多講師主講課程介紹 )
8年前我開始了自由工作工作的生涯,自己學習了一切,我從頭開始,最終為INTEL、PANASONIC和可口可樂等500強企業工作。
在剛滿1年連續做UI設計,我在 DRIBBBLE 上獲得一席之地。
與可口可樂的藝術總監與來自英國的專案經理,讓我在短時間內學到了很多東西。
從應用圖標設計到應用UI設計,從線框(Wireframe) 、原型(Prototype) 到 模型(Mockup) 設計,我渴望從各個方面完善用戶界面。
我有多種才藝,曾獲得一枚金牌,獲得PANASONIC全國海報設計大賽,並贏得了許多著陸頁設計比賽。
與世界各地的客戶,大部分來自美國、澳大利亞、英國和阿拉伯聯合酋長國,合作。同時學習自由工作時如何應對客戶,以及如何跟他們展現你的作品。
雖然我6年前開始做UI設計師,但從2002年就開始使用 Photoshop。
我的最終目標是幫助更多人成為很棒的 UI設計師,並讓剛入門 UI設計領域的人更無痛、容易地學習。
- 點選這個✨優惠連結✨ ( NT390 起特價中 ) | Udemy 永久擁有課程 ( 在電腦瀏覽器登入,點選“優惠連結”後再回想要的課程介紹中點選“報名參加課程”即可取得 )
- Udemy 現在越來越多課程有中文字幕,請參考 Soft & Share 中文線上課程
- 手機上點選優惠連結看到的價格比電腦上看到的貴
- $代表當地貨幣, 如在台灣為 NT
- 點選”報名參加課程”有可能因瀏覽器 cookies 轉久一點或回報錯誤而無法連上,請稍等刷新或重新點選就會出現
報名參加課程




也許你會有興趣
- 更多 UI/UX 設計相關課程
- ★英語學習地圖 – 練好英文是最大的學習槓桿
- 如何找工作學習地圖 – 找工作不要靠運氣!
- 從 Soft & Share 各種社團頻道挑選你喜歡的加入
發表迴響