יש מיליון דרכים ליצור מצגת, אבל Figma הוא כלי לא מוערך עבורה. תכונת האב-טיפוס ב- Figma מאפשרת שפע של אפשרויות מעבר הניתנות להתאמה אישית. לא רק שהמעברים שלך יפתיעו את הקהל שלך, אלא שאתה יכול לשלב תוספים עבור פיזה נוסף ולשמור על מעורבות הקהל שלך, מה שיגרום לך להרגיש בטוח בכישוריך.
אנחנו הולכים להראות לך איך לעשות מצגת קטלנית באמצעות Figma; פשוט עקוב אחר המדריך הזה.
1. הגדר את מסגרת המצגת הראשונה שלך
לִפְתוֹחַ פיגמה ולחץ קובץ עיצוב חדש. לחץ על כלי מסגרת (ו) כדי לצייר את המסגרת שלך או לבחור מסגרת מוגדרת מראש בצד ימין באמצעות הַצָגָה > שקופית 16:9. אתה יכול ליצור תבנית מאסטר לחסוך זמן.
שנה את שם המסגרת שלך על ידי לחיצה כפולה על הכותרת הכחולה בצד שמאל למעלה. הגדר צבע רקע; אם כי, אתה תמיד יכול לשנות אותו מאוחר יותר על ידי הדגשת כל המסגרות ושינוי צבע המילוי.
2. הוסף את טקסט הכותרת
להשתמש ב כלי טקסט (ט) וכתוב את הכותרת שלך. השתמש בתיבות טקסט נפרדות לשורות נפרדות, עם מילה אחת או שתיים בלבד בכל שורה. הגדר את העדפות הטקסט שלך ב- טֶקסט תפריט בצד ימין. Figma משתמשת בפונטים של גוגל, אז אולי תרצו לדעת שילובי הגופנים הטובים ביותר של Google.
3. הוסף תמונה
אתה יכול השתמש בתצלום מלאי או צלם תמונה רלוונטית משלך. כדי להוסיף תמונה, צייר מלבן באמצעות כלי מלבן (ר). התמונה שלך תשב בצורה הזו.
לחץ על המלבן ועבור אל למלא ולחץ על ריבוע צבעוני. לאחר מכן לחץ מוצק > תמונה > בחר תמונה. מצא את התמונה שלך ולחץ לִפְתוֹחַ. רחף מעל התמונה כדי לחשוף 4 עיגולים לבנים. לחץ וגרור עיגול אחד פנימה כדי לעגל את פינות התמונה שלך.
סדרו את השכבות כך שהתמונה תהיה מאחור והטקסט יהיה על השכבה העליונה. ניתן לגרור את השכבות בחלונית השכבות או באמצעות גmd/Ctrl + [ לשלוח שכבה בחזרה או גmd/Ctrl + ] להביא שכבה קדימה.
4. צור את המעבר הראשון
המעבר הראשון יפתח את התמונה ויאפשר לטקסט הכותרת להחליק לתוך המסגרת. ראשית, שכפל את המסגרת הראשונה על ידי בחירתה והקשה גmd/Ctrl + D לשכפל אותו.
במסגרת השמאלית, הקטנת קנה המידה של התמונה על ידי הפחתת תכונות הגובה ב- ח קופסא לסביבות 150, משאיר חריץ אופקי של התמונה. יישר אותו למרכז על ידי בחירת שתי התמונות על פני המסגרות ולחיצה Option + V (מק) או Alt + V (חלונות).
כדי להשלים את מעבר התמונה, בחר את התמונה השמאלית. לאחר מכן שנה את אֲטִימוּת ל-0% בתפריט הימני בתיבה שליד מעבר תחת שכבה. זה יהפוך את התמונה לבלתי נראית לפני שהיא עוברת ותיפתח.
לחץ על תיבת הטקסט הראשונה והחזק מִשׁמֶרֶת. התחל לגרור, ואז גם החזק מקש רווח והמשך לגרור את הטקסט אל מחוץ למסגרת. זה נראה כאילו הוא נעלם פעם אחת מחוץ למסגרת. ללא הוספת מקש הרווח, המעבר הזה לא יעבוד, אבל אם תחזיק את מקש הרווח לפני גרירה, זה רק יזיז את המסגרת שלך.
עשה זאת שוב עבור תיבות הטקסט השניות או הבאות, אך גרור אותן עוד קצת שמאלה כדי להוסיף קצת גיוון במעבר. כשהטקסט עדיין נבחר, הפחיתו את אטימות השכבה ל-0% באותו אופן שעשיתם בעבר עבור התמונה.
כדי להגדיר את המעבר, עבור אל אב טיפוס. בחר את המסגרת השמאלית ולחץ על עיגול כחול המופיע במרכז הצד הימני של המסגרת. גרור אותו, כך שהקו יעבור לפריים השני שלך.
בתפריט הנפתח שאומר רֶגַע, בחר הנפשה חכמה. לאחר מכן שנה את התיבה עם סטוֹפֶּר עד 1000ms. זה יגדיר את המעבר שלך לקחת שנייה אחת מלחיצת העכבר. את ההגדרות האחרות יש להגדיר כברירת מחדל. ודא שאינך משנה את שמות כותרות המסגרת לאחר הגדרת מעבר, אחרת, הקבצים לא יתחברו.
לחץ על לְשַׂחֵק לחצן כדי לבדוק את המעבר שלך. חזור אל לְעַצֵב כדי להמשיך בעיצוב המצגת שלך.
5. הוסף עוד שקופיות
כדי לעבור משקופית 1 לשקופית 2, שכפל את השקף הימני ביותר (גmd/Ctrl + ד). במסגרת החדשה - שקופית 2 - הזז את תיבות הטקסט אל מחוץ למסגרת באמצעות הטכניקה הקודמת (מִשׁמֶרֶת + לִגרוֹר לאחר מכן מקש רווח לאחר שהתחלת לגרור). הזז תיבת טקסט אחת שמאלה והשנייה מימין למסגרת. הגדר את האטימות ל-0% עבור שניהם.
עבור התמונה, הגדל אותה והזז אותה מעט מחוץ למרכזה, ולאחר מכן הגדר את האטימות ל-0%. זה, למעשה, נותן לך קנבס ריק לשקופית השנייה שלך. אתה יכול להוסיף את התוכן על גבי הנכסים הבלתי נראים מהשקופית הקודמת.
הוסף תמונה גדולה למרכז המסגרת. כדי להוסיף כמה קישוטים על גבי התמונה שלך, השתמש ב-a תוסף Figma לקובצי GIF אוֹ הורד מדבקת GIF מ- Giphy וגרור אותו על גבי התמונה. בחר את התמונה הראשית שלך וכל GIF, וקבץ אותם יחד (גmd/Ctrl + ג), זה מבטיח ש-Smart Animate יפעל כראוי.
בחר את הקבוצה והעתק אותה (גmd/Ctrl + ג). לאחר מכן הדבק אותו על המסגרת של שקף 1 (גmd/Ctrl + V). הגדל אותו והגדר את האטימות ל-0%. לאחר מכן העבר את השכבה הזו לאחור (גmd/Ctrl + [). זה מבטיח מעבר חלק לשקופית הבאה.
לך ל אב טיפוס. בחר שקף 2 ולחץ על העיגול הכחול כדי לגרור אותו לשקופית 3. ברירת המחדל של Figma בתפריט האב-טיפוס היא להשתמש בהגדרות הקודמות, כך שכולן אמורות להיות מוגדרות בהתאם למעבר הקודם. חזור אל לְעַצֵב.
שכפל את השקף האחרון (גmd/Ctrl + D). שקופית זו תשתמש באותה תמונה כמו הקודמת, אך נשנה אותה לצד אחד של המסגרת. הזז את התמונה משמאל למסגרת על ידי גרירתה תוך כדי לחיצה מִשׁמֶרֶת. רחף על הקצה הימני של התמונה עד להופעת חיצים הפוכים, לחץ וגרור את הקצה הימני של התמונה לכיוון שמאל עד שתהיה מרוצה.
לך ל אב טיפוס ולקשר את שתי המסגרות יחד. ואז תחזור ל לְעַצֵב.
הוסף כותרת וטקסט גוף מימין לתמונה המוקטנת, וקבץ אותם יחד. העתק את קבוצת הטקסט והדבק אותה בשקופית הקודמת. לחץ וגרור את קבוצת הטקסט מימין למסגרת כמו קודם.
6. הוסף דגם
צור מודל; בדוק שלנו מדריך ליצירת מוקאפים באמצעות תוספים ב- Figma. הוסף מסגרת חדשה ולאחר מכן הדבק עליה את הדגם שלך. שנה את גודל הדגם כך שיתאים למסגרת.
העתק את הדגם והדבק אותו למסגרת הקודמת. שנה את גודלו כך שיתאים לחלק התמונה, ואז העבר אותו לחלק האחורי של השכבות והגדר את האטימות ל-0%. קשר את המסגרות פנימה אב טיפוס.
7. הוסף תוויות
שכפל את מסגרת הדגם. הוסף כותרת ותיאור כדי להסביר חלקים מהדגם שלך. קבץ את הטקסט יחד ושמו לו. אז את \ ה יכול \ ה ליצור מחוון זכוכית חלבית עבור נקודות הקליע והקווים שלך. קבץ יחד שורה אחת עם עיגול אחד. תאם את המחוון שלך עם מה שהוא מתאר והוסף את התיאור שלך לידו. קשר את המסגרות פנימה אב טיפוס.
שכפל את המסגרת והוסף מחוון נקודות נוסף עם מה שהיא מתארת. אב טיפוס זה שוב. שכפל כל פריים לכל נקודת תבליט, כך שכל נקודת תבליט עוברת לבד.
8. סיים את המצגת שלך
שכפל את השקף האחרון. כתוב מילה אחרונה או שתיים ומרכז אותה. העתק את הטקסט והדבק אותו בשקופית הקודמת.
הגדל את הטקסט על ידי לחיצה ק בזמן שינוי קנה המידה שלו - זה שומר על עיצוב הטקסט שלך תוך כדי גודלו. מקם את הטקסט שלך איפשהו ליד החלק העליון של הדגם ושלח את השכבה לחלק האחורי, מתחת לתמונה. הגדר את האטימות ל-0%. חזור לשקופית האחרונה שלך.
הזז את כל שאר האובייקטים מחוץ למסגרת באמצעות שיטת הגרירה. המעבר יחליק הכל החוצה לצדדים ולמעלה כשהטקסט יורד מלמעלה למטה ומתרחב. הקישור גולש פנימה אב טיפוס.
9. שתף את מצגת הפיגמה שלך
אתה יכול לגשת למצגת שלך בכל מקום שבו אתה יכול להיכנס לחשבון Figma שלך או לשתף את כתובת האתר עם אחרים, כדי שהם יוכלו לצפות מכל מקום. כדי להציג את המצגת הסופית שלך עם המעברים שלה, לחץ על לְשַׂחֵק לחצן ולהציג במצב מסך מלא.
אתה יכול גם לשמור את המסגרות כקובצי PDF, אם כי תאבד את המעברים המונפשים על ידי כך.
העלה רמה במצגות שלך עם Figma
לא רק שהמצגת הזו מינימליסטית, שלא תכריע את הקהל שלכם, אלא שהמעברים מקצועיים ונקיים. לא צריך מומחה UI/UX כדי להשתמש ב-Figma בצורה שתועיל למצגות שלך, לא משנה מה תפקידך בעבודה. הצג בביטחון, ותהיה מוצף בשאלות על האופן שבו המצגת שלך נעשתה.