שם השיעור: תחילת הדרך עם Figma
אין לכם גישה לתוכן זה
לקבלת גישה לשיעור זה, יש לבחור מסלול מתאים ולהירשם תחילה
תוכן הקורס
מודול: בניית דף הנחיתה "קלין פרמייר"
- CSS היכרות ושימוש ראשון (27:37)
- טמפלייטים (28:48)
- יצירת Header (27:23)
- יצירת Footer (27:45)
- שימוש בקונטיינרים (27:03)
- תחילת הדרך עם Figma (27:02)
- סיום הHero Section (27:26)
- סיום סקשן "השירותים שלנו" (27:18)
- סקשנים למה אנחנו ושירותים (27:24)
- סקשנים בחרו בשירותים וצוות (27:28)
- סקשן המלצות (31:43)
- סקשן יצירת קשר (28:23)
- התאמה למובייל (27:01)
- הנפשות/אנימציות (27:20)
- דפים כלליים (28:18)
- חיבור לינקים (27:06)
- בדיקות כלליות (28:14)
- בדיקת הטופס (27:21)
מודול: הגדרות גלובליות
- אלמנטור – ההתחלה (28:26)
- זהות האתר ופריסת הדף (27:00)
- מה זה HEX ומה זה RGBA (28:35)
- תבנית עיצוב (26:58)
- פונטים וצבעים גלובליים (27:43)
מודול: טיפים וטריקים
- ניהול האלמנטים (27:15)
- היסטוריית העבודה (27:32)
- טעינת ספריות ומבנה הקישורים (26:48)
- פיטשרים באלמנטור (27:22)
- יחידות מידה (27:02)
- Compressimage.io (29:21)
- Recaptcha V3 & Maspik (29:11)
נו..? איך היה השיעור?
אחח חבל.. אם היית מנוי - היית יכול ללמוד ולדרג את השיעור!
מה נלמד בשיעור הזה?
- נבין שפיתוח כל אתר מתחיל בלהבין את המבנה בFigma. אפילו אם זה תהליך שלוקח עוד כמה דקות זה חשוב ביותר ועוזר לנו המון בהמשך!
- נלמד לתת שמות למדיה שאנחנו רוצים לייצא ואיך לייצא
- נבין את השכבות בFigma ואיך זה עוזר לנו להבין מיקומים ולסדר מחדש אלמנטים בדף
- נבין איך לייצא תמונה שמורכבת ממספר תמונות כאלמנט אחד
- נבין שתמונות מייצאים בPNG ואייקון בSVG
וקצת יותר בפירוט...
תחילת העבודה עם Figma היא שלב קריטי לכל מי שעוסק בבניית אתרים, במיוחד כאשר מדובר בבניית אתרי וורדפרס. הבנת מבנה האתר ב-Figma מסייעת ליצירת תכנון מוקפד שמוביל לעבודה יעילה ועיצוב מקצועי. למרות שזה עשוי להיראות כתהליך שמאט את הקצב, השקעה בהיכרות עם המבנה והסדרים של הפרויקט בשלב מוקדם חוסכת זמן רב ומונעת טעויות בשלבים מתקדמים יותר.
במהלך השיעור נלמד כיצד לתת שמות למדיה שאנו מתכננים לייצא, תהליך שמבטיח סדר ושימוש מדויק בקבצים במהלך העבודה. כמו כן, נלמד לייצא אלמנטים בודדים ותמונות מרובות כאלמנט אחד, תוך שימוש בפורמטים המתאימים: תמונות ב-PNG, המיועדות לגרפיקה עם רקע שקוף, ואייקונים בפורמט SVG, שמבטיחים שמירה על איכות ברזולוציה גבוהה ללא תלות בגודל.
בנוסף, נתעמק בהבנת השכבות ב-Figma, כלי חשוב שמאפשר לנו לנתח את מיקומי האלמנטים ולסדר מחדש את הדף בצורה נוחה. שליטה במבנה השכבות תורמת רבות לתהליך העיצוב ומספקת בסיס מוצק לעבודה עם כלים כמו אלמנטור. לימוד זה הוא חלק בלתי נפרד מתהליך לימוד בניית אתרים ומאפשר יצירת דפי נחיתה מקצועיים ותואמים לתכנון העיצובי.