Superhuman
פאנל העריכה של שעת הזהב
Superhuman משתרע על הצומת שבין צילום עריכה לממשק משתמש תוכנה - בד קנבס חם, דמוי קלף (לעולם לא לבן טהור), ממסגר אלמנטים של מיתוג בצבע חום-אדמדם ונגיעות סגולות עזות. כותרות, בגופן 460, לוחשות במקום לצעוק, מה שמאפשר לצילום קולנועי של עמוד שלם לעשות את העבודה הקשה, בעוד שכרטיסי ממשק משתמש שקופים למוצר מרחפים כמו זכוכית מעל התמונות. פלטת הצבעים נשארת רגועה ועורכתית רוב הזמן: משטחים בצבע קרם, טקסט בצבע פחם, גבולות אפורים חמים עדינים ומרווחים נדיבים בין אלמנטים, כאשר הצבע שמור לפיסוק מכוון של המותג - קריאה לפעולה בצבע חום-אדמדם יחיד, קישורים סגולים, כפתור הוספה לילך בהיר. המערכת נמנעת במכוון מצללים חזקים ומגרדיאנטים על משטחי ממשק המשתמש; העומק מושג באמצעות צילום שכבתי וטשטוש רקע עדין בכותרת, ולא באמצעות אפקט ערימה.
האלמנט הראשי הוא תמונה ברוחב מלא עם כותרת ממורכזת (48-64 פיקסלים/460) וקריאה לפעולה אחת מלאה בתמונה של יין, עם כרטיסי ממשק משתמש שקופים צפים של המוצר המונחים על הקצוות השמאלי והימני. מתחת לאלמנט הראשי נמצא פס לוגו לבן (6 תאים בכל שורה, רוחב מרבי מוגבל), לאחר מכן מקטע לשוניות עם משטחי כרטיס לבן על בד קלף. פס טורקיז כהה שובר את הקצב כשני שלישים מהדף - ברוחב מלא, שתי עמודות (תמונה משמאל, טקסט מימין) - ויוצר את הניגודיות הטונלית היחידה בזמן הגלילה. פס אטמוספרי מדורג מופיע לאחר מכן. המרווח האנכי בין המקטעים הוא 64-96 פיקסלים. רוחב התוכן המרבי הוא ~1200 פיקסלים ממורכזים, כאשר האלמנט הראשי והפס הכהה משתרעים על פני כל רוחב חלון התצוגה. הניווט הוא כותרת קבועה אחת עם רקע מטושטש; ללא סרגל צד, ללא תפריט ענק. כותרת התחתונה היא דף בצבע בורדו ברוחב מלא עם פריסה מרובת עמודות של קישורים. הקצב הכללי הוא: פריים ראשי → תוכן לבן/קרם רגוע → פס כהה עם התמונה הראשית → גרדיאנט אטמוספרי → כותרת תחתונה בצבע בורדו, פסים בהירים וכהים לסירוגין ליצירת קצב עריכה.
האלמנט הוויזואלי העיקרי הוא צילום קולנועי: דיוקן ברוחב מלא על רקע שמיים פתוחים משמש כנקודת מוקד, עם פס אטמוספרי שני הממוקם נמוך יותר בדף. התמונה בגוון חם, עמומה בעדינות, וצולמה בפרופיל, המזכיר שעת זהב, ויוצרת תחושה עריכתית יותר מאשר תאגידית. פס כהה עם מלבנים גיאומטריים שקופים וכתובות בכתב יד מונח על גבי תצלום של אדם שקוע במחשבות - קולאז' של משטחים ולא תמונה אחת. ממשק המשתמש מוצג ככרטיסי זכוכית צפים המונחים ישירות על התצלום, ולא כצילומי מסך נפרדים. אין איורי סטוק, אין עיבודים תלת-ממדיים ואין צורות דקורטיביות מופשטות, מלבד פס אטמוספרי עם גרדיאנט. הסמלים הם סמלי קו מונוכרום מינימליסטיים, ברוחב של כ-16-20 פיקסלים, עם רוחב יחיד התואם למשקל טקסט של 460 נקודות.
לוּחַ הַצְבָעִים
מותג
- Midnight Wine
#421d24— כפתורי הפעולה העיקריים, מודעת הבאנר וכותרת התחתונה הם בצבע בורדו חם, כמעט שחור, שמרגיש יותר כמו דיו מאשר אדום, מעגן את פלטת הצבעים מבלי להיות משתלטים. - Royal Violet
#714cb6— סגול משמש להדגשת קישורים, תגיות וביטויים קצרים. אין להשתמש בו כצבע העיקרי עבור קריאות לפעולה.
נֵטרָלִי
- Lilac Mist
#d4c7ff— מילוי המשטח המשני, סמלי האור ורקע כפתורי הרפאים כולם כוללים צבע סגול עמום שמרמז על סגנון המותג מבלי למשוך תשומת לב מוגזמת. - Deep Lagoon
#0c4243— הרקע הכהה של הרצועה, המשמש כאלמנט הנרטיבי העיקרי, הוא המשטח הכהה היחיד במערכת, בשילוב עם דוגמה גיאומטרית שכבת עליה. - Warm Parchment
#f2f0eb— משטח העבודה של הדף הוא האלמנט הדומיננטי; צבע קרם חם מחליף את הלבן כבסיס, ומעניק לכל המערכת חמימות עריכתית. - Soft Mist
#e3e3e2— גבולות עדינים, קווי מתאר של כרטיס, קווי חלוקה - אפור חם ובהיר שמתמזג עם הקלף אך מגדיר בבירור את הקצוות. - Ink Charcoal
#292827— גוף הטקסט, כותרות, קווי מתאר של סמלים - צבע חם, כמעט שחור, עם מספיק חום כדי להרגיש כמו דיו על נייר, לעולם לא קר #000 - Stone Gray
#666666— טקסט גוף משני, טקסטים תומכים, תיאורים דיסקרטיים - אפור בינוני יחיד, בשימוש במשורה כדי לא להתחרות בטקסט הראשי.
טיפוגרפיה
מ-12 עד 64 פיקסלים · 8 צעדים
- Super Sans VF — תַחֲלִיף: Inter (closest open equivalent for variable weight range) · קווי מתאר 460, 500, 540, 600, 700 · גופן יחיד בכל המערכת. משתני הציר נעים בטווח שבין 460 (גופן ייחודי, חתוך קלות, לכל טקסט הכותרות הגדול) ל-540 (גוף טקסט מודגש) ו-700 (כיתובים קטנים ומודגשים). VF שתוכנן במיוחד גורם לכותרות במשקל 460 להיראות מכוונות יותר מאשר אקראיות - בגודל 48-64 פיקסלים עם ריווח אותיות צר, אפקט ה"חתוך קלות" נתפס כבטוח ולא דק.
אינטרוולים וצורה
| מַטָרָה | מַשְׁמָעוּת |
|---|---|
| צְפִיפוּת | צָפוּף |
| שלב בסיסי | 8px |
| רדיוס הכפתור | 16px |
| רדיוס הכרטיס | 16px |
| צללים | אין גבולות במקום צללים |
| בין סעיפים | 64-96px |
| רוחב העמוד | 1200px |
בינה מלאכותית תבנה את אתר האינטרנט שלך בסגנון Superhuman ותמלא אותו
- מלאו מוצרים ופוסטים דרך הקישור - Instagram, TikTok, Facebook.
- העברת תוכן מהאתר הישן שלך - רק ציין את הכתובת.
- עיצוב מודרני על מנוע הפיתוח הטוב ביותר: React ( Next.js) עם רינדור שרת ואופטימיזציה של קידום אתרים (SEO) ישירות מהקופסה.
- אופטימיזציה אוטומטית לחלוטין של SEO עבור תוצאות חיפוש והמלצות לרשתות עצביות.
סגנונות דומים
- AI for Business — אולם תצוגה עריכה ברוטליסטי בגווני אפור חמים
- Jeton — מאמר מערכת על פינטק על שיש חם
- Airtable — סמינר נעים עם פרקים מסומנים בצבעים שונים
- Osmo — מוזיאון היזמים על בטון אפור
- Linktr — פוסטרים של עריכה מוערמים כמו סוכריות. האתר מעוצב בבלוקים צבעוניים, עם כותרות ירוקות בהירות על רקע קירות כחולים-קובלט, ואלמנטים לבנים בצורת גלולה המרחפים מעל שדות בורדו.
- Outsource Consultants — דף אדריכלי בפורמט גדול על נייר עצם. אסתטיקה מונוגרפית, שבה כתם בודד ובהיר של אינדיגו קוטע את הרשת החמה, המקסימליסטית טיפוגרפית.
- Streamtime — לוח מצב רוח יצירתי למגע - שולחן סקראפבוקינג מעוצב
- Switch-Lit — טבלה עריכה מודפסת בדיו על נייר קרם
- HubSpot — צבע נייר קרם חם עם נגיעה כתומה אחת. HubSpot דומה למגזין מעצבים המודפס על נייר עבה - כותרות בצבע סריפי, עמודים בצבע קרם חם ונגיעת כתום לוהטת אחת המדגישה רק את הנקודות החשובות ביותר.
- Granola — רשימות שדה על קלף חם - גרנולה נקראת כמו מחברת מולסקין בלויה היטב שנפתחה על שולחן שטוף שמש: כותרות סריפיות מעניקות תחושה של מוצקות, נגיעות ירוקות אורגניות כמו דיו צמחי, וקווים דקים בשולי הכרטיסים הדומים לרשימות בכתב יד.
- Secure — שיחה בבית קפה אירופאי באור יום רך היא גישה חמה ומסוגננת לשיחות וידאו, שבהן כותרות סריפיות נקראות כמו מאמר מגזין מעמיק ולא כמו עמוד מוצר טכנולוגי.
- Mockups made easy — סטודיו לעיצוב עריכה על נייר לבן