Figma
שלדה מונוכרום לכאוס כרומטי
הממשק מתפקד כמיכל מבני קפדני בעל ניגודיות גבוהה, המעניק דומיננטיות חזותית מוחלטת לתוכן שנוצר על ידי משתמשים. קו הבסיס הוא פלטת צבעים קפדנית מ-#000000 עד #ffffff, אשר נמנעת מגוונים עדינים של אפור לטובת ניגודיות מקסימלית מוחלטת עבור גבולות ראשוניים וטקסט. היררכיה טיפוגרפית מבוססת כמעט לחלוטין על גודל וריווח אותיות שלילי אגרסיבי ולא על וריאציות צבע, מה שהופך שורות טקסט גדולות לגושים גרפיים צפופים. ההיגיון של רדיוס הגבול יוצר דיכוטומיה חדה: ה"מסמרים" החיצוניים של 50 פיקסלים עבור אלמנטים של ניווט גלובלי מנוגדים במכוון לפינות ה-0 פיקסלים הבולטות של מיכלי התוכן.
קומפוזיציות מבוססות על גבולות קיצוניים ברוחב מקסימלי (1440 פיקסלים לכל היותר) הממרכזים את חלון התצוגה וכוללות אשכולות צפופים של תוכן המופרדים על ידי רווח מאקרו נדיב (96-120 פיקסלים של רווח לבן בין מקטעים). ארכיטיפ ה"גיבור" משתמש לעתים קרובות בגלריה אסימטרית של תמונות המעוגנות באופן דינמי מתחת לבלוק ממשק משתמש צף וממורכז בצורה מושלמת. מתחת לקפל, המידע מתאים מיד לרשת קפדנית של ארבע עמודות ללא שוליים, תוך מסגרת אשכולות חוזרים של כרטיסים, מיקסום צפיפות האובייקטים תוך ביטול שוליים מהמסגרת.
העיצוב הוויזואלי מבוסס על תוצאות ממוקדות משתמש. התמונות מוצגות כריבועים שטוחים, ללא מסגרת, או כקטעים חופפים מפוזרים, המזכירים חפצים פיזיים, על רקע ריק וקשה. תמונות הן מקור הצבע היחיד באתר. אין אלמנטים של צילום לייף סטייל או איורים סטנדרטיים של החברה - כל אלמנט גרפי הוא תמונת מצב מדויקת ומילולית של קנבס דיגיטלי, המתפקדת בו זמנית כהוכחת מוצר וכאלמנט אסתטי עיקרי.
לוּחַ הַצְבָעִים
מותג
- Context Action Violet
#4d49fc— קריאה לפעולה ראשית מקומית בתוך פאנלים משניים - צבע יחיד ומפריע מגדיר את נקודת המוקד.
נֵטרָלִי
- Absolute Canvas
#ffffff— רקע עמוד, סרגלי כלים צפים, בסיסי פאנלים מורמים. - Structural Ink
#000000— גופן בסיסי, רקע אחיד של כפתור, קווי מתאר של כפתורים. - Graphite Metadata
#595959— טקסט מחבר משני, תת-טקסט מקומי, ערכי מיקום - Boundary Frame
#e2e2e2— מפרידים עדינים וגבולות שדות קלט לא פעילים. - Angular Teal
#33dfdf— אפקטים דקורטיביים, מחווני טעינה ויזואליזציה של סמן פעיל.
טיפוגרפיה
מ-12 עד 72 פיקסלים · 6 שלבים
- figmaSans — תַחֲלִיף: Inter · קווי מתאר 320, 330, 340, 400, 450, 480, 520, 700 · כלי רב-תכליתי שמנהל הכל, החל מכותרות תצוגה ועד תוויות ניווט. הוא יוצר מראה ייחודי על ידי שינוי מעקב אופטי שלילי.
- figmaMono — תַחֲלִיף: JetBrains Mono · קווי מתאר 400 · מיקרו-תגים, מעקב אחר קואורדינטות ורמיזות טכניות שמתפקדות יותר כאלמנטים של ממשק משתמש מאשר כתוכן.
אינטרוולים וצורה
| מַטָרָה | מַשְׁמָעוּת |
|---|---|
| צְפִיפוּת | צָפוּף |
| שלב בסיסי | 24px |
| רדיוס הכפתור | 8px |
| רדיוס הכרטיס | 12px |
| צללים | אין גבולות במקום צללים |
| בין סעיפים | 96-120px |
| רוחב העמוד | 1440px |
בינה מלאכותית תבנה את אתר האינטרנט שלך בסגנון Figma ותמלא אותו
- מלאו מוצרים ופוסטים דרך הקישור - Instagram, TikTok, Facebook.
- העברת תוכן מהאתר הישן שלך - רק ציין את הכתובת.
- עיצוב מודרני על מנוע הפיתוח הטוב ביותר: React ( Next.js) עם רינדור שרת ואופטימיזציה של קידום אתרים (SEO) ישירות מהקופסה.
- אופטימיזציה אוטומטית לחלוטין של SEO עבור תוצאות חיפוש והמלצות לרשתות עצביות.
סגנונות דומים
- Caldera — לחשל אש על אבן גיר חמה. הבד עשוי טיח גולמי וחם, וכל אלמנט כתום נראה כמו גחלים בוערות שנדחסו אל פני השטח.
- Vercel — טרמינל מודפס על נייר לבן
- Dylanbrouwer — בית יציקה ברוטליסטי בשקיעה
- Headspace — פינת בריאות שטופת שמש על נייר חם
- WHOOP — מעבדת הופעות בחצות - שולחנות מעבדה קליניים לבנים תחת חלל תיאטרלי שחור, פעימה סגולה אחת של חשמל
- (dot)connect — רישום הנדסי שוויצרי עם פיסת פחם אחת
- Together AI — קונסולת מחקר על נייר קרחוני
- Vivid+Co — אור פריזמטי דרך אובסידיאן
- Sequel — הקרנה פרטית לאחר רדת החשיכה היא האור החם היחיד בקולנוע חשוך בדרך כלל.
- v0 by Vercel — שרטוט מחרטה. דיוק ופונקציונליות הם בעלי חשיבות עליונה, כאשר כל אלמנט משרת מטרה ברורה על משטח נקי ומושלם מבחינה טכנית.
- ThoughtLab — אנדרטה עשויה אובסידיאן עם אות ארגמן. בד ציור של ריקנות שחורה, שבו האובייקט האדום הרווי היחיד בקתדרלה, המודפס באותיות לבנות גדולות, הוא דמות כרומטית אחת.
- Dovetail — תוכנית אב תחת ירח שחור - קווי גרף בקושי נראים לעין, גופן לבן, נצנוץ סגול אחד