如何用FIgma製作個人作品集UX/UI教學

閱讀時間約 1 分鐘
製作個人作品集有很多方法,Figma是一個免費又支援很多其他套件的工具,你可以用它來製作許多用途:
  • 創意發想 (Ideation)
  • 草稿 (Sketch)
  • 原型 (Prototyping)
  • 線框圖 (Wireframe)
  • 視覺圖 (Muck up)
  • UX/UI 設計在網站和手機
以下展示如何用Figma工具製作一個個人作品集(Pofolio)希望能幫助大家初步學習

影片教學

總結

Figma 是一個很好的團隊溝通工具,可以跟工程師、其他設計師以及產品經理表達你的想法,你也可以在準備設計Muck up之前做Wireframe去確保大家的想法是否大致同方向

額外資源教學

如何用FIgma製作個人作品集教學 - https://vocus.cc/article/645c733dfd89780001ffe890
學習如何設計好產品 - 使用者經驗設計 | 易用性 | 通用設計 - https://vocus.cc/article/64637f74fd8978000175c0f8
前端教學架設TodoApp
學習如何用HMTL5和CSS3,跟JayLin一起做一個NFT卡片完整課程 - https://vocus.cc/article/64637f74fd8978000175c0f8

更多相關教學文章

為什麼會看到廣告
avatar-img
12會員
33內容數
設計 + 程式,是一個出版對設計和程式的學習影片和教學文章,目的是為了讓大家能加快學習最新技術以及設計相關題目去思考如何改變產品的設計體驗。 請追蹤JayLinXR獲得最新消息: https://www.youtube.com/@jaylinxr
留言0
查看全部
avatar-img
發表第一個留言支持創作者!
JayLinXR 的其他內容
學習易用性 (Usability)和通用設計(Accessibility) 區別
學習易用性 (Usability)和通用設計(Accessibility) 區別
你可能也想看
Google News 追蹤
想要輕鬆掌握UI/UX設計技巧,Figma教學資源來幫忙!這份中文教學,從基礎操作介面介紹,到進階設計功能教學,由淺入深,助你成為設計達人!新手老手都適用,別猶豫啦,快來一起探索Figma的強大功能,創造屬於你的精彩設計吧!
在設計產品的過程中,製作Wireframe設計稿是必不可少的重要環節。那究竟Wireframe是什麼?為什麼能幫設計師和產品經理將產品打造完善?讓我們一起深度解析Wireframe的關鍵要素和設計方法,還有專業的Wireframe線上工具推薦,幫你輕鬆完成Wireframe線框圖!
Thumbnail
本文分享了Aura Hsiao的作品集網站以及其經驗,介紹了透過Wix建立作品集網站的相關經驗,以及推薦了Netlify這個免費網站空間。
Thumbnail
這篇分享的是我自己在平面設計使用上覺得特別好用的5個Figma Plugin,包括Curve Text、Skew、Noise & Texture、Morph和Blobs等。分享適合初學者的設計工具,並附上了每個工具的安裝連結。
B 文組女生 如何善用 figma 和 GitHub 幸福課程 幸福教練黃老師 潮資訊媒體 文組女生可以透過以下方式善用 Figma 和 GitHub: #Figma Figma 是一款線上設計工具, 可用於製作網頁、應用程式、介面設計等。 文組女生可以使用 F
Thumbnail
設計師經常尋找可以提升工作效率和創意的資源。幸運的是,Figma社群總是樂於分享,這裡我們整理了一些免費的Figma檔案和設計資源,幫助你在App/ 網頁設計界面(UI)和呈現方面更上一層樓。
Thumbnail
Figma以其直觀的介面和強大的協作功能,迅速成為設計師和開發者首選的UI/UX App / 網頁設計工具之一。除了其高效的設計功能外,Figma的一大優勢在於其龐大的社區和用戶共享的免費資源。這些資源可以幫助設計師節省時間,並在創建高質量的設計方案時提供靈感。
Thumbnail
Figma,作為當今流行的在線界面設計工具,不僅在設計社區中擁有重要的地位,更因其協作和原型功能而廣受青睞。然而,除了傳統的UI/UX App 及網頁設計,一些創新者已經開始在這個平台上創造令人驚艷的遊戲。
Thumbnail
c文組女生 如何善用 figma 和 GitHub 幸福課程 幸福教練黃老師 潮資訊媒體 社群編輯 文組女生可以善用 Figma 和 GitHub 來提升團隊協作和專案管理的效率。以下是一些建議: #Figma: 設計協作: Figma 是一個協作性極強的設
portfolio 作品集怎麼做才好?有沒有吸引人的作品集模板?為你整理推薦 9 大免費專業的作品集網站,還有好用的網頁設計作品集範例,讓你簡單幾步學會製作自己的作品集!免費作品集網站也好處多多,幫你打造更能吸引客戶、開拓市場的portfolio!高性價比之選,千萬別錯過!
想要輕鬆掌握UI/UX設計技巧,Figma教學資源來幫忙!這份中文教學,從基礎操作介面介紹,到進階設計功能教學,由淺入深,助你成為設計達人!新手老手都適用,別猶豫啦,快來一起探索Figma的強大功能,創造屬於你的精彩設計吧!
在設計產品的過程中,製作Wireframe設計稿是必不可少的重要環節。那究竟Wireframe是什麼?為什麼能幫設計師和產品經理將產品打造完善?讓我們一起深度解析Wireframe的關鍵要素和設計方法,還有專業的Wireframe線上工具推薦,幫你輕鬆完成Wireframe線框圖!
Thumbnail
本文分享了Aura Hsiao的作品集網站以及其經驗,介紹了透過Wix建立作品集網站的相關經驗,以及推薦了Netlify這個免費網站空間。
Thumbnail
這篇分享的是我自己在平面設計使用上覺得特別好用的5個Figma Plugin,包括Curve Text、Skew、Noise & Texture、Morph和Blobs等。分享適合初學者的設計工具,並附上了每個工具的安裝連結。
B 文組女生 如何善用 figma 和 GitHub 幸福課程 幸福教練黃老師 潮資訊媒體 文組女生可以透過以下方式善用 Figma 和 GitHub: #Figma Figma 是一款線上設計工具, 可用於製作網頁、應用程式、介面設計等。 文組女生可以使用 F
Thumbnail
設計師經常尋找可以提升工作效率和創意的資源。幸運的是,Figma社群總是樂於分享,這裡我們整理了一些免費的Figma檔案和設計資源,幫助你在App/ 網頁設計界面(UI)和呈現方面更上一層樓。
Thumbnail
Figma以其直觀的介面和強大的協作功能,迅速成為設計師和開發者首選的UI/UX App / 網頁設計工具之一。除了其高效的設計功能外,Figma的一大優勢在於其龐大的社區和用戶共享的免費資源。這些資源可以幫助設計師節省時間,並在創建高質量的設計方案時提供靈感。
Thumbnail
Figma,作為當今流行的在線界面設計工具,不僅在設計社區中擁有重要的地位,更因其協作和原型功能而廣受青睞。然而,除了傳統的UI/UX App 及網頁設計,一些創新者已經開始在這個平台上創造令人驚艷的遊戲。
Thumbnail
c文組女生 如何善用 figma 和 GitHub 幸福課程 幸福教練黃老師 潮資訊媒體 社群編輯 文組女生可以善用 Figma 和 GitHub 來提升團隊協作和專案管理的效率。以下是一些建議: #Figma: 設計協作: Figma 是一個協作性極強的設
portfolio 作品集怎麼做才好?有沒有吸引人的作品集模板?為你整理推薦 9 大免費專業的作品集網站,還有好用的網頁設計作品集範例,讓你簡單幾步學會製作自己的作品集!免費作品集網站也好處多多,幫你打造更能吸引客戶、開拓市場的portfolio!高性價比之選,千萬別錯過!