figma設計

When starting a design project, a fast pace and multiple design iterations can easily lead to a cluttered mess. Taking the time in the beginning to build good organizational habits will save you time later. You’ll thank your past self when you don’t have to rename countless files and do the tidying the day before final handoff.

在開始設計項目時，快速的步伐和多次的設計迭代很容易導致混亂。 花時間開始建立良好的組織習慣將為您節省時間。 當您不必重命名無數文件并整理最后一次交接的前一天時，您將感謝您過去的時光。

Here are five tips that help me keep my files organized and easy to browse. No one likes inheriting a messy design file!

這里有五個提示，可以幫助我使文件井井有條，易于瀏覽。 沒有人喜歡繼承凌亂的設計文件！

1.為組件和層提供描述性名稱 (1. Give Components & Layers Descriptive Names)

Figma’s layer panel, located on the left side of the screen showcases all of your layers. It’s important to keep these logically ordered and descriptive!Figma的圖層面板位于屏幕左側，可顯示您的所有圖層。 保持這些邏輯順序和描述性很重要！

Keep your layer panel neat and ordered! Each frame, group, and component should have a descriptive name that tells you what it is and what it is for. For complex designs, it’s a real pain when you can’t immediately tell the difference between “Vector 21” and “Vector 22”.

保持圖層面板整潔有序！ 每個框架，組和組件均應具有描述性名稱，以告訴您它的含義和用途。 對于復雜的設計，當您無法立即分辨出“ Vector 21”和“ Vector 22”之間的區別時，這確實是一個痛苦。

If you like making a lot of groups, it can be helpful to order those groups in the order that they appear on your frame. For example, for one of my homepage designs, my largest groups represented large sections on the page, starting with the page’s header, and ending with its footer.

如果您喜歡創建許多組，則按照在框架上顯示的順序對這些組進行排序可能會有所幫助。 例如，對于我的一個首頁設計，我最大的組代表頁面上的大部分，從頁面的頁眉開始，以頁腳結束。

2.訂購相框/畫板 (2. Order Your Frames/Artboards)

Make sure your screens follow a logical progression! Especially if you are prototyping a user flow!確保您的屏幕遵循邏輯順序！ 尤其是在制作用戶流程原型時！

If you’ve spent any time on a project involving multiple pages, you know Figma files can get visually cluttered very quickly! If you are creating a user-flow for a prototype, ensure that your naming and numbering conventions are consistent.

如果您在涉及多個頁面的項目上花費了任何時間，就會知道Figma文件很快就會變得視覺混亂！ 如果要為原型創建用戶流，請確保命名和編號約定一致。

For prototypes with multiple flows, it can be helpful to separate each user-flow into its own group. From there, consistently follow a right-to-left or top-to-bottom ordering convention.

對于具有多個流程的原型，將每個用戶流程分成自己的組可能會有幫助。 從那里開始，始終遵循從右到左或從上到下的排序約定。

3.使用頁面保持整潔 (3. Use Pages to Keep Things Tidy)

Figma’s pages panel, located above the later panel helps group relevant screens together in named categories.Figma的頁面面板位于后面的面板上方，可幫助將相關屏幕按命名類別分組。

There’s no need to crowd a single page of your Figma file. If you can group user-flows, iteration, or components on separate pages it’s incredibly useful to do so. You can add or duplicate pages via the menus above the layer panel.

無需占用您的Figma文件的單個頁面。 如果您可以在單獨的頁面上對用戶流，迭代或組件進行分組，那么這樣做非常有用。 您可以通過圖層面板上方的菜單添加或復制頁面。

4.使用組件/符號 (4. Use Components/Symbols)

Figma.comFigma.com

If you have any repeatable elements in your design, like icons or buttons, build them out as components first! Rather than painstakingly tweaking every single copy of a design element, using symbols ensures that any change to your original element will be transferred to all copies of it. This is a tremendous time-saver and the organized use of components is crucial for any kind of handoff.

如果設計中有任何可重復的元素(例如圖標或按鈕)，請首先將它們構建為組件！ 使用符號可以確保對原始元素的任何更改都將轉移到設計元素的所有副本中，而不用費力地調整設計元素的每個副本。 這可以節省大量時間，并且有組織地使用組件對于任何類型的切換都是至關重要的。

5.利用樣式 (5. Make Use of Styles)

Figma’s style panel is located on the right side of your screen, under the “Design Tab”Figma的樣式面板位于屏幕的右側，“設計選項卡”下

Much like components, text, color, and effect styles are crucial time-savers that are worth every second it takes to set up. Styles are standard configurations for your elements and will save you from having to manually select the details for each element you make.

與組件，文本，顏色和效果樣式非常相似，它們是至關重要的節省時間，值得花費每一秒鐘來進行設置。 樣式是元素的標準配置，它將使您不必手動選擇制作的每個元素的詳細信息。

What’s also special about styles is that like components, changing the core style will affect all instances of the style. If you need a deeper blue for your pressed button state, changing your “Button Pressed” color style will save you the trouble of manually updating it throughout your whole design.

樣式的特殊之處還在于，與組件一樣，更改核心樣式將影響樣式的所有實例。 如果您需要更深的藍色來表示按下的按鈕狀態，則更改“ Button Pressed”的顏色樣式將避免在整個設計中手動更新它的麻煩。

These are the quickest and most useful tips I’ve learned throughout my time as a designer. Putting in the effort early exponentially saves you time near the end of your project!

這些是我在作為設計師的整個過程中學到的最快，最有用的技巧。 盡早投入大量精力可以節省您接近項目結束的時間！

You can learn more and read more in-depth organizational advice from Figma’s Guides & Practices section on their website.

您可以從Figma網站上的“指南和實踐”部分了解更多信息并深入的組織建議。

UX Para Minas Pretas (UX For Black Women), a Brazilian organization focused on promoting equity of Black women in the tech industry through initiatives of action, empowerment, and knowledge sharing. Silence against systemic racism is not an option. Build the design community you believe in.UX Para Minas Pretas (UX For Black Women)，這是一個巴西組織，致力于通過采取行動，賦權和知識共享的舉措來促進科技行業中的黑人女性平等。 對系統性種族主義保持沉默是不可行的。 建立您相信的設計社區。

翻譯自: https://uxdesign.cc/5-figma-tips-from-a-reformed-messy-designer-95b232bd58d4

figma設計

總結

以上是生活随笔為你收集整理的figma设计_5位来自杂乱无章的设计师的Figma技巧的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。