עולם תוכנות העיצוב הגרפי הוא עצום ויש בו תחרות רבה. Figma הוא כלי עיצוב אחד הדוהר למקום הראשון עבור מעצבי UX/UI ברחבי העולם. אבל מה אתה יודע על הכלי האינטואיטיבי הזה?
למרות שזה פשוט, יש גם עקומת למידה אם אתה רגיל לכלי עיצוב אחרים. בואו נסתכל על Figma וכיצד להשתמש בה. ברוכים הבאים ל- Figma 101.
מה זה Figma?
אם עבדת כמעצב גרפי או מעצב אתרים בשנים האחרונות, סביר להניח ששמעת על Figma. אולי אפילו השתמשת בזה.
Figma הוא כלי עיצוב והוא הפך בהתמדה למועדף על מעצבים דיגיטליים, ממריא מעל אפשרויות כמו Adobe XD, Adobe Photoshop ו-Sketch, לעיצוב אתרים ועוד. עם זאת, מאז אדובי רכשה את Figma ב-2022, עשויים להיות כמה שינויים שיערבו מחדש את ה-Leaderboard.
יש שימושים רבים עבור Figma. הוא משמש בעיקר לעיצוב דיגיטלי, ואי אפשר לעצב ב-CMYK להדפסה. חלק מהשימושים העיקריים של Figma כוללים:
- יצירת אב טיפוס
- עיצוב UX/UI
- עיצוב אפליקציה
- עיצוב אתרים
- עיצוב מצגת
אתה יכול השתמש בתוספים מדגם Figma לעזור להשוויץ בעיצובים שלך,
המרת דפי אינטרנט אמיתיים לעיצובי Figma באמצעות תוספים, ואפילו ליצור תבניות מאסטר לעיצובי Figma כדי לחסוך לך זמן בסוגי עיצוב שחוזרים על עצמם.כמה עולה Figma?
אתה יכול ליצור חשבון Figma בחינם ב- אתר Figma או על ידי הורדת ה אפליקציית Figma. חשבון חינמי מספק פונקציונליות לכל היבטי העיצוב של האפליקציה. אתה יכול לעצב עם Figma ו FigJam - כלי שיתוף הפעולה של Figma.
אם אתה משתמש ב-Figma כתחביב או כפרילנסר יחיד, גרסת Free Forever היא כמעט מושלמת. עדיין יש לך גישה לכל התוספים, אתה יכול להזמין משתפי פעולה ללא הגבלה, להשתמש בקבצים אישיים ללא הגבלה ולהשתמש ב- Figma מכל הפלטפורמות.
בעוד שהגרסה החינמית של Figma מציעה די והותר לכל מעצב סטנדרטי, מנוי של Figma Professional מאפשר לך לעשות זאת הזמינו חברים לצוות, עבדו מספריות צוות, יש גישה ללא הגבלה לקבצי Figma והיסטוריית גרסאות, ועוד, תמורת 12 דולר לחודש לחודש. עוֹרֵך. אם אתה סטודנט או מחנך, אתה יכול לקבל את Figma Professional בחינם.
כיצד להשתמש ב- Figma: היסודות
בין אם אתה משתמש באפליקציית Figma או בגרסת הדפדפן, אתה יכול לעקוב בקלות.
כאשר אתה פותח את Figma, יוצגו בפניך אפשרויות להתחיל קובץ Figma חדש, קובץ FigJam חדש, או לייבא קובץ שנוצר בתוכנה אחרת, כמו Sketch או Adobe XD. אם השתמשת בעבר ב-Figma, תראה גם את הפרויקטים הקודמים של Figma שתוכל לפתוח ולעבוד עליהם.
ניווט בסביבת העבודה של Figma
פתיחת קובץ חדש נראית בתחילה חסרת השראה. בניגוד לתוכניות עיצוב רבות אחרות, אתה לא מתחיל עם משטח היצירה או הקנבס שלך, אלא דף עיצוב ריק לחלוטין. אבל עם מוח מלא בהשראה, זה לא יישאר חלל ריק לאורך זמן.
התפריט האופקי השמאלי העליון מתחיל ב- תפריט ראשי סמל - הלוגו של Figma. בחירת ה תפריט ראשי, אתה יכול לנווט אל הקבצים האחרים שלך, פעולות מהירות של Figma, אפשרויות קבצים טיפוסיות וגישה לתוספים, ווידג'טים וספריות.
לאחר מכן, תמצא את מהלך \ לזוז \ לעבור כלי (V), עם ה סוּלָם כלי (ק) שוכן מתחתיו. כלים אלה מיועדים להזזת אלמנטים או קנה מידה של חלקים מהעיצוב שלך למעלה או למטה. ומימין לכלים אלה, תראה את כלי האזור, מִסגֶרֶת (ו), סָעִיף, ו פרוסה, שוכנים יחד.
ב-Figma, מסגרת היא מה שתוכניות אחרות עשויות לכנות משטח יצירה או קנבס. בחר מִסגֶרֶת לצייר קנבס בגודל מותאם אישית. כאשר נבחר, התפריט הימני יציג אפשרויות מסגרת מוכנות מראש עבור גדלי מכשירים נפוצים: סמארטפונים, טאבלטים, שולחנות עבודה, שעונים חכמים, מצגות ואפשרויות מדיה חברתית. אתה יכול גם ללחוץ ולגרור את המסגרת שלך ישירות כדי להפוך אותה לכל גודל מותאם אישית.
חזרה לתפריט השמאלי העליון, מימין לכלי האזור נמצאים צוּרָה כלים, עֵט כלים, ואת טֶקסט כְּלִי. לאחר מכן, משאבים-רכיבים, תוספים, ו ווידג'טים-וה יד כלי להזזת הקובץ שלך. ולבסוף, ה הערות כלי נהדר להערת הערות ולשיתוף פעולה עם חברי הצוות.
תפריט העיצוב של Figma
עם מסגרת ערוכה, בחירת הכותרת שלה מפעילה את המסגרת, מוכנה לעיצוב. התפריט הימני מציג כותרות עבור לְעַצֵב, אב טיפוס, ו לִבדוֹק. כפי שהשם מרמז, אפשרות העיצוב היא התפריט שבו תשתמש כדי לעצב את האלמנטים על המסגרת שלך.
בעוד שתפריט העיצוב הראשוני הוא מעט פשטני, ככל שאתה מוסיף אלמנטים נוספים לעיצוב שלך, אפשרויות התפריט מתפתחות. בהתחלה, התפריט פועל מלמעלה למטה עם כלי יישור, כלי גודל, פריסה אוטומטית, רשת פריסה, שִׁכבָה, למלא, שבץ, אפקטים, ו יְצוּא. חלק מהם ממוזערים כברירת מחדל אך על ידי לחיצה על + לחתום, אתה יכול לפתוח כל תפריט או לחיצה – כדי למזער אותו.
לאחר שציירת את המסגרת הראשית לפרויקט, תוכל להשתמש בכלי Shape או בכלי Pen כדי לצייר צורות או הוסף מצייני מיקום של תמונה, ותוכל להוסיף טקסט באמצעות כלי הטקסט בדרכים שכנראה עשית בדרכים אחרות תוֹכנָה.
ברגע שיש לך צורות או טקסט על המסגרת, השתמש באפשרויות התפריט השונות ביד ימין כדי לערוך ולעצב את האלמנטים האלה. ה שִׁכבָה התפריט מציע מצבי אטימות ומיזוג; עם למלא אתה יכול להוסיף צבע או להוסיף תמונות עם כמה תכונות עריכה כמו חשיפה, בניגוד, טֶמפֶּרָטוּרָה, ועוד.
ככל שאתה בונה אלמנטים נוספים בפרויקט שלך, השכבות ייווצרו בצד שמאל שכבות תפריט ליד נכסים לשונית. אתה יכול ללחוץ פעמיים על כותרת שכבה כדי למצוא את האלמנט, ולהיפך; אתה יכול ללחוץ פעמיים על אלמנט עיצובי כדי למצוא את השכבה המודגשת. לחיצה כפולה על כותרות מאפשרת לשנות את שמם לארגון מיטבי.
תפריט האב-טיפוס של Figma
מימין ל- לְעַצֵב אפשרות התפריט היא אב טיפוס תַפרִיט. לאחר שסיימתם את ההיבטים הוויזואליים של העיצוב שלכם והגדרתם תיבות תמונה וטקסט לאן הם צריכים להגיע, תוכלו להשתמש בכלי האב-טיפוס כדי להוסיף אנימציות ומעברים לעיצובים שלכם.
ה אב טיפוס תפריט מאפשר לך לחבר מסגרות או רכיבים יחד כמעברים. אתה יכול לבחור באיזה סדר וכיצד כל מסגרת עוברת לאחרת.
זה עובד נהדר אם אתה ביצוע מצגת Figma הנפשה משקופית אחת לאחרת, אבל הכלי גם מאפשר לך במומחיות לדמיין אנימציות עבור כפתורים או תפריטים לעיצוב אפליקציות ואתרים. אתה יכול להוסיף מעברים מרובים לכל דף עבור כל הדברים השונים, כדי שתוכל לראות כיצד המשתמשים היו מעורבים באתר שלך כשהוא פעיל.
בעוד השימוש ב-Figma לעיצוב אתר אינו זהה ליצירת אתר חי, אתה יכול למסור את ה-Figma שלך עיצוב לצוות המפתחים שלך שיוכל ליצור מחדש את אינטראקציות האב-טיפוס שלך כעיצובי אנימציה מהחיים האמיתיים שלך אתר אינטרנט. זה אומר שאתה יכול לעבור מדף לדף מקליקים, זמן או אינטראקציות אחרות.
תחילת העבודה עם Figma היא קלה
כעת אתה יודע כיצד לנווט בפריסת Figma וכיצד פועלים כלי העיצוב והאב-טיפוס הבסיסיים. מכיוון ש-Figma כל כך נגישה, הגיע הזמן ללכת ולהתעסק עם כלי העיצוב הזה ולראות מה אתה יכול ליצור.
