在這個系列中,將會深入探討如何透過 Figma 實現設計與開發的協作。我們將從淺至深,從小元件到最終實現完稿,一步步地演示如何利用 Figma 工具,促進設計師與工程師們的合作。
在設計與前端開發的協作過程中,常常會面臨諸多挑戰,像是如何確保設計師與工程師之間的理解一致、設計交付的準確性以及在開發過程中發現問題時的及時應對。隨著市面上出現...
Figma 是由 Dylan Field 和 Evan Wallace 在解決設計師日常痛點的想法下創立的。原因是 Dylan 在實習時覺得常用的設計工具 Ad...
首先,Figma 帳號可免費取得! 《取得帳號》進入 https://www.figma.com/ 後,點擊右上角的 ”Get Started for free...
讓我們開始來認識 Figma 的介面吧! 介面認識 註冊完帳號後,便可以開始使用 Figma 了!,網頁版(圖一)和 App 版(圖二)長的基本一樣(圖一:Fi...
上一章節先簡單介紹過開始新檔案的操作介面,今天來瞧瞧 Figma 首頁有些什麼功能吧! 首頁 左側區域的功能區(如下圖): (由上至下介紹) 點擊最上方 “...
在過去合作的經驗中,發現到對於從來沒有接觸過電腦繪圖軟體的工程師們來說,第一次使用 Figma 其實會滿不知所措的。接下來將會講解一些基本操作和觀念,有興趣的讀...
介紹完首頁和(分享的)檔案管理規則後,接下來將進入 Figma 基礎介面的介紹,其實 Figma 的介面和常見的設計軟體介面差異不大,若是有 Sketch 或...
工具列(上) 這一列有許多重要的基礎工具和功能按鈕,本章將依序介紹左側工具區: 移動工具 (Move Tools):包含 Move 移動工具和 Scale...
昨天介紹了基本工具欄,接下來將聊聊中間和右側的一些按鈕中間的部分的工具需要先在畫布區產生任一個物件(可以是 Frame、Text、Group 或插入的圖片等)並...
今天要介紹滿重要的頁面選單和圖層區,我們通常會運用這個部分來管理設計畫面和資產。 圖層 Layers 和資產 Assets 圖層 Layers 頂部可以切換圖...